/*
Theme Name: fanso-lp-standard
Template: lightning
Version: 1.0
*/

/* =========================
   FANSO LP Standard - styles
   貼り先：子テーマ style.css
========================= */

/* ---- reset-ish (LP内だけ) ---- */
.fanso-lp, .fanso-lp *{ box-sizing: border-box; }
.fanso-lp img{ max-width:100%; height:auto; }
.fanso-lp a{ color:inherit; }

/* ---- base ---- */
.fanso-lp{
  background:#0b0f14;
  color:#e8eef6;
  font-family: system-ui, -apple-system, "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;
  padding:0;
  margin:0;
}

/* layout */
.fanso-container{
  width:min(1100px, 92vw);
  margin:0 auto;
}

.fanso-section{
  padding:64px 0;
}

@media (max-width:768px){
  .fanso-section{ padding:44px 0; }
}

.fanso-kicker{
  letter-spacing:.12em;
  font-weight:700;
  color:#cfb53b;
  font-size:12px;
  text-transform:uppercase;
  margin:0 0 10px;
}

.fanso-h2{
  font-size: clamp(22px, 3.4vw, 34px);
  margin:0 0 12px;
  line-height:1.25;
}

.fanso-h3{
  font-size:18px;
  margin:0 0 6px;
}

.fanso-lead{
  margin:0;
  color: rgba(232,238,246,.82);
  line-height:1.85;
}

.fanso-p{
  margin:0;
  color: rgba(232,238,246,.82);
  line-height:1.85;
}

.fanso-section-head{ margin-bottom:18px; }

/* ---- cards ---- */
.fanso-card{
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  box-shadow: 0 18px 60px rgba(0,0,0,.35);
}

.fanso-card-pad{ padding:22px; }

.fanso-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:16px;
}

/* ---- buttons ---- */
.fanso-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 18px;
  border-radius:999px;
  text-decoration:none;
  font-weight:800;
  border:1px solid transparent;
  transition:.2s ease;
  line-height:1;
  user-select:none;
}

.fanso-btn-primary{
  background:#cfb53b;
  color:#0b0f14;
}
.fanso-btn-primary:hover{ filter:brightness(1.05); transform: translateY(-1px); }

.fanso-btn-secondary{
  background: transparent;
  color:#e8eef6;
  border-color: rgba(232,238,246,.28);
}
.fanso-btn-secondary:hover{ border-color: rgba(232,238,246,.55); transform: translateY(-1px); }


/* =========================
   HERO
========================= */
.fanso-hero{
  position:relative;
  padding: clamp(72px, 9vw, 120px) 0;
  overflow:hidden;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.fanso-hero-bg{
  position:absolute;
  inset:0;
  background-image: var(--hero-bg);
  background-size: cover;
  background-position:center;
  filter: saturate(.9);
  transform: scale(1.02);
  z-index:0;
}
.fanso-hero-bg:after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(60% 70% at 70% 30%, rgba(0,0,0,.05), rgba(0,0,0,.35)),
    linear-gradient(90deg, rgba(0,0,0,.3) 0%, rgba(0,0,0,.1) 55%, rgba(0,0,0,.3) 100%);
}

.fanso-hero .fanso-hero-inner{
  position:relative;
  z-index:2;
  width:min(560px, 92vw);
}

.fanso-hero-logo{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-bottom:14px;
}

/* ロゴサイズ */
.fanso-lp .fanso-hero-logo img{
  width: auto !important;
  height: auto !important;
  max-width: min(520px, 86vw) !important;
  max-height: 140px !important;
  object-fit: contain;
  aspect-ratio: auto;
}

.fanso-hero-sub{
  margin:0;
  font-weight:800;
  color:#cfb53b;
  letter-spacing:.12em;
  font-size:12px;
}

.fanso-hero-target{
  margin:0 0 10px;
  color: rgba(232,238,246,.88);
  font-weight:800;
  letter-spacing:.04em;
}

.fanso-hero-main{
  margin:0 0 14px;
  font-weight:900;
  letter-spacing:.02em;
  line-height:1.08;
  font-size: clamp(34px, 5.2vw, 54px);
}

.fanso-hero-lead{
  margin:0 0 18px;
  color: rgba(232,238,246,.88);
  line-height:1.8;
}

