/* ジムタス 紹介ページ v2 — "ジムの床"
   素材：ラバーマット（地）／チョーク（白板）／床のセーフティテープ（金）／プレートの赤（自己ベストだけ）
   書体：Dela Gothic One（日本語見出し）＋ Anton（数字・英字ラベル）＋ Zen Kaku Gothic New（本文） */
@import url("fonts/lp-fonts.css");

:root{
  --mat:#121314; --mat2:#191B1D; --mat3:#222528; --line:#2E3236;
  --ink:#ECEBE5; --sub:#9EA3A8;
  --chalk:#EFEEE8; --chalk-ink:#16181A; --chalk-sub:#5B6066; --chalk-line:#D2D1C9;
  --gold:#F2C230; --gold-ink:#141414; --plate:#D8432F; --green:#2FA36B;
  --jp:'Noto Sans JP','Hiragino Kaku Gothic StdN',sans-serif;
  --num:'Anton',Impact,sans-serif;
  --body:'Noto Sans JP','Hiragino Sans','Yu Gothic',sans-serif;
  --r:14px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--mat);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.95;font-feature-settings:"palt" 1;-webkit-font-smoothing:antialiased;font-weight:500}
h1,h2,h3,p,li,dd,dt,summary{line-break:strict;overflow-wrap:anywhere}
img{display:block;max-width:100%;height:auto}
picture,figure{display:block}
a{color:var(--gold);text-underline-offset:4px}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:4px}
.wrap{max-width:1160px;margin:0 auto;padding:0 28px}
.sp{display:none}
@media(max-width:640px){.wrap{padding:0 20px}.sp{display:inline}.pc{display:none}}

