/*
Theme Name: RePro
Theme URI: https://repro-training.jp
Description: RePro（リプロ）｜横浜市鶴見区のパーソナルトレーニング＆マシンピラティス 公式テーマ。固定ページはテンプレートに組み込み済みでデザインが崩れません。ブログ・ニュースは管理画面から更新できます。
Author: BoostX
Version: 1.1.1
Requires at least: 6.0
Requires PHP: 7.4
License: GPL v2 or later
Text Domain: repro
*/

@charset "UTF-8";
/* =========================================================
   RePro — パーソナルトレーニング & マシンピラティス
   ========================================================= */

:root{
  --ink:#2d2f47;
  --ink-2:#3b3d55;
  --text:#26241f;
  --muted:#8a8177;
  --hair:#e6ded2;
  --tan:#c9a87c;
  --tan-d:#a8865a;
  --cream:#faf6f0;
  --card:#f2e9dc;
  --white:#fff;

  --serif:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --sans:"Noto Sans JP","Hiragino Sans","Yu Gothic",sans-serif;
  --latin:"Cormorant Garamond",Georgia,serif;

  --wrap:1140px;
  --head:82px;
  --e:cubic-bezier(.22,.61,.36,1);
  --e2:cubic-bezier(.65,0,.35,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--head) + 8px);-webkit-text-size-adjust:100%}
body{
  margin:0;color:var(--text);background:var(--white);
  font-family:var(--sans);font-size:15px;line-height:2.05;font-weight:400;
  letter-spacing:.05em;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul,ol,dl,dd{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,h5,p,figure,blockquote{margin:0}
table{border-collapse:collapse;width:100%}
button{font:inherit;border:0;background:none;cursor:pointer;color:inherit}
::selection{background:var(--tan);color:#fff}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{width:min(var(--wrap),calc(100% - 52px));margin-inline:auto;position:relative;z-index:2}

/* ---------- scroll progress ---------- */
.progress{position:fixed;inset:0 0 auto;height:2px;z-index:150;background:transparent;pointer-events:none}
.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--tan),var(--tan-d))}

/* ---------- loader ---------- */
.loader{
  position:fixed;inset:0;z-index:200;background:var(--white);
  display:grid;place-items:center;align-content:center;gap:4px;
  transition:opacity .8s var(--e),visibility .8s;
}
.loader.is-hidden{opacity:0;visibility:hidden}
.loader__mark{width:190px;height:190px}
.loader__word{
  font-family:var(--latin);font-size:22px;letter-spacing:.5em;color:var(--ink);
  text-indent:.5em;margin-top:-26px;opacity:.85;
}

/* ---------- header ---------- */
.header{
  position:fixed;inset:0 0 auto;z-index:100;height:var(--head);
  display:flex;align-items:center;gap:22px;padding-inline:clamp(18px,3.4vw,44px);
  color:var(--white);
  transition:background .5s var(--e),color .5s var(--e),height .5s var(--e),box-shadow .5s var(--e);
}
.header::after{
  content:"";position:absolute;inset:auto 0 0;height:1px;
  background:rgba(255,255,255,.16);opacity:1;transition:opacity .4s;
}
.header.is-solid{background:rgba(255,255,255,.94);backdrop-filter:blur(14px);color:var(--ink);height:68px;box-shadow:0 1px 0 var(--hair)}
.header.is-solid::after{opacity:0}

.header__logo{display:flex;align-items:center;gap:11px}
.logomark{width:36px;height:36px;flex:none;transition:transform .6s var(--e)}
.header__logo:hover .logomark{transform:rotate(28deg)}
.header__wordmark{display:flex;flex-direction:column;line-height:1.08}
.header__wordmark em{font-family:var(--latin);font-style:normal;font-size:21px;letter-spacing:.24em;font-weight:500}
.header__wordmark small{font-family:var(--latin);font-size:8px;letter-spacing:.38em;opacity:.7}

