/* VL-ACADEMY-COURSE-VISUAL-1 (2026-10-02): /vavitte-academy/ 専用。COURSE DETAILS 以降(講座詳細・AFTER LEARNING・CERTIFICATION)を写真中心に。
   共通 styles.css は触らず、新しいクラス(.acv-*)だけで完結させる。既存の .learn-points / .section-heading / .certificate-copy は共通CSSのまま使う。
   写真は既存素材の切り抜き・縮小のみ。商品・ロゴが写っていないものだけを使う。認定証は実物画像(academy-certificate-v22)の余白だけを切り落として表示する。
   01 の大きな写真(assets/acv-bomber-720/860.webp・3:2)は、上の講座カード(academy-dna-v21)と同じ素材を顔と手元に寄せて切り抜いたもの。
   ボンバーフェイシャルの実写施術写真が届いたら、3:2 で 720px と 1200px 程度を書き出し、index.html の #bomber の img の src/srcset/width/height だけを差し替える(CSSの変更は不要)。 */
:root{--acv-pink:#e8557d;--acv-blush:#fdeef1;--acv-blush-2:#f8dce3;--acv-cream:#fffaf6;--acv-gold:#c39a55;--acv-gold-2:#e2c792;--acv-ink:#2c2529;--acv-soft:#665860;--acv-wine:#5b2439;--acv-sage:#7d8f6a}

/* 03 講座詳細 */
.academy-light-page .acv-details{background:linear-gradient(180deg,#fdf1f3 0%,#fff 55%,#fff8f6 100%);color:var(--acv-ink)}
.acv-details .section-tag{color:#9b8790}
.acv-course-list{display:flex;flex-direction:column;gap:90px;margin-top:10px}
.acv-course{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:5vw;align-items:center;scroll-margin-top:90px}
.acv-course-media{grid-column:2;grid-row:1;position:relative;margin:0;aspect-ratio:3/2}
.acv-course-media>img{width:100%;height:100%;object-fit:cover;display:block;border-radius:6px 240px 6px 6px;box-shadow:0 30px 60px rgba(120,60,80,.16)}
.acv-course-media:after{content:"";position:absolute;inset:0;border-radius:6px 240px 6px 6px;background:linear-gradient(200deg,rgba(255,255,255,0) 50%,rgba(240,170,190,.28) 100%);pointer-events:none}
.acv-course-inset{position:absolute;left:-7%;bottom:-9%;width:30%;aspect-ratio:1;border-radius:50%;border:6px solid #fff;overflow:hidden;box-shadow:0 18px 40px rgba(120,60,80,.2);z-index:2}
.acv-course-inset img{width:100%;height:100%;object-fit:cover;display:block}
.acv-course-script{position:absolute;right:6%;bottom:8%;z-index:2;font:italic 500 clamp(26px,2.6vw,40px)/1 var(--serif);color:#fff;text-shadow:0 2px 14px rgba(120,50,80,.45);pointer-events:none}
.acv-course-copy{grid-column:1;grid-row:1}
.acv-course-label{display:flex;align-items:center;gap:16px;margin:0 0 14px}
.acv-course-no{font:italic 500 44px/1 var(--serif);color:var(--acv-pink)}
.acv-course-label small{font:600 10px var(--sans);letter-spacing:.24em;color:var(--acv-gold)}
.acv-course h2{font:600 clamp(30px,3vw,44px)/1.4 var(--jp);margin:0 0 22px;color:var(--acv-ink)}
.acv-course-sub{display:block;margin-top:6px;font-size:.62em;letter-spacing:.04em;color:var(--acv-pink)}
.acv-course h2:after{content:"";display:block;width:50px;height:2px;margin-top:22px;background:var(--acv-pink)}
.acv-course-copy>p:not(.acv-course-label){font:400 15px/2.1 var(--jp);color:var(--acv-soft);margin:0;max-width:520px}
.acv-course .learn-points{margin-top:24px}
.acv-course .learn-points span{background:#fff;border-color:rgba(232,85,125,.28);color:var(--acv-ink)}
.acv-course-cta{display:inline-flex;align-items:center;gap:12px;margin-top:30px;padding:16px 30px;border-radius:999px;background:var(--acv-pink);color:#fff;font:600 14px var(--jp);box-shadow:0 14px 30px rgba(232,85,125,.28);transition:transform .25s,background .25s}
.acv-course-cta:hover{transform:translateY(-2px);background:#c93560}
/* 01 ボンバーフェイシャルを最も大きく */
.acv-course--bomber{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr)}
.acv-course--bomber h2{font-size:clamp(34px,3.6vw,54px)}
.acv-course--bomber .acv-course-sub{font-size:.6em}
/* 02 クロイターピールは写真を左に・植物の差し色 */
.acv-course--krauter{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.acv-course--krauter .acv-course-media{grid-column:1}
.acv-course--krauter .acv-course-copy{grid-column:2}
.acv-course--krauter .acv-course-media>img,.acv-course--krauter .acv-course-media:after{border-radius:240px 6px 6px 6px}
.acv-course--krauter .acv-course-media:after{background:linear-gradient(160deg,rgba(255,255,255,0) 50%,rgba(150,175,120,.22) 100%)}
.acv-course--krauter .acv-course-inset{left:auto;right:-6%}
.acv-course--krauter .acv-course-script{right:auto;left:8%}
.acv-course--krauter .acv-course-label small{color:var(--acv-sage)}
.acv-course--krauter .learn-points span{border-color:rgba(125,143,106,.4)}

/* 04 AFTER LEARNING(写真つきカード) */
.academy-light-page .acv-outcomes{background:var(--acv-cream)}
.acv-outcome-grid{gap:22px}
.acv-outcome-grid .acv-outcome{padding:0;overflow:hidden;border-radius:14px;border:1px solid #f3dde3;background:#fff;box-shadow:0 14px 34px rgba(150,80,100,.08);display:flex;flex-direction:column}
.acv-outcome figure{margin:0;aspect-ratio:4/3;overflow:hidden;background:#f6e9ec}
.acv-outcome figure img{width:100%;height:100%;object-fit:cover;display:block}
.acv-outcome-text{padding:26px 28px 30px}
.acv-outcome-grid .acv-outcome h3{margin:14px 0 10px}

/* 05 CERTIFICATION(認定証を大きく) */
.acv-cert{grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:4vw}
.acv-cert-panel{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);grid-template-areas:"visual lead" "visual points";align-items:center;gap:10px 36px;padding:46px 44px;border-radius:18px;background:radial-gradient(ellipse at 80% 10%,#fff 0%,rgba(255,255,255,0) 60%),linear-gradient(140deg,var(--acv-blush) 0%,var(--acv-blush-2) 100%)}
.acv-cert-lead{grid-area:lead;align-self:end;margin:0;font:600 clamp(18px,1.6vw,23px)/1.8 var(--jp);letter-spacing:.06em;color:var(--acv-wine)}
.acv-cert-lead:after{content:"";display:block;width:40px;height:1px;margin-top:16px;background:var(--acv-gold)}
.acv-cert-visual.certificate-visual{grid-area:visual;width:100%;max-width:430px;margin:0 auto;padding:10px;background:#fff;border:1px solid var(--acv-gold-2);border-radius:4px;box-shadow:0 26px 50px rgba(120,60,80,.18);transform:rotate(-1.5deg)}
.acv-cert-points{grid-area:points;align-self:start;list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:1fr;gap:14px}
.acv-cert-points li{display:flex;align-items:center;gap:14px;font:600 13px/1.6 var(--jp);color:var(--acv-ink)}
.acv-cert-points svg{width:52px;height:52px;padding:12px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px var(--acv-gold-2);fill:none;stroke:var(--acv-gold);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

@media(max-width:1100px){
  .acv-cert{grid-template-columns:1fr;gap:44px}
}
@media(max-width:900px){
  .acv-course-list{gap:70px}
  /* スマホ: 写真 → 見出し → 説明 → タグ/CTA */
  .acv-course,.acv-course--bomber,.acv-course--krauter{grid-template-columns:1fr;gap:40px}
  .acv-course-media,.acv-course--krauter .acv-course-media{grid-column:1;grid-row:1}
  .acv-course-copy,.acv-course--krauter .acv-course-copy{grid-column:1;grid-row:2}
  .acv-course-media>img,.acv-course-media:after{border-radius:6px 140px 6px 6px}
  .acv-course--krauter .acv-course-media>img,.acv-course--krauter .acv-course-media:after{border-radius:140px 6px 6px 6px}
  .acv-course-inset{left:0;width:28%;border-width:4px}
  .acv-course--krauter .acv-course-inset{right:0}
  .acv-course-script{font-size:26px}
  .acv-course-no{font-size:36px}
  .acv-course--bomber h2{font-size:34px}
  .acv-course h2{font-size:30px}
  .acv-course-copy>p:not(.acv-course-label){font-size:14.5px}
  .acv-course-cta{display:flex;justify-content:center}
  .acv-outcome-grid{gap:18px}
  .acv-outcome-grid .acv-outcome{display:grid;grid-template-columns:40% minmax(0,1fr)}
  .acv-outcome figure{aspect-ratio:auto;height:100%;min-height:150px}
  .acv-outcome-text{padding:18px 16px 20px}
  .acv-outcome-grid .acv-outcome b{font-size:22px}
  .acv-outcome-grid .acv-outcome h3{font-size:17px;margin:8px 0 6px}
  .acv-outcome-grid .acv-outcome p{font-size:13px;line-height:1.85}
  .acv-cert-panel{grid-template-columns:1fr;grid-template-areas:"lead" "visual" "points";gap:24px;padding:32px 18px 30px;text-align:center}
  .acv-cert-lead:after{margin:14px auto 0}
  .acv-br-pc{display:none}
  .acv-cert-visual.certificate-visual{width:86%;padding:8px;transform:none}
  .acv-cert-points{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:4px 0 0}
  .acv-cert-points li{flex-direction:column;gap:8px;font-size:12px}
  .acv-cert-points svg{width:46px;height:46px;padding:10px}
}
@media (prefers-reduced-motion:reduce){.acv-course-cta{transition:none}}