.fanso-scroll{ margin-top:18px; }
.fanso-scroll-link{
  color: rgba(232,238,246,.8);
  text-decoration:none;
  font-weight:700;
}
.fanso-scroll-link:hover{ color:#fff; }


/* =========================
   WHAT 2カラム
========================= */
.fanso-what-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:18px;
  align-items:center;
  margin-top:14px;
}
.fanso-what-visual img{
  width:100%;
  height:auto;
  display:block;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.20);
}
@media (max-width:900px){
  .fanso-what-grid{ grid-template-columns:1fr; }
  .fanso-what-visual{ order:2; }
}


/* =========================
   DIAG 診断
========================= */
.fanso-diagnosis{
  display:grid;
  gap:12px;
}

.fanso-check{
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.18);
}
.fanso-check input{ transform: translateY(3px); }
.fanso-check span{ line-height:1.6; color: rgba(232,238,246,.88); }

.fanso-result{
  margin-top:14px;
  padding:16px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.22);
}


/* =========================
   WHY アコーディオン
========================= */
.fanso-accordion{
  margin-top:16px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  overflow:hidden;
  background: rgba(255,255,255,.04);
}

.fanso-accordion-summary{
  list-style:none;
  cursor:pointer;
  padding:16px 18px;
  font-weight:900;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.fanso-accordion summary::-webkit-details-marker{ display:none; }
.fanso-accordion-summary:after{ content:"+"; font-weight:900; opacity:.85; }
.fanso-accordion[open] .fanso-accordion-summary:after{ content:"−"; }

.fanso-accordion-body{
  padding:0 18px 18px;
  color: rgba(232,238,246,.86);
  line-height:1.85;
}

/* WHY 内部 2カラム */
.fanso-why-grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:18px;
  align-items:center;
}
.fanso-why-visual img{
  width:100%;
  height:auto;
  display:block;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.20);
}
@media (max-width:900px){
  .fanso-why-grid{ grid-template-columns:1fr; }
}


/* =========================
   FOUNDER 代表
========================= */
.fanso-founder-grid{
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 32px;
  align-items: center;
  margin-top: 18px;
}

.fanso-founder-nameblock{
  margin-top: 16px;
  display: flex;
  align-items: baseline;
  gap: 12px;
}

.fanso-founder-role{
  font-size: 12px;
  letter-spacing: .12em;
  color: #cfb53b;
  font-weight: 700;
  text-transform: uppercase;
}

.fanso-founder-name{
  font-size: 18px;
  color: #e8eef6;
}

.fanso-founder-media{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.fanso-founder-media img{
  width: 260px;
  height: 260px;
  object-fit: cover;
  border-radius: 999px;
  position: relative;
  z-index: 2;
}

.fanso-founder-media::before{
  content: "";
  position: absolute;
  width: 290px;
  height: 290px;
  border-radius: 999px;
  background: radial-gradient(
    circle,
    rgba(207,181,59,.35) 0%,
    rgba(207,181,59,.15) 40%,
    rgba(207,181,59,0) 70%
  );
  filter: blur(20px);
  z-index: 1;
}

@media (max-width: 860px){
  .fanso-founder-grid{ grid-template-columns: 1fr; gap: 24px; }
  .fanso-founder-media img{ width: 200px; height: 200px; }
  .fanso-founder-media::before{ width: 220px; height: 220px; }
}


/* =========================
   PLAN 価格
========================= */
.fanso-price-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:16px;
  margin-top:18px;
}
@media (max-width:900px){
  .fanso-price-grid{ grid-template-columns:1fr; }
}