.gnav{margin-left:auto;display:flex;align-items:center;gap:26px}
.gnav ul{display:flex;gap:22px}
.gnav ul a{position:relative;display:grid;gap:1px;padding-block:4px;text-align:center;overflow:hidden}
.gnav ul a span{font-size:12.5px;letter-spacing:.08em;display:block;transition:transform .45s var(--e)}
.gnav ul a i{
  font-family:var(--latin);font-style:normal;font-size:9px;letter-spacing:.24em;opacity:.55;
  display:block;transition:transform .45s var(--e);
}
.gnav ul a::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--tan);
  transform:scaleX(0);transform-origin:right;transition:transform .45s var(--e);
}
.gnav ul a:hover::after{transform:scaleX(1);transform-origin:left}
.gnav__cta{
  border:1px solid currentColor;padding:11px 22px;font-size:12px;letter-spacing:.1em;white-space:nowrap;
  position:relative;overflow:hidden;transition:color .4s var(--e),border-color .4s var(--e);
}
.gnav__cta::before{
  content:"";position:absolute;inset:0;background:var(--tan);
  transform:scaleY(0);transform-origin:bottom;transition:transform .45s var(--e);z-index:-1;
}
.gnav__cta:hover{color:#fff;border-color:var(--tan)}
.gnav__cta:hover::before{transform:scaleY(1);transform-origin:top}
.header.is-solid .gnav__cta{background:var(--ink);color:#fff;border-color:var(--ink)}

.burger{display:none;width:32px;height:22px;position:relative;margin-left:auto;z-index:110}
.burger span{position:absolute;left:0;right:0;height:1.3px;background:currentColor;transition:.4s var(--e)}
.burger span:nth-child(1){top:1px}.burger span:nth-child(2){top:10px}.burger span:nth-child(3){top:19px}
.burger.is-open{color:var(--ink)}
.burger.is-open span:nth-child(1){top:10px;transform:rotate(45deg)}
.burger.is-open span:nth-child(2){opacity:0}
.burger.is-open span:nth-child(3){top:10px;transform:rotate(-45deg)}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100svh;display:grid;align-items:center;overflow:hidden;color:#fff;isolation:isolate}
.hero__media{position:absolute;inset:0;z-index:-3;overflow:hidden}
.hero__media img{
  width:100%;height:100%;object-fit:cover;object-position:72% 40%;transform:scale(1.1);
  animation:heroZoom 16s var(--e) forwards;
}
@keyframes heroZoom{to{transform:scale(1.01)}}
.hero__grain{
  position:absolute;inset:0;z-index:-2;opacity:.09;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.hero__veil{
  position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(100deg,rgba(16,15,14,.9) 0%,rgba(16,15,14,.72) 34%,rgba(16,15,14,.24) 62%,rgba(16,15,14,.42) 100%),
    linear-gradient(180deg,rgba(16,15,14,.5) 0%,transparent 34%,rgba(16,15,14,.6) 100%);
}
.hero__mark{
  position:absolute;right:-6vw;top:50%;translate:0 -50%;width:min(58vmin,520px);aspect-ratio:1;
  opacity:.13;z-index:-1;pointer-events:none;
}
.hero__inner{width:min(var(--wrap),calc(100% - 52px));margin-inline:auto;padding-top:var(--head);max-width:min(var(--wrap),100%)}
.hero__title,.hero__lead,.hero__sub{max-width:min(660px,72%)}

.hero__eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:26px;animation:rise 1s .3s var(--e) both}
.hero__eyebrow span{font-family:var(--latin);font-size:12px;letter-spacing:.4em;opacity:.88}
.hero__eyebrow b{font-family:var(--latin);font-weight:400;color:var(--tan);font-size:14px}
.hero__eyebrow::after{content:"";flex:0 0 62px;height:1px;background:rgba(255,255,255,.4)}

.hero__title{
  font-family:var(--serif);font-weight:300;line-height:1.5;
  font-size:clamp(30px,5.2vw,62px);letter-spacing:.09em;
}
.hero__title .mask{display:block;overflow:hidden;padding-block:.06em}
.hero__title .mask > span{display:block;transform:translateY(105%);animation:up 1.15s var(--e) both}
.hero__title .mask:nth-child(1) > span{animation-delay:.45s}
.hero__title .mask:nth-child(2) > span{animation-delay:.58s}
.hero__title .mask:nth-child(3) > span{animation-delay:.71s}
@keyframes up{to{transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

.hero__sub{
  margin-top:22px;font-family:var(--serif);font-size:clamp(14px,1.6vw,18px);
  letter-spacing:.16em;color:var(--tan);animation:rise 1.1s .95s var(--e) both;
}
.hero__lead{margin-top:16px;font-size:13.5px;line-height:2.2;opacity:.9;animation:rise 1.1s 1.05s var(--e) both}
.hero__actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:40px;animation:rise 1.1s 1.2s var(--e) both}

.hero__side{
  position:absolute;left:26px;bottom:120px;z-index:3;
  writing-mode:vertical-rl;font-size:11px;letter-spacing:.28em;opacity:.62;
}
.hero__side::after{content:"";display:block;width:1px;height:56px;background:rgba(255,255,255,.45);margin:14px auto 0}

.hero__badges{position:absolute;right:clamp(18px,5vw,68px);top:32%;z-index:3;display:grid;gap:14px;justify-items:center}
.badge{
  width:128px;height:128px;border-radius:50%;display:grid;place-items:center;position:relative;
  background:rgba(255,255,255,.95);color:var(--ink);box-shadow:0 16px 40px rgba(0,0,0,.22);
  animation:float 6s ease-in-out infinite;
}
.badge b{font-family:var(--serif);font-size:19px;letter-spacing:.1em;line-height:1.5;text-align:center;font-weight:500}
.badge b em{display:block;font-style:normal;font-family:var(--sans);font-size:10px;letter-spacing:.14em;color:var(--tan-d);margin-top:2px}
.badge__ring{position:absolute;inset:0;width:100%;height:100%;animation:spin 22s linear infinite}
.badge__ring text{font-family:var(--latin);font-size:7.4px;letter-spacing:.24em;fill:var(--tan-d)}
.badge--b{width:104px;height:104px;animation-delay:-3s;background:var(--ink);color:#fff}
.badge--b b em{color:var(--tan)}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes spin{to{transform:rotate(360deg)}}

.hero__scroll{position:absolute;left:50%;bottom:16px;translate:-50% 0;z-index:3;display:grid;justify-items:center}
.hero__scroll .lottie{width:34px;height:96px}
.hero__scroll span{font-family:var(--latin);font-size:10px;letter-spacing:.36em;opacity:.75;text-indent:.36em}

/* ---------- marquee ---------- */
.marquee{background:var(--ink);color:#fff;overflow:hidden;padding:15px 0}
.marquee__row{display:flex;gap:26px;white-space:nowrap;width:max-content;animation:slide 34s linear infinite}
.marquee__row span{font-family:var(--serif);font-size:13.5px;letter-spacing:.24em;opacity:.92}
.marquee__row i{color:var(--tan);font-style:normal}
@keyframes slide{to{transform:translateX(-50%)}}

/* ---------- buttons ---------- */
.btn{
  --bc:var(--ink);
  display:inline-flex;align-items:center;justify-content:center;position:relative;overflow:hidden;
  padding:16px 38px;font-size:13px;letter-spacing:.12em;border:1px solid var(--bc);
  transition:color .45s var(--e),border-color .45s var(--e);isolation:isolate;
}
.btn span{position:relative;z-index:2}
.btn::before{
  content:"";position:absolute;inset:0;z-index:1;background:var(--tan);
  transform:scaleX(0);transform-origin:right;transition:transform .5s var(--e);
}
.btn:hover::before{transform:scaleX(1);transform-origin:left}
.btn:hover{color:#fff;border-color:var(--tan)}
.btn--fill{background:var(--ink);color:#fff}
.btn--ghost{--bc:currentColor}
.btn--line{--bc:var(--tan-d);color:var(--tan-d);padding:13px 28px;font-size:12px}
.btn--lg{padding:20px 50px;font-size:14px}
.contact .btn--fill{background:#fff;color:var(--ink);border-color:#fff}

/* ---------- section ---------- */
.section{padding:clamp(82px,10vw,148px) 0;position:relative;overflow:hidden}
.section--tint{background:var(--cream)}
.section--dark{background:var(--ink);color:#fff}
.watermark{
  position:absolute;top:clamp(30px,5vw,60px);left:50%;translate:-50% 0;z-index:0;pointer-events:none;
  font-family:var(--latin);font-size:clamp(90px,17vw,220px);letter-spacing:.06em;line-height:1;
  color:var(--ink);opacity:.035;white-space:nowrap;font-weight:500;
}
.watermark--light{color:#fff;opacity:.06}

.shead{text-align:center;margin-bottom:clamp(44px,5.5vw,72px);position:relative;z-index:2}
.shead__more{
  position:absolute;right:0;bottom:12px;font-family:var(--latin);font-size:11.5px;
  letter-spacing:.28em;color:var(--tan-d);display:inline-flex;align-items:center;gap:8px;
}
.shead__more i{font-style:normal;transition:transform .45s var(--e)}
.shead__more:hover i{transform:translateX(6px)}
.shead__en{font-family:var(--latin);font-size:11.5px;letter-spacing:.42em;color:var(--tan-d);text-indent:.42em}
.shead__ja{
  font-family:var(--serif);font-weight:300;font-size:clamp(25px,3.2vw,40px);
  letter-spacing:.16em;margin-top:12px;padding-bottom:22px;position:relative;display:inline-block;
}
.shead__ja::after{
  content:"";position:absolute;left:50%;bottom:0;translate:-50% 0;width:64px;height:1px;background:var(--ink);
}
.shead--light .shead__ja::after{background:rgba(255,255,255,.7)}
.shead--light .shead__en{color:var(--tan)}

.reveal{opacity:0;transform:translateY(34px);transition:opacity 1s var(--e),transform 1s var(--e)}
.reveal.is-in{opacity:1;transform:none}

/* ---------- about ---------- */
.about__catch{
  text-align:center;font-family:var(--serif);font-weight:300;
  font-size:clamp(18px,2.4vw,28px);line-height:2.05;letter-spacing:.11em;
  margin-bottom:clamp(48px,6vw,84px);
}
.about__split{display:grid;grid-template-columns:1fr 340px;gap:clamp(32px,4.5vw,64px);align-items:center}
.about__word{display:grid;gap:22px}
.wordcard{
  background:var(--white);border:1px solid var(--hair);padding:32px 34px;
  display:grid;grid-template-columns:84px 1fr;gap:26px;align-items:start;
  transition:border-color .5s var(--e),transform .5s var(--e);
}
.wordcard:hover{border-color:var(--tan);transform:translateY(-4px)}
.wordcard__key{
  font-family:var(--latin);font-size:34px;letter-spacing:.05em;color:#fff;font-weight:500;
  background:var(--ink);display:grid;place-items:center;height:60px;
}
.wordcard h3{font-family:var(--serif);font-weight:500;font-size:16px;letter-spacing:.1em;margin-bottom:10px}
.wordcard p{font-size:13.5px;line-height:2.1;color:#524b43}
.wordcard b{color:var(--tan-d)}

.about__aside{display:grid;gap:18px;justify-items:center}
.about__fig{overflow:hidden;width:100%}
.about__fig img{width:100%;aspect-ratio:7/5;object-fit:cover;transition:transform 1.2s var(--e)}
.about__fig:hover img{transform:scale(1.05)}
.about__pulse{width:190px;aspect-ratio:1}

.plist{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  margin-top:clamp(44px,5.5vw,72px);border-top:1px solid var(--hair);
}
.plist li{
  padding:28px 26px;border-bottom:1px solid var(--hair);border-right:1px solid var(--hair);
  display:grid;gap:8px;transition:background .5s var(--e);
}
.plist li:last-child{border-right:0}
.plist li:hover{background:var(--cream)}
.plist b{font-family:var(--latin);font-size:26px;letter-spacing:.06em;color:var(--tan-d);font-weight:500}
.plist span{font-size:13px;line-height:1.95}
.plist em{font-style:normal;color:var(--ink);font-weight:500}

/* ---------- pilates (dark) ---------- */
.pil__lead{
  text-align:center;font-family:var(--serif);font-weight:300;font-size:clamp(15px,1.9vw,20px);
  line-height:2.3;letter-spacing:.1em;color:rgba(255,255,255,.86);margin-bottom:clamp(44px,5vw,72px);
}
.pil__lead em{font-style:normal;color:var(--tan);border-bottom:1px solid rgba(201,168,124,.5);padding-bottom:2px}
.pil__flow{position:relative}
.pil__line{position:absolute;left:0;right:0;top:-34px;height:70px;opacity:.9}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,38px)}
.steps li{position:relative}
.steps__fig{overflow:hidden;margin-bottom:24px;position:relative}
.steps__fig::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(45,47,71,.5))}
.steps__fig img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform 1.2s var(--e)}
.steps li:hover .steps__fig img{transform:scale(1.06)}
.steps__no{
  font-family:var(--latin);font-size:13px;letter-spacing:.24em;color:var(--tan);
  display:block;margin-bottom:8px;
}
.steps h3{font-family:var(--serif);font-weight:400;font-size:22px;letter-spacing:.14em;margin-bottom:14px}
.steps h3 em{
  display:block;font-style:normal;font-family:var(--latin);font-size:12px;
  letter-spacing:.3em;color:rgba(255,255,255,.5);margin-top:6px;
}
.steps p{font-size:13px;line-height:2.05;color:rgba(255,255,255,.74)}

.pil__note{
  margin-top:clamp(40px,5vw,64px);border:1px solid rgba(255,255,255,.18);
  padding:28px;text-align:center;font-size:13.5px;line-height:2.1;color:rgba(255,255,255,.86);
}
.pil__note b{color:var(--tan)}

/* ---------- reasons ---------- */
.reasons{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.reason{
  background:var(--white);border:1px solid var(--hair);padding:44px 26px 34px;text-align:center;position:relative;
  transition:transform .55s var(--e),box-shadow .55s var(--e),border-color .55s var(--e);
}
.reason:hover{transform:translateY(-8px);box-shadow:0 24px 50px rgba(45,47,71,.09);border-color:var(--tan)}
.reason__no{
  position:absolute;top:16px;left:20px;font-family:var(--latin);font-size:13px;
  letter-spacing:.18em;color:var(--tan-d);opacity:.8;
}
.reason__icon{width:62px;height:62px;margin:0 auto 22px;color:var(--tan-d)}
.reason__icon svg{width:100%;height:100%}
.reason h3{font-family:var(--serif);font-weight:500;font-size:15.5px;line-height:1.9;letter-spacing:.09em;margin-bottom:16px}
.reason p{font-size:12.5px;line-height:2.05;text-align:left;color:#524b43}

/* ---------- price ---------- */
.pricecard{border:1px solid var(--tan);padding:clamp(26px,4.2vw,58px);background:var(--white);position:relative}
.pricecard::after{content:"";position:absolute;inset:10px;border:1px solid rgba(201,168,124,.32);pointer-events:none}
.pricecard__label{text-align:center;font-family:var(--latin);font-size:13px;letter-spacing:.4em;color:var(--tan-d);text-indent:.4em}
.pricecard__title{
  text-align:center;font-family:var(--serif);font-weight:400;
  font-size:clamp(27px,3.6vw,42px);letter-spacing:.28em;text-indent:.28em;margin:6px 0 36px;
}
.initial{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:36px}
.initial div{background:var(--cream);padding:22px 14px;text-align:center;border-bottom:2px solid var(--tan)}
.initial span{display:block;font-size:11px;letter-spacing:.2em;color:var(--muted);margin-bottom:4px}
.initial b{font-family:var(--serif);font-size:27px;letter-spacing:.04em;font-weight:500;color:var(--ink)}
.initial i{font-style:normal;font-size:11.5px;margin-left:4px;color:var(--text);letter-spacing:.06em}

.tablewrap{overflow-x:auto}
.ptable{font-size:13.5px;min-width:520px}
.ptable th[scope=col]{
  background:var(--ink);color:#fff;font-weight:400;letter-spacing:.16em;padding:14px 10px;font-size:12px;
}
.ptable th[scope=row]{font-family:var(--serif);font-weight:400;letter-spacing:.08em;text-align:center}
.ptable td,.ptable th[scope=row]{border-bottom:1px solid var(--hair);padding:18px 12px;text-align:center}
.ptable tbody tr{transition:background .4s var(--e)}
.ptable tbody tr:hover{background:var(--cream)}
.ptable td:last-child b{font-family:var(--latin);font-weight:400;font-size:23px;letter-spacing:.04em;white-space:nowrap;color:var(--ink)}
.ptable td:last-child span{font-family:var(--sans);font-size:12px;margin-left:3px}
.ptable td:last-child{white-space:nowrap}
.ptable .is-rec{background:rgba(201,168,124,.13)}
.ptable .is-rec:hover{background:rgba(201,168,124,.2)}
.ptable .is-rec em{
  font-style:normal;font-size:10px;letter-spacing:.12em;background:var(--tan-d);color:#fff;
  padding:3px 9px;margin-left:9px;vertical-align:2px;
}
.notes{margin-top:20px;font-size:11.5px;color:var(--muted);line-height:2}
.notes li::before{content:"※";margin-right:6px}

.opt-title{margin:52px 0 20px;text-align:center}
.opt-title span{
  font-family:var(--serif);font-weight:400;font-size:17px;letter-spacing:.24em;text-indent:.24em;
  position:relative;padding:0 22px;
}
.opt-title span::before,.opt-title span::after{
  content:"";position:absolute;top:50%;width:34px;height:1px;background:var(--hair);
}
.opt-title span::before{right:100%}.opt-title span::after{left:100%}
.opts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.opt{border:1px solid var(--hair);padding:24px 22px;transition:border-color .45s var(--e)}
.opt:hover{border-color:var(--tan)}
.opt h5{font-family:var(--serif);font-weight:500;font-size:15px;letter-spacing:.1em;margin-bottom:8px}
.opt p{font-size:12px;color:#6b635a;line-height:1.9;min-height:3.8em}
.opt b{font-family:var(--latin);font-size:24px;color:var(--ink);letter-spacing:.03em}
.opt i{font-style:normal;font-family:var(--sans);font-size:11.5px;margin-left:4px;color:var(--muted)}

.trial{margin-top:clamp(40px,5vw,68px);background:var(--cream);padding:clamp(34px,5vw,68px);text-align:center;position:relative}
.trial__en{font-family:var(--latin);font-size:11.5px;letter-spacing:.4em;color:var(--tan-d);text-indent:.4em}
.trial h3{font-family:var(--serif);font-weight:400;font-size:clamp(20px,2.6vw,28px);letter-spacing:.1em;margin:12px 0 24px}
.trial__body,.trial__sub{font-size:13.5px;line-height:2.25;max-width:780px;margin-inline:auto}
.trial__sub{margin-top:18px;color:#524b43}
.trial .btn{margin-top:34px}
.trial__note{margin-top:20px;font-size:11.5px;color:var(--muted)}

/* ---------- studio ---------- */
.studio{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(26px,4vw,60px);align-items:center;background:var(--white);padding:clamp(20px,3vw,40px)}
.studio__photo{overflow:hidden}
.studio__photo img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform 1.2s var(--e)}
.studio__photo:hover img{transform:scale(1.05)}
.studio__body h3{font-family:var(--serif);font-weight:400;font-size:22px;letter-spacing:.11em;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--hair)}
.studio dl{display:grid;grid-template-columns:78px 1fr;gap:14px 18px;font-size:13px;line-height:1.95}
.studio dt{color:var(--tan-d);letter-spacing:.14em;font-size:11.5px;padding-top:3px}
.studio dd a{border-bottom:1px solid var(--hair);transition:border-color .4s}
.studio dd a:hover{border-color:var(--tan-d)}
.studio .btn{margin-top:30px}

/* ---------- voice ---------- */
.voices{columns:3;column-gap:18px}
.voice{
  break-inside:avoid;background:var(--white);border:1px solid var(--hair);
  padding:34px 30px 28px;margin-bottom:18px;position:relative;
  transition:border-color .5s var(--e),transform .5s var(--e);
}
.voice:hover{border-color:var(--tan);transform:translateY(-4px)}
.voice::before{
  content:"”";position:absolute;top:6px;right:20px;font-family:var(--latin);
  font-size:72px;color:var(--tan);opacity:.22;line-height:1;
}
.stars{color:var(--tan-d);letter-spacing:.24em;font-size:13px}
.voice blockquote{margin-top:14px}
.voice p{font-size:13px;line-height:2.1}
.voice p + p{margin-top:12px}
.voice figcaption{
  margin-top:20px;padding-top:14px;border-top:1px solid var(--hair);
  font-size:11.5px;letter-spacing:.1em;color:var(--muted);display:flex;gap:10px;align-items:center;
}
.voice figcaption span{color:var(--tan-d)}

/* ---------- staff ---------- */
.staff{display:grid;grid-template-columns:360px 1fr;gap:clamp(30px,4.4vw,64px);align-items:start;background:var(--white);padding:clamp(22px,3vw,44px)}
.staff__photo{overflow:hidden}
.staff__photo img{width:100%;aspect-ratio:3/4;object-fit:cover;transition:transform 1.2s var(--e)}
.staff__photo:hover img{transform:scale(1.05)}
.staff__role{font-size:11.5px;letter-spacing:.24em;color:var(--tan-d)}
.staff__name{font-family:var(--serif);font-weight:400;font-size:clamp(26px,3.4vw,36px);letter-spacing:.18em;margin:10px 0 24px}
.staff__name em{display:block;font-family:var(--latin);font-style:normal;font-size:12px;letter-spacing:.32em;color:var(--muted);margin-top:10px}
.staff__lic{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.staff__lic li{border:1px solid var(--hair);padding:7px 15px;font-size:11.5px;letter-spacing:.08em;color:#524b43}
.staff__msg{font-family:var(--serif);font-size:15px;letter-spacing:.08em;margin-bottom:14px}
.staff__body p{font-size:13.5px;line-height:2.2}
.staff__body p + p{margin-top:14px}
.staff__links{display:flex;flex-wrap:wrap;gap:22px;margin-top:28px;font-size:12px;letter-spacing:.08em}
.staff__links a{color:var(--tan-d);border-bottom:1px solid currentColor;padding-bottom:3px;transition:opacity .3s}
.staff__links a:hover{opacity:.6}

/* ---------- news ---------- */
.news{border-top:1px solid var(--hair);max-width:960px;margin-inline:auto}
.news li{
  display:grid;grid-template-columns:112px 88px 1fr;gap:22px;align-items:center;
  padding:24px 6px;border-bottom:1px solid var(--hair);transition:background .4s var(--e);
}
.news li:hover{background:var(--cream)}
.news time{font-family:var(--latin);font-size:15px;letter-spacing:.1em;color:var(--muted)}
.news .tag{font-size:10.5px;letter-spacing:.14em;text-align:center;border:1px solid var(--tan);color:var(--tan-d);padding:4px 0}
.news a{font-size:13.5px;transition:color .35s;line-height:1.85}
.news a:hover{color:var(--tan-d)}

/* ---------- blog cards ---------- */
.blog__lead{text-align:center;font-size:13.5px;margin:-28px 0 48px;color:#524b43}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.card{background:var(--white);display:block;transition:transform .55s var(--e),box-shadow .55s var(--e)}
.card:hover{transform:translateY(-8px);box-shadow:0 24px 50px rgba(45,47,71,.12)}
.card__thumb{
  aspect-ratio:16/10;display:grid;place-items:center;position:relative;overflow:hidden;
  background:linear-gradient(150deg,#33506a,#4d7091);
}
.card__thumb::after{
  content:"";position:absolute;width:74px;height:74px;border:1px solid rgba(255,255,255,.4);border-radius:50%;
  transition:transform .7s var(--e);
}
.card:hover .card__thumb::after{transform:scale(1.14)}
.card__ep{font-family:var(--latin);color:rgba(255,255,255,.95);font-size:21px;letter-spacing:.2em;position:relative;z-index:2}
.card__body{padding:24px 22px 28px}
.card__body time{font-family:var(--latin);font-size:12.5px;letter-spacing:.1em;color:var(--muted)}
.card__body h3{font-family:var(--serif);font-weight:500;font-size:15px;line-height:1.85;letter-spacing:.07em;margin:8px 0 12px}
.card__body p{font-size:12.5px;line-height:1.95;color:#6b635a}
.card__more{
  display:inline-block;margin-top:16px;font-family:var(--latin);font-size:11px;letter-spacing:.26em;
  color:var(--tan-d);border-bottom:1px solid currentColor;padding-bottom:2px;
}

/* ---------- faq ---------- */
.faq{max-width:900px;margin-inline:auto;border-top:1px solid var(--hair)}
.faq details{border-bottom:1px solid var(--hair)}
.faq summary{
  list-style:none;cursor:pointer;padding:26px 50px 26px 48px;position:relative;
  font-family:var(--serif);font-size:15.5px;letter-spacing:.07em;line-height:1.85;
  transition:color .35s var(--e);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{
  content:"Q";position:absolute;left:6px;top:24px;font-family:var(--latin);font-size:19px;color:var(--tan-d);
}
.faq summary::after{
  content:"";position:absolute;right:10px;top:50%;width:13px;height:1px;background:var(--ink);
  transition:transform .45s var(--e);
}
.faq details[open] summary{color:var(--tan-d)}
.faq details[open] summary::after{transform:rotate(180deg)}
.faq summary:hover{color:var(--tan-d)}
.faq details > div{
  padding:0 50px 30px 48px;font-size:13.5px;line-height:2.15;color:#524b43;
  animation:fadeDown .45s var(--e) both;
}
@keyframes fadeDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* ---------- contact ---------- */
.contact{
  padding:clamp(84px,10vw,132px) 0;text-align:center;color:#fff;position:relative;overflow:hidden;
  background:
    radial-gradient(80% 120% at 18% 8%,rgba(201,168,124,.4),transparent 62%),
    linear-gradient(140deg,#2d2f47 0%,#403a33 58%,#6b5c49 100%);
}
.contact__en{font-family:var(--latin);font-size:11.5px;letter-spacing:.44em;opacity:.8;text-indent:.44em}
.contact__ja{font-family:var(--serif);font-weight:300;font-size:clamp(26px,3.8vw,42px);letter-spacing:.15em;margin:16px 0 26px}
.contact__lead{font-size:13.5px;line-height:2.25;opacity:.9}
.contact__actions{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-top:40px}
.contact__meta{margin-top:44px;font-size:11.5px;line-height:2.1;opacity:.72}

/* ---------- footer ---------- */
.footer{background:var(--cream);padding:clamp(54px,6vw,80px) 0 0;color:var(--ink)}
.footer__inner{display:grid;grid-template-columns:1fr auto;gap:44px;align-items:start}
.footer__brand .logomark{width:58px;height:58px;margin-bottom:14px}
.footer__word{display:flex;flex-direction:column;line-height:1.2}
.footer__word em{font-family:var(--latin);font-style:normal;font-size:25px;letter-spacing:.24em;font-weight:500}
.footer__word small{font-family:var(--latin);font-size:9px;letter-spacing:.38em;color:var(--muted)}
.footer__tag{margin-top:14px;font-size:11.5px;letter-spacing:.26em;color:var(--muted)}
.footer__addr{margin-top:10px;font-size:11.5px;color:var(--muted);line-height:1.9}
.footer__nav{display:flex;gap:clamp(30px,5vw,76px)}
.footer__nav ul{display:grid;gap:13px;font-size:12.5px}
.footer__nav a{color:#5c554c;transition:color .3s}
.footer__nav a:hover{color:var(--tan-d)}
.copyright{
  margin-top:48px;padding:22px 0;text-align:center;font-family:var(--latin);
  font-size:11px;letter-spacing:.18em;color:var(--muted);border-top:1px solid var(--hair);
}

/* ---------- floating cta ---------- */
.fab{
  position:fixed;right:22px;bottom:22px;z-index:90;background:var(--ink);color:#fff;
  padding:16px 28px;font-size:12.5px;letter-spacing:.1em;box-shadow:0 14px 34px rgba(45,47,71,.32);
  opacity:0;visibility:hidden;transform:translateY(16px);transition:.55s var(--e);
}
.fab.is-show{opacity:1;visibility:visible;transform:none}
.fab:hover{background:var(--tan)}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .reasons,.cards{grid-template-columns:repeat(2,1fr)}
  .voices{columns:2}
  .staff{grid-template-columns:290px 1fr;gap:26px}
  .staff__photo img{aspect-ratio:3/4;object-position:50% 22%}
  .about__split{grid-template-columns:1fr}
  .about__aside{grid-template-columns:1fr 190px;align-items:center}
  .plist{grid-template-columns:1fr}
  .plist li{border-right:0}
  .steps{grid-template-columns:1fr}
  .pil__line{display:none}
  .studio{grid-template-columns:1fr}
  .initial{grid-template-columns:1fr 1fr}
  .opts{grid-template-columns:1fr}
}
@media (max-width:1120px){
  :root{--head:66px}
  .burger{display:block}
  .gnav{
    position:fixed;inset:0;background:rgba(255,255,255,.985);color:var(--ink);
    flex-direction:column;justify-content:center;gap:36px;padding:80px 24px;
    opacity:0;visibility:hidden;transition:.5s var(--e);overflow-y:auto;
  }
  .gnav.is-open{opacity:1;visibility:visible}
  .gnav ul{flex-direction:column;gap:22px;text-align:center}
  .gnav ul a span{font-size:16px;font-family:var(--serif)}
  .gnav ul a i{font-size:9px}
  .gnav__cta{background:var(--ink);color:#fff;border-color:var(--ink)}
  .hero__badges{top:auto;bottom:118px;right:14px;gap:10px}
  .badge{width:98px;height:98px}
  .badge b{font-size:15px}
  .badge--b{width:84px;height:84px}
  .hero__side{display:none}
  .hero__mark{left:50%}
  .news li{grid-template-columns:96px 80px;row-gap:8px}
  .news a{grid-column:1/-1}
}
@media (max-width:600px){
  body{font-size:14px}
  .wrap{width:calc(100% - 36px)}
  .reasons,.cards{grid-template-columns:1fr}
  .voices{columns:1}
  .initial{grid-template-columns:1fr}
  .about__aside{grid-template-columns:1fr}
  .wordcard{grid-template-columns:1fr;gap:16px}
  .wordcard__key{width:78px}
  .footer__inner{grid-template-columns:1fr}
  .footer__nav{flex-wrap:wrap;gap:26px 44px}
  .fab{left:16px;right:16px;display:flex;justify-content:center}
  .faq summary{padding:22px 40px 22px 38px;font-size:14.5px}
  .faq details > div{padding:0 40px 26px 38px}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
  .hero__title .mask > span{transform:none}
}


/* =========================================================
   下層ページ用パーツ
   ========================================================= */
.phero{position:relative;height:clamp(240px,34vw,380px);display:grid;align-items:center;color:#fff;overflow:hidden;isolation:isolate}
.phero__media{position:absolute;inset:0;z-index:-2}
.phero__media img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);animation:heroZoom 14s var(--e) forwards}
.phero__veil{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(18,16,14,.6),rgba(18,16,14,.42))}
.phero__inner{padding-top:var(--head);text-align:center}
.phero__en{font-family:var(--latin);font-size:11.5px;letter-spacing:.44em;text-indent:.44em;opacity:.82;animation:rise .9s .25s var(--e) both}
.phero__ja{
  font-family:var(--serif);font-weight:300;font-size:clamp(24px,3.6vw,40px);
  letter-spacing:.16em;margin-top:12px;animation:rise 1s .38s var(--e) both;
}

.crumb{border-bottom:1px solid var(--hair);background:var(--white)}
.crumb ul{display:flex;flex-wrap:wrap;gap:8px;padding:14px 0;font-size:11.5px;color:var(--muted);letter-spacing:.08em}
.crumb li + li::before{content:"›";margin-right:8px;color:var(--tan-d)}
.crumb a{transition:color .3s}
.crumb a:hover{color:var(--tan-d)}

.lead{max-width:820px;margin:0 auto clamp(28px,4vw,48px);font-size:14px;line-height:2.25;text-align:left}
.lead p + p{margin-top:18px}
.lead em{font-style:normal;background:linear-gradient(transparent 62%,rgba(201,168,124,.45) 62%)}

.mini-h{
  font-family:var(--serif);font-weight:400;font-size:clamp(19px,2.3vw,24px);letter-spacing:.14em;
  text-align:center;margin:clamp(56px,7vw,92px) 0 clamp(26px,3vw,40px);position:relative;padding-bottom:16px;
}
.mini-h::after{content:"";position:absolute;left:50%;bottom:0;translate:-50% 0;width:44px;height:1px;background:var(--tan)}

.linkgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:clamp(48px,6vw,80px)}
.linkgrid a{
  border:1px solid var(--hair);padding:22px 24px;display:flex;justify-content:space-between;align-items:center;
  font-size:13px;letter-spacing:.08em;transition:border-color .45s var(--e),background .45s var(--e);
}
.linkgrid a:hover{border-color:var(--tan);background:var(--cream)}
.linkgrid i{font-style:normal;color:var(--tan-d);transition:transform .45s var(--e)}
.linkgrid a:hover i{transform:translateX(6px)}

.chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:900px;margin-inline:auto}
.chips span{border:1px solid var(--hair);background:var(--white);padding:9px 18px;font-size:12.5px;letter-spacing:.06em}

.flowlist{display:grid;gap:2px;max-width:860px;margin-inline:auto;border-top:1px solid var(--hair)}
.flowlist li{display:grid;grid-template-columns:64px 1fr;gap:20px;padding:22px 8px;border-bottom:1px solid var(--hair);align-items:start}
.flowlist b{font-family:var(--latin);font-size:22px;color:var(--tan-d);letter-spacing:.06em;font-weight:500}
.flowlist h3{font-family:var(--serif);font-weight:500;font-size:15.5px;letter-spacing:.1em;margin-bottom:6px}
.flowlist p{font-size:13px;color:#524b43}

.specs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.specs div{border:1px solid var(--hair);background:var(--white);padding:26px 24px;transition:border-color .45s var(--e)}
.specs div:hover{border-color:var(--tan)}
.specs h3{font-family:var(--serif);font-weight:500;font-size:15px;letter-spacing:.1em;margin-bottom:10px}
.specs p{font-size:12.5px;line-height:2;color:#524b43}
.specs a{color:var(--tan-d);border-bottom:1px solid currentColor}

.concept{
  margin-top:clamp(48px,6vw,84px);background:var(--cream);padding:clamp(32px,5vw,60px);
  text-align:center;font-family:var(--serif);
}
.concept p{font-size:14.5px;line-height:2.4;letter-spacing:.08em}
.concept p + p{margin-top:20px}
.concept footer{margin-top:28px;font-size:13px;letter-spacing:.18em;color:var(--muted)}

.article{max-width:820px;margin-inline:auto}
.article__meta{display:flex;gap:14px;align-items:center;justify-content:center;margin-bottom:18px}
.article__meta time{font-family:var(--latin);font-size:14px;letter-spacing:.1em;color:var(--muted)}
.article__meta .tag{font-size:10.5px;letter-spacing:.14em;border:1px solid var(--tan);color:var(--tan-d);padding:4px 12px}
.article__title{
  font-family:var(--serif);font-weight:400;font-size:clamp(21px,2.8vw,30px);letter-spacing:.1em;
  line-height:1.8;text-align:center;padding-bottom:28px;border-bottom:1px solid var(--hair);margin-bottom:34px;
}
.article__body p{font-size:14px;line-height:2.25}
.article__body p + p{margin-top:18px}
.article__body h3{font-family:var(--serif);font-weight:500;font-size:17px;letter-spacing:.12em;margin:36px 0 14px;padding-left:14px;border-left:2px solid var(--tan)}
.dots{display:grid;gap:10px;margin:8px 0 24px}
.dots li{position:relative;padding-left:20px;font-size:13.5px}
.dots li::before{content:"";position:absolute;left:2px;top:.85em;width:6px;height:6px;background:var(--tan);border-radius:50%}

/* 明るい面で使うピラティスブロック */
.pil__lead--light{color:var(--text)}
.pil__lead--light em{color:var(--tan-d);border-bottom-color:rgba(201,168,124,.6)}
.steps--light h3{color:var(--text)}
.steps--light h3 em{color:var(--muted)}
.steps--light p{color:#524b43}
.steps--light .steps__fig::after{background:linear-gradient(180deg,transparent 55%,rgba(45,47,71,.28))}
.pil__note--light{border-color:var(--hair);background:var(--white);color:var(--text)}
.pil__note--light b{color:var(--tan-d)}

/* 現在地 */
.gnav .is-active{color:var(--tan)}
.gnav .is-active::after{transform:scaleX(1)}

@media (max-width:1024px){
  .specs,.linkgrid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:600px){
  .specs,.linkgrid{grid-template-columns:1fr}
  .shead__more{position:static;display:inline-flex;margin-top:16px}
  .flowlist li{grid-template-columns:48px 1fr;gap:14px}
}


/* =========================================================
   ビフォーアフター
   ========================================================= */
.balist{display:grid;gap:clamp(24px,3.4vw,44px)}
.ba{
  display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(22px,3vw,44px);align-items:center;
  background:var(--white);border:1px solid var(--hair);padding:clamp(18px,2.4vw,30px);
}
.ba:nth-child(even){grid-template-columns:.85fr 1.15fr}
.ba:nth-child(even) .ba__pair{order:2}
.ba__pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ba__pair figure{position:relative;overflow:hidden;background:var(--cream)}
.ba__pair img{width:100%;aspect-ratio:3/4;object-fit:cover;transition:transform 1.1s var(--e)}
.ba__pair figure:hover img{transform:scale(1.04)}
.ba__pair figcaption{
  position:absolute;left:10px;top:10px;font-family:var(--latin);font-size:10.5px;letter-spacing:.24em;
  background:rgba(255,255,255,.92);color:var(--ink);padding:5px 12px;
}
.ba__pair figure:last-child figcaption{background:var(--ink);color:#fff}
.ba__who{
  font-family:var(--serif);font-size:17px;letter-spacing:.1em;margin-bottom:14px;
  display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;
}
.ba__who span{font-family:var(--sans);font-size:11.5px;letter-spacing:.1em;color:var(--tan-d)}
.ba__body p{font-size:13.5px;line-height:2.15;color:#524b43}
@media (max-width:860px){
  .ba,.ba:nth-child(even){grid-template-columns:1fr}
  .ba:nth-child(even) .ba__pair{order:0}
}
@media (max-width:600px){
  .hero__title,.hero__lead,.hero__sub{max-width:100%}
}


/* =========================================================
   スタッフ（拡充）
   ========================================================= */
.staff__photo{position:relative}
.staff__photo figcaption{
  position:absolute;left:0;bottom:0;background:rgba(45,47,71,.86);color:#fff;
  font-size:10.5px;letter-spacing:.16em;padding:8px 16px;
}
.staff__data{
  display:grid;grid-template-columns:64px 1fr;gap:10px 16px;margin:24px 0 4px;
  padding-top:22px;border-top:1px solid var(--hair);font-size:12.5px;line-height:1.95;
}
.staff__data dt{color:var(--tan-d);letter-spacing:.14em;font-size:11.5px;padding-top:2px}
.staff__data dd{color:#524b43}

.staffgal{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:clamp(24px,3vw,38px)}
.staffgal figure{overflow:hidden;background:var(--cream)}
.staffgal img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform 1.2s var(--e)}
.staffgal figure:hover img{transform:scale(1.05)}
.staffgal figcaption{
  padding:14px 4px 0;font-size:12px;line-height:1.9;color:#6b635a;letter-spacing:.04em;
}
.staffgal figure:first-child img{aspect-ratio:4/5;object-position:50% 34%}

/* =========================================================
   TOP 微調整
   ========================================================= */
.hero__badges{top:auto;bottom:clamp(90px,14vh,150px)}
.section + .section{border-top:0}
.shead__ja{line-height:1.5}
.plist li{align-content:start}
.pricecard{box-shadow:0 20px 60px rgba(45,47,71,.05)}
.reason{background:var(--white)}
.section--tint .reason{background:var(--white)}
.section:not(.section--tint) .reason{background:var(--cream);border-color:transparent}
.voices .voice{background:var(--white)}
.section:not(.section--tint) .voice{background:var(--cream);border-color:transparent}
.section:not(.section--tint) .ba{background:var(--cream);border-color:transparent}
.section:not(.section--tint) .studio{background:var(--cream)}
.section:not(.section--tint) .staff{background:var(--cream)}
.section:not(.section--tint) .card{background:var(--cream)}

@media (max-width:1024px){
  .staffgal{grid-template-columns:repeat(3,1fr);gap:10px}
  .staffgal figcaption{font-size:11px}
}
@media (max-width:600px){
  .staffgal{grid-template-columns:1fr}
  .staff__data{grid-template-columns:1fr;gap:4px 0}
  .staff__data dd{margin-bottom:10px}
}


/* =========================================================
   タブレット／モバイル 最終調整
   ========================================================= */
@media (max-width:1120px){
  .hero__inner{padding-top:calc(var(--head) + 8px)}
  .hero__title,.hero__lead,.hero__sub{max-width:100%}
  .hero__badges{
    position:absolute;top:calc(var(--head) + 14px);right:16px;bottom:auto;
    flex-direction:row;display:flex;gap:10px;
  }
  .badge{width:92px;height:92px;box-shadow:0 8px 22px rgba(0,0,0,.24)}
  .badge b{font-size:15px}
  .badge b em{font-size:9px}
  .badge--b{width:80px;height:80px}
  .badge__ring text{font-size:6.6px;letter-spacing:.18em}
}
@media (max-width:900px){
  .hero{min-height:92svh}
  .hero__eyebrow{gap:9px;flex-wrap:nowrap}
  .hero__eyebrow span{font-size:10px;letter-spacing:.26em;white-space:nowrap}
  .hero__eyebrow::after{flex-basis:32px}
  .hero__title{font-size:clamp(26px,7.4vw,40px);line-height:1.6}
  .hero__sub{font-size:13px;margin-top:18px}
  .hero__lead{font-size:12.5px;line-height:2.05}
  .hero__actions{margin-top:28px;gap:10px}
  .hero__actions .btn{flex:1 1 100%;padding:16px 20px}
  .hero__scroll{bottom:8px}
  .hero__scroll .lottie{height:64px}
}
@media (max-width:768px){
  .wrap{width:calc(100% - 40px)}
  .section{padding:clamp(58px,11vw,86px) 0}
  .shead{margin-bottom:34px}
  .shead__more{position:static;display:inline-flex;margin-top:18px}
  .voices{columns:2;column-gap:14px}
  .cards{grid-template-columns:repeat(2,1fr)}
  .reasons{grid-template-columns:repeat(2,1fr)}
  .staffgal{grid-template-columns:repeat(3,1fr);gap:8px}
  .staffgal figcaption{font-size:10.5px;line-height:1.75}
  .ba__pair{gap:8px}
  .ba__pair figcaption{font-size:9.5px;padding:4px 9px;left:8px;top:8px}
  .initial{grid-template-columns:1fr 1fr}
  .initial div:last-child{grid-column:1/-1}
  .phero{height:clamp(190px,42vw,260px)}
  .phero__ja{font-size:clamp(21px,5.4vw,30px)}
  .crumb ul{font-size:10.5px}
  .fab{padding:14px 20px;font-size:12px}
}
@media (max-width:560px){
  body{font-size:14px;line-height:2}
  .wrap{width:calc(100% - 32px)}
  .voices{columns:1}
  .cards,.reasons{grid-template-columns:1fr}
  .staffgal{grid-template-columns:1fr 1fr;gap:8px}
  .staffgal figure:last-child{grid-column:1/-1}
  .staffgal img{aspect-ratio:1/1}
  .staffgal figure:last-child img{aspect-ratio:16/9}
  .initial{grid-template-columns:1fr}
  .initial div:last-child{grid-column:auto}
  .hero__badges{top:calc(var(--head) + 10px);right:12px;gap:8px}
  .badge{width:74px;height:74px}
  .badge b{font-size:12.5px;line-height:1.4}
  .badge b em{font-size:8px}
  .badge--b{width:66px;height:66px}
  .badge__ring{display:none}
  .staff{padding:16px}
  .staff__photo img{aspect-ratio:4/5}
  .ptable{min-width:420px;font-size:11.5px}
  .ptable td:last-child{font-size:17px}
  .ptable .is-rec em{display:block;margin:4px 0 0;width:fit-content}
  .pricecard{padding:20px 14px}
  .pricecard::after{inset:6px}
  .trial{padding:26px 18px}
  .contact__actions .btn{width:100%}
  .article__title{font-size:19px}
  .mini-h{margin:44px 0 22px}
}
/* 横スクロールの完全防止 */
html,body{max-width:100%}
img,svg,video{max-width:100%;height:auto}
.tablewrap{-webkit-overflow-scrolling:touch}


/* 料金表：スマホはカード表示（横スクロールさせない） */
@media (max-width:640px){
  .tablewrap{overflow:visible}
  .ptable{min-width:0;display:block}
  .ptable thead{display:none}
  .ptable tbody,.ptable tr,.ptable th,.ptable td{display:block;width:100%}
  .ptable tr{
    border:1px solid var(--hair);border-left:2px solid var(--tan);
    margin-bottom:12px;padding:16px 18px;background:var(--white);
  }
  .ptable tbody tr:nth-child(odd){background:var(--white)}
  .ptable .is-rec{background:rgba(201,168,124,.12);border-left-color:var(--tan-d)}
  .ptable th[scope=row]{
    border:0;padding:0 0 10px;text-align:left;font-size:16px;letter-spacing:.08em;
    display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  }
  .ptable .is-rec em{margin:0}
  .ptable td{
    border:0;padding:0;text-align:left;display:flex;justify-content:space-between;
    align-items:baseline;gap:14px;
  }
  .ptable td::before{
    content:attr(data-l);font-size:11px;letter-spacing:.16em;color:var(--muted);flex:none;
  }
  .ptable td[data-l="内容"]{padding-bottom:10px;font-size:12.5px;text-align:right}
  .ptable td[data-l="料金"]{border-top:1px solid var(--hair);padding-top:12px}
  .ptable td[data-l="料金"] b{font-size:26px}
}


/* スタッフ写真：タブレット〜スマホでの見え方 */
@media (max-width:768px){
  .staff{grid-template-columns:1fr;gap:22px}
  .staff__photo{max-width:420px;margin-inline:auto;width:100%}
  .staff__photo img{aspect-ratio:4/5;object-position:50% 20%}
  .staff__name{font-size:26px}
}
@media (max-width:560px){
  .staff__photo{max-width:none}
  .staff__photo img{aspect-ratio:4/5}
}


/* =========================================================
   ステートメント帯（ヒーロー直後）
   ========================================================= */
.statement{
  position:relative;padding:clamp(96px,14vw,190px) 0;color:#fff;overflow:hidden;isolation:isolate;
}
.statement__media{position:absolute;inset:0;z-index:-2}
.statement__media img{width:100%;height:100%;object-fit:cover;object-position:50% 42%}
.statement__veil{
  position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(20,19,22,.78),rgba(20,19,22,.62) 45%,rgba(20,19,22,.86));
}
.statement__inner{text-align:center}
.statement__en{font-family:var(--latin);font-size:11px;letter-spacing:.46em;text-indent:.46em;opacity:.75}
.statement__lead{
  margin-top:26px;font-family:var(--serif);font-weight:200;
  font-size:clamp(21px,3.4vw,40px);line-height:1.85;letter-spacing:.12em;
}
.statement__lead .l{display:block}
.statement__body{
  margin-top:30px;font-size:13.5px;line-height:2.4;opacity:.86;letter-spacing:.06em;
}
.statement__body em{
  font-style:normal;color:var(--tan);
  border-bottom:1px solid rgba(201,168,124,.55);padding-bottom:3px;
}
.statement__sign{margin-top:34px;font-size:11.5px;letter-spacing:.24em;opacity:.7}

/* セクション番号 */
.shead{padding-top:6px}
.shead__no{
  display:block;font-family:var(--latin);font-size:12px;letter-spacing:.3em;
  color:var(--tan-d);opacity:.75;margin-bottom:10px;
}
.section--dark .shead__no,.shead--light .shead__no{color:var(--tan)}

/* 横長の1枚写真 */
.figwide{margin:clamp(40px,5vw,64px) 0 0;overflow:hidden}
.figwide img{width:100%;aspect-ratio:16/7;object-fit:cover;transition:transform 1.4s var(--e)}
.figwide:hover img{transform:scale(1.03)}

@media (max-width:600px){
  .statement{padding:74px 0}
  .statement__lead{font-size:20px;line-height:1.95}
  .statement__body{font-size:12.5px;line-height:2.2}
  .figwide img{aspect-ratio:4/3}
}


/* =========================================================
   ピラティス／ステップ：明色セクションを既定にする（可読性の修正）
   ========================================================= */
.pil__lead{color:var(--text)}
.pil__lead em{color:var(--tan-d);border-bottom-color:rgba(201,168,124,.6)}
.steps h3{color:var(--text)}
.steps h3 em{color:var(--muted)}
.steps p{color:#524b43}
.steps__no{color:var(--tan-d)}
.steps__fig::after{background:linear-gradient(180deg,transparent 58%,rgba(45,47,71,.26))}
.pil__note{border-color:var(--hair);background:var(--white);color:var(--text)}
.pil__note b{color:var(--tan-d)}

/* ダークセクション内だけ反転 */
.section--dark .pil__lead{color:rgba(255,255,255,.86)}
.section--dark .pil__lead em{color:var(--tan);border-bottom-color:rgba(201,168,124,.5)}
.section--dark .steps h3{color:#fff}
.section--dark .steps h3 em{color:rgba(255,255,255,.5)}
.section--dark .steps p{color:rgba(255,255,255,.74)}
.section--dark .steps__no{color:var(--tan)}
.section--dark .steps__fig::after{background:linear-gradient(180deg,transparent 40%,rgba(45,47,71,.5))}
.section--dark .pil__note{border-color:rgba(255,255,255,.18);background:transparent;color:rgba(255,255,255,.86)}
.section--dark .pil__note b{color:var(--tan)}
.section--dark .shead__ja{color:#fff}
.section--dark .shead__ja::after{background:rgba(255,255,255,.7)}
.section--dark .shead__en,.section--dark .shead__no{color:var(--tan)}


/* =========================================================
   選ばれる理由：写真主導カード
   ========================================================= */
.reason{padding:0;overflow:hidden;display:flex;flex-direction:column}
.reason__fig{position:relative;overflow:hidden;margin:0}
.reason__fig img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform 1.2s var(--e)}
.reason:hover .reason__fig img{transform:scale(1.06)}
.reason__fig::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(20,19,22,.05),rgba(20,19,22,.34));
}
.reason .reason__no{
  position:absolute;left:16px;bottom:12px;top:auto;z-index:2;
  font-family:var(--latin);font-size:26px;letter-spacing:.14em;color:#fff;opacity:.95;
}
.reason__body{padding:26px 24px 30px;text-align:center;flex:1;display:flex;flex-direction:column}
.reason__icon{width:46px;height:46px;margin:0 auto 16px}
.reason h3{font-size:15px;margin-bottom:14px}
.reason p{margin-top:auto}

/* ステートメントの見え方を強める */
.statement__media img{filter:saturate(.82)}

@media (max-width:600px){
  .reason__fig img{aspect-ratio:16/9}
  .reason__body{padding:22px 20px 26px}
}


/* ステートメント帯：可読性を上げる */
.statement__veil{
  background:
    radial-gradient(60% 55% at 50% 46%,rgba(16,15,18,.72),transparent 72%),
    linear-gradient(180deg,rgba(16,15,18,.74),rgba(16,15,18,.6) 45%,rgba(16,15,18,.86));
}
.statement__lead{text-shadow:0 2px 24px rgba(0,0,0,.45)}
.statement__body{color:rgba(255,255,255,.94);opacity:1;text-shadow:0 1px 14px rgba(0,0,0,.5)}
.statement__body em{
  color:#efd9b4;border-bottom:1px solid rgba(239,217,180,.7);
}
.statement__sign{opacity:.82}


/* =========================================================
   料金・無料体験・声・フッター（iteration 3）
   ========================================================= */
.pricecard{max-width:960px;margin-inline:auto}

/* 無料体験：写真つき2カラム */
.trial{
  display:grid;grid-template-columns:.9fr 1.1fr;gap:0;padding:0;text-align:left;
  overflow:hidden;background:var(--cream);
}
.trial{align-items:stretch}
.trial__fig{margin:0;overflow:hidden;position:relative;align-self:stretch;min-height:100%}
.trial__fig img{width:100%;height:100%;min-height:440px;object-fit:cover;display:block;transition:transform 1.4s var(--e)}
.trial:hover .trial__fig img{transform:scale(1.04)}
.trial__inner{padding:clamp(30px,4.4vw,58px);align-self:center}
.trial__en{text-align:left}
.trial h3{margin:12px 0 22px;text-align:left;line-height:1.7}
.trial__body,.trial__sub{margin-inline:0;max-width:none;padding:0}
.trial .btn{margin-top:30px}
.trial__note{margin-top:18px}

/* 声：出典ラベル */
.voice figcaption{flex-wrap:wrap}
.voice figcaption i{
  font-style:normal;font-family:var(--latin);font-size:10.5px;letter-spacing:.16em;
  color:var(--muted);margin-left:auto;opacity:.8;
}

/* フッター：4カラム＋CTA */
.footer__inner{
  display:grid;grid-template-columns:1.1fr 1.5fr 1fr;gap:clamp(28px,4vw,64px);align-items:start;
}
.footer__nav{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,34px)}
.footer__nav ul{align-content:start}
.footer__cta{border-left:1px solid var(--hair);padding-left:clamp(20px,2.6vw,38px)}
.footer__cta-lead{font-family:var(--serif);font-size:14.5px;line-height:2;letter-spacing:.06em;margin-bottom:20px}
.footer__cta-lead b{color:var(--tan-d);font-weight:500}
.footer__cta .btn{width:100%;padding:15px 18px;font-size:12.5px}
.footer__contact{margin-top:20px;font-size:12px;line-height:2.1}
.footer__contact a{color:#5c554c;border-bottom:1px solid var(--hair);transition:color .3s,border-color .3s}
.footer__contact a:hover{color:var(--tan-d);border-color:var(--tan-d)}
.footer__brand .logomark{color:var(--ink)}

@media (max-width:1024px){
  .trial{grid-template-columns:1fr}
  .trial__fig img{min-height:280px;aspect-ratio:16/9}
  .footer__inner{grid-template-columns:1fr 1fr}
  .footer__cta{grid-column:1/-1;border-left:0;border-top:1px solid var(--hair);padding:26px 0 0}
  .footer__cta .btn{width:auto;padding:15px 34px}
}
@media (max-width:768px){
  .footer__nav{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .footer__inner{grid-template-columns:1fr}
  .footer__nav{grid-template-columns:1fr 1fr;gap:20px}
  .trial__body{padding:26px 20px 32px}
  .footer__cta .btn{width:100%}
}


/* 体験ブロックの見出し・CONTACT帯の余白調整 */
.trial h3{font-size:clamp(19px,2.2vw,26px);letter-spacing:.08em;max-width:22em}
.br-sp{display:none}
.contact{padding:clamp(78px,8.5vw,112px) 0}
.contact__meta{margin-top:36px}
@media (max-width:900px){ .br-sp{display:inline} }


/* =========================================================
   下層ページの間合いと細部（iteration 4）
   ========================================================= */
/* パンくず直後のセクションは上余白を詰める */
.crumb + section.section,
main > section.section:first-of-type{padding-top:clamp(52px,6vw,86px)}

/* ReProとは：右カラムを写真主体に、Lottieは小さなアクセントへ */
.about__aside{
  grid-template-rows:1fr auto;gap:22px;justify-items:stretch;align-self:stretch;
}
.about__fig{height:100%;position:relative}
.about__fig img{height:100%;min-height:320px;aspect-ratio:auto;object-fit:cover}
.about__pulse{width:104px;aspect-ratio:1;justify-self:center;opacity:.75}

/* Re / Pro のキー：塗りつぶしの箱から、線と余白のある活字へ */
.wordcard{grid-template-columns:96px 1fr;align-items:center;gap:28px}
.wordcard__key{
  background:transparent;color:var(--ink);height:auto;
  font-size:40px;letter-spacing:.02em;line-height:1;
  padding:16px 0;border-top:1px solid var(--tan);border-bottom:1px solid var(--tan);
  display:grid;place-items:center;
}
.wordcard:hover .wordcard__key{color:var(--tan-d);border-color:var(--tan-d)}
.wordcard h3{font-size:16.5px;margin-bottom:12px}

/* リード文の左右幅を本文とそろえる */
.lead{max-width:860px}

@media (max-width:1024px){
  .about__aside{grid-template-columns:1fr auto;grid-template-rows:auto;align-items:center}
  .about__fig img{min-height:0;aspect-ratio:4/3}
  .about__pulse{width:120px}
}
@media (max-width:600px){
  .about__aside{grid-template-columns:1fr}
  .about__pulse{display:none}
  .wordcard{grid-template-columns:72px 1fr;gap:18px}
  .wordcard__key{font-size:30px;padding:12px 0}
}


/* /about/：画像のみの右カラム */
.about__aside--solo{grid-template-rows:1fr}
.about__aside--solo .about__fig img{min-height:420px}
@media (max-width:1024px){
  .about__aside--solo{grid-template-columns:1fr}
  .about__aside--solo .about__fig img{min-height:0;aspect-ratio:16/10}
}

/* FAQ：開いている項目を分かりやすく */
.faq details[open]{background:var(--cream)}
.faq details[open] summary::before{color:var(--tan-d)}
.faq summary::after{width:13px;height:1px;background:var(--ink);position:absolute;right:12px}
.faq summary::before{transition:color .3s}
.faq .lead{margin-bottom:8px}

.lead--center{text-align:center;margin-bottom:34px}


/* =========================================================
   ヘッダーメニューの整え
   ========================================================= */
.header{gap:clamp(20px,3vw,44px)}
.gnav{gap:clamp(18px,2.4vw,34px)}
.gnav ul{
  display:flex;align-items:center;gap:clamp(14px,1.9vw,28px);
}
.gnav ul li{display:flex}
.gnav ul a{
  display:block;padding:10px 2px;line-height:1;white-space:nowrap;
  font-size:13px;letter-spacing:.06em;font-weight:400;
}
.gnav ul a i{display:none}            /* 英字サブラベルは廃止（横幅が乱れる原因） */
.gnav ul a span{display:block;font-size:inherit;letter-spacing:inherit;transition:opacity .35s var(--e)}
.gnav ul a::after{bottom:2px;height:1px;background:var(--tan)}
.gnav ul a:hover span{opacity:.72}
.gnav .is-active span{color:var(--tan)}

.gnav__cta{
  padding:12px 22px;font-size:12.5px;letter-spacing:.08em;white-space:nowrap;line-height:1;
  border-width:1px;
}
.header.is-solid .gnav ul a{color:var(--ink)}

/* ロゴとメニューの間に自然な余白を作る */
.header__logo{margin-right:auto}
.gnav{margin-left:0}

@media (max-width:1240px){
  .gnav ul{gap:14px}
  .gnav ul a{font-size:12.5px}
  .gnav__cta{padding:11px 16px;font-size:12px}
}
@media (max-width:1120px){
  .gnav ul a{font-size:16px;padding:0}
  .gnav ul a i{display:block;font-family:var(--latin);font-style:normal;font-size:9.5px;
    letter-spacing:.28em;color:var(--tan-d);margin-top:6px}
  .gnav ul a span{font-family:var(--serif)}
  .gnav ul a::after{display:none}
}


/* =========================================================
   ヘッダー：最終整形（ロゴ｜メニュー｜CTA の3分割グリッド）
   ========================================================= */
.header{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;
  gap:clamp(24px,3vw,56px);padding-inline:clamp(20px,3.2vw,48px);
}
.header::after{background:rgba(255,255,255,.14)}
.header.is-solid{box-shadow:none;border-bottom:1px solid var(--hair)}

/* ロゴ：文字とマークの重心を揃える */
.header__logo{margin-right:0;align-items:center;gap:12px}
.logomark{width:34px;height:34px}
.header__wordmark{padding-top:2px}
.header__wordmark em{font-size:20px;letter-spacing:.26em;line-height:1}
.header__wordmark small{font-size:7.5px;letter-spacing:.42em;margin-top:5px;line-height:1}

/* メニュー：中央に置き、字間と余白を均等に */
.gnav{margin:0;justify-self:center;gap:0}
.gnav ul{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(16px,2.1vw,32px);
}
.gnav ul li{display:block}
.gnav ul a{
  position:relative;display:block;padding:8px 0;line-height:1;white-space:nowrap;
  font-size:13.5px;letter-spacing:.08em;font-feature-settings:"palt";
}
.gnav ul a span{display:block}
.gnav ul a::after{
  content:"";position:absolute;left:50%;right:auto;bottom:0;
  width:0;height:1px;background:var(--tan);
  transform:none;transition:width .4s var(--e),left .4s var(--e);
}
.gnav ul a:hover::after{left:0;width:100%}
.gnav .is-active::after{left:0;width:100%}
.gnav .is-active span{color:inherit}
.header.is-solid .gnav .is-active span{color:var(--tan-d)}

/* CTA：線で構成して、書体の繊細さに合わせる */
.gnav__cta{
  justify-self:end;position:relative;z-index:1;overflow:hidden;
  display:inline-flex;align-items:center;height:42px;padding:0 26px;
  font-size:12.5px;letter-spacing:.12em;white-space:nowrap;
  border:1px solid currentColor;background:transparent;color:inherit;
  transition:color .45s var(--e),border-color .45s var(--e);
}
.gnav__cta::before{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--ink);
  transform:scaleX(0);transform-origin:right;transition:transform .5s var(--e);
}
.gnav__cta:hover{color:#fff;border-color:var(--ink)}
.gnav__cta:hover::before{transform:scaleX(1);transform-origin:left;background:var(--ink)}
.header.is-solid .gnav__cta{background:transparent;color:var(--ink);border-color:var(--ink)}
.header.is-solid .gnav__cta:hover{color:#fff}

/* 進捗バーはヘッダーの下に潜らせる（上端の金線に見えていたため） */
.progress{top:auto;bottom:auto;inset:0 0 auto;height:2px;z-index:99}
.header.is-solid ~ .progress i{opacity:1}

@media (max-width:1280px){
  .gnav ul{gap:clamp(12px,1.6vw,22px)}
  .gnav ul a{font-size:12.5px;letter-spacing:.05em}
  .gnav__cta{height:38px;padding:0 18px;font-size:11.5px;letter-spacing:.08em}
}
@media (max-width:1120px){
  .header{grid-template-columns:auto 1fr;gap:16px}
  .gnav{justify-self:stretch}
  .gnav ul a{font-size:16px;padding:0}
  .gnav ul a::after{display:none}
  .gnav__cta{height:auto;padding:15px 30px;justify-self:center;color:#fff;border-color:var(--ink)}
  .gnav__cta::before{transform:scaleX(1)}
}


/* ヘッダー：中央カラムが縮めるようにして重なりを防ぐ */
.header{grid-template-columns:auto minmax(0,1fr) auto}
.gnav{min-width:0}
.gnav ul{min-width:0;flex-wrap:nowrap}
@media (max-width:1440px){
  .header{gap:clamp(16px,2vw,32px)}
  .gnav ul{gap:clamp(12px,1.5vw,24px)}
  .gnav ul a{font-size:13px}
}
@media (max-width:1320px){
  .gnav ul{gap:clamp(10px,1.2vw,18px)}
  .gnav ul a{font-size:12.5px;letter-spacing:.03em}
  .gnav__cta{height:38px;padding:0 16px;font-size:11.5px;letter-spacing:.06em}
  .header__wordmark em{font-size:18px;letter-spacing:.22em}
}
@media (max-width:1200px){
  .gnav ul{gap:9px}
  .gnav ul a{font-size:12px;letter-spacing:0}
  .gnav__cta{padding:0 13px;font-size:11px}
}


/* ヘッダー：CTAは .gnav の内側なので、2カラム構成で確実に間隔を作る */
.header{grid-template-columns:auto minmax(0,1fr)}
.gnav{
  display:flex;align-items:center;justify-content:flex-end;
  gap:clamp(22px,2.8vw,48px);   /* メニュー群とCTAの間の余白 */
  justify-self:end;min-width:0;
}
.gnav ul{flex:0 1 auto}
@media (max-width:1120px){
  .header{grid-template-columns:auto 1fr}
  .gnav{justify-content:center;gap:36px}
}


/* ヘッダー：スクロール後の確定スタイル（半透明のちらつきを排除） */
.header.is-solid{
  background:#fff;backdrop-filter:none;color:var(--ink);
  height:70px;box-shadow:none;border-bottom:1px solid var(--hair);
}
.header.is-solid .logomark,
.header.is-solid .header__wordmark em{color:var(--ink)}
.header.is-solid .header__wordmark small{color:var(--muted)}
.header.is-solid .gnav ul a{color:var(--ink)}
.header.is-solid .gnav__cta{background:transparent;color:var(--ink);border-color:var(--ink)}
.header.is-solid .gnav__cta:hover{color:#fff;border-color:var(--ink)}
.header.is-solid .burger{color:var(--ink)}


/* =========================================================
   選ばれる理由：写真をやめてアイコンのみに戻す（Figma準拠）
   ========================================================= */
.reason{
  padding:48px 28px 36px;text-align:center;background:var(--white);
  border:1px solid var(--hair);display:flex;flex-direction:column;overflow:visible;
}
.section:not(.section--tint) .reason{background:var(--cream);border-color:transparent}
.reason__fig{display:none}
.reason .reason__no{
  position:absolute;top:18px;left:0;right:0;bottom:auto;text-align:center;
  font-family:var(--latin);font-size:13px;letter-spacing:.28em;color:var(--tan-d);
  opacity:.85;text-indent:.28em;
}
.reason{position:relative}
.reason__body{padding:0;text-align:center;flex:1;display:flex;flex-direction:column}
.reason__icon{width:52px;height:52px;margin:0 auto 22px;color:var(--tan-d)}
.reason h3{font-family:var(--serif);font-weight:500;font-size:15.5px;line-height:1.95;letter-spacing:.09em;margin-bottom:18px}
.reason p{font-size:12.5px;line-height:2.05;text-align:left;color:#524b43;margin-top:0}
.reason:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(45,47,71,.08);border-color:var(--tan)}
@media (max-width:600px){ .reason{padding:42px 24px 32px} }


/* =========================================================
   明るい世界観へ：ヒーロー／ステートメント／ページヘッダーを反転
   ========================================================= */

/* --- ヒーロー：明るい写真＋濃紺の明朝 --- */
.hero{color:var(--text)}
.hero__media img{object-position:50% 46%}
.hero__grain{opacity:.05}
.hero__veil{
  background:
    linear-gradient(100deg,rgba(255,253,250,.95) 0%,rgba(255,253,250,.86) 34%,rgba(255,253,250,.42) 64%,rgba(255,253,250,.30) 100%),
    linear-gradient(180deg,rgba(255,253,250,.72) 0%,transparent 32%,rgba(255,253,250,.55) 100%);
}
.hero__mark{opacity:.10;filter:invert(0)}
.hero__eyebrow span{color:var(--muted);opacity:1}
.hero__eyebrow::after{background:var(--hair);flex-basis:70px}
.hero__title{color:var(--ink);font-weight:300}
.hero__sub{color:var(--tan-d)}
.hero__lead{color:#544c43;opacity:1}
.hero__side{color:var(--muted);opacity:1}
.hero__side::after{background:var(--hair)}
.hero__scroll{color:var(--muted)}
.hero__scroll .lottie{filter:invert(1) opacity(.55)}
.hero .btn--ghost{border-color:var(--ink);color:var(--ink)}
.hero .btn--ghost:hover{color:#fff}
.badge{box-shadow:0 14px 34px rgba(45,47,71,.12)}

/* ヘッダーは最初から濃色（明るい写真の上に乗るため） */
.header{color:var(--ink)}
.header::after{background:var(--hair)}
.header .gnav ul a{color:var(--ink)}
.header .gnav__cta{color:var(--ink);border-color:var(--ink)}
.header .burger{color:var(--ink)}

/* --- ステートメント帯：淡いベージュ地に濃紺の明朝 --- */
.statement{color:var(--text)}
.statement__media img{filter:saturate(.55) brightness(1.06)}
.statement__veil{
  background:
    radial-gradient(60% 58% at 50% 46%,rgba(250,246,240,.94),rgba(250,246,240,.80) 70%),
    linear-gradient(180deg,rgba(250,246,240,.9),rgba(250,246,240,.72) 45%,rgba(250,246,240,.92));
}
.statement__en{color:var(--tan-d);opacity:1}
.statement__lead{color:var(--ink);text-shadow:none;font-weight:300}
.statement__body{color:#544c43;text-shadow:none}
.statement__body em{color:var(--tan-d);border-bottom-color:rgba(168,134,90,.55)}
.statement__sign{color:var(--muted);opacity:1}

/* --- 下層ページヘッダーも明るく --- */
.phero{color:var(--text)}
.phero__veil{
  background:linear-gradient(180deg,rgba(250,246,240,.86),rgba(250,246,240,.72) 55%,rgba(250,246,240,.9));
}
.phero__en{color:var(--tan-d);opacity:1}
.phero__ja{color:var(--ink)}

@media (max-width:900px){
  .hero__veil{
    background:
      linear-gradient(180deg,rgba(255,253,250,.94) 0%,rgba(255,253,250,.86) 46%,rgba(255,253,250,.72) 100%);
  }
}


/* =========================================================
   ヘッダー：ロゴ｜メニュー｜CTA を等しい重心で配置
   （.gnav を display:contents にして、3要素を直接グリッドに乗せる）
   ========================================================= */
@media (min-width:1121px){
  .header{
    display:grid;
    grid-template-columns:1fr auto 1fr;   /* 左右を同じ重みにしてメニューを真ん中に */
    align-items:center;gap:clamp(20px,2.4vw,40px);
  }
  .gnav{display:contents}
  .gnav ul{
    grid-column:2;justify-self:center;
    display:flex;align-items:center;gap:clamp(16px,2vw,30px);
  }
  .gnav__cta{grid-column:3;justify-self:end}
  .header__logo{grid-column:1;justify-self:start}
}
@media (min-width:1121px) and (max-width:1360px){
  .header{gap:16px}
  .gnav ul{gap:clamp(11px,1.4vw,20px)}
  .gnav ul a{font-size:12.5px;letter-spacing:.02em}
  .gnav__cta{height:38px;padding:0 16px;font-size:11.5px;letter-spacing:.06em}
}


/* =========================================================
   3ステップ：写真をやめてアイコンに（意味が伝わらない写真の排除）
   ========================================================= */
.steps li{
  background:var(--white);border:1px solid var(--hair);
  padding:46px 32px 38px;text-align:center;
  transition:transform .5s var(--e),border-color .5s var(--e),box-shadow .5s var(--e);
}
.section--tint .steps li{background:var(--white)}
.section:not(.section--tint) .steps li{background:var(--cream);border-color:transparent}
.steps li:hover{transform:translateY(-6px);border-color:var(--tan);box-shadow:0 20px 44px rgba(45,47,71,.07)}
.steps__icon{width:56px;height:56px;margin:0 auto 20px;color:var(--tan-d)}
.steps__icon svg{width:100%;height:100%}
.steps__no{text-align:center;margin-bottom:10px}
.steps h3{text-align:center}
.steps p{text-align:left}
.pil__line{display:none}

/* グレーディングの白飛びを戻す（コントラストを少し起こす） */
.hero__media img,.statement__media img,.phero__media img,
.trial__fig img,.about__fig img,.studio__photo img{filter:contrast(1.06) saturate(.9)}


/* =========================================================
   ヒーロー：左に組版、右に写真の分割構成
   ========================================================= */
.hero{
  display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);
  min-height:100svh;background:var(--cream);color:var(--text);overflow:hidden;isolation:isolate;
}
.hero__text{
  position:relative;display:flex;align-items:center;
  padding:calc(var(--head) + clamp(40px,6vw,90px)) clamp(28px,4.6vw,86px) clamp(70px,8vw,110px)
          clamp(28px,5.4vw,104px);
}
.hero__textinner{position:relative;z-index:2;width:100%;max-width:620px;margin-left:auto}

.hero__mark{
  position:absolute;left:auto;right:-14%;top:50%;translate:0 -50%;
  width:min(46vmin,440px);aspect-ratio:1;opacity:.10;z-index:1;pointer-events:none;
}

.hero__eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:clamp(20px,2.4vw,30px)}
.hero__eyebrow span{font-family:var(--latin);font-size:11.5px;letter-spacing:.36em;color:var(--muted)}
.hero__eyebrow b{font-family:var(--latin);font-weight:400;color:var(--tan);font-size:13px}
.hero__eyebrow::after{content:"";flex:1 1 auto;height:1px;background:var(--hair)}

.hero__title{
  font-family:var(--serif);font-weight:300;color:var(--ink);
  font-size:clamp(28px,3.6vw,50px);line-height:1.52;letter-spacing:.085em;
}
.hero__sub{margin-top:clamp(18px,2vw,26px);font-family:var(--serif);font-size:clamp(13px,1.15vw,17px);letter-spacing:.14em;color:var(--tan-d)}
.hero__lead{margin-top:14px;font-size:13px;line-height:2.15;color:#5b5349}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(26px,3vw,38px)}
.hero__actions .btn{padding:15px 30px;font-size:12.5px}

.hero__facts{
  display:flex;gap:clamp(20px,2.6vw,40px);margin-top:clamp(30px,3.6vw,46px);
  padding-top:22px;border-top:1px solid var(--hair);animation:rise 1.1s 1.3s var(--e) both;
}
.hero__facts dt{font-size:10.5px;letter-spacing:.2em;color:var(--muted);margin-bottom:6px}
.hero__facts dd{margin:0;font-family:var(--latin);font-size:24px;letter-spacing:.03em;color:var(--ink)}
.hero__facts i{font-style:normal;font-family:var(--sans);font-size:11px;margin-left:3px;color:var(--text)}

/* 右：写真 */
.hero__visual{position:relative;overflow:hidden}
.hero__media{position:absolute;inset:0}
.hero__media img{
  width:100%;height:100%;object-fit:cover;object-position:52% 48%;
  clip-path:inset(0 0 0 0);transform:scale(1.08);
  animation:heroIn 1.6s .25s var(--e) both;
}
@keyframes heroIn{from{transform:scale(1.12);clip-path:inset(0 0 100% 0)}to{transform:scale(1);clip-path:inset(0 0 0 0)}}
.hero__visual .hero__grain{position:absolute;inset:0;opacity:.06}
.hero__veil{display:none}

/* 写真の端に重なる丸バッジ */
.hero__visual .badge{
  position:absolute;left:-56px;bottom:clamp(72px,9vw,120px);
  width:118px;height:118px;background:var(--white);
}
.hero__place{
  position:absolute;right:clamp(20px,2.4vw,34px);top:calc(var(--head) + 26px);
  writing-mode:vertical-rl;font-size:11px;letter-spacing:.26em;color:#fff;
  text-shadow:0 1px 10px rgba(0,0,0,.35);
}
.hero__place span{display:block;margin-top:18px;opacity:.8;font-size:10px}

.hero__scroll{
  position:absolute;left:clamp(28px,5.4vw,104px);bottom:18px;translate:0 0;z-index:3;
  display:grid;justify-items:center;color:var(--muted);
}
.hero__scroll .lottie{width:28px;height:70px;filter:invert(1) opacity(.45)}
.hero__scroll span{font-size:9.5px;letter-spacing:.32em}

@media (max-width:1024px){
  .hero{grid-template-columns:1fr;min-height:0}
  .hero__text{padding:calc(var(--head) + 54px) clamp(24px,5vw,48px) 56px;order:2}
  .hero__textinner{max-width:none;margin:0}
  .hero__visual{order:1;height:52svh;min-height:320px}
  .hero__visual .badge{left:auto;right:20px;bottom:-40px;width:96px;height:96px}
  .hero__mark{right:-22%;opacity:.07}
  .hero__scroll{display:none}
  .hero__place{right:16px;top:calc(var(--head) + 16px)}
}
@media (max-width:600px){
  .hero__facts{gap:18px;flex-wrap:wrap}
  .hero__facts dd{font-size:20px}
  .hero__actions .btn{flex:1 1 100%;justify-content:center}
  .hero__visual{height:44svh}
  .hero__place{display:none}
}


/* =========================================================
   ヒーロー：全幅の写真＋白文字（Figma準拠）
   ========================================================= */
.hero{
  display:block;position:relative;min-height:100svh;overflow:hidden;isolation:isolate;
  background:var(--ink);color:#fff;
}
.hero__text,.hero__visual,.hero__facts,.hero__place{display:none}
.hero__media{position:absolute;inset:0;z-index:-3}
.hero__media img{
  width:100%;height:100%;object-fit:cover;object-position:56% 52%;
  transform:scale(1.06);animation:heroZoom 20s var(--e) forwards;clip-path:none;
}
.hero__grain{position:absolute;inset:0;z-index:-2;opacity:.07}
.hero__veil{
  position:absolute;inset:0;z-index:-1;display:block;
  background:
    linear-gradient(96deg,rgba(28,24,20,.72) 0%,rgba(28,24,20,.52) 38%,rgba(28,24,20,.16) 68%,rgba(28,24,20,.30) 100%),
    linear-gradient(180deg,rgba(28,24,20,.42) 0%,transparent 30%,rgba(28,24,20,.46) 100%);
}
.hero__inner{
  position:relative;z-index:2;display:block;
  width:min(var(--wrap),calc(100% - 52px));margin-inline:auto;
  padding-top:calc(var(--head) + clamp(60px,9vh,120px));max-width:none;
}
.hero__eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.hero__eyebrow span{font-family:var(--latin);font-size:11.5px;letter-spacing:.38em;color:rgba(255,255,255,.9)}
.hero__eyebrow b{color:var(--tan);font-family:var(--latin);font-weight:400;font-size:13px}
.hero__eyebrow::after{content:"";flex:0 0 66px;height:1px;background:rgba(255,255,255,.45)}
.hero__title{
  color:#fff;font-family:var(--serif);font-weight:300;
  font-size:clamp(30px,4.6vw,58px);line-height:1.5;letter-spacing:.09em;max-width:none;
  text-shadow:0 2px 26px rgba(0,0,0,.32);
}
.hero__sub{color:var(--tan);margin-top:24px;font-size:clamp(14px,1.5vw,19px);letter-spacing:.16em;max-width:none}
.hero__lead{color:rgba(255,255,255,.92);margin-top:16px;font-size:13.5px;line-height:2.2;max-width:none;
  text-shadow:0 1px 14px rgba(0,0,0,.32)}
.hero__actions{margin-top:38px}
.hero__actions .btn{padding:16px 36px;font-size:13px}
.hero .btn--ghost{border-color:rgba(255,255,255,.85);color:#fff}
.hero .btn--ghost:hover{color:#fff;border-color:var(--tan)}

/* 丸バッジ2つ（Figmaの配置） */
.hero__badges{
  position:absolute;right:clamp(24px,5vw,84px);top:50%;translate:0 -50%;z-index:3;
  display:flex;flex-direction:row;gap:18px;bottom:auto;
}
.badge{
  width:132px;height:132px;border-radius:50%;background:#fff;color:var(--ink);
  display:grid;place-items:center;box-shadow:0 18px 44px rgba(20,16,12,.22);
}
.badge b{font-family:var(--serif);font-weight:500;font-size:13.5px;letter-spacing:.06em;line-height:1.7;text-align:center}
.badge b em{display:block;font-style:normal;font-size:17px;letter-spacing:.1em;margin-top:4px}
.badge--b{background:var(--ink);color:#fff}
.badge--b b{font-family:var(--latin);font-size:26px;letter-spacing:.04em}
.badge--b b em{font-family:var(--sans);font-size:10.5px;letter-spacing:.12em;color:var(--tan);margin-top:6px}
.badge__ring text{fill:var(--tan-d)}

/* 下部の情報バー */
.hero__bar{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  display:flex;justify-content:center;gap:clamp(18px,3vw,56px);flex-wrap:wrap;
  padding:16px 24px;background:rgba(20,16,12,.34);backdrop-filter:blur(6px);
  font-size:11.5px;letter-spacing:.1em;color:rgba(255,255,255,.9);
  border-top:1px solid rgba(255,255,255,.16);
}
.hero__bar span{position:relative}
.hero__bar span + span::before{content:"";position:absolute;left:calc(-1 * clamp(9px,1.5vw,28px));top:50%;
  width:1px;height:12px;background:rgba(255,255,255,.28);translate:0 -50%}

.hero__scroll{
  position:absolute;left:50%;translate:-50% 0;bottom:62px;z-index:3;color:rgba(255,255,255,.85);
}
.hero__scroll .lottie{width:30px;height:74px;filter:none}
.hero__scroll span{font-size:9.5px;letter-spacing:.34em;opacity:.8}

/* ヘッダーは写真の上なので白に戻す */
.header:not(.is-solid){color:#fff}
.header:not(.is-solid)::after{background:rgba(255,255,255,.2)}
.header:not(.is-solid) .gnav ul a{color:#fff}
.header:not(.is-solid) .gnav__cta{color:#fff;border-color:rgba(255,255,255,.85)}
.header:not(.is-solid) .burger{color:#fff}

@media (max-width:1200px){
  .hero__badges{gap:14px}
  .badge{width:114px;height:114px}
  .badge b{font-size:12px}
  .badge b em{font-size:15px}
  .badge--b b{font-size:22px}
}
@media (max-width:900px){
  .hero__badges{
    position:absolute;top:auto;bottom:104px;right:16px;translate:0 0;flex-direction:column;gap:10px;
  }
  .badge{width:92px;height:92px}
  .badge b{font-size:10.5px;line-height:1.5}
  .badge b em{font-size:13px}
  .badge--b b{font-size:18px}
  .badge--b b em{font-size:9px}
  .badge__ring{display:none}
  .hero__inner{padding-top:calc(var(--head) + 54px)}
  .hero__scroll{display:none}
  .hero__bar{font-size:10.5px;gap:10px 16px;padding:12px 16px}
}
@media (max-width:600px){
  .hero__actions .btn{flex:1 1 100%;justify-content:center}
  .hero__bar span + span::before{display:none}
}


/* ヒーロー微調整：器具が見える位置に寄せ、バッジの文字被りを解消 */
.hero__media img{object-position:26% 56%}
.badge{width:140px;height:140px}
.badge b{font-size:12.5px;line-height:1.65;padding:0 22px}
.badge b em{font-size:16.5px;margin-top:5px}
.badge__ring{inset:0;width:100%;height:100%}
.badge__ring text{font-size:6.6px;letter-spacing:.2em}
.badge--b b{padding:0}
@media (max-width:1200px){ .badge{width:120px;height:120px} .badge b{padding:0 16px;font-size:11.5px} }
@media (max-width:900px){ .badge{width:96px;height:96px} .badge b{padding:0 10px} }


/* 横長の写真ブロック（キャプション付き） */
.figwide{margin:clamp(36px,4.6vw,64px) 0 0;overflow:hidden}
.figwide img{width:100%;aspect-ratio:16/7;object-fit:cover;display:block;transition:transform 1.4s var(--e)}
.figwide:hover img{transform:scale(1.03)}
.figwide figcaption{
  margin-top:14px;font-size:11.5px;letter-spacing:.06em;color:var(--muted);text-align:center;line-height:1.9;
}
.figwide--inline{margin:26px 0}
.figwide--inline img{aspect-ratio:16/9}
.section--dark .figwide figcaption{color:rgba(255,255,255,.7)}

/* 2枚並びの写真 */
.figpair{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:clamp(40px,5vw,64px)}
.figpair img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform 1.2s var(--e)}
.figpair img:hover{transform:scale(1.03)}

@media (max-width:600px){
  .figwide img{aspect-ratio:4/3}
  .figpair{grid-template-columns:1fr;gap:10px}
}

.hero__media img{object-position:44% 62%}
.figwide img{object-position:50% 60%}


/* =========================================================
   下層ページ：ページヘッダーが明るいので、グローバルナビは濃色で固定
   ========================================================= */
.is-sub .header:not(.is-solid),
body:has(.phero) .header:not(.is-solid){color:var(--ink)}
.is-sub .header:not(.is-solid)::after,
body:has(.phero) .header:not(.is-solid)::after{background:var(--hair)}
.is-sub .header:not(.is-solid) .gnav ul a,
body:has(.phero) .header:not(.is-solid) .gnav ul a{color:var(--ink)}
.is-sub .header:not(.is-solid) .gnav__cta,
body:has(.phero) .header:not(.is-solid) .gnav__cta{color:var(--ink);border-color:var(--ink)}
.is-sub .header:not(.is-solid) .burger,
body:has(.phero) .header:not(.is-solid) .burger{color:var(--ink)}
.is-sub .header:not(.is-solid) .header__wordmark small{color:var(--muted)}

/* ページヘッダーの上端をわずかに白く抜いて、ナビの可読性を担保 */
.phero__veil{
  background:
    linear-gradient(180deg,rgba(252,250,247,.96) 0%,rgba(250,246,240,.72) 22%,
                    rgba(250,246,240,.62) 58%,rgba(250,246,240,.88) 100%);
}
.phero__inner{padding-top:calc(var(--head) + 18px)}

/* リフォーマー1台のカットは正方形に近い比率で見せる */
.figwide img{aspect-ratio:16/9;object-position:50% 50%}


/* =========================================================
   モバイルナビ（ドロワー）
   ========================================================= */
@media (min-width:1121px){ .gnav__panel{display:contents} .gnav__foot{display:none} }

@media (max-width:1120px){
  .gnav{
    position:fixed;inset:0;z-index:105;display:block;padding:0;
    background:rgba(20,18,16,0);pointer-events:none;
    transition:background .5s var(--e);
    opacity:1;visibility:visible;
  }
  .gnav.is-open{background:rgba(20,18,16,.42);pointer-events:auto}

  .gnav__panel{
    position:absolute;top:0;right:0;height:100%;
    width:88vw;max-width:420px;background:var(--cream);
    display:flex;flex-direction:column;justify-content:flex-start;
    padding:calc(var(--head) + 26px) clamp(24px,6vw,40px)
            calc(28px + env(safe-area-inset-bottom,0px));
    overflow-y:auto;-webkit-overflow-scrolling:touch;
    transform:translateX(102%);transition:transform .55s var(--e);
    box-shadow:-20px 0 60px rgba(20,18,16,.16);
  }
  .gnav.is-open .gnav__panel{transform:translateX(0)}

  .gnav ul{
    display:block;border-top:1px solid var(--hair);
  }
  .gnav ul li{border-bottom:1px solid var(--hair)}
  .gnav ul a{
    display:flex;align-items:baseline;gap:12px;justify-content:flex-start;
    padding:18px 2px;text-align:left;color:var(--ink);
    opacity:0;transform:translateX(16px);
    transition:opacity .5s var(--e),transform .5s var(--e);
  }
  .gnav.is-open ul a{opacity:1;transform:none}
  .gnav.is-open ul li:nth-child(1) a{transition-delay:.10s}
  .gnav.is-open ul li:nth-child(2) a{transition-delay:.15s}
  .gnav.is-open ul li:nth-child(3) a{transition-delay:.20s}
  .gnav.is-open ul li:nth-child(4) a{transition-delay:.25s}
  .gnav.is-open ul li:nth-child(5) a{transition-delay:.30s}
  .gnav.is-open ul li:nth-child(6) a{transition-delay:.35s}
  .gnav.is-open ul li:nth-child(7) a{transition-delay:.40s}
  .gnav.is-open ul li:nth-child(8) a{transition-delay:.45s}
  .gnav ul a span{font-family:var(--serif);font-size:16.5px;letter-spacing:.08em;font-weight:400}
  .gnav ul a i{
    display:block;font-family:var(--latin);font-style:normal;font-size:9.5px;
    letter-spacing:.24em;color:var(--tan-d);margin:0;
  }
  .gnav ul a::after{display:none}
  .gnav .is-active span{color:var(--tan-d)}
  .gnav .is-active::before{
    content:"";position:absolute;left:-14px;top:50%;translate:0 -50%;
    width:4px;height:4px;border-radius:50%;background:var(--tan-d);
  }
  .gnav ul li{position:relative}

  .gnav__cta{
    margin-top:26px;width:100%;height:auto;padding:17px 20px;justify-content:center;
    background:var(--ink);color:#fff;border-color:var(--ink);font-size:13.5px;letter-spacing:.1em;
    opacity:0;transform:translateY(10px);transition:opacity .5s .48s var(--e),transform .5s .48s var(--e);
  }
  .gnav.is-open .gnav__cta{opacity:1;transform:none}
  .gnav__cta::before{display:none}

  .gnav__foot{
    margin-top:30px;padding-top:24px;border-top:1px solid var(--hair);
    opacity:0;transform:translateY(10px);transition:opacity .5s .56s var(--e),transform .5s .56s var(--e);
  }
  .gnav.is-open .gnav__foot{opacity:1;transform:none}
  .gnav__line{
    display:flex;align-items:center;justify-content:center;gap:8px;
    border:1px solid var(--tan-d);color:var(--tan-d);padding:13px 16px;
    font-size:12.5px;letter-spacing:.08em;margin-bottom:16px;
  }
  .gnav__mail{display:block;font-size:12px;color:#5c554c;border-bottom:1px solid var(--hair);padding-bottom:12px}
  .gnav__addr{margin-top:14px;font-size:11.5px;line-height:1.95;color:var(--muted)}
  .gnav__sns{display:flex;gap:20px;margin-top:16px;font-size:11.5px}
  .gnav__sns a{color:var(--tan-d);border-bottom:1px solid currentColor;padding-bottom:2px}

  /* ハンバーガー：開いている間はパネルの上に出す */
  .burger{z-index:110}
  .burger.is-open span{background:var(--ink)}
  .header.is-solid .burger.is-open span{background:var(--ink)}
}

@media (max-width:420px){
  .gnav__panel{width:100%;padding-top:calc(var(--head) + 18px)}
  .gnav ul a{padding:16px 2px}
  .gnav ul a span{font-size:15.5px}
}


/* ドロワー：グリッド配下でのサイズ解決に依存せず、明示的に画面全体を占める */
@media (max-width:1120px){
  .gnav{
    position:fixed;top:0;left:0;right:auto;bottom:auto;
    width:100vw;height:100dvh;height:100vh;
    display:block;padding:0;margin:0;justify-self:auto;align-self:auto;
  }
  .gnav__panel{
    position:absolute;top:0;right:0;left:auto;
    width:88vw;max-width:420px;height:100%;
  }
}
@media (max-width:420px){ .gnav__panel{width:100vw;max-width:none} }


/* =========================================================
   モバイルのヒーロー：重なりを解消して素直に積む
   ========================================================= */
@media (max-width:900px){
  .hero{
    display:flex;flex-direction:column;justify-content:center;
    min-height:100svh;padding-bottom:78px;   /* 下部の情報バーぶん */
  }
  .hero__inner{
    padding-top:calc(var(--head) + 34px);padding-bottom:0;
    width:calc(100% - 44px);
  }
  .hero__eyebrow{gap:10px;margin-bottom:20px}
  .hero__eyebrow span{font-size:9.5px;letter-spacing:.24em}
  .hero__eyebrow::after{flex:1 1 auto}
  .hero__title{font-size:clamp(27px,7.6vw,38px);line-height:1.58}
  .hero__sub{margin-top:18px;font-size:13px;letter-spacing:.1em}
  .hero__lead{margin-top:14px;font-size:12.5px;line-height:2.05}
  .hero__actions{margin-top:26px;gap:10px}

  /* バッジは重ねずに、ボタンの下へ横並びで置く */
  .hero__badges{
    position:static;translate:none;order:2;
    display:flex;flex-direction:row;justify-content:flex-start;gap:12px;
    width:calc(100% - 44px);margin:22px auto 0;
  }
  .badge{width:92px;height:92px;box-shadow:0 10px 26px rgba(20,16,12,.22)}
  .badge b{font-size:10.5px;line-height:1.5;padding:0 8px}
  .badge b em{font-size:13px;margin-top:3px}
  .badge--b{width:92px;height:92px}
  .badge--b b{font-size:19px}
  .badge--b b em{font-size:8.5px;margin-top:4px}
  .badge__ring{display:none}

  .hero__bar{
    gap:4px 14px;padding:12px 18px calc(12px + env(safe-area-inset-bottom,0px));
    font-size:10.5px;line-height:1.9;
  }
}
@media (max-width:600px){
  .hero__inner{width:calc(100% - 36px)}
  .hero__badges{width:calc(100% - 36px)}
  .hero__actions .btn{flex:1 1 100%;justify-content:center;padding:15px 18px}
}


/* ドロワー内は必ず濃色（ヘッダーの白文字指定を打ち消す） */
@media (max-width:1120px){
  .header .gnav ul a,
  .header:not(.is-solid) .gnav ul a,
  .is-sub .header:not(.is-solid) .gnav ul a{color:var(--ink)}
  .header .gnav ul a i,
  .header:not(.is-solid) .gnav ul a i{color:var(--tan-d)}
  .header .gnav .is-active span{color:var(--tan-d)}
  .header .gnav__cta,
  .header:not(.is-solid) .gnav__cta,
  .is-sub .header:not(.is-solid) .gnav__cta{background:var(--ink);color:#fff;border-color:var(--ink)}
  .header .gnav__line,
  .header:not(.is-solid) .gnav__line{color:var(--tan-d);border-color:var(--tan-d)}
  .header .gnav__mail,
  .header:not(.is-solid) .gnav__mail{color:#5c554c}
  .header .gnav__addr,
  .header:not(.is-solid) .gnav__addr{color:var(--muted)}
  .header .gnav__sns a,
  .header:not(.is-solid) .gnav__sns a{color:var(--tan-d)}
}


/* =========================================================
   モバイル最適化（表示の主戦場）
   ========================================================= */
@media (max-width:900px){
  /* VIEW MORE が見出しに重なるのを解消し、見出しの下へ */
  .shead{padding-bottom:0}
  .shead__more{
    position:static !important;display:inline-flex;margin-top:16px;
    font-size:11px;letter-spacing:.22em;
  }
  .shead__ja{padding-bottom:18px}
  .shead__no{font-size:11px;margin-bottom:8px}
  .shead__en{font-size:10.5px;letter-spacing:.32em}
  .shead__ja{font-size:clamp(22px,6.2vw,28px);letter-spacing:.12em}

  /* 長いリード文は中央揃えをやめて読みやすく */
  .about__catch{font-size:17px;line-height:1.95;letter-spacing:.06em}
  .blog__lead,.pil__lead,.trial__body,.trial__sub,.lead,.statement__body{
    text-align:left;font-size:13px;line-height:2.05;
  }
  .pil__lead{letter-spacing:.04em}
  .statement__lead{font-size:20px;line-height:1.9;letter-spacing:.08em}
  .statement__lead .l{display:inline}
  .contact__lead,.contact__meta{text-align:center;font-size:12.5px}

  /* セクションの余白を締める */
  .section{padding:56px 0}
  .shead{margin-bottom:28px}

  /* 追従CTAは常に不透明・タップしやすく */
  .fab{
    left:14px;right:14px;bottom:14px;padding:16px 20px;font-size:13px;
    background:var(--ink);box-shadow:0 10px 30px rgba(20,16,12,.34);
    border-radius:2px;
  }

  /* ビフォーアフターのカード内の余白 */
  .ba{padding:14px}
  .ba__body{padding-top:4px}
  .ba__who{font-size:15px;margin-bottom:10px}
  .ba__body p{font-size:12.5px;line-height:2}

  /* 声・カードの文字 */
  .voice{padding:26px 22px 22px}
  .voice p{font-size:12.5px}
  .card__body{padding:20px 18px 24px}
  .staff__name{font-size:24px}
  .mini-h{font-size:19px;margin:44px 0 22px}
  .flowlist li{grid-template-columns:44px 1fr;gap:12px;padding:18px 4px}
  .specs div{padding:22px 20px}
  .chips span{font-size:12px;padding:8px 14px}
}


/* モバイルでは丸バッジを出さない（ボタンと競合し、情報も下部バーと重複するため） */
@media (max-width:900px){
  .hero__badges{display:none !important}
  .hero__inner{padding-top:calc(var(--head) + 40px)}
  .hero__actions{margin-top:30px}
}


/* ヒーロー：下部の情報バー・スクロール表示と本文が接触しないよう余白を確保 */
.hero{--hero-bar:118px}
.hero__inner{
  padding-top:calc(var(--head) + clamp(52px,7.5vh,104px));
  padding-bottom:var(--hero-bar);
}
.hero__scroll{bottom:calc(var(--hero-bar) - 46px)}
.hero__bar{padding-block:15px}

@media (max-height:760px){
  .hero{--hero-bar:104px}
  .hero__inner{padding-top:calc(var(--head) + 36px)}
  .hero__title{font-size:clamp(28px,3.6vw,44px)}
  .hero__lead{margin-top:12px}
  .hero__actions{margin-top:26px}
}
@media (max-width:900px){
  .hero{--hero-bar:96px}
  .hero__inner{padding-top:calc(var(--head) + 40px);padding-bottom:0}
  .hero{padding-bottom:var(--hero-bar)}
}


/* ヒーロー：実店舗写真に合わせてスクリムを調整（左に文字、右に器具を見せる） */
.hero__media img{object-position:52% 54%}
.hero__veil{
  background:
    linear-gradient(97deg,rgba(18,16,15,.86) 0%,rgba(18,16,15,.70) 32%,
                    rgba(18,16,15,.30) 58%,rgba(18,16,15,.12) 78%,rgba(18,16,15,.34) 100%),
    linear-gradient(180deg,rgba(18,16,15,.46) 0%,transparent 26%,rgba(18,16,15,.52) 100%);
}
@media (max-width:900px){
  .hero__media img{object-position:60% 54%}
  .hero__veil{
    background:linear-gradient(180deg,rgba(18,16,15,.80) 0%,rgba(18,16,15,.62) 46%,rgba(18,16,15,.74) 100%);
  }
}


/* ヒーローを元の写真に戻したので、切り取り位置とスクリムも元の設定へ */
.hero__media img{object-position:44% 62%}
.hero__veil{
  background:
    linear-gradient(96deg,rgba(28,24,20,.72) 0%,rgba(28,24,20,.52) 38%,
                    rgba(28,24,20,.16) 68%,rgba(28,24,20,.30) 100%),
    linear-gradient(180deg,rgba(28,24,20,.42) 0%,transparent 30%,rgba(28,24,20,.46) 100%);
}
@media (max-width:900px){
  .hero__media img{object-position:50% 60%}
  .hero__veil{
    background:linear-gradient(180deg,rgba(28,24,20,.72) 0%,rgba(28,24,20,.56) 46%,rgba(28,24,20,.70) 100%);
  }
}


/* =========================================================
   ページヘッダー：暗いスクリム＋白文字にして写真を活かす
   ========================================================= */
.phero{color:#fff;height:clamp(260px,36vw,400px)}
.phero__media img{filter:none;object-position:50% 52%}
.phero__veil{
  background:
    linear-gradient(180deg,rgba(20,17,15,.70) 0%,rgba(20,17,15,.42) 34%,
                    rgba(20,17,15,.40) 62%,rgba(20,17,15,.66) 100%);
}
.phero__en{color:var(--tan);opacity:1;text-shadow:0 1px 12px rgba(0,0,0,.4)}
.phero__ja{color:#fff;text-shadow:0 2px 22px rgba(0,0,0,.42)}

/* 下層ページのヘッダーは白文字へ戻す（暗いページヘッダーの上に乗るため） */
.is-sub .header:not(.is-solid),
body:has(.phero) .header:not(.is-solid){color:#fff}
.is-sub .header:not(.is-solid)::after,
body:has(.phero) .header:not(.is-solid)::after{background:rgba(255,255,255,.2)}
.is-sub .header:not(.is-solid) .gnav ul a,
body:has(.phero) .header:not(.is-solid) .gnav ul a{color:#fff}
.is-sub .header:not(.is-solid) .gnav__cta,
body:has(.phero) .header:not(.is-solid) .gnav__cta{color:#fff;border-color:rgba(255,255,255,.85);background:transparent}
.is-sub .header:not(.is-solid) .burger,
body:has(.phero) .header:not(.is-solid) .burger{color:#fff}
.is-sub .header:not(.is-solid) .header__wordmark small{color:rgba(255,255,255,.7)}

/* ドロワー内は引き続き濃色（背景がクリームのため） */
@media (max-width:1120px){
  .is-sub .header:not(.is-solid) .gnav ul a,
  body:has(.phero) .header:not(.is-solid) .gnav ul a{color:var(--ink)}
  .is-sub .header:not(.is-solid) .gnav__cta,
  body:has(.phero) .header:not(.is-solid) .gnav__cta{background:var(--ink);color:#fff;border-color:var(--ink)}
}

@media (max-width:768px){
  .phero{height:clamp(210px,44vw,290px)}
  .phero__ja{font-size:clamp(21px,5.6vw,30px)}
}


/* =========================================================
   ブログ：記事カード・記事本文・記事ナビ
   ========================================================= */
.posts{display:grid;gap:0;border-top:1px solid var(--hair);max-width:900px;margin-inline:auto}
.pcard{
  display:block;padding:30px 6px;border-bottom:1px solid var(--hair);
  transition:background .45s var(--e),padding-left .45s var(--e);
}
.pcard:hover{background:var(--cream);padding-left:18px}
.pcard__meta{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.pcard__meta time{font-family:var(--latin);font-size:13px;letter-spacing:.1em;color:var(--muted)}
.pcard__meta .tag{font-size:10.5px;letter-spacing:.14em;border:1px solid var(--tan);color:var(--tan-d);padding:4px 12px}
.pcard h3{font-family:var(--serif);font-weight:500;font-size:19px;line-height:1.75;letter-spacing:.06em;margin-bottom:10px}
.pcard:hover h3{color:var(--tan-d)}
.pcard p{font-size:13px;line-height:2.05;color:#5c554c}
.pcard__more{
  display:inline-block;margin-top:14px;font-family:var(--latin);font-size:11px;
  letter-spacing:.24em;color:var(--tan-d);
}

/* 記事本文 */
.article__lead{
  font-size:14.5px;line-height:2.25;color:#4f483f;margin-bottom:34px;padding-bottom:26px;
  border-bottom:1px solid var(--hair);
}
.article__body h3{margin:40px 0 16px}
.article__body .dots{margin:16px 0 24px}
.postcta{
  margin-top:48px;background:var(--cream);padding:34px 30px;text-align:center;
}
.postcta p{font-family:var(--serif);font-size:16px;letter-spacing:.08em;margin-bottom:20px}

/* 前後記事ナビ */
.postnav{
  display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center;
  margin-top:44px;padding-top:26px;border-top:1px solid var(--hair);font-size:12.5px;
}
.postnav a{display:flex;align-items:center;gap:10px;line-height:1.7;transition:color .35s}
.postnav a:hover{color:var(--tan-d)}
.postnav a:last-child{justify-content:flex-end;text-align:right}
.postnav i{font-style:normal;color:var(--tan-d)}
.postnav__index{
  justify-content:center;white-space:nowrap;border:1px solid var(--hair);
  padding:10px 18px;font-size:11.5px;letter-spacing:.12em;
}
.postnav__none{display:block}

@media (max-width:768px){
  .pcard{padding:24px 4px}
  .pcard h3{font-size:17px}
  .postnav{grid-template-columns:1fr;gap:12px}
  .postnav a:last-child{justify-content:flex-start;text-align:left}
  .postnav__index{justify-content:center}
  .postnav__none{display:none}
}


/* =========================================================
   ページ見出し帯：写真をやめ、明朝と余白で構成
   ========================================================= */
.phero{
  position:relative;height:auto;display:block;color:var(--text);
  background:var(--cream);overflow:hidden;isolation:isolate;
  padding:calc(var(--head) + clamp(56px,7vw,96px)) 0 clamp(44px,5.5vw,74px);
  border-bottom:1px solid var(--hair);
}
.phero__media,.phero__veil{display:none}
.phero__mark{
  position:absolute;right:-3%;top:50%;translate:0 -50%;
  width:min(38vmin,300px);aspect-ratio:1;color:var(--ink);opacity:.055;
  z-index:0;pointer-events:none;
}
.phero__mark svg{width:100%;height:100%}
.phero__inner{position:relative;z-index:2;text-align:center;padding-top:0}
.phero__en{
  font-family:var(--latin);font-size:11.5px;letter-spacing:.44em;text-indent:.44em;
  color:var(--tan-d);opacity:1;text-shadow:none;
}
.phero__ja{
  font-family:var(--serif);font-weight:300;color:var(--ink);text-shadow:none;
  font-size:clamp(26px,4vw,44px);letter-spacing:.17em;margin-top:14px;line-height:1.5;
}
.phero__rule{display:block;width:56px;height:1px;background:var(--tan);margin:26px auto 0}

/* ヘッダーは明るい帯の上なので濃色で固定 */
.is-sub .header:not(.is-solid),
body:has(.phero) .header:not(.is-solid){color:var(--ink)}
.is-sub .header:not(.is-solid)::after,
body:has(.phero) .header:not(.is-solid)::after{background:var(--hair)}
.is-sub .header:not(.is-solid) .gnav ul a,
body:has(.phero) .header:not(.is-solid) .gnav ul a{color:var(--ink)}
.is-sub .header:not(.is-solid) .gnav__cta,
body:has(.phero) .header:not(.is-solid) .gnav__cta{color:var(--ink);border-color:var(--ink);background:transparent}
.is-sub .header:not(.is-solid) .burger,
body:has(.phero) .header:not(.is-solid) .burger{color:var(--ink)}
.is-sub .header:not(.is-solid) .header__wordmark small{color:var(--muted)}
@media (max-width:1120px){
  .is-sub .header:not(.is-solid) .gnav__cta,
  body:has(.phero) .header:not(.is-solid) .gnav__cta{background:var(--ink);color:#fff}
}

.crumb{background:var(--white);border-bottom:1px solid var(--hair)}
.crumb ul{padding:15px 0}

@media (max-width:768px){
  .phero{padding:calc(var(--head) + 44px) 0 36px}
  .phero__ja{font-size:clamp(22px,6.4vw,30px);letter-spacing:.14em}
  .phero__mark{width:200px;right:-14%;opacity:.05}
  .phero__rule{margin-top:20px;width:44px}
}


/* =========================================================
   LINE 予約ボタン（問い合わせはLINEに一本化）
   ========================================================= */
.btn--line-cta{
  --bc:#06C755;
  background:#06C755;color:#fff;border-color:#06C755;
}
.btn--line-cta span{display:inline-flex;align-items:center;gap:10px}
.btn--line-cta::before{background:#05a948}
.btn--line-cta:hover{color:#fff;border-color:#05a948}
.contact .btn--line-cta{background:#06C755;color:#fff;border-color:#06C755}
.contact .btn--line-cta:hover{color:#fff}

.ico-line{
  width:19px;height:19px;flex:none;display:inline-block;background:currentColor;
  -webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat;
  --ico:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3C6.9 3 2.8 6.3 2.8 10.4c0 3.7 3.3 6.8 7.7 7.4.3.1.7.2.8.5.1.3.1.6 0 .9l-.1.8c0 .2-.2.9.8.5s5.4-3.2 7.4-5.4c1.3-1.4 1.9-2.9 1.9-4.7C21.3 6.3 17.1 3 12 3z'/></svg>");
}

/* /contact/ のLINE案内ブロック */
.lineblock{
  max-width:720px;margin:0 auto;text-align:center;
  background:var(--cream);padding:clamp(30px,4.4vw,52px);
}
.lineblock__lead{font-family:var(--serif);font-size:clamp(16px,2vw,20px);letter-spacing:.08em;margin-bottom:24px}
.lineblock__lead b{color:#06C755;font-weight:500}
.lineblock__steps{
  display:grid;gap:12px;margin:30px auto 0;max-width:460px;text-align:left;
}
.lineblock__steps li{
  display:flex;align-items:baseline;gap:14px;font-size:13.5px;line-height:1.9;
  padding-bottom:12px;border-bottom:1px solid var(--hair);
}
.lineblock__steps li:last-child{border-bottom:0}
.lineblock__steps b{font-family:var(--latin);font-size:14px;color:var(--tan-d);letter-spacing:.12em}
.lineblock__note{margin-top:24px;font-size:12px;line-height:2;color:var(--muted)}
.lineblock__note a{color:var(--tan-d);border-bottom:1px solid currentColor}

/* CTA帯の補足 */
.contact__note{margin-top:22px;font-size:12.5px;line-height:2;opacity:.85}
.contact__meta{margin-top:30px}

/* 追従ボタンもLINE色に */
.fab{background:var(--ink);box-shadow:0 14px 34px rgba(45,47,71,.34)}
.fab:hover{background:var(--tan)}

@media (max-width:600px){
  .lineblock{padding:26px 20px}
  .lineblock__steps{max-width:none}
}


/* ご予約方法：LINEを主役にした3カラム */
.specs--contact{align-items:start}
.specs--contact h3{display:flex;align-items:center;gap:9px}
.specs--contact .btn{margin-top:16px;width:100%;justify-content:center;padding:13px 16px;font-size:12.5px}
.spec--line{border-color:#06C755 !important;position:relative}
.spec--line::before{
  content:"おすすめ";position:absolute;top:-11px;left:22px;
  background:#06C755;color:#fff;font-size:10px;letter-spacing:.12em;padding:3px 12px;
}
.spec--line h3{color:#06C755}
.spec--line .ico-line{width:17px;height:17px}
@media (max-width:600px){ .specs--contact .btn{width:auto} }


/* アクセス：Googleマップの埋め込み */
.studio__map{position:relative;overflow:hidden;background:var(--cream)}
.studio__map iframe{
  display:block;width:100%;aspect-ratio:4/3;border:0;filter:grayscale(.18) contrast(1.02);
}
@media (max-width:1024px){ .studio__map iframe{aspect-ratio:16/10} }
@media (max-width:600px){ .studio__map iframe{aspect-ratio:4/3} }

/* ご予約方法：おすすめバッジを廃止し、LINEは枠色だけで示す */
.spec--line::before{display:none}
.spec--line{border-color:#06C755 !important}


/* ご予約方法：オンライン予約を主役に */
.specs--contact{grid-template-columns:repeat(4,1fr)}
.spec--book{border-color:var(--ink) !important;background:var(--white)}
.spec--book h3{color:var(--ink)}
.contact__actions .btn--lg{padding:19px 40px}
@media (max-width:1024px){ .specs--contact{grid-template-columns:repeat(2,1fr)} }
@media (max-width:600px){ .specs--contact{grid-template-columns:1fr} }


/* CTA帯：予約を主役／LINEは副導線 */
.contact .btn--fill{background:#fff;color:var(--ink);border-color:#fff}
.contact .btn--fill::before{background:var(--tan)}
.contact .btn--fill:hover{color:#fff;border-color:var(--tan)}
.contact .btn--line-cta{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.contact .btn--line-cta::before{background:#06C755}
.contact .btn--line-cta:hover{color:#fff;border-color:#06C755}
.contact__actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
@media (max-width:600px){
  .contact__actions{flex-direction:column;align-items:stretch}
  .contact__actions .btn{width:100%}
}


/* モバイル：追従ボタンが最下部のテキストに被らないよう余白を確保 */
@media (max-width:768px){
  .copyright{padding-bottom:26px}
}


/* =========================================================
   WordPress 用の追加スタイル
   ========================================================= */
.pagenav{display:flex;justify-content:center;gap:8px;margin-top:44px}
.pagenav .page-numbers{
  display:grid;place-items:center;min-width:40px;height:40px;padding:0 12px;
  border:1px solid var(--hair);font-family:var(--latin);font-size:13px;letter-spacing:.06em;
  transition:border-color .35s var(--e),color .35s var(--e);
}
.pagenav .page-numbers:hover{border-color:var(--tan);color:var(--tan-d)}
.pagenav .page-numbers.current{background:var(--ink);color:#fff;border-color:var(--ink)}

/* 投稿本文（管理画面から入力される部分）の既定スタイル */
.article__body h2{font-family:var(--serif);font-weight:500;font-size:20px;letter-spacing:.1em;margin:44px 0 16px;padding-left:14px;border-left:2px solid var(--tan)}
.article__body h4{font-family:var(--serif);font-weight:500;font-size:15.5px;letter-spacing:.1em;margin:28px 0 12px}
.article__body ul,.article__body ol{margin:16px 0 24px;padding-left:1.4em}
.article__body ul li{list-style:disc;margin-bottom:8px;font-size:13.5px}
.article__body ol li{list-style:decimal;margin-bottom:8px;font-size:13.5px}
.article__body a{color:var(--tan-d);border-bottom:1px solid currentColor}
.article__body img{margin:26px 0}
.article__body blockquote{
  margin:26px 0;padding:22px 26px;background:var(--cream);border-left:2px solid var(--tan);
  font-size:13.5px;line-height:2.1;
}
.article__body table{margin:26px 0;font-size:13px}
.article__body table th,.article__body table td{border:1px solid var(--hair);padding:12px}
.article__body table th{background:var(--cream);font-weight:500}
.article__body figure{margin:26px 0}
.article__body figcaption{margin-top:10px;font-size:11.5px;color:var(--muted);text-align:center}
.wp-block-image img{max-width:100%;height:auto}

/* ポッドキャストの音声プレイヤー */
.epaudio{margin:26px 0 8px;background:var(--cream);padding:20px 22px}
.epaudio audio{width:100%;height:40px}

.alignwide,.alignfull{margin-inline:0}