/* =========================================================
   あさか卓球 テーマ装飾CSS（やわらか版 v2）
   ブロックの className に対してスタイルを当てています
   ========================================================= */

:root{
  --cream:#fffaf2;
  --paper:#ffffff;
  --teal:#1bb89a;
  --teal-d:#129e83;
  --teal-soft:#e4f7f2;
  --coral:#ff7a59;
  --coral-d:#ff6a45;
  --coral-soft:#ffeee8;
  --sun:#ffc24b;
  --navy:#33424f;
  --muted:#7b8893;
  --line:#f0e9dc;
  --radius:24px;
  --radius-s:16px;
  --shadow:0 18px 40px rgba(51,66,79,.08);
  --shadow-sm:0 8px 22px rgba(51,66,79,.07);
}

body{ -webkit-font-smoothing:antialiased; }

/* ---------- ボタン ---------- */
.wp-block-button__link{
  box-shadow:0 8px 18px rgba(255,122,89,.32);
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.wp-block-button__link:hover{ transform:translateY(-2px); box-shadow:0 12px 24px rgba(255,122,89,.4); }
/* ティールボタン */
.wp-block-button.is-style-teal .wp-block-button__link{ background:var(--teal) !important; box-shadow:0 8px 18px rgba(27,184,154,.3); }
.wp-block-button.is-style-teal .wp-block-button__link:hover{ background:var(--teal-d) !important; }
/* 白ボタン */
.wp-block-button.is-style-white .wp-block-button__link{ background:#fff !important; color:var(--teal-d) !important; box-shadow:0 10px 24px rgba(0,0,0,.12); }
/* ゴースト（枠線） */
.wp-block-button.is-style-ghost .wp-block-button__link{
  background:#fff !important; color:var(--navy) !important;
  border:2px solid var(--line); box-shadow:none;
}
.wp-block-button.is-style-ghost .wp-block-button__link:hover{ border-color:var(--teal); color:var(--teal) !important; transform:translateY(-2px); }

/* ---------- ヘッダー ---------- */
.asaka-header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding-top:14px; padding-bottom:14px;
  background:#fff; box-shadow:0 2px 14px rgba(51,66,79,.07);
  transition:box-shadow .3s ease, padding .3s ease;
}
.asaka-header.is-scrolled{
  box-shadow:0 6px 24px rgba(51,66,79,.1);
  padding-top:10px; padding-bottom:10px;
}
/* ログイン中の管理バーぶんだけ固定ヘッダーを下げる */
.admin-bar .asaka-header{ top:32px; }
@media screen and (max-width:782px){ .admin-bar .asaka-header{ top:46px; } }
/* スマホ：ヘッダーをロゴ＋予約＋メニュー(ハンバーガー)の1列に整理 */
@media (max-width:781px){
  .asaka-header .wp-block-group{ gap:8px; align-items:center; flex-wrap:nowrap; }
  .asaka-header .asaka-logo-img img{ height:38px; }
  .asaka-header .wp-block-buttons{ gap:6px; }
  .asaka-header .wp-block-button .wp-block-button__link{ padding:8px 14px !important; font-size:13px; }
  /* お問い合わせボタンはハンバーガーメニュー内に集約（バーからは隠す） */
  .asaka-header .wp-block-buttons .wp-block-button:last-child{ display:none; }
}
/* PC：予約/お問い合わせはボタンで出すので、ナビ内の重複リンクは隠す（モバイルのメニュー内にだけ表示） */
@media (min-width:782px){
  .asaka-header .wp-block-navigation a[href*="/yoyaku"],
  .asaka-header .wp-block-navigation a[href*="/contact"]{ display:none !important; }
}
/* サイトタイトルをワードマーク風に（丸い卓球ボールマーク付き） */
.asaka-header .wp-block-site-title{ font-family:"Zen Maru Gothic",sans-serif; font-weight:900; }
.asaka-header .wp-block-site-title a{
  color:var(--navy); text-decoration:none; display:inline-flex; align-items:center; gap:10px;
}
.asaka-header .wp-block-site-title a::before{
  content:""; width:34px; height:34px; border-radius:50%; flex:none;
  background:radial-gradient(circle at 34% 30%, #fff 0%, #ffe2a6 28%, var(--sun) 72%);
  box-shadow:0 6px 14px rgba(255,194,75,.5);
}
.asaka-header .wp-block-navigation{ font-family:"Zen Maru Gothic",sans-serif; }
.asaka-header .wp-block-navigation a{ color:var(--navy); font-weight:700; }
.asaka-header .wp-block-navigation a:hover{ color:var(--teal); }
.asaka-header .wp-block-site-logo img{ max-height:48px; width:auto; }
/* ロゴ画像（ワードマーク） */
.asaka-header .asaka-logo-img{ margin:0; }
.asaka-header .asaka-logo-img img{ height:52px; width:auto; display:block; }
@media (max-width:781px){ .asaka-header .asaka-logo-img img{ height:42px; } }

/* ---------- ヒーロー ---------- */
.asaka-hero{
  position:relative; min-height:56vh; display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
  overflow:hidden; padding-top:130px; padding-bottom:70px;
}
.asaka-hero::before{
  content:""; position:absolute; width:380px; height:380px; border-radius:50%;
  background:var(--teal-soft); left:-90px; top:80px; filter:blur(6px); z-index:0; opacity:.8;
}
.asaka-hero::after{
  content:""; position:absolute; width:300px; height:300px; border-radius:50%;
  background:var(--coral-soft); right:5%; bottom:-60px; filter:blur(6px); z-index:0; opacity:.85;
}
.asaka-hero > *{ position:relative; z-index:2; }
.asaka-tag{
  display:inline-flex; align-items:center; gap:8px;
  background:#fff; border:1px solid var(--line); padding:8px 16px;
  border-radius:999px; font-size:13px; font-weight:700; color:var(--teal-d);
  box-shadow:var(--shadow-sm);
}
.asaka-tag::before{ content:""; width:8px; height:8px; border-radius:50%; background:var(--teal); }
.asaka-hero h1 .asaka-hl{ color:var(--teal); position:relative; }
.asaka-hero h1 .asaka-hl2{ color:var(--coral); }
.asaka-lead{ color:var(--muted); max-width:520px; }
.asaka-area-pills .wp-block-button__link{
  background:#fff !important; color:var(--navy) !important; border:1px solid var(--line);
  box-shadow:none; padding:6px 16px !important; font-size:13px; pointer-events:none;
}
.asaka-area-label{ color:var(--muted); font-weight:700; font-size:13px; }

/* ヒーローのイラスト（卓球台＋ボール） */
.asaka-hero-art{ position:relative; min-height:360px; }
.asaka-hero-art .asaka-badge:nth-of-type(1){ position:absolute; left:0; top:54px; }
.asaka-hero-art .asaka-badge:nth-of-type(2){ position:absolute; right:0; bottom:54px; }
.asaka-hero-art::before{
  content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:300px; height:300px; border-radius:44px;
  background:linear-gradient(160deg,#eafaf5,#fff); box-shadow:var(--shadow);
}
.asaka-hero-art::after{
  content:""; position:absolute; left:50%; top:46%; transform:translate(-50%,-50%);
  width:84px; height:84px; border-radius:50%;
  background:radial-gradient(circle at 34% 30%, #fff 0%, #ffe2a6 30%, var(--sun) 75%);
  box-shadow:0 18px 36px rgba(255,194,75,.5); animation:asaka-bob 4s ease-in-out infinite;
}
@keyframes asaka-bob{ 0%,100%{transform:translate(-50%,-50%)} 50%{transform:translate(-50%,-62%)} }
.asaka-badge{
  position:relative; z-index:3; display:inline-flex; align-items:center; gap:10px;
  background:#fff; border-radius:18px; box-shadow:var(--shadow-sm);
  padding:12px 16px; font-weight:700; font-size:14px; width:max-content;
}
.asaka-badge .asaka-badge-ic{
  width:34px; height:34px; border-radius:12px; display:grid; place-items:center; font-size:18px;
  background:var(--teal-soft);
}
.asaka-badge.is-coral .asaka-badge-ic{ background:var(--coral-soft); }

/* ---------- セクション見出し ---------- */
.asaka-sec-head{ text-align:center; }
.asaka-sec-head .asaka-en{
  display:block; color:var(--coral); font-weight:700; font-size:14px;
  font-family:"Baloo 2",sans-serif; letter-spacing:.04em; margin-bottom:6px;
}
.asaka-sec-head h2{ margin:0; }
.asaka-sec-head h2 .asaka-u{ background:linear-gradient(transparent 70%, rgba(27,184,154,.25) 70%); }
.asaka-sec-head p{ color:var(--muted); margin-top:10px; }

/* ---------- 特長カード ---------- */
.asaka-feat{
  padding:38px 28px; border-radius:var(--radius); background:var(--cream);
  text-align:center; transition:transform .3s ease, box-shadow .3s ease; height:100%;
}
.asaka-feat:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.asaka-feat .asaka-ic{
  width:84px; height:84px; border-radius:50%; display:grid; place-items:center;
  font-size:38px; margin:0 auto 14px; background:var(--teal-soft);
}
.asaka-feat.is-coral .asaka-ic{ background:var(--coral-soft); }
.asaka-feat.is-sun .asaka-ic{ background:#fff2d4; }
.asaka-feat h3{ margin:.3em 0 .3em; }
.asaka-feat p{ color:var(--muted); margin:0; font-size:14.5px; }

/* ---------- サービスカード ---------- */
.asaka-svc{
  position:relative;
  background:var(--paper); border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow-sm); transition:transform .3s ease, box-shadow .3s ease; height:100%;
}
.asaka-svc:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.asaka-svc-link{ position:absolute; inset:0; z-index:3; }
.asaka-svc .asaka-svc-top{
  height:130px; display:flex; align-items:center; justify-content:center;
  font-size:46px; position:relative; overflow:hidden; background:var(--teal-soft); margin:0;
}
.asaka-svc.is-coral .asaka-svc-top{ background:var(--coral-soft); }
.asaka-svc.is-sun .asaka-svc-top{ background:#fff2d4; }
.asaka-svc.is-sky .asaka-svc-top{ background:#e8f4fb; }
.asaka-svc .asaka-svc-top::after{
  content:""; position:absolute; width:110px; height:110px; border-radius:50%;
  background:rgba(255,255,255,.45); right:-34px; bottom:-34px;
}
.asaka-svc .asaka-svc-body{ padding:22px 24px; }
.asaka-svc h3{ margin:0 0 .2em; display:flex; align-items:center; justify-content:space-between; }
.asaka-svc .asaka-arrow{ color:var(--coral); transition:transform .25s ease; }
.asaka-svc:hover .asaka-arrow{ transform:translateX(5px); }
.asaka-svc p{ color:var(--muted); margin:0; font-size:13.5px; }

/* ---------- お知らせ ---------- */
.asaka-news-wrap{
  max-width:800px; margin-left:auto; margin-right:auto;
  background:#fff; border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:8px 30px;
}
.asaka-news-wrap .wp-block-post-template{ margin:0; padding:0; list-style:none; }
.asaka-news-item, .asaka-news-wrap .wp-block-post-template > li{
  display:flex; gap:20px; align-items:center; flex-wrap:wrap;
  padding:20px 4px; border-bottom:1px solid var(--line); margin:0;
}
.asaka-news-item:last-child, .asaka-news-wrap .wp-block-post-template > li:last-child{ border-bottom:none; }
.asaka-news-item:hover .asaka-ttl{ color:var(--teal); }
.asaka-date{ font-family:"Baloo 2",sans-serif; font-weight:700; color:var(--muted); font-size:14px; min-width:104px; }
.asaka-cat{ background:var(--teal); color:#fff; font-size:11px; font-weight:700; padding:4px 13px; border-radius:999px; }
.asaka-cat.is-event{ background:var(--coral); }
.asaka-ttl{ flex:1; font-weight:700; min-width:200px; color:var(--navy); text-decoration:none; }
.asaka-ttl:hover{ color:var(--teal); }
/* 投稿ループ版（実データ表示時） */
.asaka-news-wrap .wp-block-post-title{ margin:0; font-size:16px; flex:1; min-width:200px; }
.asaka-news-wrap .wp-block-post-title a{ color:var(--navy); font-weight:700; text-decoration:none; }
.asaka-news-wrap .wp-block-post-title a:hover{ color:var(--teal); }
.asaka-news-wrap .wp-block-post-date{ font-family:"Baloo 2",sans-serif; color:var(--muted); font-size:14px; min-width:104px; margin:0; }

/* ---------- 店舗情報 ---------- */
.asaka-info-card{
  background:var(--paper); border-radius:var(--radius); padding:38px;
  box-shadow:var(--shadow-sm); height:100%;
}
.asaka-info-card h3{ display:flex; align-items:center; gap:22px; margin:0 0 18px; }
.asaka-info-card h3::before{
  content:""; width:8px; height:8px; border-radius:50%; background:var(--coral);
  box-shadow:14px 0 0 var(--sun), 28px 0 0 var(--teal);
}
.asaka-info-row{ display:flex; gap:16px; padding:13px 0; border-bottom:1px dashed var(--line); }
.asaka-info-row:last-child{ border-bottom:none; }
.asaka-info-row .asaka-k{ font-weight:700; min-width:80px; color:var(--navy); }
.asaka-info-row .asaka-v{ color:var(--muted); }
.asaka-map{ border-radius:var(--radius); overflow:hidden; min-height:330px; height:100%; background:var(--teal-soft); }
.asaka-map iframe{ width:100%; height:100%; min-height:330px; border:0; display:block; }

/* ---------- CTA ---------- */
.asaka-cta{
  border-radius:32px; padding:60px 40px !important; text-align:center; color:#fff;
  position:relative; overflow:hidden; box-shadow:0 24px 50px rgba(27,184,154,.3);
}
.asaka-cta::before{ content:""; position:absolute; width:240px; height:240px; border-radius:50%; background:rgba(255,255,255,.1); right:-60px; top:-60px; }
.asaka-cta::after{ content:""; position:absolute; width:180px; height:180px; border-radius:50%; background:rgba(255,194,75,.25); left:-50px; bottom:-50px; }
.asaka-cta > *{ position:relative; z-index:2; }
.asaka-cta h2, .asaka-cta p{ color:#fff; }
.asaka-cta .asaka-phone{
  font-family:"Baloo 2",sans-serif; font-weight:800; font-size:clamp(30px,5vw,48px);
  color:#fff; margin:0;
}
.asaka-cta .asaka-hours{ font-size:14px; color:rgba(255,255,255,.88); }

/* ---------- フッター ---------- */
.asaka-footer{ color:rgba(255,255,255,.72); }
.asaka-footer .wp-block-site-title a{ color:#fff; font-family:"Zen Maru Gothic",sans-serif; font-weight:900; text-decoration:none; }
.asaka-footer h4, .asaka-footer .wp-block-heading{ color:#fff; font-family:"Zen Maru Gothic",sans-serif; }
.asaka-footer a{ color:rgba(255,255,255,.65); text-decoration:none; transition:color .2s ease; }
.asaka-footer a:hover{ color:var(--sun); }
.asaka-footer .wp-block-navigation a:hover{ color:var(--sun); }
.asaka-socials a{
  display:inline-flex; width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,.1); align-items:center; justify-content:center;
  font-size:18px; color:#fff; transition:background .25s ease, transform .25s ease;
}
.asaka-socials a:hover{ background:var(--coral); transform:translateY(-3px); }
.asaka-copy{ text-align:center; font-size:13px; color:rgba(255,255,255,.42); }

/* ---------- スクロール表示アニメーション ---------- */
.asaka-reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease; }
.asaka-reveal.is-visible{ opacity:1; transform:none; }

/* ---------- 通常ページ・記事 ---------- */
.asaka-page-content{ padding-top:120px; padding-bottom:60px; }
.asaka-page-content .wp-block-post-title{ margin-bottom:.4em; }
/* 下層ページのカラム崩れ対策（テキスト列が潰れるので縦積みに統一） */
.asaka-page-content .wp-block-columns{ display:block !important; }
.asaka-page-content .wp-block-columns > .wp-block-column{ width:100% !important; flex-basis:100% !important; margin:0 0 22px !important; }
/* 右/左寄せ画像のフロートで本文が潰れるのを防ぐ（縦並びに） */
.asaka-page-content .wp-block-image.alignright,
.asaka-page-content .wp-block-image.alignleft{ float:none !important; margin-left:0 !important; margin-right:0 !important; max-width:100%; }
.asaka-page-content .wp-block-image img{ max-width:100%; height:auto; }
.asaka-page-content img{ height:auto; }

/* ---------- レスポンシブ ---------- */
@media (max-width:781px){
  .asaka-hero{ min-height:auto; padding-top:110px; }
  .asaka-hero-art{ min-height:300px; }
  .asaka-cta{ padding:48px 24px !important; }
}

/* hero immediate */
.asaka-hero.asaka-reveal{opacity:1;transform:none}