.fanso-price-label{ margin:0; color:#cfb53b; font-weight:900; letter-spacing:.08em; font-size:12px; }
.fanso-price{ display:flex; align-items:baseline; gap:6px; margin:8px 0 6px; }
.fanso-price-num{ font-size:48px; font-weight:1000; letter-spacing:.02em; }
.fanso-price-yen{ font-size:16px; font-weight:900; opacity:.9; }
.fanso-price-tax{ font-size:12px; opacity:.85; }
.fanso-price-meta{ margin:0; color: rgba(232,238,246,.86); line-height:1.8; }
.fanso-note{ margin:10px 0 0; font-size:12px; color: rgba(232,238,246,.72); line-height:1.7; }

.fanso-monitor-badge{
  margin: 10px 0 14px;
  padding: 10px 14px;
  display: inline-block;
  font-size: 13px;
  line-height: 1.5;
  letter-spacing: .08em;
  border: 1px solid rgba(207,181,59,.65);
  border-radius: 14px;
  color: #cfb53b;
  background: rgba(207,181,59,.08);
}

.fanso-monitor-reason{
  margin: 12px 0 0;
  font-size: 13px;
  color: rgba(232,238,246,.72);
  line-height: 1.7;
}

.fanso-monitor-flow{
  margin: 14px 0 0;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.18);
  font-size: 13px;
  color: rgba(232,238,246,.82);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.fanso-flow-dot{
  width: 8px; height: 8px;
  border-radius: 999px;
  background: #cfb53b;
  display: inline-block;
}

.fanso-flow-sep{ opacity: .7; }

.fanso-mini-note{
  margin: 12px 0 0;
  font-size: 12px;
  color: rgba(232,238,246,.66);
  line-height: 1.7;
}

/* steps */
.fanso-steps{ display:grid; gap:14px; margin-top:10px; }
.fanso-step{ display:flex; gap:14px; }
.fanso-step-no{
  width:44px; height:44px;
  border-radius:14px;
  background: rgba(207,181,59,.18);
  border:1px solid rgba(207,181,59,.35);
  display:flex; align-items:center; justify-content:center;
  font-weight:1000;
  color:#cfb53b;
  flex-shrink:0;
}


/* =========================
   SAMPLES
========================= */
.fanso-samples{ margin-top:34px; }
.fanso-sample-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
  margin-top:16px;
}
@media (max-width:768px){
  .fanso-sample-grid{ grid-template-columns:1fr; }
}

.fanso-sample-item{
  display:block;
  position:relative;
  overflow:hidden;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.25);
}

.fanso-sample-item img{
  width:100%;
  height:auto;
  display:block;
  transition: transform .45s cubic-bezier(.4,0,.2,1);
}

.fanso-sample-item.is-hover img,
.fanso-sample-item:hover img{
  transform: scale(1.05);
}

/* オーバーレイ */
.fanso-sample-item::after{
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(13,13,13,.75) 0%, transparent 55%);
  opacity: 0;
  transition: opacity .35s ease;
  pointer-events: none;
}
.fanso-sample-item.is-hover::after,
.fanso-sample-item:hover::after{ opacity: 1; }

/* 「サンプルを見る →」スライドイン */
.fanso-sample-cta{
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 14px 16px;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .04em;
  transform: translateY(10px);
  opacity: 0;
  transition: transform .35s cubic-bezier(.4,0,.2,1), opacity .35s ease;
  z-index: 2;
  pointer-events: none;
}
.fanso-sample-item.is-hover .fanso-sample-cta,
.fanso-sample-item:hover .fanso-sample-cta{
  transform: translateY(0);
  opacity: 1;
}

.fanso-sample-badge{
  position:absolute;
  top:10px; left:10px;
  background: rgba(11,15,20,.75);
  color:#cfb53b;
  font-size:11px;
  font-weight:700;
  padding:4px 10px;
  border-radius:999px;
  z-index:2;
  transition: transform .35s ease;
}
.fanso-sample-item.is-hover .fanso-sample-badge,
.fanso-sample-item:hover .fanso-sample-badge{
  transform: translateY(-4px);
}


/* =========================
   EXTEND 拡張
========================= */
.fanso-grid3{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:14px;
  margin-top:18px;
}
@media (max-width:900px){
  .fanso-grid3{ grid-template-columns:1fr; }
}

.fanso-linkcard{
  color:inherit;
  text-decoration:none;
  position:relative;
  overflow:hidden;
}
.fanso-linkcard:hover{ transform: translateY(-2px); transition:.2s ease; }
.fanso-link{ display:inline-block; margin-top:10px; font-weight:900; color:#cfb53b; }

.fanso-service-logo img{
  height:42px;
  width:auto;
  display:block;
  margin-bottom:12px;
}
@media (max-width:768px){
  .fanso-service-logo img{ height:36px; }
}

/* final CTA */
.fanso-final{
  margin-top:26px;
  padding:22px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.12));
}


