/* =========================================
   ASALAB Luxury Refresh 2026
   Front Page Scope
========================================= */

:root{
  --bg:#f5f3f1;
  --surface:#ffffff;
  --surface-soft:#faf8f6;

  --text:#1a1a1a;
  --muted:#6e6e6e;

  --brand:#b96a2e;
  --brand-soft:#d6a172;

  --dark:#111111;

  --radius:28px;
  --radius-m:20px;

  --shadow-s:0 15px 40px rgba(0,0,0,.06);
  --shadow-m:0 30px 80px rgba(0,0,0,.12);

  --container:min(1120px,92vw);
}

body{
  background:var(--bg);
  color:var(--text);
  font-family:'Montserrat',sans-serif;
}

/* 共通幅 */
.course,
.feature,
.trainer,
.topic{
  width:var(--container);
  margin-inline:auto;
  padding-block:10px;
}

/* ================= HERO ================= */

.fastview-back{
  background:linear-gradient(
    180deg,
    rgba(0,0,0,.6),
    rgba(0,0,0,.35)
  );
}

.textbox p{
  color:#fff;
  font-size:20px;
  letter-spacing:.15em;
}

.textbox h2{
  color:#fff;
  font-size:clamp(48px,6vw,86px);
  font-weight:900;
  letter-spacing:.12em;
  line-height:1.1;
}

.fastview-content-title .button{
  background:transparent;
  border:1px solid #fff;
  color:#fff;
  border-radius:999px;
  padding:14px 36px;
  transition:.3s ease;
}

.fastview-content-title .button:hover{
  background:#fff;
  color:#111;
}

/* ================= COURSE ================= */

.course{
  background:var(--surface-soft);
}

.course-title h2{
  font-weight:900;
  letter-spacing:.08em;
}

.course-content-item{
  background:var(--surface);
  border-radius:var(--radius);
  box-shadow:var(--shadow-s);
  padding:50px 40px;
  transition:.3s ease;
  color:var(--text);   /* ← 強制指定 */
}

.course-content-item *{
  color:var(--text);   /* ← 白文字防止 */
}

.course-content-item:hover{
  transform:translateY(-8px);
  box-shadow:var(--shadow-m);
}

.course-content-item h3{
  font-size:22px;
  font-weight:900;
  margin-bottom:18px;
}

.course-content-item .price{
  font-size:28px;
  font-weight:900;
  color:var(--brand);
  letter-spacing:.08em;
}

.course-content-item.top{
  transform:scale(1.04);
  box-shadow:var(--shadow-m);
}

/* クーポン */

.course-content-item.coupon{
  background:linear-gradient(
    180deg,
    #ffffff,
    #f8f4ef
  );
  border:1px solid rgba(185,106,46,.2);
}

.corce-coupon-box-circle{
  background:var(--brand);
  color:#fff;
}

/* ================= FEATURE ================= */

.feature{
  background:#fff;
}

.feature-content-shapes{
  background:var(--dark);
  color:#fff;
}

.feature-content-message-text{
  background:#fff;
  border-radius:var(--radius-m);
  box-shadow:var(--shadow-s);
  padding:50px;
  color:var(--text);
}

/* ================= TRAINER ================= */

.trainer{
  background:var(--surface-soft);
}

.trainer-pc-content-detail,
.trainer-sp-content-detail{
  background:#fff;
  border-radius:var(--radius-m);
  box-shadow:var(--shadow-s);
  padding:40px;
}

/* ================= CUSTOMER ================= */

.customercase{
  background:#111;
  padding-block:160px;
}

.customercase-title h2{
  color:#fff;
  letter-spacing:.1em;
}

.Box{
  border-radius:var(--radius-m);
  overflow:hidden;
  box-shadow:0 30px 80px rgba(0,0,0,.4);
}

.Box img{
  transition:.4s ease;
}

.Box:hover img{
  transform:scale(1.06);
}

/* ================= BUTTON ================= */

.course-button p{
  background:var(--dark);
  color:#fff;
  padding:14px 36px;
  border-radius:999px;
  transition:.3s ease;
}

.course-button p:hover{
  background:var(--brand);
}

/* ================= TYPO ================= */

h2 span.orange{
  color:var(--brand);
}

.subtitle{
  letter-spacing:.2em;
  font-weight:700;
  opacity:.6;
}
/* ================= FEATURE REBUILD ================= */

.feature{
  background:#f6f4f2;
  padding-block:180px;
}

.feature-title{
  text-align:center;
  margin-bottom:100px;
}

.feature-title h2{
  font-size:42px;
  font-weight:900;
  letter-spacing:.12em;
}

.feature-content{
  max-width:1000px;
  margin-inline:auto;
}

.feature-content-top{
  display:flex;
  align-items:center;
  gap:30px;
  margin-bottom:40px;
}

.feature-content-shapes{
  width:64px;
  height:64px;
  border-radius:50%;
  background:#111;
  display:flex;
  align-items:center;
  justify-content:center;
}

.feature-content-shapes .number{
  color:#fff;
  font-weight:800;
  font-size:20px;
}

.feature-content-title h3{
  font-size:26px;
  font-weight:800;
  letter-spacing:.05em;
}

.feature-content-message{
  background:#ffffff;
  border-radius:28px;
  box-shadow:0 30px 80px rgba(0,0,0,.08);
  overflow:hidden;
  margin-bottom:120px;
}

.feature-content-message-img img{
  width:100%;
  display:block;
}

.feature-content-message-text{
  padding:60px 70px;
  font-size:17px;
  line-height:1.9;
  color:#333;
}

/* モバイル最適化 */
@media(max-width:768px){

  .feature{
    padding-block:120px;
  }

  .feature-content-message-text{
    padding:40px 30px;
  }

  .feature-content-title h3{
    font-size:20px;
  }

}
/* =========================
   SP Section Spacing Fix
========================= */

@media (max-width: 768px){

  .course,
  .feature,
  .trainer,
  .topic{
    padding-top:80px;
    padding-bottom:90px;
  }

  .feature{
    padding-top:90px;
    padding-bottom:100px;
  }

  .feature-title,
  .course-title,
  .trainer-title,
  .topic-title{
    margin-bottom:50px;
  }

}
@media (max-width:768px){
  body .course{
    padding-top:10px !important;
  }
}