/*
  Skin Name: クポミル
  Description: クーポン情報サイト「クポミル」専用スキン。オレンジ×ブルーのブランドカラーとクーポンカードUIを実装。
  Skin URI: https://kupomiru.jp/
  Author: kupomiru
  Author URI: https://kupomiru.jp/
  Screenshot URI: https://kupomiru.jp/wp-content/themes/cocoon-child-master/skins/kupomiru/images/screenshot.png
  Version: 1.0.0
  Priority: 100
*/

/* ===========================================
   CSS カスタムプロパティ
   =========================================== */
:root {
  --kp-orange:        #FF8C00;
  --kp-orange-light:  #FFB347;
  --kp-orange-dark:   #E65100;
  --kp-orange-pale:   #FFF3E0;
  --kp-blue:          #1565C0;
  --kp-blue-light:    #42A5F5;
  --kp-blue-pale:     #E3F2FD;

  --kp-coupon-color:   #E53935;
  --kp-campaign-color: #7B1FA2;
  --kp-sale-color:     #2E7D32;

  --kp-white:   #FFFFFF;
  --kp-bg:      #F5F7FA;
  --kp-bg-warm: #FFFBF5;
  --kp-text:    #212529;
  --kp-text-sub:#555F6D;
  --kp-muted:   #8A94A6;
  --kp-border:  #E2E8F0;

  --kp-grad-main: linear-gradient(135deg, #FF8C00 0%, #FFB347 100%);
  --kp-grad-blue: linear-gradient(135deg, #1565C0 0%, #42A5F5 100%);
  --kp-grad-hero: linear-gradient(135deg, #FF8C00 0%, #FF6F00 45%, #1565C0 100%);

  --kp-shadow-sm:     0 1px 4px rgba(0,0,0,0.08);
  --kp-shadow-md:     0 4px 16px rgba(0,0,0,0.10);
  --kp-shadow-lg:     0 8px 32px rgba(0,0,0,0.14);
  --kp-shadow-orange: 0 4px 16px rgba(255,140,0,0.30);

  --kp-radius-sm: 6px;
  --kp-radius-md: 12px;
  --kp-radius-xl: 32px;

  --kp-font: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', sans-serif;
  --kp-mono: 'Courier New', 'Roboto Mono', monospace;
}


/* ===========================================
   ベース
   =========================================== */
body {
  background-color: var(--kp-bg) !important;
  font-family: var(--kp-font) !important;
  color: var(--kp-text) !important;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--kp-blue); transition: color 0.2s ease; }
a:hover { color: var(--kp-orange-dark); text-decoration: none; }

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--kp-bg); }
::-webkit-scrollbar-thumb { background: var(--kp-orange-light); border-radius: 3px; }


/* ===========================================
   ヘッダー
   =========================================== */
#site-header,
.site-header {
  background: var(--kp-white) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
  border-bottom: 3px solid var(--kp-orange) !important;
}

/* ロゴ */
.header-logo-image img,
#header-logo-image img {
  max-height: 58px !important;
  width: auto !important;
}

/* キャッチフレーズ */
.header-site-name-text {
  font-size: 0.85rem !important;
  color: var(--kp-text-sub) !important;
  display: block !important;
}

/* ヘッダー内検索 */
.header-search-form .search-text {
  border: 2px solid var(--kp-orange-light) !important;
  border-radius: var(--kp-radius-xl) !important;
  padding: 8px 18px !important;
  font-size: 0.9rem !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}
.header-search-form .search-text:focus {
  border-color: var(--kp-orange) !important;
  box-shadow: 0 0 0 3px rgba(255,140,0,0.15) !important;
  outline: none !important;
}
.header-search-form .search-submit {
  background: var(--kp-grad-main) !important;
  border: none !important;
  color: var(--kp-white) !important;
  border-radius: var(--kp-radius-xl) !important;
  padding: 8px 20px !important;
  cursor: pointer !important;
}