/* =========================
   Floating CTA (mobile)
========================= */
.fanso-floating{
  position:fixed;
  left:50%;
  bottom:14px;
  transform: translateX(-50%) translateY(16px);
  width:min(560px, 94vw);
  padding:10px;
  border-radius:18px;
  background: rgba(10,14,20,.78);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
  box-shadow: 0 22px 70px rgba(0,0,0,.55);
  display:flex;
  gap:10px;
  opacity:0;
  pointer-events:none;
  transition:.25s ease;
  z-index:9999;
}
.fanso-floating.is-show{
  opacity:1;
  transform: translateX(-50%) translateY(0);
  pointer-events:auto;
}
.fanso-floating .fanso-float-btn{
  flex:1;
  padding:12px;
  border-radius:14px;
  font-weight:1000;
  text-decoration:none;
  text-align:center;
  border:1px solid transparent;
}
.fanso-floating .primary{ background:#cfb53b; color:#0b0f14; }
.fanso-floating .secondary{
  background: transparent;
  color:#e8eef6;
  border-color: rgba(232,238,246,.28);
}
@media (min-width:769px){
  .fanso-floating{ display:none; }
}


/* =========================
   SVG 分断→線
========================= */
.fanso-linewrap{
  margin-top:18px;
  padding:18px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.18);
}
.fanso-line-title{
  font-weight:900;
  margin:0 0 10px;
  color:rgba(232,238,246,.92);
}
.fanso-line-svg{
  width:100%;
  height:110px;
  display:block;
}

/* パス描画アニメーション */
.fanso-line-path{
  stroke:#cfb53b;
  stroke-width:3.5;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-dasharray: 800;
  stroke-dashoffset: 800;
  transition: stroke-dashoffset 1.4s cubic-bezier(.4,0,.2,1) .15s;
}
.fanso-linewrap.is-on .fanso-line-path{
  stroke-dashoffset: 0;
}

/* 点（分断）→ 消える */
.fanso-line-dot{
  transition: opacity .4s ease .1s;
}
.fanso-linewrap.is-on .fanso-line-dot{
  opacity: 0 !important;
}


/* =========================
   スクロール出現アニメーション
========================= */
.fanso-reveal{
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .6s cubic-bezier(.22,.68,0,1.2),
              transform .6s cubic-bezier(.22,.68,0,1.2);
}
.fanso-reveal.is-visible{
  opacity: 1;
  transform: translateY(0);
}
.fanso-reveal.delay-1{ transition-delay: .08s; }
.fanso-reveal.delay-2{ transition-delay: .16s; }
.fanso-reveal.delay-3{ transition-delay: .24s; }
.fanso-reveal.delay-4{ transition-delay: .32s; }
.fanso-reveal.delay-5{ transition-delay: .40s; }

@media (prefers-reduced-motion: reduce){
  .fanso-reveal{ opacity:1; transform:none; transition:none; }
}


/* =========================
   タイプライター カーソル点滅
========================= */
@keyframes fanso-blink{
  0%, 100%{ border-color: #cfb53b; }
  50%      { border-color: transparent; }
}
#fansoTypewriter{
  display: inline;
  border-right: 2px solid #cfb53b;
  animation: fanso-blink .75s step-end infinite;
  white-space: pre-wrap;
}


/* =========================
   診断 進捗バー
========================= */
.fanso-diag-progress{
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}
.fanso-diag-bar-wrap{
  flex: 1;
  height: 6px;
  background: rgba(255,255,255,.12);
  border-radius: 999px;
  overflow: hidden;
}
.fanso-diag-bar{
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #cfb53b, #F07B2E);
  border-radius: 999px;
  transition: width .35s cubic-bezier(.4,0,.2,1);
}
.fanso-diag-bar-num{
  font-size: 13px;
  color: #cfb53b;
  white-space: nowrap;
  min-width: 44px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* 診断結果 フェードイン */
#fansoDiagResult{
  transition: opacity .45s ease;
}


