/* ============================================================
   BabuuFit overrides — rich Japanese-LP layer  (2026-06-14)
   ============================================================ */

:root{
  /* recolour existing accents toward the BabuuFit logo orange */
  --terra:#e85d22;
  --terra-dark:#c64c16;
  --orange:#f1834a;
  /* new tokens */
  --bf-orange:#e85d22;
  --bf-orange-d:#c64c16;
  --bf-orange-l:#f6a062;
  --bf-tint:#fbe7da;
  --bf-tint2:#fff7f1;
  --bf-cream:#fdf2e9;
  --bf-mark:#ffdd93;
  --bf-ink:#34281f;
  --bf-zen:"Zen Maru Gothic","Hiragino Maru Gothic ProN",sans-serif;
  --bf-gthc:"Zen Kaku Gothic New","Hiragino Sans",sans-serif;
}

/* ---------- brand logo ---------- */
.logo-img{ height:50px; width:auto; display:block; }
.footer .logo-img{ height:60px; margin:0 auto; }
.footer .logo{ display:flex; justify-content:center; }
@media(max-width:640px){ .logo-img{ height:40px; } .footer .logo-img{ height:52px; } }

/* ---------- shared helpers ---------- */
.mk{ background:linear-gradient(transparent 56%, var(--bf-mark) 56%); padding:0 .08em; font-weight:900; }
.line-mini, .line-btn, .fixed-cta{ font-family:var(--bf-zen); letter-spacing:.02em; white-space:nowrap !important; }
.line-btn:hover, .line-mini:hover, .fixed-cta:hover{ transform:translateY(-2px); filter:saturate(1.05); transition:.2s; }

/* a bit more air between sections */
.flyer-section{ padding-top:clamp(58px,8vw,96px); padding-bottom:clamp(58px,8vw,96px); }

/* ============================================================
   SECTION TITLES — English eyebrow + underline accent
   ============================================================ */
.section-title{
  position:relative; text-align:center;
  font-family:var(--bf-zen) !important; font-weight:900 !important;
  color:var(--bf-ink) !important; letter-spacing:.06em;
  margin-bottom:clamp(30px,4vw,48px) !important;
}
.section-title::before{
  content:attr(data-en); display:block;
  font-family:var(--bf-zen); font-weight:700; color:var(--bf-orange);
  font-size:clamp(12px,1.25vw,14px); letter-spacing:.3em; margin-bottom:12px;
}
.section-title::after{
  content:""; display:block; width:56px; height:5px; border-radius:99px;
  background:linear-gradient(90deg,var(--bf-orange),var(--bf-orange-l));
  margin:18px auto 0;
}

/* ============================================================
   HERO
   ============================================================ */
.hero-head{ display:inline-block; }
.service-tag{
  display:inline-flex; align-items:center; gap:10px; margin:0 0 14px;
  padding:8px 18px 8px 10px; border-radius:99px;
  background:#fff; border:1.5px solid var(--bf-tint);
  box-shadow:0 8px 20px rgba(200,76,22,.10);
}
.service-tag b{
  font-family:var(--bf-zen); font-weight:900; font-size:15px; letter-spacing:.02em;
  color:#fff; background:linear-gradient(135deg,var(--bf-orange),var(--bf-orange-l));
  padding:5px 13px; border-radius:99px;
}
.service-tag span{
  font-family:var(--bf-zen); font-weight:700; font-size:clamp(13px,1.4vw,15px); color:var(--bf-ink); white-space:nowrap;
}
@media(max-width:640px){
  .service-tag{ flex-wrap:wrap; justify-content:center; gap:7px; padding:8px 16px; }
  .service-tag span{ font-size:12.5px; white-space:normal; }
}
.hero-eyebrow{
  display:block; text-align:center; width:100%;
  font-family:var(--bf-zen); font-weight:700; color:var(--bf-orange-d);
  font-size:clamp(13px,1.5vw,17px); letter-spacing:.02em; margin-bottom:16px;
}
.hero h1{
  font-family:"Zen Kaku Gothic New",var(--bf-zen) !important; font-weight:900 !important;
  font-size:clamp(44px,5.6vw,82px) !important; line-height:1.24 !important; letter-spacing:.01em !important;
  color:var(--bf-ink) !important; white-space:normal !important; margin-bottom:22px !important;
  text-shadow:0 2px 16px rgba(255,250,244,.7);
}
.hero h1 .pop{
  color:var(--bf-orange) !important; white-space:nowrap;
  background:linear-gradient(transparent 60%, var(--bf-mark) 60%); padding:0 .06em;
}
.hero h1 .nw{ white-space:nowrap; }
.sub{ font-family:var(--bf-zen); font-weight:700; word-break:keep-all; overflow-wrap:anywhere; }