/* ===========================================
   グローバルナビ
   =========================================== */
#navi,
.navi-in,
.global-nav {
  background: var(--kp-white) !important;
  border-top: 1px solid var(--kp-border) !important;
}

.navi-in > ul > li > a {
  color: var(--kp-text) !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  padding: 14px 18px !important;
  border-bottom: 3px solid transparent !important;
  transition: color 0.2s, border-color 0.2s !important;
  display: block !important;
}

.navi-in > ul > li > a:hover,
.navi-in > ul > li.current-menu-item > a {
  color: var(--kp-orange) !important;
  border-bottom-color: var(--kp-orange) !important;
}

/* ドロップダウン */
.navi-in ul ul {
  background: var(--kp-white) !important;
  box-shadow: var(--kp-shadow-md) !important;
  border-top: 3px solid var(--kp-orange) !important;
  border-radius: 0 0 var(--kp-radius-sm) var(--kp-radius-sm) !important;
}
.navi-in ul ul li a {
  color: var(--kp-text) !important;
  font-size: 0.85rem !important;
  padding: 10px 18px !important;
}
.navi-in ul ul li a:hover {
  background: var(--kp-orange-pale) !important;
  color: var(--kp-orange-dark) !important;
}

/* ハンバーガーメニューボタン */
.menu-open-btn {
  color: var(--kp-orange) !important;
}


/* ===========================================
   ヒーローセクション
   =========================================== */
.kp-hero {
  background: var(--kp-grad-hero);
  color: var(--kp-white);
  padding: 64px 24px 56px;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.kp-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 50%, rgba(255,255,255,0.08) 0%, transparent 55%),
    radial-gradient(circle at 80% 20%, rgba(255,255,255,0.05) 0%, transparent 45%);
  pointer-events: none;
}

.kp-hero h1 {
  font-size: clamp(1.25rem, 3.5vw, 1.85rem);
  font-weight: 900;
  margin: 0 0 14px;
  line-height: 1.45;
  text-shadow: 0 2px 8px rgba(0,0,0,0.2);
  position: relative;
}

.kp-hero .lead {
  font-size: clamp(0.88rem, 2vw, 1.05rem);
  opacity: 0.92;
  margin: 0 0 32px;
  position: relative;
}

.kp-hero-search {
  display: flex;
  max-width: 560px;
  margin: 0 auto;
  gap: 8px;
  position: relative;
}

.kp-hero-search input[type="search"] {
  flex: 1;
  padding: 14px 24px;
  border: none;
  border-radius: var(--kp-radius-xl);
  font-size: 1rem;
  box-shadow: var(--kp-shadow-lg);
  outline: none;
  font-family: var(--kp-font);
}

.kp-hero-search button {
  padding: 14px 26px;
  background: var(--kp-orange-dark);
  color: var(--kp-white);
  border: none;
  border-radius: var(--kp-radius-xl);
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: var(--kp-shadow-orange);
  transition: transform 0.2s, opacity 0.2s;
  font-family: var(--kp-font);
  white-space: nowrap;
}

.kp-hero-search button:hover {
  transform: translateY(-1px);
  opacity: 0.9;
}

.kp-category-links {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 28px;
  position: relative;
}

.kp-category-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 20px;
  background: rgba(255,255,255,0.18);
  border: 1px solid rgba(255,255,255,0.40);
  border-radius: var(--kp-radius-xl);
  color: var(--kp-white) !important;
  font-weight: 700;
  font-size: 0.9rem;
  text-decoration: none !important;
  transition: background 0.2s, transform 0.2s;
}

.kp-category-link:hover {
  background: rgba(255,255,255,0.30) !important;
  transform: translateY(-2px);
}


/* ===========================================
   セクションヘッダー
   =========================================== */
.kp-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 3px solid var(--kp-orange);
}