/* =========================
   ページ全体上書き（LP専用）
   page-id は環境に合わせて変更
========================= */
body.page-id-8,
body.page-id-8 #page,
body.page-id-8 .site,
body.page-id-8 #content,
body.page-id-8 .site-content,
body.page-id-8 main,
body.page-id-8 article{
  background:#0b0f14 !important;
  color:#e8eef6 !important;
}

body.page-id-8 #content,
body.page-id-8 .site-content,
body.page-id-8 .content-area,
body.page-id-8 .site-main,
body.page-id-8 .container,
body.page-id-8 .wrap,
body.page-id-8 .inner,
body.page-id-8 .entry-content{
  max-width:none !important;
  width:100% !important;
}

body.page-id-8 .container,
body.page-id-8 .wrap,
body.page-id-8 .inner{
  padding-left:0 !important;
  padding-right:0 !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

body.page-id-8 .fanso-container{
  width:min(1100px, 92vw) !important;
  margin:0 auto !important;
}

body.page-id-8 header.entry-header,
body.page-id-8 .entry-header,
body.page-id-8 .page-header,
body.page-id-8 .post-header,
body.page-id-8 .entry-meta,
body.page-id-8 .post-meta,
body.page-id-8 .breadcrumb,
body.page-id-8 .breadcrumbs,
body.page-id-8 .pankuzu,
body.page-id-8 .archive-header,
body.page-id-8 .cat-links,
body.page-id-8 .tags-links{
  display:none !important;
}

body.page-id-8 .fanso-lp{
  background:#0b0f14 !important;
  color:#e8eef6 !important;
}


/* =========================
   lp-standard テンプレート用
   1カラム化 & 余計なUI非表示
========================= */
body[class*="lp-standard"] .entry-header,
body[class*="lp-standard"] .page-header,
body[class*="lp-standard"] .entry-title,
body[class*="lp-standard"] .page-title,
body[class*="lp-standard"] .breadcrumb,
body[class*="lp-standard"] .breadcrumbs,
body[class*="lp-standard"] .vk_breadcrumb,
body[class*="lp-standard"] .vk_post_title{ display: none !important; }

body[class*="lp-standard"] .widget-area,
body[class*="lp-standard"] .sidebar,
body[class*="lp-standard"] .l-sidebar,
body[class*="lp-standard"] .site-sidebar,
body[class*="lp-standard"] aside{ display: none !important; }

body[class*="lp-standard"] .site-content,
body[class*="lp-standard"] .content-area,
body[class*="lp-standard"] #primary,
body[class*="lp-standard"] .l-main,
body[class*="lp-standard"] main#main{
  width: 100% !important;
  max-width: none !important;
  flex: 0 0 100% !important;
}

body[class*="lp-standard"] .site-content,
body[class*="lp-standard"] .content,
body[class*="lp-standard"] .container,
body[class*="lp-standard"] .entry-content{ margin: 0 !important; }

body[class*="lp-standard"] .wp-block-group,
body[class*="lp-standard"] .wp-block-cover,
body[class*="lp-standard"] .wp-block{ max-width: none !important; }

body[class*="lp-standard"] .site-main,
body[class*="lp-standard"] .entry-content{ padding-top: 0 !important; }

/* =========================
   lp-standard テンプレート用
   1カラム化 & 余計なUI非表示
========================= */
body[class*="lp-standard"] .entry-header,
body[class*="lp-standard"] .page-header,
body[class*="lp-standard"] .entry-title,
body[class*="lp-standard"] .page-title,
body[class*="lp-standard"] .breadcrumb,
body[class*="lp-standard"] .breadcrumbs,
body[class*="lp-standard"] .vk_breadcrumb,
body[class*="lp-standard"] .vk_post_title{ display: none !important; }

body[class*="lp-standard"] .widget-area,
body[class*="lp-standard"] .sidebar,
body[class*="lp-standard"] .l-sidebar,
body[class*="lp-standard"] .site-sidebar,
body[class*="lp-standard"] aside{ display: none !important; }

body[class*="lp-standard"] .site-content,
body[class*="lp-standard"] .content-area,
body[class*="lp-standard"] #primary,
body[class*="lp-standard"] .l-main,
body[class*="lp-standard"] main#main{
  width: 100% !important;
  max-width: none !important;
  flex: 0 0 100% !important;
}

