:root{--bg:#07090c;--paper:#eee9e0;--muted:#aaa49a;--gold:#c9a45f;--line:#c5a36538}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--paper);font-family:"Yu Mincho","Hiragino Mincho ProN",serif;line-height:1.7}a{color:inherit;text-decoration:none}header{height:64px;position:relative;z-index:20;display:flex;align-items:center;padding:0 4.8vw;background:#080b10;border-bottom:1px solid #ffffff0b}.brand{display:flex;align-items:center;gap:12px;color:var(--gold);font:11px Arial;letter-spacing:.18em}.brand img{width:45px;height:38px;object-fit:contain}nav{margin-left:auto;display:flex;gap:28px;font:10px Arial;letter-spacing:.17em}header button{display:none}.hero{position:relative;width:100%;background:#05070b;overflow:hidden;border-bottom:1px solid #ffffff0b}.hero-final{display:block;width:100%;height:auto;max-width:1829px;margin:0 auto;object-fit:contain}.cards{width:min(90.5vw,1410px);margin:16px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.cards article{background:#0c0f13;border:1px solid #b9965533;min-width:0}.pic,.cardpic{height:190px;background-position:center;background-size:cover;background-repeat:no-repeat}.pic{background-image:url("assets/sora-official.jpg");background-position:center 27%}.bgmpic{background-image:url("assets/bgm-master.jpg")}.studiopic{background-image:url("assets/studio-master.jpg")}.body{padding:17px 21px 20px;min-height:170px}.body .tag{margin:0 0 6px}.body h3{font-size:24px;font-weight:400;line-height:1.15;margin:4px 0 8px}.body p:not(.tag){color:#b6b0a7;font-size:12px;margin:5px 0}.body a{display:inline-block;margin-top:8px;color:var(--gold);font:10px Arial;letter-spacing:.15em}.section{max-width:1120px;margin:auto;padding:90px 7vw}.about{margin-top:90px;display:grid;grid-template-columns:1fr 1.25fr;gap:10vw;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}h2{font-size:clamp(32px,4vw,52px);font-weight:400;line-height:1.45}.about>div:last-child,.section>p:not(.tag){color:#b6b0a7}.links{border-top:1px solid var(--line)}footer{border-top:1px solid var(--line);padding:35px 7vw;display:flex;align-items:center;gap:18px;color:#8f887e;font:10px Arial;letter-spacing:.12em}footer img{width:65px;height:48px;object-fit:contain}footer strong{color:var(--gold)}footer span{margin-left:auto}@media(max-width:760px){header{height:64px;padding:0 18px}.brand span{font-size:9px}.brand img{width:43px}header button{display:block;margin-left:auto;background:none;border:0;color:var(--gold);font-size:10px;letter-spacing:.16em}nav{display:none;position:absolute;top:64px;left:0;right:0;background:#090b0f;padding:26px;flex-direction:column}nav.open{display:flex}.hero{height:auto;min-height:0}.hero-final{width:100%;height:auto;object-fit:contain}.cards{width:auto;margin:16px 20px 0;display:block}.cards article{margin-bottom:16px}.pic,.cardpic{height:220px}.body{min-height:0;padding:24px}.section{padding:78px 24px}.about{margin-top:70px;grid-template-columns:1fr;gap:10px}footer{padding:28px 22px;flex-wrap:wrap}footer span{width:100%;margin:0}}

/* v1.7 — original SORA portrait + crisp live typography */
.hero{min-height:clamp(560px,68vw,820px);display:grid;grid-template-columns:minmax(0,46%) minmax(0,54%);background:linear-gradient(105deg,#06090e 0%,#090c11 45%,#15100d 100%);overflow:hidden}
.hero-copy{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;padding:clamp(46px,6vw,105px) clamp(28px,5.8vw,106px);background:radial-gradient(circle at 90% 45%,rgba(177,119,57,.10),transparent 45%)}
.hero-kicker{margin:0 0 14px;color:#d4ad68;font:600 clamp(10px,.78vw,13px)/1.5 Arial,sans-serif;letter-spacing:.13em}
.hero h1{margin:0;color:#f4efe6;font-family:Georgia,"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(46px,5.1vw,92px);font-weight:500;line-height:.94;letter-spacing:-.025em;text-shadow:0 1px 0 rgba(255,255,255,.22)}
.hero h1 em{display:inline-block;margin-top:.08em;color:#d8b46c;font-weight:600;text-shadow:0 1px 0 #f7d995,0 0 16px rgba(213,170,92,.16)}
.hero-lead{margin:clamp(30px,4vw,58px) 0 0;color:#f3eee5;font-size:clamp(18px,1.55vw,27px);font-weight:600;letter-spacing:.08em;line-height:1.65;text-shadow:none}
.hero-text{margin:clamp(16px,2vw,26px) 0 0;color:#e8e1d6;font-size:clamp(13px,1.05vw,18px);font-weight:600;line-height:2;letter-spacing:.045em;text-shadow:none}
.hero-scroll{width:min(310px,100%);margin-top:clamp(28px,3vw,44px);padding:17px 22px 13px;border:1px solid #b99252;color:#d6ad65;text-align:center;font:600 clamp(11px,.8vw,14px)/1.3 Georgia,serif;letter-spacing:.16em;background:rgba(4,7,11,.34)}
.hero-scroll span{display:block;font:400 24px/1 Arial;margin-top:3px}
.hero-photo{min-width:0;background-image:linear-gradient(90deg,#090c11 0%,rgba(9,12,17,.42) 8%,transparent 23%),url("assets/sora-guitar-original-crop.png");background-repeat:no-repeat;background-size:cover;background-position:42% center}
@media(max-width:760px){.hero{display:block;min-height:0}.hero-photo{height:72vw;min-height:360px;max-height:590px;background-position:43% 35%}.hero-copy{padding:54px 24px 48px}.hero h1{font-size:clamp(45px,14vw,68px)}.hero-lead{font-size:19px}.hero-text{font-size:13px;line-height:1.9}.hero-scroll{width:100%;max-width:310px}}

/* v1.8 — elegant hero typography, preserving the original SORA image */
.hero h1{
  font-size:clamp(40px,4.45vw,80px);
  line-height:1.02;
  letter-spacing:.055em;
  font-weight:400;
  color:#efe7d8;
  text-shadow:0 1px 0 rgba(255,255,255,.18),0 3px 10px rgba(0,0,0,.34);
}
.hero h1 br{display:none}
.hero h1 em{
  display:block;
  width:max-content;
  margin-top:.14em;
  font-size:1.22em;
  line-height:.95;
  letter-spacing:.075em;
  font-weight:500;
  font-style:normal;
  background:linear-gradient(180deg,#fff0bd 0%,#e4bd70 34%,#bd8d43 69%,#f0cf87 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  filter:drop-shadow(0 2px 1px rgba(0,0,0,.42)) drop-shadow(0 0 7px rgba(218,171,88,.18));
}
.hero h1::after{
  content:"";
  display:block;
  width:min(470px,88%);
  height:1px;
  margin-top:clamp(24px,2.5vw,38px);
  background:linear-gradient(90deg,rgba(200,157,83,.78) 0%,rgba(200,157,83,.55) 47%,rgba(255,220,142,.95) 50%,rgba(200,157,83,.28) 54%,transparent 100%);
  box-shadow:0 0 8px rgba(229,180,91,.18);
}
.hero-lead{margin-top:clamp(25px,3vw,43px);font-weight:500;letter-spacing:.1em}
.hero-scroll{border-color:rgba(201,164,95,.78);box-shadow:inset 0 0 0 1px rgba(255,225,164,.035),0 5px 22px rgba(0,0,0,.16);transition:border-color .25s ease,background .25s ease,box-shadow .25s ease}
.hero-scroll:hover{background:rgba(196,151,77,.08);border-color:#d5ad67;box-shadow:inset 0 0 18px rgba(214,173,101,.04),0 7px 24px rgba(0,0,0,.2)}
@media(max-width:760px){.hero h1{font-size:clamp(38px,11vw,58px);letter-spacing:.035em}.hero h1 em{font-size:1.14em}.hero h1::after{width:88%;margin-top:24px}}

/* v1.9 — AMBIENT LIGHT: atmosphere without changing the SORA portrait */
.hero-copy{isolation:isolate;background:
  radial-gradient(ellipse 74% 34% at 68% 25%,rgba(190,130,63,.115) 0%,rgba(127,82,39,.05) 42%,transparent 72%),
  radial-gradient(ellipse 58% 42% at 20% 62%,rgba(29,45,66,.18) 0%,transparent 72%),
  linear-gradient(112deg,#05080d 0%,#080b11 53%,#130e0b 100%);
}
.hero-copy::before{content:"";position:absolute;z-index:-1;inset:5% -7% 9% 0;pointer-events:none;background:
  radial-gradient(ellipse 43% 18% at 54% 38%,rgba(233,183,96,.095),transparent 72%),
  radial-gradient(ellipse 32% 24% at 88% 58%,rgba(181,109,48,.075),transparent 72%);
filter:blur(10px);opacity:.95}
.hero-copy::after{content:"";position:absolute;z-index:-1;left:0;right:-8%;bottom:0;height:42%;pointer-events:none;background:linear-gradient(to bottom,transparent 0%,rgba(2,5,9,.18) 45%,rgba(2,5,9,.62) 100%)}
.hero h1{position:relative;text-shadow:0 1px 0 rgba(255,255,255,.16),0 4px 18px rgba(0,0,0,.36)}
.hero h1 em{filter:drop-shadow(0 2px 1px rgba(0,0,0,.4)) drop-shadow(0 0 10px rgba(226,178,89,.17))}
.hero h1::after{position:relative;background:linear-gradient(90deg,rgba(202,158,83,.66) 0%,rgba(202,158,83,.48) 45%,#f2cb78 49.7%,#fff0b6 50%,#f2cb78 50.3%,rgba(202,158,83,.32) 55%,transparent 100%);box-shadow:0 0 5px rgba(239,191,96,.22),0 0 15px rgba(239,191,96,.08)}
.hero-lead{color:#f0e9de;text-shadow:0 2px 12px rgba(0,0,0,.28)}
.hero-text{color:#ddd6cb;text-shadow:0 2px 12px rgba(0,0,0,.24)}
.hero-scroll{background:linear-gradient(180deg,rgba(16,17,18,.34),rgba(4,7,11,.52));box-shadow:inset 0 1px 0 rgba(255,225,165,.055),0 10px 28px rgba(0,0,0,.2)}
.hero-photo{background-image:linear-gradient(90deg,#080b10 0%,rgba(8,11,16,.48) 7%,rgba(8,11,16,.12) 18%,transparent 28%),url("assets/sora-guitar-original-crop.png")}
@media(max-width:760px){.hero-copy::before{inset:0;filter:blur(8px)}.hero-copy::after{right:0;height:34%}}

/* v2.0 — SORA AIR: elegant cinematic atmosphere, no image generation */
.hero-copy{
  background:
    radial-gradient(ellipse 62% 27% at 67% 18%,rgba(231,178,92,.14) 0%,rgba(166,103,46,.055) 42%,transparent 73%),
    radial-gradient(ellipse 45% 34% at 15% 72%,rgba(30,48,73,.21) 0%,rgba(15,28,47,.08) 48%,transparent 76%),
    radial-gradient(ellipse 32% 22% at 91% 73%,rgba(188,115,49,.075) 0%,transparent 75%),
    linear-gradient(112deg,#05080d 0%,#080b11 51%,#130e0b 100%);
}
.hero-copy::before{
  inset:0 -10% 0 0;
  filter:none;
  opacity:1;
  background:
    radial-gradient(circle at 67% 22%,rgba(255,222,151,.26) 0 1px,transparent 2px),
    radial-gradient(circle at 79% 31%,rgba(224,177,92,.18) 0 1px,transparent 2px),
    radial-gradient(circle at 58% 52%,rgba(255,224,160,.13) 0 1px,transparent 2px),
    radial-gradient(circle at 87% 61%,rgba(211,157,77,.12) 0 1px,transparent 2px),
    radial-gradient(ellipse 46% 18% at 63% 35%,rgba(232,178,91,.095),transparent 72%),
    radial-gradient(ellipse 30% 24% at 94% 55%,rgba(181,109,48,.07),transparent 74%);
}
.hero-copy::after{
  left:0;right:-10%;bottom:0;height:100%;
  background:
    linear-gradient(180deg,transparent 0%,transparent 66%,rgba(2,5,9,.15) 82%,rgba(2,5,9,.56) 100%),
    linear-gradient(90deg,rgba(201,164,95,.12),transparent 18%) left 12% bottom 17% / 36% 1px no-repeat;
}
.hero h1{
  text-shadow:0 1px 0 rgba(255,255,255,.18),0 5px 20px rgba(0,0,0,.40),0 0 28px rgba(218,170,87,.035);
}
.hero h1 em{
  background:linear-gradient(180deg,#fff3c8 0%,#e7c077 32%,#bc8b40 68%,#f2d28d 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 2px 1px rgba(0,0,0,.44)) drop-shadow(0 0 8px rgba(229,181,92,.22));
}
.hero h1::after{
  width:min(500px,91%);
  height:1px;
  background:linear-gradient(90deg,rgba(201,158,82,.78) 0%,rgba(201,158,82,.52) 43%,#e8b95f 49.4%,#fff1bd 50%,#e8b95f 50.6%,rgba(201,158,82,.25) 57%,transparent 100%);
  box-shadow:0 0 7px rgba(239,191,96,.20),0 0 18px rgba(239,191,96,.07);
}
.hero-kicker{color:#d8ae65;text-shadow:0 0 14px rgba(207,157,78,.10)}
.hero-lead{color:#f3ece2;letter-spacing:.11em;text-shadow:0 3px 14px rgba(0,0,0,.34)}
.hero-text{color:#ded7cc;text-shadow:0 3px 14px rgba(0,0,0,.28)}
.hero-scroll{position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(21,19,16,.36),rgba(4,7,11,.54));border-color:rgba(206,166,96,.76);box-shadow:inset 0 1px 0 rgba(255,229,177,.07),0 10px 30px rgba(0,0,0,.22)}
.hero-scroll::before{content:"";position:absolute;left:18%;right:18%;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,222,151,.55),transparent)}
@media(max-width:760px){
  .hero-copy::before{inset:0;filter:none}
  .hero-copy::after{right:0;height:100%;background:linear-gradient(180deg,transparent 0%,transparent 72%,rgba(2,5,9,.45) 100%)}
}

/* v2.1 — SORA AFTERGLOW: crisp typography + restrained cinematic light */
.hero-copy{
  background:
    radial-gradient(ellipse 78% 42% at 83% 33%,rgba(174,98,43,.16) 0%,rgba(121,67,36,.075) 37%,transparent 72%),
    radial-gradient(ellipse 64% 52% at 13% 76%,rgba(18,39,67,.28) 0%,rgba(10,24,44,.11) 48%,transparent 77%),
    linear-gradient(112deg,#05080d 0%,#080b11 53%,#160f0c 100%);
}
.hero-copy::before{
  inset:0 -12% 0 0;opacity:1;filter:none;
  background:
    radial-gradient(ellipse 58% 22% at 64% 39%,rgba(238,177,87,.115),transparent 70%),
    radial-gradient(ellipse 38% 30% at 96% 56%,rgba(191,103,44,.09),transparent 72%),
    radial-gradient(circle at 61% 30%,rgba(255,226,163,.20) 0 1px,transparent 1.8px),
    radial-gradient(circle at 74% 23%,rgba(233,183,99,.13) 0 1px,transparent 1.8px),
    radial-gradient(circle at 83% 46%,rgba(255,222,153,.11) 0 1px,transparent 1.8px);
}
.hero-copy::after{right:-11%;height:100%;background:linear-gradient(180deg,transparent 0%,transparent 67%,rgba(2,5,9,.12) 83%,rgba(2,5,9,.54) 100%)}
.hero h1{color:#f5efe5;text-shadow:0 1px 0 rgba(255,255,255,.20),0 4px 15px rgba(0,0,0,.42)}
.hero h1 em{background:linear-gradient(180deg,#f8e7b8 0%,#e2bb70 40%,#c18e43 72%,#e8c67f 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 1px rgba(0,0,0,.48)) drop-shadow(0 0 5px rgba(231,179,88,.17))}
.hero h1::after{width:min(520px,92%);height:1px;margin-top:clamp(24px,2.8vw,39px);background:linear-gradient(90deg,rgba(195,148,73,.62) 0%,rgba(207,162,86,.55) 43%,#e9b85e 49.5%,#fff0b1 50%,#e9b85e 50.5%,rgba(201,153,77,.25) 58%,transparent 100%);box-shadow:0 0 4px rgba(241,190,91,.25),0 0 11px rgba(241,190,91,.09)}
.hero-lead{color:#f4eee5;text-shadow:0 2px 8px rgba(0,0,0,.38)}
.hero-text{color:#e2dbd0;text-shadow:0 2px 8px rgba(0,0,0,.34)}
@media(max-width:760px){.hero-copy::before{inset:0}.hero-copy::after{right:0}}

/* v2.2 — SORA TWILIGHT: visible cinematic atmosphere, no generated imagery */
.hero-copy{
  isolation:isolate;
  overflow:hidden;
  background:
    linear-gradient(180deg,rgba(4,8,15,.06) 0%,rgba(5,9,16,.14) 45%,rgba(3,7,13,.68) 100%),
    radial-gradient(ellipse 105% 62% at 103% 47%,rgba(198,111,54,.42) 0%,rgba(145,76,43,.25) 28%,rgba(57,43,45,.14) 52%,transparent 73%),
    radial-gradient(ellipse 85% 55% at 36% 19%,rgba(72,82,115,.20) 0%,rgba(27,39,66,.11) 48%,transparent 75%),
    linear-gradient(116deg,#050913 0%,#080d18 42%,#181219 70%,#2a1712 100%);
}
/* distant dusk haze + soft city-light bokeh */
.hero-copy::before{
  content:"";position:absolute;z-index:-2;inset:0 -12% 0 0;pointer-events:none;opacity:1;filter:none;
  background:
    radial-gradient(circle at 79% 58%,rgba(255,197,100,.42) 0 1.5px,rgba(255,183,83,.12) 2px 5px,transparent 7px),
    radial-gradient(circle at 91% 63%,rgba(255,181,82,.32) 0 1px,rgba(255,181,82,.08) 2px 4px,transparent 6px),
    radial-gradient(circle at 70% 68%,rgba(255,213,134,.24) 0 1px,rgba(255,190,92,.06) 2px 4px,transparent 6px),
    radial-gradient(circle at 57% 61%,rgba(224,155,73,.20) 0 1px,transparent 5px),
    radial-gradient(circle at 96% 48%,rgba(255,210,129,.18) 0 1px,transparent 5px),
    linear-gradient(90deg,transparent 0 49%,rgba(225,156,78,.07) 70%,rgba(239,155,73,.11) 100%);
}
/* horizon glow, subtle floor shadow and warm air */
.hero-copy::after{
  content:"";position:absolute;z-index:-1;left:0;right:-12%;bottom:0;height:100%;pointer-events:none;
  background:
    linear-gradient(90deg,transparent 0 8%,rgba(213,164,83,.34) 8.2%,rgba(213,164,83,.08) 8.35%,transparent 8.6%) left 0 bottom 27% / 100% 1px no-repeat,
    radial-gradient(ellipse 48% 11% at 79% 62%,rgba(226,145,68,.18),transparent 72%),
    linear-gradient(180deg,transparent 0%,transparent 60%,rgba(3,7,13,.18) 72%,rgba(2,5,10,.72) 100%);
}
.hero h1{letter-spacing:.045em;text-shadow:0 1px 0 rgba(255,255,255,.20),0 5px 18px rgba(0,0,0,.48),0 0 22px rgba(213,158,77,.055)}
.hero h1 em{
  background:linear-gradient(180deg,#fff0bf 0%,#e8c177 36%,#c69347 70%,#f0ce85 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 2px 1px rgba(0,0,0,.48)) drop-shadow(0 0 7px rgba(234,181,89,.22));
}
.hero h1::after{
  width:min(540px,94%);height:1px;
  background:linear-gradient(90deg,rgba(195,148,73,.72) 0%,rgba(211,166,88,.58) 44%,#e6ae4f 49.2%,#fff2b8 50%,#e6ae4f 50.8%,rgba(201,153,77,.24) 58%,transparent 100%);
  box-shadow:0 0 5px rgba(255,203,104,.28),0 0 14px rgba(255,190,85,.12);
}
.hero-kicker{color:#dfb15f}
.hero-lead{color:#f4eee4;text-shadow:0 2px 8px rgba(0,0,0,.48)}
.hero-text{color:#e5ddd1;text-shadow:0 2px 8px rgba(0,0,0,.44)}
.hero-scroll{background:linear-gradient(180deg,rgba(24,19,17,.38),rgba(4,8,14,.58));border-color:rgba(210,165,88,.82);box-shadow:inset 0 1px 0 rgba(255,229,170,.08),0 9px 30px rgba(0,0,0,.30)}
@media(max-width:760px){.hero-copy::before,.hero-copy::after{right:0}.hero-copy{background:radial-gradient(ellipse 105% 55% at 95% 42%,rgba(191,105,52,.30),transparent 67%),linear-gradient(116deg,#050913 0%,#0a0d16 58%,#21140f 100%)}}

/* v2.3 — MOBILE HERO UNIFIED: one cinematic hero, original SORA portrait preserved */
@media(max-width:760px){
  .hero{
    position:relative;
    display:block;
    min-height:900px;
    overflow:hidden;
    background:#05080d;
  }
  .hero-photo{
    position:absolute;
    inset:0;
    z-index:0;
    height:100%;
    min-height:0;
    max-height:none;
    background-image:url("assets/sora-guitar-original-crop.png");
    background-size:cover;
    background-repeat:no-repeat;
    background-position:50% 22%;
  }
  .hero-photo::after{
    content:"";
    position:absolute;
    inset:0;
    background:
      linear-gradient(180deg,rgba(3,6,11,.10) 0%,rgba(3,6,11,.08) 28%,rgba(3,6,11,.40) 47%,rgba(3,6,11,.90) 64%,rgba(3,6,11,.98) 100%),
      linear-gradient(90deg,rgba(3,6,11,.34),transparent 45%,rgba(3,6,11,.08));
  }
  .hero-copy{
    position:relative;
    z-index:2;
    min-height:900px;
    justify-content:flex-end;
    padding:430px 24px 44px;
    background:none;
    overflow:visible;
  }
  .hero-copy::before{
    inset:auto 0 0 0;
    height:54%;
    z-index:-1;
    background:
      radial-gradient(ellipse 100% 42% at 88% 35%,rgba(191,105,52,.18),transparent 68%),
      linear-gradient(180deg,transparent 0%,rgba(4,8,14,.24) 15%,rgba(4,8,14,.88) 42%,#05080d 100%);
  }
  .hero-copy::after{display:none}
  .hero-kicker{margin-bottom:10px;font-size:10px;letter-spacing:.12em}
  .hero h1{font-size:clamp(42px,12.5vw,58px);line-height:.94;letter-spacing:.025em}
  .hero h1 br{display:block}
  .hero h1 em{font-size:1.08em}
  .hero h1::after{width:88%;margin-top:20px}
  .hero-lead{margin-top:22px;font-size:18px;line-height:1.65}
  .hero-text{margin-top:12px;font-size:13px;line-height:1.9;letter-spacing:.025em}
  .hero-scroll{width:100%;max-width:none;margin-top:22px;padding:15px 18px 11px}
}
@media(max-width:430px){
  .hero{min-height:860px}
  .hero-copy{min-height:860px;padding:400px 20px 38px}
  .hero h1{font-size:clamp(40px,12vw,52px)}
}

/* v2.4 — MOBILE HERO COMPOSED: smaller SORA, more breathing room, same original image */
@media(max-width:760px){
  .hero{min-height:980px;background:#05080d;}
  .hero-photo{
    background-size:auto 68%;
    background-position:72% 5%;
    background-color:#090a0c;
  }
  .hero-photo::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:
      radial-gradient(ellipse 75% 42% at 12% 32%,rgba(177,101,45,.28),transparent 70%),
      radial-gradient(circle at 17% 34%,rgba(239,177,78,.32) 0 1px,transparent 3px),
      radial-gradient(circle at 25% 27%,rgba(239,177,78,.18) 0 1px,transparent 3px);
  }
  .hero-photo::after{
    background:
      linear-gradient(90deg,rgba(3,6,11,.58) 0%,rgba(3,6,11,.16) 44%,rgba(3,6,11,.06) 72%,rgba(3,6,11,.24) 100%),
      linear-gradient(180deg,rgba(3,6,11,.08) 0%,rgba(3,6,11,.08) 37%,rgba(3,6,11,.48) 57%,rgba(3,6,11,.96) 78%,#05080d 100%);
  }
  .hero-copy{
    min-height:980px;
    justify-content:flex-end;
    padding:420px 24px 42px;
  }
  .hero-copy::before{height:58%;}
  .hero h1{font-size:clamp(40px,11.7vw,54px);line-height:.96;}
  .hero h1::after{width:82%;}
}
@media(max-width:430px){
  .hero{min-height:940px}
  .hero-photo{background-size:auto 64%;background-position:70% 4%}
  .hero-copy{min-height:940px;padding:390px 20px 36px}
  .hero h1{font-size:clamp(38px,11.5vw,49px)}
}

/* v2.5 — connected official routes. Visual master v2.4 preserved. */
.route-section{border-top:1px solid var(--line)}
.route-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:34px}
.route-card{position:relative;display:flex;flex-direction:column;min-height:142px;padding:22px 24px;border:1px solid rgba(201,164,95,.26);background:linear-gradient(135deg,rgba(201,164,95,.045),rgba(255,255,255,.012));transition:transform .2s ease,border-color .2s ease,background .2s ease}
.route-card:hover{transform:translateY(-2px);border-color:rgba(201,164,95,.68);background:linear-gradient(135deg,rgba(201,164,95,.09),rgba(255,255,255,.018))}
.route-card.primary{border-color:rgba(201,164,95,.52);box-shadow:inset 0 1px 0 rgba(255,229,170,.035)}
.route-card.quiet{opacity:.82}
.route-card small{color:var(--gold);font:600 9px/1.4 Arial,sans-serif;letter-spacing:.18em}
.route-card strong{margin-top:10px;color:#f0ebe2;font-size:clamp(19px,2vw,28px);font-weight:400;line-height:1.25}
.route-card span{margin-top:auto;padding-top:17px;color:#b9b1a5;font:10px/1.4 Arial,sans-serif;letter-spacing:.08em}
.inline-route{display:flex;flex-wrap:wrap;gap:18px;margin-top:30px!important}.inline-route a,.section-cta{color:var(--gold);font:600 10px/1.5 Arial,sans-serif;letter-spacing:.12em;border-bottom:1px solid rgba(201,164,95,.35);padding-bottom:5px}.section-cta{display:inline-block;margin-top:24px}
.official-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:30px}.official-grid a{display:flex;justify-content:space-between;align-items:center;padding:17px 18px;border:1px solid rgba(201,164,95,.22);color:#e8e1d7;font:11px/1.4 Arial,sans-serif;letter-spacing:.09em;background:rgba(255,255,255,.012)}.official-grid a:hover{border-color:rgba(201,164,95,.58);color:var(--gold)}.official-grid span{color:var(--gold)}
.return-links{display:flex;flex-wrap:wrap;gap:20px;margin-top:34px}.return-links a{color:#8f887e;font:9px/1.4 Arial,sans-serif;letter-spacing:.14em}.return-links a:hover{color:var(--gold)}
@media(max-width:760px){.route-grid{grid-template-columns:1fr;gap:11px;margin-top:26px}.route-card{min-height:126px;padding:20px}.official-grid{grid-template-columns:1fr 1fr}.inline-route{gap:14px}.journal .section-cta{margin-top:18px}}
@media(max-width:430px){.official-grid{grid-template-columns:1fr}}


/* v2.7 — NEW RELEASE / NOTE FULL SONG */
.release-section{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.release-head{
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:7vw;
  align-items:end;
  margin-bottom:34px;
}
.release-head h2{margin:.25em 0 0}
.release-head>p{
  margin:0;
  color:#b6b0a7;
  font-size:13px;
  line-height:1.95;
}
.release-card{
  display:grid;
  grid-template-columns:minmax(0,1.38fr) minmax(290px,.62fr);
  min-height:390px;
  border:1px solid rgba(201,164,95,.42);
  background:
    radial-gradient(circle at 82% 24%,rgba(201,164,95,.10),transparent 34%),
    linear-gradient(135deg,rgba(201,164,95,.055),rgba(255,255,255,.012));
  overflow:hidden;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.release-card:hover{
  transform:translateY(-2px);
  border-color:rgba(201,164,95,.78);
  box-shadow:0 18px 48px rgba(0,0,0,.22);
}
.release-art{
  position:relative;
  min-height:390px;
  background:#0b0e13;
  overflow:hidden;
}
.release-art::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent 66%,rgba(8,10,14,.16) 84%,rgba(8,10,14,.56) 100%);
  pointer-events:none;
}
.release-art img{
  display:block;
  width:100%;
  height:100%;
  min-height:390px;
  object-fit:cover;
  object-position:center;
}
.release-copy{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(30px,4vw,58px);
}
.release-copy small{
  color:var(--gold);
  font:600 9px/1.5 Arial,sans-serif;
  letter-spacing:.17em;
}
.release-copy h3{
  margin:14px 0 12px;
  color:#f2ece3;
  font-size:clamp(25px,2.8vw,39px);
  font-weight:400;
  line-height:1.35;
}
.release-copy p{
  margin:0;
  color:#bcb4a9;
  font-size:13px;
}
.release-copy span{
  display:inline-block;
  margin-top:32px;
  color:var(--gold);
  font:600 10px/1.5 Arial,sans-serif;
  letter-spacing:.12em;
}

@media(max-width:760px){
  .release-head{
    grid-template-columns:1fr;
    gap:10px;
    margin-bottom:24px;
  }
  .release-head>p{font-size:12px}
  .release-card{
    grid-template-columns:1fr;
    min-height:0;
  }
  .release-art{min-height:0;aspect-ratio:1280/670}
  .release-art::after{
    background:linear-gradient(180deg,transparent 64%,rgba(8,10,14,.16) 82%,rgba(8,10,14,.42) 100%);
  }
  .release-art img{
    min-height:0;
    aspect-ratio:1280/670;
    object-fit:cover;
  }
  .release-copy{padding:26px 22px 28px}
  .release-copy h3{margin-top:10px}
  .release-copy span{margin-top:22px}
}


/* v2.8 — permanent FULL SONGS / STORIES gateway
   The site no longer needs one HTML/ZIP update per note article.
   New/old songs accumulate in the linked note magazine. */
.archive-section{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.archive-shell{
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(420px,1.12fr);
  border:1px solid rgba(201,164,95,.34);
  background:
    radial-gradient(circle at 18% 28%,rgba(201,164,95,.07),transparent 28%),
    linear-gradient(135deg,rgba(255,255,255,.018),rgba(201,164,95,.025));
  overflow:hidden;
}
.archive-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(38px,5vw,72px);
}
.archive-copy h2{
  margin:.25em 0 .7em;
  font-size:clamp(34px,4.4vw,62px);
  font-weight:300;
  line-height:1.42;
}
.archive-copy>p{
  margin:0;
  max-width:560px;
  color:#b9b2a8;
  font-size:13px;
  line-height:2;
}
.archive-copy .archive-note{
  margin-top:14px;
  color:#8f887f;
  font-size:11px;
}
.archive-cta{
  align-self:flex-start;
  margin-top:30px;
  padding:13px 18px;
  border:1px solid rgba(201,164,95,.48);
  color:var(--gold);
  font:600 10px/1.4 Arial,sans-serif;
  letter-spacing:.08em;
  transition:background .2s ease,border-color .2s ease,transform .2s ease;
}
.archive-cta:hover{
  transform:translateY(-1px);
  border-color:rgba(201,164,95,.82);
  background:rgba(201,164,95,.06);
}
.archive-cta span{margin-left:8px}

.archive-visual{
  position:relative;
  min-height:470px;
  overflow:hidden;
  background:#090c11;
}
.archive-visual img{
  display:block;
  width:100%;
  height:100%;
  min-height:470px;
  object-fit:cover;
  object-position:center 42%;
  filter:saturate(.84) brightness(.72);
}
.archive-visual::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(8,10,14,.66),transparent 35%),
    linear-gradient(180deg,rgba(8,10,14,.05),rgba(8,10,14,.50));
}
.archive-emblem{
  position:absolute;
  z-index:2;
  right:clamp(22px,3.2vw,52px);
  bottom:clamp(22px,3.2vw,46px);
  text-align:right;
  color:#ece5da;
  text-shadow:0 2px 16px rgba(0,0,0,.42);
}
.archive-emblem small,
.archive-emblem span{
  display:block;
  color:var(--gold);
  font:600 8px/1.5 Arial,sans-serif;
  letter-spacing:.18em;
}
.archive-emblem strong{
  display:block;
  margin:7px 0 5px;
  font:300 clamp(34px,4vw,58px)/.92 Georgia,"Times New Roman",serif;
  letter-spacing:.08em;
}

@media(max-width:760px){
  .archive-shell{grid-template-columns:1fr}
  .archive-copy{padding:34px 22px 36px}
  .archive-copy h2{font-size:clamp(32px,10vw,46px)}
  .archive-visual{min-height:0;aspect-ratio:4/3}
  .archive-visual img{min-height:0;aspect-ratio:4/3}
  .archive-visual::after{
    background:linear-gradient(180deg,rgba(8,10,14,.06),rgba(8,10,14,.58));
  }
}


/* v2.9 — readability / mobile tap-target pass */

/* Archive title: deliberate 2-line composition instead of per-character Japanese wrapping */
.archive-copy .archive-title{
  margin:.25em 0 .7em;
  font-size:clamp(34px,3.5vw,54px);
  font-weight:300;
  line-height:1.42;
  letter-spacing:.015em;
  word-break:keep-all;
  overflow-wrap:normal;
}
.archive-copy .archive-title span{
  display:block;
  white-space:nowrap;
}

/* Give the copy column enough room on desktop */
.archive-shell{
  grid-template-columns:minmax(430px,.98fr) minmax(460px,1.02fr);
}

/* Improve legibility of clickable text site-wide */
.route-card span,
.section-cta,
.archive-cta,
.release-copy span,
.links a{
  font-size:11px;
}

/* Mobile readability and tap targets */
@media(max-width:760px){
  .archive-shell{
    grid-template-columns:1fr;
  }
  .archive-copy .archive-title{
    font-size:clamp(31px,8.5vw,42px);
    line-height:1.38;
  }
  .archive-copy .archive-title span{
    white-space:normal;
  }

  /* Main navigation / CTA / card links */
  .nav a,
  .route-card span,
  .section-cta,
  .archive-cta,
  .release-copy span,
  .links a{
    font-size:13px !important;
    line-height:1.55;
  }

  .route-card{
    min-height:124px;
  }
  .route-card small{
    font-size:9px;
  }
  .route-card strong{
    font-size:24px;
  }

  .section-cta,
  .archive-cta{
    padding:15px 17px;
    min-height:46px;
    display:inline-flex;
    align-items:center;
  }

  .links a{
    padding:14px 0;
  }

  /* Supporting copy */
  .archive-copy>p,
  .release-head>p,
  .section>p{
    font-size:13px;
    line-height:1.95;
  }
  .archive-copy .archive-note{
    font-size:12px;
  }
}

/* Extra-small phones */
@media(max-width:420px){
  .archive-copy .archive-title{
    font-size:30px;
  }
  .nav a,
  .route-card span,
  .section-cta,
  .archive-cta,
  .links a{
    font-size:13px !important;
  }
}


/* v2.10 FINAL — explicit card image click areas */
.cards article > .card-image-link{
  display:block;
  width:100%;
  text-decoration:none;
  color:inherit;
  cursor:pointer;
}
.cards article > .card-image-link .pic,
.cards article > .card-image-link .cardpic{
  width:100%;
}
.cards article > .card-image-link:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:3px;
}

/* Archive: intentionally calm two-line headline */
.archive-copy .archive-title{
  font-size:clamp(26px,2.25vw,38px) !important;
  line-height:1.52 !important;
  letter-spacing:.005em !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
}
.archive-copy .archive-title span{
  display:block !important;
  white-space:nowrap !important;
}
.archive-shell{
  grid-template-columns:minmax(520px,1.08fr) minmax(480px,.92fr) !important;
}

/* Archive right panel: true atmospheric background, no half-visible person/guitar/photo crop */
.archive-visual{
  position:relative;
  min-height:470px;
  overflow:hidden;
  background:
    radial-gradient(circle at 72% 32%, rgba(238,186,108,.16) 0%, rgba(238,186,108,.06) 18%, transparent 36%),
    linear-gradient(180deg, rgba(77,54,39,.42) 0%, rgba(23,24,28,.52) 46%, rgba(7,9,12,.96) 100%),
    linear-gradient(120deg, #302117 0%, #1b1b1e 42%, #0a0c10 100%);
}
.archive-visual::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(circle at 64% 18%, rgba(255,219,155,.11), transparent 22%),
    radial-gradient(circle at 58% 54%, rgba(223,163,82,.08), transparent 26%),
    linear-gradient(90deg,rgba(5,7,10,.58) 0%,rgba(5,7,10,.16) 34%,rgba(5,7,10,.02) 68%,rgba(5,7,10,.20) 100%);
  pointer-events:none;
}
.archive-visual::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(180deg,transparent 48%,rgba(5,7,10,.22) 72%,rgba(5,7,10,.62) 100%);
  pointer-events:none;
}
.archive-visual img{
  display:none !important;
}
.archive-emblem{
  z-index:2;
}

@media(max-width:900px){
  .archive-shell{grid-template-columns:1fr !important;}
  .archive-copy .archive-title{
    font-size:clamp(28px,5.4vw,38px) !important;
  }
  .archive-copy .archive-title span{
    white-space:normal !important;
  }
}


/* v2.11 — archive section stability fix */

/* Desktop layout: balanced proportions */
.archive-shell{
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr) !important;
  min-height:560px;
}

/* Left copy remains readable and deliberate */
.archive-copy{
  padding:clamp(42px,5vw,70px) !important;
}
.archive-copy .archive-title{
  font-size:clamp(30px,2.6vw,42px) !important;
  line-height:1.48 !important;
  margin:.28em 0 .82em !important;
}
.archive-copy .archive-title span{
  display:block !important;
  white-space:nowrap !important;
}

/* Right panel is a self-contained designed field */
.archive-visual{
  position:relative !important;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
  min-width:0 !important;
  min-height:560px !important;
  overflow:hidden !important;
  padding:0 !important;
  background:
    radial-gradient(circle at 72% 28%, rgba(219,164,96,.13) 0%, rgba(219,164,96,.05) 22%, transparent 40%),
    linear-gradient(180deg, #2b211a 0%, #17191d 45%, #090b0f 100%) !important;
}
.archive-visual img{
  display:none !important;
}

/* Replace edge-hugging emblem with centered contained emblem */
.archive-emblem{
  position:relative !important;
  right:auto !important;
  bottom:auto !important;
  width:100% !important;
  max-width:420px !important;
  margin:0 auto 46px !important;
  padding:0 28px !important;
  box-sizing:border-box !important;
  text-align:center !important;
  color:#efe8dd !important;
  z-index:3 !important;
}
.archive-emblem small,
.archive-emblem span{
  display:block !important;
  color:var(--gold) !important;
  font:600 9px/1.5 Arial,sans-serif !important;
  letter-spacing:.16em !important;
  white-space:nowrap !important;
}
.archive-emblem strong{
  display:block !important;
  margin:10px 0 8px !important;
  font:300 clamp(40px,4.2vw,68px)/.9 Georgia,"Times New Roman",serif !important;
  letter-spacing:.05em !important;
  white-space:normal !important;
  overflow-wrap:normal !important;
}

/* Mobile / tablet */
@media(max-width:900px){
  .archive-shell{
    grid-template-columns:1fr !important;
    min-height:0 !important;
  }
  .archive-copy .archive-title{
    font-size:clamp(30px,5vw,40px) !important;
  }
  .archive-copy .archive-title span{
    white-space:normal !important;
  }
  .archive-visual{
    min-height:340px !important;
  }
  .archive-emblem{
    max-width:360px !important;
    margin-bottom:34px !important;
    padding:0 24px !important;
  }
  .archive-emblem strong{
    font-size:clamp(38px,10vw,58px) !important;
  }
}

@media(max-width:520px){
  .archive-copy{
    padding:34px 22px 36px !important;
  }
  .archive-copy .archive-title{
    font-size:30px !important;
    line-height:1.42 !important;
  }
  .archive-visual{
    min-height:300px !important;
  }
  .archive-emblem{
    max-width:300px !important;
    margin-bottom:28px !important;
  }
  .archive-emblem strong{
    font-size:44px !important;
  }
  .archive-emblem small,
  .archive-emblem span{
    font-size:8px !important;
  }
}


/* v2.12 — generated FULL SONGS / STORIES artwork section */
.archive-artwork-section{
  padding-top:clamp(42px,6vw,84px);
  padding-bottom:clamp(42px,6vw,84px);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.archive-artwork-link{
  display:block;
  width:min(100%,1400px);
  margin:0 auto;
  border:1px solid rgba(201,164,95,.35);
  background:#090b0f;
  overflow:hidden;
  text-decoration:none;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.archive-artwork-link:hover{
  transform:translateY(-2px);
  border-color:rgba(201,164,95,.74);
  box-shadow:0 20px 55px rgba(0,0,0,.24);
}
.archive-artwork-link:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:4px;
}
.archive-artwork-link img{
  display:block;
  width:100%;
  height:auto;
}

/* Mobile: preserve the exact artwork without cropping */
@media(max-width:760px){
  .archive-artwork-section{
    padding-top:32px;
    padding-bottom:32px;
  }
  .archive-artwork-link{
    width:100%;
  }
  .archive-artwork-link img{
    width:100%;
    height:auto;
    object-fit:contain;
  }
}


/* v2.13 — SORA BGM STORE preparation notice (BOOTH routes preserved) */
.store-preparing{
  width:min(100%,980px);margin:28px 0 30px;padding:28px 30px;
  border:1px solid rgba(201,164,95,.42);background:linear-gradient(135deg,rgba(201,164,95,.08),rgba(255,255,255,.025));
  display:grid;gap:8px;position:relative;overflow:hidden
}
.store-preparing small{font-size:11px;letter-spacing:.18em;color:var(--gold)}
.store-preparing strong{font-size:clamp(24px,3vw,36px);letter-spacing:.04em}
.store-preparing span{max-width:720px;line-height:1.8;opacity:.82}
.store-preparing b{display:inline-block;width:max-content;margin-top:8px;padding:7px 12px;border:1px solid rgba(201,164,95,.45);font-size:10px;letter-spacing:.18em;color:var(--gold);font-weight:600}
@media(max-width:760px){.store-preparing{padding:24px 20px;margin:22px 0 26px}.store-preparing strong{font-size:27px}}

/* v2.40: preserve Stripe placeholder in source but never render while hidden */
.store-preparing[hidden]{display:none!important}