.kp-section-title {
  font-size: 1.2rem;
  font-weight: 900;
  color: var(--kp-text);
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}

.kp-section-title::before {
  content: '';
  display: inline-block;
  width: 5px;
  height: 1.15em;
  background: var(--kp-grad-main);
  border-radius: 3px;
  flex-shrink: 0;
}

.kp-section-more {
  font-size: 0.83rem;
  color: var(--kp-blue) !important;
  text-decoration: none !important;
  font-weight: 600;
}
.kp-section-more:hover { color: var(--kp-orange) !important; }


/* ===========================================
   クーポンカード
   =========================================== */
.kp-coupon-card {
  background: var(--kp-white);
  border-radius: var(--kp-radius-md);
  box-shadow: var(--kp-shadow-sm);
  border: 1px solid var(--kp-border);
  overflow: hidden;
  transition: transform 0.2s, box-shadow 0.2s;
  display: flex;
  flex-direction: column;
}

.kp-coupon-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--kp-shadow-md);
}

.kp-coupon-card-header {
  padding: 14px 18px 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.kp-coupon-store {
  font-size: 0.78rem;
  color: var(--kp-muted);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.kp-coupon-card-body {
  padding: 12px 18px 14px;
  flex: 1;
}

.kp-coupon-title {
  font-size: 0.98rem;
  font-weight: 700;
  color: var(--kp-text);
  margin: 0 0 8px;
  line-height: 1.5;
}

.kp-coupon-desc {
  font-size: 0.83rem;
  color: var(--kp-text-sub);
  margin: 0 0 12px;
  line-height: 1.6;
}

.kp-discount-badge {
  display: inline-flex;
  align-items: center;
  background: var(--kp-grad-main);
  color: var(--kp-white);
  font-size: 1.15rem;
  font-weight: 900;
  padding: 5px 14px;
  border-radius: var(--kp-radius-sm);
  margin-bottom: 12px;
  box-shadow: var(--kp-shadow-orange);
  line-height: 1;
}

/* クーポンコードエリア */
.kp-code-wrap {
  display: flex;
  align-items: stretch;
  border: 2px dashed var(--kp-orange);
  border-radius: var(--kp-radius-sm);
  background: var(--kp-orange-pale);
  overflow: hidden;
  margin-top: 12px;
}

.kp-code-text {
  flex: 1;
  padding: 10px 14px;
  font-family: var(--kp-mono);
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--kp-orange-dark);
  background: transparent;
  border: none;
  outline: none;
  cursor: text;
  user-select: all;
}

.kp-copy-btn {
  padding: 10px 16px;
  background: var(--kp-orange);
  color: var(--kp-white);
  border: none;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s;
  font-family: var(--kp-font);
}

.kp-copy-btn:hover { background: var(--kp-orange-dark); }
.kp-copy-btn.kp-copied { background: #388E3C; }

.kp-coupon-card-footer {
  padding: 10px 18px 14px;
  border-top: 1px solid var(--kp-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.kp-expiry {
  font-size: 0.78rem;
  color: var(--kp-muted);
  display: flex;
  align-items: center;
  gap: 4px;
}

.kp-expiry-soon { color: var(--kp-coupon-color) !important; font-weight: 700; }

.kp-detail-link {
  font-size: 0.8rem;
  color: var(--kp-blue) !important;
  font-weight: 600;
  text-decoration: none !important;
}
.kp-detail-link:hover { color: var(--kp-orange) !important; }

.kp-coupon-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 20px;
  margin-bottom: 32px;
}


/* ===========================================
   バッジ
   =========================================== */
.kp-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: var(--kp-radius-xl);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.4;
}

.kp-badge-coupon   { background: #FFEBEE; color: var(--kp-coupon-color);   border: 1px solid #FFCDD2; }
.kp-badge-campaign { background: #F3E5F5; color: var(--kp-campaign-color); border: 1px solid #E1BEE7; }
.kp-badge-sale     { background: #E8F5E9; color: var(--kp-sale-color);     border: 1px solid #C8E6C9; }
.kp-badge-new      { background: #FFF8E1; color: #F57F17;                  border: 1px solid #FFECB3; }
.kp-badge-hot      { background: #FBE9E7; color: #BF360C;                  border: 1px solid #FFCCBC; }


/* ===========================================
   Cocoon エントリーカード上書き
   =========================================== */
.entry-card-wrap,
.card-wrap {
  background: var(--kp-white) !important;
  border-radius: var(--kp-radius-md) !important;
  box-shadow: var(--kp-shadow-sm) !important;
  border: 1px solid var(--kp-border) !important;
  transition: transform 0.2s, box-shadow 0.2s !important;
  overflow: hidden !important;
}

.entry-card-wrap:hover,
.card-wrap:hover {
  transform: translateY(-3px) !important;
  box-shadow: var(--kp-shadow-md) !important;
}

.entry-card-title,
.card-title {
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  color: var(--kp-text) !important;
  line-height: 1.5 !important;
}

.entry-card-wrap:hover .entry-card-title,
.card-wrap:hover .card-title {
  color: var(--kp-orange-dark) !important;
}

/* カテゴリラベル */
.cat-label,
.entry-card-cat-label {
  background: var(--kp-grad-main) !important;
  color: var(--kp-white) !important;
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  padding: 3px 10px !important;
  border-radius: var(--kp-radius-sm) !important;
}

/* カテゴリ別カラー */
.cat-coupon   .cat-label,
.category-coupon   .cat-label { background: var(--kp-coupon-color)   !important; }
.cat-campaign .cat-label,
.category-campaign .cat-label { background: var(--kp-campaign-color) !important; }
.cat-sale     .cat-label,
.category-sale     .cat-label { background: var(--kp-sale-color)     !important; }

/* 投稿日・タグ */
.post-date,
.entry-card-date {
  font-size: 0.78rem !important;
  color: var(--kp-muted) !important;
}


/* ===========================================
   記事コンテンツ（シングル）
   =========================================== */
.article-body,
.entry-content {
  font-size: 1rem !important;
  line-height: 1.85 !important;
  color: var(--kp-text) !important;
}

.article-body h2,
.entry-content h2 {
  background: linear-gradient(to right, var(--kp-orange-pale), transparent) !important;
  border-left: 5px solid var(--kp-orange) !important;
  padding: 12px 20px !important;
  border-radius: 0 var(--kp-radius-sm) var(--kp-radius-sm) 0 !important;
  font-size: 1.25rem !important;
  font-weight: 900 !important;
  margin: 32px 0 16px !important;
  color: var(--kp-text) !important;
}

.article-body h3,
.entry-content h3 {
  border-bottom: 2px solid var(--kp-orange) !important;
  padding-bottom: 8px !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  margin: 24px 0 12px !important;
  color: var(--kp-text) !important;
}

.article-body h4,
.entry-content h4 {
  color: var(--kp-orange-dark) !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  margin: 20px 0 8px !important;
}

/* テーブル */
.article-body table,
.entry-content table {
  width: 100% !important;
  border-collapse: collapse !important;
  box-shadow: var(--kp-shadow-sm) !important;
}

.article-body table th,
.entry-content table th {
  background: var(--kp-grad-main) !important;
  color: var(--kp-white) !important;
  padding: 11px 16px !important;
  font-weight: 700 !important;
  text-align: left !important;
  font-size: 0.9rem !important;
}

.article-body table td,
.entry-content table td {
  padding: 11px 16px !important;
  border-bottom: 1px solid var(--kp-border) !important;
  font-size: 0.9rem !important;
  background: var(--kp-white) !important;
}

.article-body table tr:nth-child(even) td,
.entry-content table tr:nth-child(even) td {
  background: var(--kp-bg) !important;
}

.article-body blockquote,
.entry-content blockquote {
  background: var(--kp-bg) !important;
  border-left: 4px solid var(--kp-orange-light) !important;
  padding: 16px 20px !important;
  margin: 20px 0 !important;
  border-radius: 0 var(--kp-radius-sm) var(--kp-radius-sm) 0 !important;
  font-style: normal !important;
}

/* Cocoon 吹き出し */
.speech-wrap .speech-balloon {
  border-radius: var(--kp-radius-md) !important;
}


/* ===========================================
   クーポン使い方ボックス
   =========================================== */
.kp-how-to-box {
  background: var(--kp-bg);
  border-radius: var(--kp-radius-md);
  padding: 24px;
  margin: 24px 0;
  border: 1px solid var(--kp-border);
}

.kp-how-to-box h4 {
  font-size: 1rem;
  font-weight: 900;
  margin: 0 0 16px;
  color: var(--kp-text);
  display: flex;
  align-items: center;
  gap: 8px;
}

.kp-steps {
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: step-counter;
}

.kp-steps li {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 10px 0;
  border-bottom: 1px dashed var(--kp-border);
  counter-increment: step-counter;
  font-size: 0.93rem;
  line-height: 1.6;
}

.kp-steps li:last-child { border-bottom: none; }

.kp-steps li::before {
  content: counter(step-counter);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  background: var(--kp-grad-main);
  color: var(--kp-white);
  border-radius: 50%;
  font-size: 0.78rem;
  font-weight: 900;
  flex-shrink: 0;
  margin-top: 2px;
}

.kp-notice-box {
  background: #FFF8E1;
  border: 1px solid #FFE082;
  border-left: 4px solid #FFA000;
  border-radius: 0 var(--kp-radius-sm) var(--kp-radius-sm) 0;
  padding: 14px 18px;
  margin: 16px 0;
  font-size: 0.9rem;
  color: #5D4037;
  line-height: 1.7;
}

.kp-inline-code {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--kp-orange-pale);
  border: 1px dashed var(--kp-orange);
  border-radius: var(--kp-radius-sm);
  padding: 5px 12px;
  margin: 4px 0;
}

.kp-inline-code code {
  font-family: var(--kp-mono);
  font-size: 1rem;
  font-weight: 700;
  color: var(--kp-orange-dark);
  background: none !important;
  padding: 0 !important;
  border: none !important;
}


/* ===========================================
   サイドバー
   =========================================== */
.widget {
  background: var(--kp-white) !important;
  border-radius: var(--kp-radius-md) !important;
  box-shadow: var(--kp-shadow-sm) !important;
  border: 1px solid var(--kp-border) !important;
  padding: 20px !important;
  margin-bottom: 20px !important;
}

.widget-title {
  font-size: 1rem !important;
  font-weight: 900 !important;
  color: var(--kp-text) !important;
  padding-bottom: 10px !important;
  margin-bottom: 14px !important;
  border-bottom: 2px solid var(--kp-orange) !important;
}

.widget .cat-item a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 8px 0 !important;
  color: var(--kp-text) !important;
  font-size: 0.88rem !important;
  border-bottom: 1px solid var(--kp-border) !important;
  text-decoration: none !important;
  transition: color 0.15s, padding-left 0.15s !important;
}

.widget .cat-item:last-child a { border-bottom: none !important; }

.widget .cat-item a:hover {
  color: var(--kp-orange-dark) !important;
  padding-left: 4px !important;
}

.tagcloud a,
.tag-cloud-link {
  display: inline-block !important;
  padding: 5px 12px !important;
  background: var(--kp-bg) !important;
  border: 1px solid var(--kp-border) !important;
  border-radius: var(--kp-radius-xl) !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  color: var(--kp-text-sub) !important;
  text-decoration: none !important;
  transition: all 0.2s !important;
  margin: 3px !important;
}

.tagcloud a:hover,
.tag-cloud-link:hover {
  background: var(--kp-orange-pale) !important;
  border-color: var(--kp-orange) !important;
  color: var(--kp-orange-dark) !important;
}


/* ===========================================
   Cocoon 標準パーツ上書き
   =========================================== */

/* パンくず */
#breadcrumb,
.breadcrumb {
  background: var(--kp-bg-warm) !important;
  border: none !important;
  padding: 10px 20px !important;
  font-size: 0.79rem !important;
}

#breadcrumb a,
.breadcrumb a { color: var(--kp-blue) !important; }

/* SNSシェアボタン */
.sns-share-buttons .sns-share-button {
  border-radius: var(--kp-radius-sm) !important;
}

/* 関連記事 */
.related-entry-heading {
  border-bottom: 3px solid var(--kp-orange) !important;
  padding-bottom: 8px !important;
  font-size: 1.1rem !important;
  font-weight: 900 !important;
}

/* ページネーション */
.pager-links,
.pagination {
  display: flex !important;
  justify-content: center !important;
  gap: 6px !important;
  margin: 40px 0 !important;
  flex-wrap: wrap !important;
}

.pager-links a,
.page-numbers {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 40px !important;
  height: 40px !important;
  padding: 0 10px !important;
  border-radius: var(--kp-radius-sm) !important;
  border: 1px solid var(--kp-border) !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  color: var(--kp-text) !important;
  text-decoration: none !important;
  transition: all 0.2s !important;
  background: var(--kp-white) !important;
}

.pager-links a:hover,
.page-numbers:hover {
  background: var(--kp-orange-pale) !important;
  border-color: var(--kp-orange) !important;
  color: var(--kp-orange-dark) !important;
}

.pager-links .current,
.page-numbers.current {
  background: var(--kp-grad-main) !important;
  border-color: var(--kp-orange) !important;
  color: var(--kp-white) !important;
}

/* 目次 */
#toc_container {
  background: var(--kp-orange-pale) !important;
  border: 1px solid #FFE0B2 !important;
  border-radius: var(--kp-radius-md) !important;
}

#toc_container .toc_title {
  background: var(--kp-grad-main) !important;
  color: var(--kp-white) !important;
  border-radius: var(--kp-radius-sm) var(--kp-radius-sm) 0 0 !important;
  padding: 10px 16px !important;
  font-weight: 900 !important;
}

#toc_container ul li a { color: var(--kp-blue) !important; }
#toc_container ul li a:hover { color: var(--kp-orange-dark) !important; }


/* ===========================================
   フッター
   =========================================== */
#footer,
.site-footer {
  background: #1A1A2E !important;
  color: rgba(255,255,255,0.7) !important;
  border-top: 4px solid var(--kp-orange) !important;
}

.footer-widget-title,
.footer-widget .widget-title {
  color: var(--kp-white) !important;
  border-bottom-color: rgba(255,255,255,0.2) !important;
}

.footer-widget a,
.site-footer a {
  color: rgba(255,255,255,0.65) !important;
  text-decoration: none !important;
}

.footer-widget a:hover,
.site-footer a:hover { color: var(--kp-orange-light) !important; }

.footer-bottom-wrap,
.footer-bottom {
  background: rgba(0,0,0,0.3) !important;
  color: rgba(255,255,255,0.5) !important;
  font-size: 0.79rem !important;
}

.footer-copyright { color: rgba(255,255,255,0.5) !important; }
.footer-copyright a { color: var(--kp-orange-light) !important; }

/* フッターナビ */
.footer-navi a {
  font-size: 0.82rem !important;
  color: rgba(255,255,255,0.6) !important;
  text-decoration: none !important;
}
.footer-navi a:hover { color: var(--kp-orange-light) !important; }


/* ===========================================
   ボタン
   =========================================== */
.kp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 12px 28px;
  border-radius: var(--kp-radius-xl);
  font-weight: 700;
  font-size: 0.95rem;
  text-decoration: none !important;
  cursor: pointer;
  transition: transform 0.2s, opacity 0.2s;
  border: none;
  font-family: var(--kp-font);
  line-height: 1;
}

.kp-btn:hover { transform: translateY(-2px); opacity: 0.92; }

.kp-btn-primary   { background: var(--kp-grad-main); color: var(--kp-white) !important; box-shadow: var(--kp-shadow-orange); }
.kp-btn-secondary { background: var(--kp-grad-blue); color: var(--kp-white) !important; }
.kp-btn-outline   { background: transparent; color: var(--kp-orange-dark) !important; border: 2px solid var(--kp-orange); }
.kp-btn-outline:hover { background: var(--kp-orange-pale); }
.kp-btn-large     { padding: 16px 40px; font-size: 1.05rem; }

/* Cocoon 標準ボタン上書き */
.btn,
.cocoon-block-button__link {
  border-radius: var(--kp-radius-xl) !important;
  font-weight: 700 !important;
  transition: transform 0.2s, opacity 0.2s !important;
}

.btn:hover,
.cocoon-block-button__link:hover {
  transform: translateY(-2px) !important;
  opacity: 0.9 !important;
}


/* ===========================================
   アーカイブ・タグページ
   =========================================== */
.archive-title,
.page-header h1 {
  font-size: 1.3rem !important;
  font-weight: 900 !important;
  color: var(--kp-text) !important;
  margin-bottom: 20px !important;
  padding-bottom: 12px !important;
  border-bottom: 3px solid var(--kp-orange) !important;
}

.kp-archive-desc {
  background: var(--kp-white);
  border-radius: var(--kp-radius-md);
  padding: 18px 22px;
  margin-bottom: 24px;
  border: 1px solid var(--kp-border);
  font-size: 0.93rem;
  line-height: 1.7;
  color: var(--kp-text-sub);
}


/* ===========================================
   管理者バー
   =========================================== */
body.admin-bar #site-header,
body.admin-bar .site-header {
  top: 32px !important;
}

@media screen and (max-width: 782px) {
  body.admin-bar #site-header,
  body.admin-bar .site-header {
    top: 46px !important;
  }
}


/* ===========================================
   アニメーション
   =========================================== */
@keyframes kp-fade-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.kp-fade-in { animation: kp-fade-in 0.4s ease both; }

.kp-reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.kp-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}


/* ===========================================
   レスポンシブ
   =========================================== */
@media screen and (max-width: 1023px) {
  .kp-coupon-grid {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  }
}

@media screen and (max-width: 767px) {
  .kp-hero {
    padding: 40px 16px 36px;
  }

  .kp-hero-search {
    flex-direction: column;
    gap: 10px;
  }

  .kp-hero-search input[type="search"],
  .kp-hero-search button {
    width: 100%;
    border-radius: var(--kp-radius-xl);
  }

  .kp-category-links { gap: 8px; }
  .kp-category-link  { font-size: 0.82rem; padding: 6px 14px; }
  .kp-coupon-grid    { grid-template-columns: 1fr; }

  .kp-coupon-card-footer {
    flex-wrap: wrap;
  }

  .kp-section-header {
    flex-wrap: wrap;
    gap: 8px;
  }
}

@media screen and (max-width: 480px) {
  .kp-hero h1     { font-size: 1.1rem; }
  .kp-code-text   { font-size: 0.95rem; letter-spacing: 0.06em; }
  .kp-copy-btn    { padding: 10px 12px; font-size: 0.78rem; }
  .widget         { padding: 16px !important; }
}


/* ===========================================
   印刷
   =========================================== */
@media print {
  .site-header,
  .sidebar,
  .site-footer,
  .kp-copy-btn,
  .kp-hero-search { display: none !important; }

  .kp-coupon-card {
    box-shadow: none !important;
    border: 1px solid #ccc !important;
  }
}