body[class*="lp-standard"] .site-content,
body[class*="lp-standard"] .content,
body[class*="lp-standard"] .container,
body[class*="lp-standard"] .entry-content{ margin: 0 !important; }

body[class*="lp-standard"] .wp-block-group,
body[class*="lp-standard"] .wp-block-cover,
body[class*="lp-standard"] .wp-block{ max-width: none !important; }

body[class*="lp-standard"] .site-main,
body[class*="lp-standard"] .entry-content{ padding-top: 0 !important; }

/* ================================================
   FANSO SCROLL INDICATOR
================================================ */
.fanso-scroll-indicator {
  position: absolute;
  bottom: 36px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  z-index: 10;
  pointer-events: none;
  opacity: 1;
  transition: opacity .5s ease;
}
.fanso-scroll-indicator.is-hidden {
  opacity: 0;
}
.fanso-scroll-indicator__text {
  font-size: 11px;
  letter-spacing: .25em;
  color: rgba(245, 200, 66, 0.85);
  text-transform: uppercase;
  animation: fanso-scroll-text-pulse 2.4s ease-in-out infinite;
}
@keyframes fanso-scroll-text-pulse {
  0%, 100% { opacity: 0.85; }
  50%       { opacity: 0.4;  }
}
.fanso-scroll-indicator__line {
  position: relative;
  width: 1px;
  height: 52px;
  background: rgba(245, 200, 66, 0.2);
  overflow: hidden;
}
.fanso-scroll-indicator__line::after {
  content: '';
  position: absolute;
  top: -100%;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    #F5C842 40%,
    #F07B2E 100%
  );
  animation: fanso-scroll-line 1.8s cubic-bezier(.4, 0, .6, 1) infinite;
}
@keyframes fanso-scroll-line {
  0%   { top: -100%; opacity: 1; }
  80%  { top: 100%;  opacity: 1; }
  100% { top: 100%;  opacity: 0; }
}

/* HEROのoverflowをvisibleに */
.fanso-hero {
  overflow: visible !important;
}

@media (max-width: 768px) {
  .fanso-scroll-indicator {
    position: relative;
    bottom: auto;
    left: auto;
    transform: none;
    margin-top: 16px;
  }
}

/* =========================
FANSO Sample Catalog
========================= */
.fanso-catalog-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap:20px;
  margin-top:28px;
}

.fanso-catalog-card{
  display:flex;
  flex-direction:column;
  text-decoration:none;
  color:inherit;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(207,181,59,.15);
  border-radius: 18px;
  overflow:hidden;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
  position:relative;
}

.fanso-catalog-card:hover{
  transform: translateY(-2px);
  border-color: rgba(207,181,59,.38);
  background: rgba(207,181,59,.06);
}

.fanso-catalog-card img{
  width:100%;
  height:auto;
  display:block;
  background:#111;
}

.fanso-catalog-body{
  padding:16px 16px 18px;
}

.fanso-catalog-badge{
  position:absolute;
  top:12px;
  left:12px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  padding:7px 12px;
  border-radius:999px;
  background:#cfb53b;
  color:#0b0f14;
  font-size:12px;
  font-weight:900;
  letter-spacing:.06em;
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
}

.fanso-catalog-link{
  display:inline-block;
  margin-top:12px;
  font-size:13px;
  font-weight:800;
  color:#cfb53b;
}

/* =========================
FANSO Sample Catalog
PC:4列 / Tablet:3列 / SP:2列
========================= */
.fanso-catalog-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:18px;
  margin-top:28px;
}

@media (max-width: 1100px){
  .fanso-catalog-grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 680px){
  .fanso-catalog-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:12px;
  }
}

.fanso-catalog-card{
  display:flex;
  flex-direction:column;
  text-decoration:none;
  color:inherit;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(207,181,59,.15);
  border-radius: 18px;
  overflow:hidden;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
  position:relative;
  min-width:0;
}

.fanso-catalog-card:hover{
  transform: translateY(-2px);
  border-color: rgba(207,181,59,.38);
  background: rgba(207,181,59,.06);
}

.fanso-catalog-card img{
  width:100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display:block;
  background:#111;
}

.fanso-catalog-body{
  padding:14px 14px 16px;
}

