/* =========================================================
   FORGE パーソナルジム — 制作サンプル
   型: パーソナルジム（力強い・ダーク・エネルギッシュ）
   配色: 黒 #0d0d0f / 白 / 鮮烈オレンジ #ff5a1f / グレー #2a2a2e
   フォント: Zen Kaku Gothic New(極太見出し) + Space Mono(数値)
   ========================================================= */

:root{
  --bk:#0d0d0f;
  --bk-2:#16161a;
  --gray:#2a2a2e;
  --gray-lt:#9a9aa2;
  --line:#2f2f35;
  --orange:#ff5a1f;
  --orange-d:#e6481090;
  --white:#ffffff;
  --paper:#f4f4f6;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:"Zen Kaku Gothic New","Hiragino Sans",sans-serif;
  color:var(--white);background:var(--bk);
  line-height:1.85;font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.mono{font-family:"Space Mono",monospace}
h1,h2,h3{font-family:"Zen Kaku Gothic New",sans-serif;font-weight:900;line-height:1.18;letter-spacing:.01em}
.wrap{width:min(1120px,90vw);margin-inline:auto}
.ey{font-family:"Space Mono",monospace;font-size:.78rem;letter-spacing:.32em;color:var(--orange);text-transform:uppercase}
.accent{color:var(--orange)}

/* nav (top offset clears the sample frame bar) */
.nav{position:fixed;top:42px;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;
  padding:18px 5vw;transition:.35s;background:transparent}
@media(max-width:600px){.nav{top:34px;padding:14px 5vw}}
.nav.solid{background:rgba(13,13,15,.92);backdrop-filter:blur(12px);box-shadow:0 1px 0 var(--line)}
.nav .logo{font-family:"Zen Kaku Gothic New",sans-serif;font-weight:900;font-size:1.35rem;letter-spacing:.22em}
.nav .logo b{color:var(--orange)}
.nav-links{display:flex;gap:1.9em;font-size:.84rem;letter-spacing:.14em;font-weight:700}
.nav-links a{color:#d6d6da;transition:.2s}.nav-links a:hover{color:var(--orange)}
.nav .cta{background:var(--orange);color:#fff;padding:.62em 1.4em;font-weight:900;font-size:.8rem;letter-spacing:.1em;
  clip-path:polygon(8% 0,100% 0,92% 100%,0 100%);transition:.25s}
.nav .cta:hover{filter:brightness(1.12)}
@media(max-width:860px){.nav-links{display:none}}

/* hero */
.hero{min-height:100vh;position:relative;display:flex;align-items:center;
  background:#000 center/cover no-repeat;overflow:hidden}
.hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(13,13,15,.92) 0%,rgba(13,13,15,.7) 40%,rgba(13,13,15,.25) 100%)}
.hero-inner{position:relative;z-index:2;padding:140px 0 80px;animation:rise 1.1s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
.hero .ey{margin-bottom:1.6em}
.hero h1{font-size:clamp(2.8rem,9vw,6.6rem);letter-spacing:.01em;text-shadow:0 6px 40px rgba(0,0,0,.5)}
.hero h1 .bar{display:inline-block;background:var(--orange);color:#0d0d0f;padding:0 .12em;transform:skewX(-6deg)}
.hero .sub{margin-top:1.4em;font-size:clamp(1rem,2vw,1.25rem);font-weight:500;color:#d6d6da;max-width:24em;line-height:1.9}
.hero-actions{margin-top:2.6em;display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.btn{display:inline-block;font-weight:900;letter-spacing:.08em;font-size:.95rem;transition:.25s}
.btn-fill{background:var(--orange);color:#fff;padding:1.05em 2.4em;clip-path:polygon(6% 0,100% 0,94% 100%,0 100%)}
.btn-fill:hover{filter:brightness(1.12);transform:translateY(-2px)}
.btn-line{border:2px solid #45454c;color:#fff;padding:.95em 2em}
.btn-line:hover{border-color:var(--orange);color:var(--orange)}
.scroll-cue{position:absolute;bottom:30px;right:5vw;z-index:2;font-family:"Space Mono",monospace;
  font-size:.7rem;letter-spacing:.3em;color:#9a9aa2;writing-mode:vertical-rl}
.scroll-cue::after{content:"";display:block;width:1px;height:42px;background:#5a5a62;margin:12px auto 0}

/* section base */
.sec{padding:120px 0}
.sec-head{margin-bottom:60px}
.sec-head h2{font-size:clamp(2rem,5vw,3.4rem);margin-top:.3em}
.sec-head .ey{display:block}

/* reasons (3) */
.reasons{background:var(--bk-2)}
.reason-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.reason{background:var(--bk);border:1px solid var(--line);padding:46px 34px;position:relative;overflow:hidden;transition:.3s}
.reason::before{content:"";position:absolute;top:0;left:0;width:100%;height:4px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:.4s}
.reason:hover{transform:translateY(-6px)}
.reason:hover::before{transform:scaleX(1)}
.reason .no{font-family:"Space Mono",monospace;font-size:2.4rem;font-weight:700;color:var(--orange);line-height:1}
.reason h3{font-size:1.32rem;margin:.7em 0 .5em}
.reason p{color:var(--gray-lt);font-size:.96rem;line-height:1.9}
@media(max-width:860px){.reason-grid{grid-template-columns:1fr}}

/* programs */
.prog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--line)}
.prog{position:relative;min-height:420px;display:flex;align-items:flex-end;
  background:#000 center/cover no-repeat;overflow:hidden;border-right:1px solid var(--line)}
.prog:last-child{border-right:none}
.prog::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,13,15,.1) 30%,rgba(13,13,15,.92))}
.prog .pin{position:relative;z-index:2;padding:34px 30px;width:100%;transition:.3s}
.prog:hover .pin{transform:translateY(-6px)}
.prog .pno{font-family:"Space Mono",monospace;color:var(--orange);font-size:.8rem;letter-spacing:.2em}
.prog h3{font-size:1.5rem;margin:.4em 0 .5em}
.prog p{color:#cfcfd4;font-size:.92rem;line-height:1.85}
@media(max-width:860px){.prog-grid{grid-template-columns:1fr}.prog{border-right:none;border-bottom:1px solid var(--line);min-height:300px}.prog:last-child{border-bottom:none}}

/* plans */
.plans{background:var(--bk-2)}
.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.plan{background:var(--bk);border:1px solid var(--line);padding:42px 32px;display:flex;flex-direction:column;transition:.3s}
.plan.feat{border-color:var(--orange);box-shadow:0 0 0 1px var(--orange) inset;position:relative}
.plan.feat::after{content:"人気";position:absolute;top:18px;right:-1px;background:var(--orange);color:#fff;
  font-size:.72rem;font-weight:900;letter-spacing:.1em;padding:.3em 1em}
.plan .pname{font-size:1.3rem;font-weight:900}
.plan .pdesc{color:var(--gray-lt);font-size:.88rem;margin:.5em 0 1.4em;min-height:3em}
.plan .price{font-family:"Space Mono",monospace;font-size:2.3rem;font-weight:700;color:#fff;line-height:1}
.plan .price small{font-size:.9rem;color:var(--gray-lt);font-family:"Zen Kaku Gothic New",sans-serif;font-weight:500}
.plan .punit{font-size:.82rem;color:var(--gray-lt);margin-top:.5em}
.plan ul{list-style:none;margin:1.8em 0;padding-top:1.6em;border-top:1px solid var(--line);flex:1}
.plan li{font-size:.92rem;padding:.5em 0 .5em 1.6em;position:relative;color:#d6d6da}
.plan li::before{content:"";position:absolute;left:0;top:.95em;width:9px;height:9px;background:var(--orange);transform:rotate(45deg)}
.plan .pbtn{display:block;text-align:center;font-weight:900;letter-spacing:.06em;padding:1em;border:2px solid var(--line);transition:.25s}
.plan.feat .pbtn{background:var(--orange);border-color:var(--orange)}
.plan .pbtn:hover{border-color:var(--orange);color:var(--orange)}
.plan.feat .pbtn:hover{color:#fff;filter:brightness(1.12)}
.plan-note{margin-top:24px;font-size:.82rem;color:var(--gray-lt)}
@media(max-width:860px){.plan-grid{grid-template-columns:1fr}}

/* trainers */
.trainer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.trainer{background:var(--bk-2);border:1px solid var(--line);padding:36px 30px}
.trainer .ti{display:flex;align-items:baseline;gap:.7em;margin-bottom:.4em}
.trainer .tname{font-size:1.25rem;font-weight:900}
.trainer .trole{font-family:"Space Mono",monospace;font-size:.74rem;letter-spacing:.12em;color:var(--orange)}
.trainer p{color:var(--gray-lt);font-size:.92rem;line-height:1.9;margin-top:.4em}
.trainer .tags{margin-top:1.2em;display:flex;flex-wrap:wrap;gap:8px}
.trainer .tags span{font-size:.74rem;letter-spacing:.04em;border:1px solid var(--line);padding:.32em .9em;color:#c2c2c8}
@media(max-width:860px){.trainer-grid{grid-template-columns:1fr}}

/* voices */
.voices{background:var(--bk-2)}
.voice-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.voice{background:var(--bk);border-left:4px solid var(--orange);padding:34px 32px}
.voice .q{font-size:1.08rem;font-weight:700;line-height:1.8}
.voice .who{margin-top:1.2em;font-family:"Space Mono",monospace;font-size:.8rem;color:var(--gray-lt);letter-spacing:.06em}
@media(max-width:860px){.voice-grid{grid-template-columns:1fr}}

/* split feature (studio image) */
.split{display:grid;grid-template-columns:1.05fr .95fr;align-items:stretch;background:var(--bk)}
.split .ph{min-height:62vh;background:#000 center/cover no-repeat}
.split .tx{padding:9vh 6vw;display:flex;flex-direction:column;justify-content:center}
.split h2{font-size:clamp(1.8rem,4vw,3rem);margin:.4em 0 .6em}
.split p{color:var(--gray-lt);line-height:1.95;max-width:32em}
@media(max-width:860px){.split{grid-template-columns:1fr}.split .ph{min-height:64vw}.split .tx{padding:60px 30px}}

/* CTA band */
.cta-band{position:relative;background:#000 center/cover no-repeat;color:#fff;text-align:center;padding:130px 0;overflow:hidden}
.cta-band::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,13,15,.78),rgba(230,72,16,.55))}
.cta-band .wrap{position:relative;z-index:2}
.cta-band .ey{color:#ffd9c9}
.cta-band h2{font-size:clamp(2rem,5.4vw,3.6rem);margin:.4em 0 .6em;text-shadow:0 4px 30px rgba(0,0,0,.4)}
.cta-band p{max-width:30em;margin:0 auto 2.2em;font-weight:500;color:#fff}
.cta-band .btn-fill{font-size:1.05rem}

/* access */
.access{padding:110px 0;background:var(--bk)}
.access-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.access .info{line-height:2.2;color:#d6d6da}
.access .info dt{font-family:"Space Mono",monospace;font-size:.74rem;letter-spacing:.16em;color:var(--orange);margin-top:1.2em}
.access .info dd{font-size:1rem}
.access .info dd:first-of-type{margin-top:0}
.access-img{border:1px solid var(--line)}
.access-img img{width:100%;height:100%;aspect-ratio:3/2;object-fit:cover}
@media(max-width:860px){.access-grid{grid-template-columns:1fr;gap:30px}}

/* footer */
.foot{background:#070708;color:#7c7c84;padding:54px 0 64px;font-size:.8rem;line-height:1.9}
.foot .logo{font-family:"Zen Kaku Gothic New",sans-serif;font-weight:900;color:#fff;font-size:1.2rem;letter-spacing:.2em;margin-bottom:1em}
.foot .logo b{color:var(--orange)}
.foot a{color:var(--orange)}
.foot .disc{border-top:1px solid #1d1d22;margin-top:18px;padding-top:18px;color:#5d5d64;font-size:.76rem;line-height:1.85}

/* reveal */
.rv{opacity:0;transform:translateY(28px);transition:.9s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