/* badge chips → soft cards with orange check */
.badges span{
  background:#fff !important; border:1.5px solid var(--bf-tint) !important; border-top:3px solid var(--bf-orange) !important;
  border-radius:14px !important; box-shadow:0 8px 22px rgba(200,76,22,.10) !important;
  font-family:var(--bf-zen); font-weight:700 !important; color:var(--bf-ink) !important;
  display:flex !important; align-items:center; justify-content:center;
  padding:14px 10px !important; text-align:center !important;
  line-height:1.4 !important; white-space:normal !important;
  transition:transform .2s, box-shadow .2s;
}
.badges span:hover{ transform:translateY(-3px); box-shadow:0 14px 30px rgba(200,76,22,.18) !important; }
.badges span::before{ display:none !important; }
.badges span:nth-child(1)::before{ background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><path d='M10.5 8 15 12l-4.5 4z' fill='%23fff'/></svg>") center/20px no-repeat, linear-gradient(140deg,#e85d22,#f6a062); }
.badges span:nth-child(2)::before{ background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='6' width='18' height='13' rx='2.5'/><circle cx='9' cy='12.5' r='2.6'/><path d='M14.5 11h3.5M14.5 14h3.5'/></svg>") center/20px no-repeat, linear-gradient(140deg,#e85d22,#f6a062); }
.badges span:nth-child(3)::before{ background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linejoin='round'><rect x='3' y='5' width='18' height='14' rx='2'/><path d='M3 9.5h18M8 5v14'/></svg>") center/20px no-repeat, linear-gradient(140deg,#e85d22,#f6a062); }
.badges span:nth-child(4)::before{ background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='9' cy='9' r='3'/><path d='M3.5 19c.5-3 2.7-4.8 5.5-4.8s5 1.8 5.5 4.8'/><circle cx='17' cy='8' r='2.3'/><path d='M15.5 13.4c2.2.2 3.8 1.8 4.2 4.3'/></svg>") center/20px no-repeat, linear-gradient(140deg,#e85d22,#f6a062); }

/* price block → dashed ticket card */
.price-block{
  background:#fff; border:2px dashed var(--bf-orange-l); border-radius:18px;
  padding:38px 24px 14px !important; box-shadow:0 12px 30px rgba(200,76,22,.10);
  display:flex !important; flex-wrap:wrap; align-items:center; justify-content:center; text-align:center; gap:8px 12px !important;
  position:relative; margin-top:20px;
}
.price-amt{ display:inline-flex; align-items:baseline; gap:4px; font-size:26px; }
.price-amt .label{ font-size:25px !important; }
.price-amt strong{ font-size:clamp(70px,9vw,98px) !important; line-height:.9; }
.price-block .label{ font-family:var(--bf-zen); font-weight:700; }
.price-block strong{ color:var(--bf-orange) !important; }
.price-block em{ flex-basis:100%; margin:0 !important; text-align:center; font-family:var(--bf-zen); font-weight:700; font-size:16px; color:var(--bf-orange-d); font-style:normal; }
.price-row{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:6px; }
.limited-lead{
  position:absolute; top:-15px; left:50%; transform:translateX(-50%); z-index:2;
  display:flex; align-items:center; gap:7px; margin:0;
  font-family:var(--bf-zen); font-weight:700; font-size:14px; color:#fff;
  background:linear-gradient(135deg,var(--bf-orange),var(--bf-orange-l));
  padding:7px 18px; border-radius:99px; box-shadow:0 8px 18px rgba(232,93,34,.30); letter-spacing:.02em; white-space:nowrap;
}

/* week-4 circle → vivid badge with dashed ring */
.circle{
  background:radial-gradient(120% 120% at 30% 20%, var(--bf-orange-l), var(--bf-orange)) !important;
  border:3px solid #fff !important; box-shadow:0 18px 44px rgba(232,93,34,.42) !important;
  font-family:var(--bf-zen); font-weight:700;
}
.circle::after{
  content:""; position:absolute; inset:-9px; border:2px dashed rgba(255,255,255,.85);
  border-radius:50%; pointer-events:none;
}

/* ============================================================
   WORRIES — speech-bubble checklist
   ============================================================ */
.worries{ background:var(--bf-tint2); position:relative; overflow:hidden; display:block !important; }
.worries .worry-img{ display:none !important; }
.worries-copy{ max-width:920px !important; margin:0 auto !important; min-width:0; }
.worries::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:radial-gradient(rgba(232,93,34,.10) 2px, transparent 2px);
  background-size:24px 24px; opacity:.6;
}
.worries > *{ position:relative; z-index:1; }
.worries-copy h2{
  text-align:center; position:relative; font-family:var(--bf-zen) !important; font-weight:900 !important;
  color:var(--bf-ink) !important; margin-bottom:30px !important; padding-top:6px;
}
.worries-copy h2::before{
  content:attr(data-en); display:block; font-family:var(--bf-zen); font-weight:700;
  color:var(--bf-orange); font-size:13px; letter-spacing:.3em; margin-bottom:20px; line-height:1;
}
.checks{
  display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px !important;
  max-width:760px; margin:0 auto 30px !important;
  background:transparent !important; box-shadow:none !important; padding:0 !important;
}
.checks p{
  background:#fff !important; border-radius:16px !important; border:1px solid var(--bf-tint);
  box-shadow:0 8px 22px rgba(200,76,22,.08) !important;
  padding:16px 18px 16px 50px !important; position:relative; font-weight:700 !important;
  font-family:var(--bf-gthc); margin:0 !important; line-height:1.55;
}
.checks p:last-child:nth-child(odd){ grid-column:1 / -1; max-width:50%; justify-self:center; }
.checks p::before{
  content:""; position:absolute; left:14px; top:50%; transform:translateY(-50%);
  width:24px; height:24px; border-radius:50%; background:var(--bf-orange);
}
.checks p::after{
  content:""; position:absolute; left:22px; top:50%; margin-top:-6px;
  width:7px; height:12px; border:solid #fff; border-width:0 2.6px 2.6px 0; transform:rotate(42deg);
}
.worries .lead{
  text-align:center; font-family:var(--bf-zen) !important; font-weight:900 !important;
  font-size:clamp(19px,2.3vw,27px) !important; line-height:1.7 !important;
}
.worries .lead span{
  background:linear-gradient(transparent 56%, var(--bf-mark) 56%);
  color:var(--bf-orange-d) !important; padding:0 .12em; font-weight:900;
}
/* downward connector arrow */
.worries::after{
  content:""; position:absolute; left:50%; bottom:-1px; transform:translateX(-50%);
  border-left:22px solid transparent; border-right:22px solid transparent;
  border-top:20px solid var(--bf-tint2); z-index:2;
}

/* ============================================================
   FEATURES — numbered ribbon cards
   ============================================================ */
.features{ background:#fff; }
.feature-grid{ counter-reset:feat; }
.feature-grid article{
  position:relative; background:#fff; border:1px solid var(--bf-tint);
  border-radius:20px !important; overflow:hidden;
  box-shadow:0 14px 36px rgba(200,76,22,.10) !important; transition:.25s; padding-bottom:8px;
}
.feature-grid article:hover{ transform:translateY(-6px); box-shadow:0 24px 48px rgba(200,76,22,.18) !important; }
.feature-grid article::after{
  counter-increment:feat; content:"0" counter(feat);
  position:absolute; top:12px; left:18px; z-index:3;
  font-family:var(--bf-zen); font-weight:900; font-size:30px;
  color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.45); line-height:1;
}
.feature-grid article span{
  position:absolute !important; top:16px; right:0 !important; left:auto !important; bottom:auto !important;
  width:auto !important; max-width:60% !important; z-index:3;
  background:var(--bf-orange) !important; color:#fff !important;
  font-family:var(--bf-zen); font-weight:700; font-size:12px !important;
  padding:6px 14px 6px 16px !important; border-radius:99px 0 0 99px !important;
  box-shadow:0 6px 14px rgba(232,93,34,.32); text-align:center !important;
}
.feature-grid img{ border-radius:0 !important; }
.feature-grid h3{ color:var(--bf-orange-d) !important; font-family:var(--bf-zen) !important; }
.feature-grid p{ font-family:var(--bf-gthc); }

/* ============================================================
   MIDDLE CTA — inset gradient band
   ============================================================ */
.middle-cta{
  background:linear-gradient(120deg,var(--bf-orange),var(--bf-orange-l)) !important;
  color:#fff; border-radius:30px; position:relative; overflow:hidden;
  width:auto !important;
  margin:8px clamp(22px,5vw,70px); padding:clamp(34px,4.5vw,52px) clamp(26px,4vw,56px) !important;
  box-shadow:0 26px 60px rgba(232,93,34,.30);
}
.middle-cta::before{ content:""; position:absolute; right:-50px; top:-50px; width:200px; height:200px; border-radius:50%; background:rgba(255,255,255,.14); }
.middle-cta::after{ content:""; position:absolute; left:-40px; bottom:-60px; width:180px; height:180px; border-radius:50%; background:rgba(255,255,255,.10); }
.middle-cta > *{ position:relative; z-index:1; }
.middle-cta h2{ color:#fff !important; font-family:var(--bf-zen) !important; font-weight:900 !important; }
.middle-cta p{ color:rgba(255,255,255,.94) !important; }
.middle-cta .badge-round{
  background:#fff !important; color:var(--bf-orange) !important;
  font-family:var(--bf-zen); font-weight:900; box-shadow:0 10px 24px rgba(0,0,0,.18);
  position:relative;
}
.middle-cta .badge-round::after{
  content:""; position:absolute; inset:-7px; border:2px dashed rgba(255,255,255,.85); border-radius:50%;
}
.middle-cta .line-btn{ background:#fff !important; color:var(--bf-orange-d) !important; box-shadow:0 12px 26px rgba(0,0,0,.18); }
.middle-cta .line-btn b{ background:var(--bf-orange) !important; color:#fff !important; }

/* ============================================================
   PLANS
   ============================================================ */
.plans{ background:var(--bf-tint2); position:relative; overflow:hidden; }
.plans::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(rgba(232,93,34,.08) 2px, transparent 2px); background-size:26px 26px; opacity:.6;
}
.plans > *{ position:relative; z-index:1; }
.main-plan{
  position:relative; background:#fff !important; border:2.5px solid var(--bf-orange) !important;
  border-radius:24px !important; box-shadow:0 22px 54px rgba(232,93,34,.16) !important; overflow:hidden;
}
.main-plan::before{
  content:"おすすめ"; position:absolute; top:20px; right:-42px; transform:rotate(45deg);
  background:var(--bf-orange); color:#fff; font-family:var(--bf-zen); font-weight:700; font-size:13px;
  padding:7px 52px; box-shadow:0 6px 14px rgba(232,93,34,.3);
}
.main-plan .plan-kicker{
  display:inline-block; background:var(--bf-orange) !important; color:#fff !important;
  font-family:var(--bf-zen); font-weight:700; padding:7px 18px !important; border-radius:99px !important;
}
.main-plan h3{ font-family:var(--bf-zen) !important; }
.main-plan .big-price strong{ color:var(--bf-orange) !important; }
.main-plan .limited-note{ margin-top:10px; font-family:var(--bf-zen); font-weight:700; font-size:15px; color:var(--bf-orange-d); }
.main-plan ul li{ position:relative; padding-left:32px !important; list-style:none !important; }
.main-plan ul{ list-style:none !important; padding-left:0 !important; }
.main-plan ul li::before{
  content:""; position:absolute; left:6px; top:50%; margin-top:-9px;
  width:18px; height:18px; border-radius:50%; background:var(--bf-tint);
}
.main-plan ul li::after{
  content:""; position:absolute; left:12px; top:50%; margin-top:-5px;
  width:5px; height:9px; border:solid var(--bf-orange); border-width:0 2.4px 2.4px 0; transform:rotate(42deg);
}
.nutrition-card{ background:#fff !important; border:1px solid var(--bf-tint); border-radius:24px !important; box-shadow:0 14px 36px rgba(200,76,22,.10); }
.nutrition-card h3 span{ background:var(--bf-orange) !important; color:#fff !important; font-family:var(--bf-zen); border-radius:99px; padding:2px 12px; font-size:13px; }
.nutrition-card strong{ color:var(--bf-orange-d) !important; }

/* ============================================================
   FLOW — big STEP numbers + dashed connector
   ============================================================ */
.flow{ background:#fff; }
.flow-grid{ grid-template-columns:repeat(4,minmax(0,1fr)) !important; }
@media(max-width:1100px){ .flow-grid{ grid-template-columns:repeat(2,1fr) !important; } }
.flow-grid > div{ position:relative; }
.flow-grid b{
  display:flex !important; align-items:center; justify-content:center;
  width:66px !important; height:66px !important; margin:0 auto 16px !important; border-radius:50% !important;
  background:linear-gradient(140deg,var(--bf-orange),var(--bf-orange-l)) !important; color:#fff !important;
  font-family:var(--bf-zen) !important; font-weight:900 !important; font-size:30px !important;
  box-shadow:0 12px 26px rgba(232,93,34,.32) !important; position:relative; z-index:2;
}
.flow-grid b::before{
  content:"STEP"; position:absolute; top:-15px; left:50%; transform:translateX(-50%);
  font-family:var(--bf-zen); font-weight:700; font-size:10px; letter-spacing:.18em; color:var(--bf-orange);
}
.flow-grid > div:not(:last-child)::after{
  content:""; position:absolute; top:33px; left:62%; width:76%; height:3px; z-index:1;
  background:repeating-linear-gradient(90deg,var(--bf-orange-l) 0 7px, transparent 7px 14px);
}
.flow-grid h3{ font-family:var(--bf-zen) !important; color:var(--bf-orange-d) !important; }

/* ============================================================
   TRAINERS — accent cards
   ============================================================ */
.trainers{ background:var(--bf-tint2); position:relative; overflow:hidden; }
.trainers::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(rgba(232,93,34,.07) 2px, transparent 2px); background-size:26px 26px; opacity:.6;
}
.trainers > *{ position:relative; z-index:1; }
.trainer-grid{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:24px !important; }
@media(max-width:760px){ .trainer-grid{ grid-template-columns:1fr !important; } }
.trainer-grid article{
  background:#fff !important; border:1px solid var(--bf-tint) !important; border-top:4px solid var(--bf-orange) !important;
  border-radius:18px !important; box-shadow:0 14px 36px rgba(200,76,22,.10) !important;
  padding:22px !important;
}
.trainer-grid img{ border-radius:16px !important; box-shadow:0 8px 20px rgba(52,40,31,.16) !important; grid-row:1 / span 3 !important; align-self:start; }
.trainer-grid h3{ font-family:var(--bf-zen) !important; color:var(--bf-ink) !important; }
.trainer-grid p{ color:var(--bf-orange-d) !important; font-family:var(--bf-zen); font-weight:700; }
.trainer-grid small{ position:relative; padding-top:6px; display:block; }
.trainer-grid small::before{
  content:"\201C"; position:absolute; left:-4px; top:-14px; font-family:Georgia,serif;
  font-size:42px; line-height:1; color:var(--bf-orange-l); opacity:.5;
}
.ig{ color:var(--bf-orange) !important; font-weight:800; }
.ig:hover{ text-decoration:underline; }

/* ============================================================
   VOICES — star-rated testimonial cards
   ============================================================ */
.voices{ background:#fff; }
.voice-grid article{
  display:flex !important; flex-direction:column; align-items:flex-start;
  background:var(--bf-tint2) !important; border:1px solid var(--bf-tint);
  border-radius:20px !important; padding:24px 22px 22px !important; position:relative; overflow:hidden;
  box-shadow:0 12px 30px rgba(200,76,22,.09) !important;
}
.voice-grid article::before{
  content:"\2605\2605\2605\2605\2605"; order:0; color:#ffb23e; letter-spacing:3px; font-size:15px; margin-bottom:10px;
}
.voice-grid article::after{
  content:"\201D"; position:absolute; right:14px; top:2px; font-family:Georgia,serif;
  font-size:64px; color:var(--bf-orange-l); opacity:.22; line-height:1;
}
.voice-grid img{
  order:2; width:58px !important; height:58px !important; border-radius:50% !important; object-fit:cover;
  border:3px solid #fff; box-shadow:0 4px 12px rgba(52,40,31,.16); margin-top:14px !important;
}
.voice-grid p{ order:1; width:100%; font-family:var(--bf-gthc); font-weight:600; color:var(--bf-ink) !important; line-height:1.8; word-break:normal !important; overflow-wrap:anywhere !important; }
.voice-grid small{ order:3; width:100%; color:var(--bf-orange-d) !important; font-family:var(--bf-zen); font-weight:700; margin-top:8px; }

/* ============================================================
   FAQ — Q/A badges
   ============================================================ */
.faq{ background:var(--bf-tint2); position:relative; overflow:hidden; }
.faq::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(rgba(232,93,34,.06) 2px, transparent 2px); background-size:26px 26px; opacity:.6;
}
.faq > *{ position:relative; z-index:1; }
.faq-grid details{
  background:#fff !important; border:1px solid var(--bf-tint) !important; border-radius:16px !important;
  box-shadow:0 8px 22px rgba(200,76,22,.07) !important; overflow:hidden;
}
.faq-grid summary{
  position:relative; list-style:none; cursor:pointer; font-family:var(--bf-zen) !important; font-weight:700 !important;
  padding:20px 56px 20px 58px !important; color:var(--bf-ink) !important;
}
.faq-grid summary::-webkit-details-marker{ display:none; }
.faq-grid summary::before{
  content:"Q"; position:absolute; left:16px; top:50%; transform:translateY(-50%);
  width:32px; height:32px; border-radius:50%; background:var(--bf-orange); color:#fff;
  display:flex; align-items:center; justify-content:center; font-family:var(--bf-zen); font-weight:900;
}
.faq-grid summary::after{
  content:""; position:absolute; right:22px; top:50%; width:12px; height:12px; margin-top:-8px;
  border-right:2.6px solid var(--bf-orange); border-bottom:2.6px solid var(--bf-orange);
  transform:rotate(45deg); transition:transform .22s;
}
.faq-grid details[open] summary::after{ transform:rotate(-135deg); }
.faq-grid details p{
  position:relative; padding:0 22px 22px 58px !important; color:var(--muted) !important; font-family:var(--bf-gthc);
}
.faq-grid details p::before{
  content:"A"; position:absolute; left:16px; top:-2px;
  width:32px; height:32px; border-radius:50%; background:var(--bf-tint); color:var(--bf-orange-d);
  display:flex; align-items:center; justify-content:center; font-family:var(--bf-zen); font-weight:900;
}

/* ============================================================
   FINAL CTA — full-width gradient band, arched top
   ============================================================ */
.final-cta{
  background:linear-gradient(125deg,var(--bf-orange),var(--bf-orange-l)) !important;
  position:relative; overflow:hidden; border-radius:60px 60px 0 0 / 50px 50px 0 0;
  padding:clamp(44px,6vw,76px) clamp(22px,5vw,70px) !important;
}
.final-cta::before{ content:""; position:absolute; right:-60px; top:-60px; width:220px; height:220px; border-radius:50%; background:rgba(255,255,255,.13); }
.final-cta::after{ content:""; position:absolute; left:-50px; bottom:-70px; width:200px; height:200px; border-radius:50%; background:rgba(255,255,255,.10); }
.final-cta > *{ position:relative; z-index:1; }
.final-cta h2{ color:#fff !important; font-family:var(--bf-zen) !important; font-weight:900 !important; }
.final-cta p{ color:rgba(255,255,255,.94) !important; }
.final-cta img{ border-radius:20px !important; box-shadow:0 18px 44px rgba(0,0,0,.22) !important; }
.final-cta .line-btn{ background:#fff !important; color:var(--bf-orange-d) !important; box-shadow:0 14px 30px rgba(0,0,0,.2); }
.final-cta .line-btn b{ background:var(--bf-orange) !important; color:#fff !important; }

/* ============================================================
   FIXED CTA — gentle pulse
   ============================================================ */
.fixed-cta{ animation:bf-pulse 2.4s ease-in-out infinite; }
.final-cta h2{ white-space:normal !important; text-wrap:balance; }
@keyframes bf-pulse{ 0%,100%{ box-shadow:0 10px 24px rgba(6,199,85,.30); } 50%{ box-shadow:0 10px 30px rgba(6,199,85,.55); } }

/* ============================================================
   Real trainer portrait framing
   ============================================================ */
.trainer-grid img{ object-fit:cover; }
.trainer-grid img.t-hotta{ object-position:63% 26%; }
.trainer-grid img.t-kobayashi{ object-position:42% 30%; }
.trainer-grid img.t-kawakami{ object-position:50% 24%; }
.trainer-grid img.t-morimoto{ object-position:50% 20%; }

/* ===== HERO — week-4 badge: tighten text inside the circle ===== */
.circle{
  width:150px !important; height:150px !important; padding:0 !important;
  display:flex !important; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; font-size:12.5px !important; line-height:1.4 !important;
}
.circle strong{ font-size:30px !important; line-height:1 !important; display:block; margin:2px 0; }

/* ===== HERO — PC split layout: person on the right, text on clean cream ===== */
@media(min-width:1101px){
  .hero{ background:var(--bf-cream) !important; }
  .hero-bg{ background:var(--bf-cream) !important; }
  .hero-inner{ align-items:stretch !important; }
  .hero-side{
    position:relative !important; min-height:520px !important; align-self:stretch !important;
    background:url('assets/hero-bg.webp') 54% 28% / cover no-repeat !important;
    border-radius:30px !important; box-shadow:0 26px 60px rgba(52,40,31,.18) !important;
    overflow:visible !important;
  }
  .circle{ right:18px !important; top:18px !important; }
  .hero-copy .line-btn.big{ display:flex !important; width:fit-content; margin-left:auto !important; margin-right:auto !important; }
}

/* ============================================================
   Mobile tidy
   ============================================================ */
@media(max-width:640px){
  .checks{ grid-template-columns:1fr !important; }
  .checks p:last-child:nth-child(odd){ grid-column:auto; max-width:none; }
  .middle-cta{ margin:8px 16px; border-radius:24px; }
  .flow-grid > div:not(:last-child)::after{ display:none; }
  .final-cta{ border-radius:40px 40px 0 0 / 30px 30px 0 0; }
  .line-mini:after{ content:"はじめる" !important; }
}