.fanso-catalog-badge{
  position:absolute;
  top:10px;
  left:10px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background:#cfb53b;
  color:#0b0f14;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
}

.fanso-catalog-link{
  display:inline-block;
  margin-top:10px;
  font-size:12px;
  font-weight:800;
  color:#cfb53b;
}

@media (max-width:680px){
  .fanso-catalog-body{
    padding:10px 10px 12px;
  }
  .fanso-catalog-body .fanso-h3{
    font-size:14px;
    line-height:1.4;
    margin-bottom:4px;
  }
  .fanso-catalog-body .fanso-p{
    font-size:12px;
    line-height:1.55;
  }
  .fanso-catalog-link{
    font-size:11px;
  }
}
/* カードからはみ出した画像を隠す */
.fanso-catalog-card{
  overflow:hidden;
}

/* 通常は少しズームして中央トリミング */
.fanso-catalog-card img{
  width:100%;
  aspect-ratio:3/4;
  object-fit:cover;
  display:block;
  transform:scale(1.3);
  transition:transform .6s cubic-bezier(.22,.61,.36,1);
}

/* hoverで画像全体を表示 */
.fanso-catalog-card:hover img{
  transform:scale(1);
}
/* =========================
FANSO Catalog Hover UI
========================= */

/* カード */
.fanso-catalog-card{
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(207,181,59,.15);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.fanso-catalog-card:hover{
  transform: translateY(-4px);
  border-color: rgba(207,181,59,.4);
  box-shadow: 0 18px 40px rgba(0,0,0,.35);
}

/* 画像 */
.fanso-catalog-card img{
  width: 100%;
  height: 320px;
  object-fit: cover;
  display: block;
  transform: scale(1.18);
  transition:
    transform .55s cubic-bezier(.22,.61,.36,1),
    filter .35s ease;
}

/* hoverで少し引いて見せる */
.fanso-catalog-card:hover img{
  transform: scale(1.02);
  filter: brightness(.55);
}

/* サンプルを見るのオーバーレイ */
.fanso-catalog-card::after{
  content: "サンプルを見る";
  position: absolute;
  left: 50%;
  top: 42%;
  transform: translate(-50%, 12px);
  padding: 12px 18px;
  border-radius: 999px;
  background: rgba(10,14,20,.78);
  border: 1px solid rgba(232,238,246,.18);
  color: #e8eef6;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .06em;
  opacity: 0;
  transition: all .28s ease;
  z-index: 3;
  pointer-events: none;
  backdrop-filter: blur(8px);
}

.fanso-catalog-card:hover::after{
  opacity: 1;
  transform: translate(-50%, 0);
}

/* バッジ */
.fanso-catalog-badge{
  position:absolute;
  top:10px;
  left:10px;
  z-index:4;
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background:#cfb53b;
  color:#0b0f14;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
}

/* 本文部分 */
.fanso-catalog-body{
  position: relative;
  z-index: 2;
  padding: 14px 14px 16px;
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
}

.fanso-catalog-link{
  display:inline-block;
  margin-top:10px;
  font-size:12px;
  font-weight:800;
  color:#cfb53b;
}

/* PC4列 / tablet3列 / SP2列 */
.fanso-catalog-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:18px;
  margin-top:28px;
}

@media (max-width:1100px){
  .fanso-catalog-grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width:680px){
  .fanso-catalog-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:12px;
  }

  .fanso-catalog-card img{
    height: 220px;
    transform: scale(1.1);
  }

  .fanso-catalog-card::after{
    display:none; /* スマホはhover無いので消す */
  }

  .fanso-catalog-body{
    padding:10px 10px 12px;
  }

  .fanso-catalog-body .fanso-h3{
    font-size:14px;
    line-height:1.4;
    margin-bottom:4px;
  }

  .fanso-catalog-body .fanso-p{
    font-size:12px;
    line-height:1.55;
  }

  .fanso-catalog-link{
    font-size:11px;
  }
}

/* ===== MEO 料金早見ブロック ===== */
.fanso-meo-summary-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:16px;
  margin-top:24px;
  max-width:900px;
}

.fanso-meo-summary-card{
  display:flex;
  flex-direction:column;
}

.fanso-meo-summary-card--gold{
  border-color: rgba(207,181,59,.4) !important;
  background: rgba(207,181,59,.06) !important;
}