/* ラバーマットの粒 */
.hero,.mat,.close{background-color:var(--mat);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ── ヘッダー ── */
.hd{position:sticky;top:0;z-index:20;background:rgba(18,19,20,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.hd-in{display:flex;align-items:center;justify-content:space-between;height:68px}
.hd-logo img{height:30px;width:auto}
.hd-nav{display:flex;gap:28px}
.hd-nav a{color:var(--ink);text-decoration:none;font-size:.88rem;font-weight:700;letter-spacing:.04em;opacity:.85}
.hd-nav a:hover{opacity:1;color:var(--gold)}
@media(max-width:760px){.hd-nav a:not([href$="#trainer"]):not([href="support.html"]){display:none}.hd-nav{gap:18px}}

/* ── ヒーロー ── */
.hero{position:relative;overflow:hidden}
.hero-in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:40px;align-items:center;padding-top:72px;padding-bottom:120px}
.eyebrow{font-family:var(--num);font-size:1rem;letter-spacing:.14em;color:var(--gold);display:flex;gap:10px;align-items:center}
.eyebrow .dot{color:var(--sub)}
.hero h1{font-family:var(--jp);font-weight:400;font-size:clamp(3rem,8.2vw,6.6rem);line-height:1.06;letter-spacing:-.01em;margin-top:18px}
.hero-lead{margin-top:30px;font-size:1.12rem;color:#C9CBCD;max-width:30em;font-weight:700}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:22px 28px;margin-top:40px}
.badge{display:inline-flex;align-items:center;gap:12px;background:var(--gold);color:var(--gold-ink);padding:13px 24px 13px 18px;border-radius:12px;font-weight:700}
.badge svg{width:24px;height:24px;fill:currentColor}
.badge small{display:block;font-size:.72rem;font-weight:700;opacity:.7;line-height:1.3}
.badge b{display:block;font-size:1.02rem;line-height:1.35}
.badge.light{background:var(--ink);color:var(--mat)}
.link-arrow{color:var(--ink);font-weight:700;text-decoration:none;border-bottom:2px solid var(--gold);padding-bottom:2px}
.link-arrow::after{content:" →";color:var(--gold)}
.hero-note{margin-top:18px;font-size:.88rem;color:var(--sub)}

.hero-visual{position:relative;isolation:isolate;justify-self:center;width:min(330px,80vw)}
.phone{position:relative;background:#0A0A0B;border-radius:44px;padding:11px;box-shadow:0 0 0 1.5px #3A3E42,0 40px 80px -30px rgba(0,0,0,.8),0 0 120px -40px rgba(242,194,48,.25)}
.phone img{border-radius:34px}
.hero .phone{transform:rotate(-3deg)}
.pr-chip{position:absolute;left:-118px;bottom:86px;width:236px;background:var(--mat2);border:1.5px solid var(--gold);border-radius:16px;padding:16px 18px 14px;box-shadow:0 24px 48px -20px rgba(0,0,0,.9);transform:rotate(2.5deg)}
.pr-tag{display:inline-block;background:var(--gold);color:var(--gold-ink);font-family:var(--num);font-size:.82rem;letter-spacing:.12em;padding:1px 9px;border-radius:4px}
.pr-ex{display:block;font-size:.78rem;color:var(--sub);margin-top:8px;font-weight:700}
.pr-num{display:block;font-family:var(--num);font-size:1.7rem;line-height:1.2;color:var(--ink);letter-spacing:.01em}
.pr-num i{font-style:normal;font-size:.8rem;margin-left:2px;color:var(--sub)}
.pr-num em{font-style:normal;color:var(--gold);margin:0 8px;font-size:1.2rem}
.pr-diff{display:block;font-family:var(--num);font-size:2.4rem;line-height:1.05;color:var(--gold)}
.plate{position:absolute;right:-92px;top:-36px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle at 50% 50%,var(--mat) 0 14%,#2a2d30 14.5% 17%,var(--plate) 17.5% 64%,#a8321f 64.5% 68%,var(--plate) 68.5% 100%);display:grid;place-content:center;text-align:center;transform:rotate(12deg);box-shadow:0 20px 40px -18px rgba(0,0,0,.9);z-index:-1}
.plate span,.plate small{position:absolute;left:0;right:0;font-family:var(--num);color:#fff;opacity:.92}
.plate span{top:12px;font-size:1.5rem}
.plate small{bottom:14px;font-size:.8rem;letter-spacing:.2em}
@media(max-width:900px){
  .hero-in{grid-template-columns:1fr;padding-top:44px;padding-bottom:110px;gap:64px}
  .pr-chip{left:-40px;bottom:60px;width:210px}
  .plate{right:-50px;width:120px;height:120px}
}
@media(max-width:520px){.pr-chip{left:-14px}.plate{right:-24px;top:-24px}}

/* セーフティテープ */
.tape{position:absolute;left:0;right:0;bottom:0;height:22px;background:repeating-linear-gradient(-45deg,var(--gold) 0 18px,var(--mat) 18px 36px)}

/* 種目の帯 */
.strip{background:var(--mat2);border-bottom:1px solid var(--line);overflow:hidden}
.strip-in{display:flex;gap:44px;padding:16px 28px;white-space:nowrap;font-family:var(--num);font-size:1.35rem;letter-spacing:.08em;color:#4B5056;justify-content:center}
.strip-in span:nth-child(odd){color:#6C7177}

/* ── 共通セクション ── */
.sec{padding:120px 0}
.sec-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center}
.sec-in.rev .sec-copy{order:2}
@media(max-width:900px){.sec{padding:84px 0}.sec-in{grid-template-columns:1fr;gap:44px}.sec-in.rev .sec-copy{order:0}}
.num{font-family:var(--num);font-size:4.6rem;line-height:.9;color:var(--gold);display:flex;align-items:flex-end;gap:14px}
.num span{font-size:1rem;letter-spacing:.2em;color:var(--sub);padding-bottom:.55rem}
.sec h2,.pair h2{font-family:var(--jp);font-weight:400;font-size:clamp(1.9rem,4vw,2.9rem);line-height:1.28;margin:22px 0 24px}
.sec p+p{margin-top:14px}
.sec-copy>p:not(.num){color:#C3C6C9}
mark{background:linear-gradient(transparent 62%,var(--plate) 62% 92%,transparent 92%);color:inherit}
.mat2{background:var(--mat2)}

/* 01 白板 */
.board{background:var(--chalk);color:var(--chalk-ink);
  background-image:radial-gradient(rgba(0,0,0,.035) 1px,transparent 1px);background-size:22px 22px}
.board .num span{color:var(--chalk-sub)}
.board .num{color:var(--chalk-ink);-webkit-text-stroke:0}
.board .sec-copy>p:not(.num){color:var(--chalk-sub)}
.ticks{list-style:none;margin-top:26px;border-top:2px solid var(--chalk-ink)}
.ticks li{position:relative;padding:12px 0 12px 30px;border-bottom:1px solid var(--chalk-line);font-size:.96rem}
.ticks li::before{content:"";position:absolute;left:2px;top:22px;width:14px;height:7px;border-left:3px solid var(--chalk-ink);border-bottom:3px solid var(--chalk-ink);transform:rotate(-45deg)}
.ticks b{background:linear-gradient(transparent 60%,var(--gold) 60%)}
.shot-board{position:relative;background:#fff;padding:14px 14px 0;border-radius:6px;box-shadow:0 2px 0 var(--chalk-line),0 30px 50px -28px rgba(0,0,0,.45);transform:rotate(1.2deg)}
.shot-board img{border-radius:4px;background:#111}
.shot-board figcaption{font-size:.8rem;color:var(--chalk-sub);padding:10px 4px 12px}
.pin{position:absolute;top:-12px;left:50%;width:22px;height:22px;margin-left:-11px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffe27a,var(--gold) 45%,#b48a10);box-shadow:0 4px 6px rgba(0,0,0,.35)}

/* 02 PR */
.shot-pr{justify-self:center;width:min(380px,100%);border-radius:28px;overflow:hidden;box-shadow:0 0 0 1.5px var(--gold),0 40px 80px -30px rgba(0,0,0,.9)}

/* 03/04 */
.pair{display:grid;grid-template-columns:1fr 1fr;gap:72px}
.pair-item>p:not(.num){color:#C3C6C9}
.pair .num{font-size:3.6rem}
.shot-flat{margin-top:30px;border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}
.src{margin-top:26px;border-top:1px solid var(--line)}
.src div{display:grid;grid-template-columns:11em 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.src dt{font-weight:700;color:var(--ink)}
.src dd{color:var(--sub);font-size:.94rem}
@media(max-width:900px){.pair{grid-template-columns:1fr;gap:96px}.src div{grid-template-columns:1fr;gap:2px}}

/* ── トレーナー ── */
.trainer{background:var(--gold);color:var(--gold-ink);padding:130px 0 110px;position:relative}
.trainer::before{content:"";position:absolute;left:0;right:0;top:0;height:14px;background:repeating-linear-gradient(-45deg,var(--mat) 0 14px,var(--gold) 14px 28px)}
.tr-eyebrow{font-family:var(--num);letter-spacing:.16em;font-size:1.05rem}
.tr-head h2{font-family:var(--jp);font-weight:400;font-size:clamp(2.1rem,5vw,3.8rem);line-height:1.2;margin-top:18px}
.tr-lead{margin-top:26px;max-width:36em;font-size:1.08rem;font-weight:700}
.tr-body{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:56px;margin-top:64px;align-items:start}
.steps{list-style:none;counter-reset:s;border-top:3px solid var(--gold-ink)}
.steps li{display:grid;grid-template-columns:72px 1fr;gap:18px;padding:22px 0;border-bottom:1.5px solid rgba(20,20,20,.25)}
.st-n{font-family:var(--num);font-size:3.2rem;line-height:1}
.steps h3{font-family:var(--jp);font-weight:400;font-size:1.35rem;line-height:1.4}
.steps p{margin-top:4px;font-size:.98rem}
.roster{background:var(--mat);color:var(--ink);border-radius:20px;padding:24px 22px 18px;box-shadow:0 30px 60px -30px rgba(0,0,0,.6);transform:rotate(-1.2deg)}
.roster-cap{font-weight:700;display:flex;justify-content:space-between;align-items:center;font-size:.95rem}
.roster-cap span{font-size:.7rem;color:var(--sub);border:1px solid var(--line);padding:0 8px;border-radius:999px}
.roster ul{list-style:none;margin-top:14px}
.roster li{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"n w" "e e";gap:2px 12px;padding:13px 4px;border-top:1px solid var(--line)}
.roster li b{grid-area:n}
.roster li span{grid-area:w;color:var(--sub);font-size:.85rem;justify-self:end;align-self:center}
.roster li em{grid-area:e;font-style:normal;font-size:.85rem;color:var(--sub)}
.roster li em.up{color:var(--gold)}
.roster li em.warn{color:#F0876F}
.roster-note{font-size:.72rem;color:var(--sub);margin-top:8px}
.tr-foot{margin-top:56px;padding-top:24px;border-top:3px solid var(--gold-ink);font-size:1rem}
@media(max-width:900px){.trainer{padding:100px 0 84px}.tr-body{grid-template-columns:1fr}.roster{transform:none}}

/* 05 テーマ */
.duo{display:flex;gap:26px;justify-content:center}
.phone.sm{width:min(220px,42vw);border-radius:34px;padding:8px}
.phone.sm img{border-radius:27px}
.phone.sm.light{transform:translateY(40px);box-shadow:0 0 0 1.5px #cfcfc8,0 40px 80px -30px rgba(0,0,0,.8)}

/* FAQ */
.faq{background:var(--chalk);color:var(--chalk-ink);padding:110px 0}
.faq-in{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:56px}
.faq h2{font-family:var(--jp);font-weight:400;font-size:clamp(1.8rem,3.4vw,2.5rem);line-height:1.3}
.qa{border-top:2px solid var(--chalk-ink)}
.qa details{border-bottom:1px solid var(--chalk-line)}
.qa summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;font-weight:700;position:relative}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"";position:absolute;right:8px;top:50%;width:12px;height:12px;margin-top:-8px;border-right:3px solid var(--chalk-ink);border-bottom:3px solid var(--chalk-ink);transform:rotate(45deg);transition:transform .2s}
.qa details[open] summary::after{transform:rotate(-135deg);margin-top:-2px}
.qa p{padding:0 0 22px;color:var(--chalk-sub)}
.qa a{color:#1F7A5C}
@media(max-width:900px){.faq{padding:84px 0}.faq-in{grid-template-columns:1fr;gap:28px}}

/* 締め */
.close{padding:120px 0;text-align:center;border-top:1px solid var(--line)}
.close-big{font-family:var(--jp);font-size:clamp(2rem,5.4vw,4rem);line-height:1.22}
.close-big span{color:var(--gold)}
.close .badge{margin-top:40px}

/* フッター */
.ft{background:#0C0D0E;border-top:1px solid var(--line);padding:44px 0 56px;font-size:.88rem}
.ft-in{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.ft img{height:26px;width:auto}
.ft nav{display:flex;gap:22px;margin-top:16px;flex-wrap:wrap}
.ft nav a{color:var(--sub);text-decoration:none}
.ft nav a:hover{color:var(--ink)}
.ft .by{color:var(--sub);text-align:right}
.ft .by a{color:var(--ink)}

@media(max-width:900px){.strip-in{justify-content:flex-start}}

/* v2.1 パキッとした見出し：Noto Sans JP Black、詰め組み、わずかに前傾 */
.hero h1,.sec h2,.pair h2,.tr-head h2,.steps h3,.faq h2,.close-big{font-family:var(--jp);font-weight:900;letter-spacing:-.04em;font-style:italic;font-synthesis:style}
.hero h1{line-height:1.02;letter-spacing:-.06em}
.num,.eyebrow,.tr-eyebrow,.pr-tag,.pr-num,.pr-diff,.st-n,.strip-in{font-style:italic;font-synthesis:style}
.hero-lead,.tr-lead,.badge b{font-weight:700}
.link-arrow,.hd-nav a,.qa summary,.roster li b,.src dt{font-weight:700}
.hero-lead .nm{color:var(--gold)}