.fanso-meo-summary-price{
  font-size: clamp(24px, 3vw, 34px);
  font-weight: 900;
  line-height: 1.1;
  color: #fff;
  margin: 4px 0 0;
}

@media (max-width: 900px){
  .fanso-meo-summary-grid{
    grid-template-columns: 1fr;
  }
}


  color: #fff;.fanso-event-wrap{
  display:flex;
  align-items:center;
  gap:40px;
  margin-top:28px;
}

.fanso-event-text{
  flex:1;
}

.fanso-event-title{
  margin:0 0 14px;
  font-size:clamp(26px, 3vw, 42px);
  line-height:1.2;
}

.fanso-event-content{
  color:#e8eef6;
}

.fanso-event-image{
  flex:1;
  text-align:center;
}

.fanso-event-image img{
  width:100%;
  max-width:520px;
  height:auto;
  display:block;
  margin:0 auto;
  border-radius:14px;
}

@media (max-width: 768px){
  .fanso-event-wrap{
    flex-direction:column;
    align-items:flex-start;
    gap:20px;
  }

  .fanso-event-image{
    width:100%;
  }

  .fanso-event-image img{
    max-width:100%;
  }
}
.fanso-event-wrap{
  display:flex;
  align-items:center;
  gap:40px;
  margin-top:28px;
}

.fanso-event-text{
  flex:1;
}

.fanso-event-title{
  margin:0 0 14px;
  font-size:clamp(26px, 3vw, 42px);
  line-height:1.2;
}

.fanso-event-content{
  color:#e8eef6;
}

.fanso-event-image{
  flex:1;
  text-align:center;
}

.fanso-event-image img{
  width:100%;
  max-width:520px;
  height:auto;
  display:block;
  margin:0 auto;
  border-radius:14px;
}

@media (max-width: 768px){
  .fanso-event-wrap{
    flex-direction:column;
    align-items:flex-start;
    gap:20px;
  }

  .fanso-event-image{
    width:100%;
  }

  .fanso-event-image img{
    max-width:100%;
  }
}

.fanso-event-wrap{
  display:grid;
  grid-template-columns: minmax(280px, 1fr) minmax(320px, 520px);
  align-items:center;
  gap:40px;
  margin-top:28px;
}

.fanso-event-text{
  min-width:0;
}

.fanso-event-title{
  margin:0;
  font-size:clamp(28px, 4vw, 56px);
  line-height:1.15;
  word-break:break-word;
}

.fanso-event-image{
  width:100%;
}

.fanso-event-image img{
  width:100%;
  max-width:520px;
  height:auto;
  display:block;
  margin-left:auto;
  border-radius:16px;
}

@media (max-width: 768px){
  .fanso-event-wrap{
    grid-template-columns: 1fr;
    gap:20px;
  }

  .fanso-event-image img{
    margin:0 auto;
    max-width:100%;
  }
}
.fanso-linker-block{
display:grid;
grid-template-columns: 420px 1fr;
gap:40px;
align-items:center;
margin-top:40px;
}

.fanso-linker-image img{
width:100%;
height:auto;
border-radius:12px;
display:block;
}

.fanso-linker-points{
display:grid;
gap:10px;
}

.fanso-linker-item{
padding:10px 14px;
border-radius:10px;
background:rgba(0,0,0,.2);
border:1px solid rgba(255,255,255,.06);
font-size:13px;
}

/* スマホ */

@media(max-width:768px){

.fanso-linker-block{
grid-template-columns:1fr;
gap:24px;
}

}

.fanso-status-wrap{
  display:inline-flex;
  align-items:center;
  gap:12px;
  background:#1e1e1e;
  padding:14px 28px;
  border-radius:50px;
  font-size:1rem;
  font-weight:bold;
  color:#fff;
  letter-spacing:1px;
}
.fanso-open .fanso-dot,
.fanso-open .fanso-dot-ring {
  background-color: #27ae60 !important;
}

.fanso-close .fanso-dot,
.fanso-close .fanso-dot-ring {
  background-color: #e74c3c !important;
}
.fanso-dot-ring {
  animation: fanso-pulse 2s ease-out infinite;
  opacity: .5;
}