/* =======================================
   上品 × POP モード（柔らかい雰囲気に）
   ======================================= */

/* 1️⃣ 全体を少し明るく */
body {
  background: #fdfdfd !important;
}

/* 2️⃣ ヘッダーに淡いベージュのニュアンス */
.site-header,
.nav-primary,
.primary-header {
  background: linear-gradient(180deg, #f6f4f2 0%, #f0efed 100%) !important;
  border-bottom: 1px solid #e4e2df !important;
}

/* 3️⃣ ロゴやタイトルを少し“温かい黒”に */
.site-title a {
  color: #2b2b2b !important;
  letter-spacing: 0.03em;
  font-weight: 600;
}

/* 4️⃣ ナビゲーションを柔らかく */
.nav-primary a,
.primary-menu > li > a {
  color: #444 !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em;
  transition: all 0.25s ease;
}
.nav-primary a:hover,
.primary-menu > li > a:hover {
  color: #c79e6c !important; /* 柔らかいキャメルベージュ */
}
.nav-primary a::after,
.primary-menu > li > a::after {
  background: #c79e6c !important; /* ホバー下線もベージュ系 */
}

/* 5️⃣ フッターも統一 */
.site-footer,
#colophon {
  background: #f4f3f2 !important;
  border-top: 1px solid #e5e5e5 !important;
  color: #555 !important;
}

/* 6️⃣ リンクカラーをやや明るめグレー寄りブラウンに */
a {
  color: #7b5f40 !important;
}
a:hover {
  color: #c79e6c !important;
}

/* 7️⃣ ボタン類（例：検索・送信など） */
button,
.button,
input[type=submit] {
  background: #c79e6c !important;
  color: #fff !important;
  border-radius: 6px !important;
  border: none !important;
  box-shadow: 0 2px 4px rgba(0,0,0,.08);
  transition: all 0.25s ease;
}
button:hover,
.button:hover,
input[type=submit]:hover {
  background: #b38b58 !important;
  transform: translateY(-1px);
}

/* 8️⃣ 見出しフォントを少しPOPに */
.block-title {
  color: #3a3a3a !important;
  font-family: "Noto Serif JP", "Shippori Mincho", serif !important;
  letter-spacing: 0.05em;
}
.block-subtitle {
  color: #8a7d6a !important;
}

/* 9️⃣ ニュースティッカーを少しカラーに */
.news-ticker {
  background: #f9f8f6 !important;
  border: 1px solid #e7e3df !important;
}
.news-ticker__label {
  background: #c79e6c !important;
  color: #fff !important;
}

/* ===================== ブランド A–Z 一覧 ===================== */
.brands-a2z-wrapper { margin-top: 8px; }
.brands-a2z-heading {
  font-size: 1.1rem;
  font-weight: 600;
  color: #3a3a3a;
  margin: 20px 0 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid #e6e2de;
  letter-spacing: .03em;
}
.brands-a2z-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px,1fr));
  gap: 10px;
}
.brands-a2z-item {
  display: block;
  background: #fff;
  border: 1px solid #eceaea;
  border-radius: 8px;
  padding: 10px 12px;
  text-align: center;
  font-size: 14px;
  color: #333;
  transition: transform .18s ease, box-shadow .18s ease, color .18s ease, background .18s ease, border-color .18s ease;
}
.brands-a2z-item:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.06);
  background: #f9f5ef;             /* ほんのりベージュ */
  border-color: #e5d8c6;
  color: #b4854e;                   /* キャメル寄り */
}

/* A～Z 見出しが続くときの詰まり防止 */
.brands-a2z-group + .brands-a2z-group { margin-top: 8px; }

/* ===================== 都道府県一覧 ===================== */
.pref-list-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px,1fr));
  gap: 10px;
  margin-top: 10px;
}
.pref-list-item {
  display: block;
  background: #fff;
  border: 1px solid #eceaea;
  border-radius: 10px;
  padding: 10px 12px;
  text-align: center;
  font-size: 14px;
  color: #333;
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.pref-list-item:hover {
  background: #f9f5ef;
  color: #b4854e;
  border-color: #e5d8c6;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.06);
}

/* スマホ最適化 */
@media (max-width: 640px) {
  .brands-a2z-grid { grid-template-columns: repeat(2,1fr); }
  .pref-list-wrapper { grid-template-columns: repeat(2,1fr); }
}
/* A–Z導線ボタン */
.btn-a2z {
  display: inline-block;
  padding: 10px 16px;
  border-radius: 999px;
  background: #c79e6c;
  color: #fff !important;
  border: 1px solid #b88e60;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn-a2z:hover {
  background: #b88e60;
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
  transform: translateY(-1px);
}
/* =========================================================
   A–Z導線ボタン（フェードイン付き）
   ========================================================= */
.btn-a2z {
  display: inline-block;
  padding: 10px 18px;
  border-radius: 999px;
  background: #c79e6c;
  color: #fff !important;
  border: 1px solid #b88e60;
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  text-decoration: none;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease, opacity .8s ease;
  opacity: 0; /* ← 初期は非表示（fadeinで表示） */
  transform: translateY(10px);
}

.btn-a2z:hover {
  background: #b88e60;
  box-shadow: 0 6px 16px rgba(0,0,0,.1);
  transform: translateY(-1px);
}

/* フェードインアニメーション */
.fadein {
  animation: fadeUp 1s ease forwards;
  animation-delay: .3s; /* 少し遅れて登場 */
}

@keyframes fadeUp {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/* ================= A–Z ロゴ付きカード ================ */
.brands-a2z__heading{
  font-size:1.1rem;font-weight:600;color:#3a3a3a;margin:20px 0 10px;
  padding-bottom:6px;border-bottom:1px solid #e6e2de;letter-spacing:.03em;
}
.brands-a2z__grid--logo{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
  gap:12px;
}

/* カード本体 */
.brands-a2z__card{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:#fff;border:1px solid #eceaea;border-radius:12px;
  padding:14px 10px;min-height:132px;text-align:center;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.brands-a2z__card:hover{
  transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.07);
  border-color:#e5d8c6;background:#f9f5ef;
}

/* ロゴ枠（比率統一） */
.brands-a2z__logo-wrap{
  width:120px; height:80px; display:flex; align-items:center; justify-content:center;
}
.brands-a2z__logo{
  max-width:110px; max-height:70px; object-fit:contain; display:block;
}

/* ロゴが無いときの頭文字フォールバック */
.brands-a2z__initial{
  width:64px;height:64px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:999px;background:#f0efeD;border:1px solid #e1ded8;color:#7d6a56;
  font-weight:700;font-size:20px;letter-spacing:.02em;
}

/* テキスト名：控えめ（必要なら display:block に） */
.brands-a2z__name{
  margin-top:8px;font-size:12px;color:#666;display:none; /* ←表示したい場合は block に */
}

/* スマホ */
@media (max-width:640px){
  .brands-a2z__grid--logo{ grid-template-columns:repeat(3,1fr); gap:10px; }
  .brands-a2z__card{ min-height:120px; padding:12px 8px; }
  .brands-a2z__logo-wrap{ width:110px;height:72px; }
  .brands-a2z__logo{ max-width:100px; max-height:64px; }
}
/* ===== A–Z 目次バーを横並びに矯正（強制力強め） ===== */
.brands-a2z .az-index {
  position: sticky; top: 64px;
  z-index: 5;
  background: #f7f6f4;
  border: 1px solid #e7e3df;
  border-radius: 10px;
  padding: 8px;
  margin: 8px 0 16px;
  overflow: hidden;
}

/* ULを横スクロール行に */
.brands-a2z .az-index__list {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: max-content !important;
  gap: 6px !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 2px 2px !important;
  list-style: none !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

/* LIは横一列に（縦積み防止） */
.brands-a2z .az-index__item {
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Aタグは“ピル”化。幅100%指定などを無効化 */
.brands-a2z .az-index__link {
  display: inline-block !important;
  width: auto !important;
  min-width: 30px !important;
  text-align: center !important;
  padding: 6px 9px !important;
  border-radius: 999px !important;
  background: #fff !important;
  border: 1px solid #eceaea !important;
  color: #444 !important;
  font-size: 13px !important;
  line-height: 1 !important;
  letter-spacing: .03em !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease !important;
}
.brands-a2z .az-index__link:hover {
  background: #f9f5ef !important;
  color: #b4854e !important;
  border-color: #e5d8c6 !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.06);
}
.brands-a2z .az-index__link.is-active {
  background: #c79e6c !important;
  color: #fff !important;
  border-color: #b88e60 !important;
}
.brands-a2z .az-index__link.is-disabled {
  opacity: .35 !important;
  pointer-events: none !important;
}

/* アンカー位置（見出しがヘッダーに隠れないように） */
.brands-a2z__heading { scroll-margin-top: 90px; }

@media (max-width: 640px) {
  .brands-a2z .az-index { top: 56px; }
  .brands-a2z__heading { scroll-margin-top: 80px; }
}
/* ===== 地域カード（A案：シンプルでおしゃれ） ===== */
.regions-grid.cards{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 16px;
}
@media (max-width: 960px){
  .regions-grid.cards{ grid-template-columns: 1fr; }
}

.region-card{
  background:#fff;
  border:1px solid #eceaea;
  border-radius:12px;
  padding:14px 16px;
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease, background .18s ease;
}
.region-card:hover{
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0,0,0,.07);
  border-color:#e5d8c6;
  background:#f9f5ef;
}

.region-title{
  font-size: .95rem;
  font-weight: 600;
  color:#3a3a3a;
  margin: 2px 0 10px;
  letter-spacing:.02em;
}

/* 県名は2列の“ピル”で均等配置 */
.pref-list--2col{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 8px;
}
.pref-list--2col a{
  display:block;
  text-align:center;
  padding:8px 10px;
  border-radius: 999px;
  background:#f7f6f4;
  border:1px solid #e7e3df;
  color:#444;
  font-size:14px;
  text-decoration:none;
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.pref-list--2col a:hover{
  background:#f9f5ef;
  color:#b4854e;
  border-color:#e5d8c6;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.06);
}

/* アンカーずれ対策（ヘッダー固定時） */
#areas{ scroll-margin-top: 80px; }

/* 地域カード（2列→SP1列） */
.regions-grid.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:960px){.regions-grid.cards{grid-template-columns:1fr}}
.region-card{background:#fff;border:1px solid #eceaea;border-radius:12px;padding:14px 16px;transition:box-shadow .18s,transform .18s,border-color .18s}
.region-card:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(0,0,0,.07);border-color:#e5d8c6;background:#f9f5ef}
.region-title{font-size:.95rem;font-weight:600;color:#3a3a3a;margin:2px 0 10px}
.pref-list--2col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pref-list--2col a{display:block;text-align:center;padding:8px 10px;border-radius:999px;background:#f7f6f4;border:1px solid #e7e3df;color:#444;text-decoration:none;transition:background .18s,color .18s,border-color .18s,transform .18s,box-shadow .18s}
.pref-list--2col a:hover{background:#f9f5ef;color:#b4854e;border-color:#e5d8c6;transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,0,0,.06)}

/* === 地域カードのホバー色を無効化（大枠は色を変えない） === */
.regions-grid.cards .region-card:hover{
  background:#fff !important;         /* もとの白のまま */
  border-color:#eceaea !important;     /* 枠色も固定 */
  box-shadow:none !important;          /* 立ち上がり無し */
  transform:none !important;
}

/* （任意）大枠にごく軽い反応だけ欲しい場合は下を有効化
.regions-grid.cards .region-card:hover{
  background:#fff !important;
  border-color:#e9e6e2 !important;
  box-shadow:0 3px 10px rgba(0,0,0,.04) !important;
  transform:translateY(-1px) !important;
}
*/

/* ピルだけは従来どおり色変化 */
.pref-list--2col a:hover{
  background:#f9f5ef !important;
  color:#b4854e !important;
  border-color:#e5d8c6 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 16px rgba(0,0,0,.06) !important;
}
/* Contact Form 7 – デザイン調整 */
.wpcf7 form {
  max-width: 680px;
  margin: 0 auto;
}
.wpcf7 form label {
  display: block;
  font-weight: 600;
  margin: 10px 0 6px;
  color: #3a3a3a;
}
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #e5e1dc;
  border-radius: 10px;
  background: #fff;
  outline: none;
  transition: border-color .18s, box-shadow .18s;
}
.wpcf7 textarea {
  min-height: 160px;
}
.wpcf7 input:focus,
.wpcf7 textarea:focus {
  border-color: #e5d8c6;
  box-shadow: 0 0 0 3px rgba(229,216,198,.35);
}
.wpcf7 input[type="submit"] {
  display: inline-block;
  margin-top: 12px;
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid #e5e1dc;
  background: #f7f6f4;
  cursor: pointer;
  transition: transform .18s, box-shadow .18s, background .18s, border-color .18s;
}
.wpcf7 input[type="submit"]:hover {
  background: #f9f5ef;
  border-color: #e5d8c6;
  box-shadow: 0 6px 16px rgba(0,0,0,.06);
  transform: translateY(-1px);
}
.wpcf7 .wpcf7-response-output {
  margin: 14px 0;
  padding: 10px 12px;
  border-left: 4px solid #e5d8c6;
  background: #f9f5ef;
  color: #333;
}
/* ===== 検索オーバーレイ：見やすく、モバイルで被らない ===== */
.search-overlay {
  background: rgba(255,255,255,.97) !important;
  color: #333 !important;
  z-index: 9999 !important; /* ヘッダーに潜らない */
}
.search-overlay .container {
  padding: 18px 14px !important;
}

/* 置き換えた高度検索フォーム */
.fc-advanced-search {
  display: grid;
  gap: 12px;
}
.fc-as-row {
  display: grid;
  gap: 6px;
}
.fc-as-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.fc-as-label {
  font-size: 12px;
  color: #666;
  margin-bottom: 2px;
}
.fc-as-input,
.fc-as-select {
  width: 100%;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 14px;
  background: #fff;
}
.fc-as-input::placeholder {
  color: #999;
}
.fc-as-actions {
  display: flex;
  justify-content: flex-end;
}
.fc-as-submit {
  border-radius: 999px !important;
  padding: 10px 18px !important;
}

/* モバイル：1カラムにして重なり回避 */
@media (max-width: 640px){
  .fc-as-grid {
    grid-template-columns: 1fr;
  }
}

/* ヘッダーの白い虫眼鏡アイコンが見づらい問題 (色を濃く) */
.search-overlay-toggle,
.primary-header .search-overlay-toggle,
#site-navigation .search-overlay-toggle {
  color: #444 !important;
  opacity: 1 !important;
}
/* === 検索アイコン・メニューボタンを見やすく === */
.primary-header .search-overlay-toggle,
.main-navigation .ion-search,
.navigation-bar-toggle {
  color: #4b5563 !important;   /* ダークグレーで視認性UP */
  opacity: 1 !important;
}

/* 閉じている検索オーバーレイがクリックをブロックしないように */
.search-overlay {
  position: fixed;             /* 画面いっぱいでもOK */
  inset: 0;
  opacity: 0;                  /* 視覚的に消す */
  pointer-events: none;        /* クリックを通す（重要） */
  transition: opacity .2s ease;
  z-index: 1001;               /* 開いた時はヘッダーの下→後で上げる */
}

/* テーマ側が付ける状態クラス（両対応）：開いた時だけ操作可に */
.search-overlay.is-visible,
.search-overlay.open,
.search-overlay.active {
  opacity: 1;
  pointer-events: auto;        /* 開いた時だけクリックを受ける */
  z-index: 2000;               /* 開いたら最前面 */
}

/* ヘッダー自体は常に上に（オーバーレイ“未表示時”に内容に負けない） */
.primary-header { position: relative; z-index: 1500; }

/* モバイルでヘッダーと重なって見える問題の軽減（高さ分の余白） */
@media (max-width: 782px) {
  body { padding-top: 75px; }  /* 既に入っていれば重複OK */
}

/* オーバーレイ内の×アイコンも見やすく */
.search-overlay .ion-close,
.search-overlay .search-submit {
  color: #4b5563 !important;
}

/* 検索フィールドの文字色/背景も薄グレー基調で視認性UP */
.search-overlay .search-form .search-field {
  background: #fff !important;
  color: #333 !important;
  border: 1px solid #e5e7eb !important;
}

/* もし白いアイコンフォントが :before のみで描画される場合に備えて */
.search-overlay-toggle:before,
.ion-search:before,
.ion-close:before {
  color: #4b5563 !important;
}
/* 検索オーバーレイ：閉じるボタンを常に見える場所に・大きく */
.search-overlay {
  position: fixed;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
  z-index: 1001;
}
.search-overlay.is-visible,
.search-overlay.open,
.search-overlay.active {
  opacity: 1;
  pointer-events: auto;
  z-index: 2000;
}

/* 右上の×（テーマ既存 .ion-close）を見やすく・押しやすく */
.search-overlay .ion-close.search-overlay-toggle {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 44px;
  height: 44px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  color: #4b5563 !important;      /* 視認性の高いグレー */
  background: rgba(255,255,255,.9);
  border-radius: 999px;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
}

/* アイコンフォントで描画される場合の保険 */
.search-overlay .ion-close.search-overlay-toggle:before,
.search-overlay-toggle:before {
  color: #4b5563 !important;
}
/* 見た目の強化（任意） */
.search-form--enhanced .search-form__row {
  display: grid;
  grid-template-columns: 1fr 200px 200px auto auto;
  gap: 10px;
  align-items: center;
}
@media (max-width: 768px) {
  .search-form--enhanced .search-form__row {
    grid-template-columns: 1fr;
  }
  .search-overlay-closebtn {
    position: absolute; right: 16px; top: 12px;
  }
}

.search-form__keywords,
.search-form__select {
  padding: 10px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}
.search-form__submit {
  padding: 10px 14px;
  border: none;
  border-radius: 8px;
  background: #111827;
  color: #fff;
  cursor: pointer;
}
.search-overlay-closebtn {
  padding: 8px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}
/* ===== 検索オーバーレイ（見やすさ＋確実表示） ===== */
.ion-search,
.ion-close.search-overlay-toggle {
  color: #444 !important;   /* 白→濃いグレーで視認性UP */
  opacity: .95;
}

.search-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;           /* ヘッダーより前面 */
  display: none;            /* デフォ隠す（JSで is-open 付与） */
  background: rgba(255,255,255,0.96);
  -webkit-overflow-scrolling: touch;
}

/* JSが動かない環境のフォールバック（アンカー #target でも開く） */
.search-overlay:target { display: block; }

/* JS駆動時 */
.search-overlay.is-open { display: block; }

.search-overlay .container {
  position: relative;
  padding: 24px 16px;
}

/* ×ボタン右上固定 */
.ion-close.search-overlay-toggle {
  position: absolute;
  top: 10px; right: 12px;
  font-size: 22px;
  text-decoration: none;
}

/* モバイルでヘッダーと重ならない */
@media (max-width: 767px){
  .search-overlay .container { padding-top: 56px; }
}

/* 入力UIの視認性 */
.search-overlay .search-form .search-field,
.search-overlay input[type="search"]{
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 16px;
  width: 100%;
  box-sizing: border-box;
}

.search-overlay .search-submit { border-radius: 10px; }

/* オーバーレイ表示中は背面スクロールを止める */
body.search-open { overflow: hidden; }

.search-overlay{
  position: fixed; inset: 0; z-index: 10000;
  display: none; background: rgba(255,255,255,.96);
}
.search-overlay.is-open{ display:block; }
.search-overlay:target{ display:block; } /* JS無効でも開く */
.search-overlay-closebtn{
  margin-left: 8px; font-size: 28px; line-height: 1;
  background: transparent; border: 0; cursor: pointer;
}

/* ===== shop detail ===== */
.fc-shop__head { position: relative; text-align: center; margin-bottom: 18px; }
.fc-shop__badge {
  position: absolute; left: 12px; top: 8px;
  background: #ffdf99; color: #7a4a00; border: 1px solid #f2c66d;
  font-weight: 700; font-size: 12px; padding: 3px 8px; border-radius: 999px;
}
.fc-shop__logo img { max-width: 240px; height: auto; margin: 0 auto 6px; display: block; }
.fc-shop__title { font-size: clamp(20px, 3.2vw, 26px); margin: 0 0 8px; }

.fc-shop__meta { list-style: none; padding: 0; margin: 8px auto 0; max-width: 720px; display: grid; gap: 6px; }
.fc-shop__meta li { display: grid; grid-template-columns: 70px 1fr; gap: 10px; align-items: baseline; }
.fc-shop__meta-label { color: #777; font-size: 13px; }
.fc-shop__meta-value a { color: #2854a1; text-decoration: none; }
.fc-shop__meta-value a:hover { text-decoration: underline; }

.fc-shop__desc { max-width: 760px; margin: 16px auto; color: #444; line-height: 1.8; }
.fc-shop__content { max-width: 760px; margin: 16px auto; line-height: 1.8; }

.fc-shop__section-title { font-size: 16px; margin: 20px 0 8px; }
.fc-shop__brands-links { color: #333; }

.fc-shop__gallery {
  margin: 18px auto 0; max-width: 980px;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px;
}
.fc-shop__gallery-item { border-radius: 10px; overflow: hidden; border: 1px solid #eee; background: #fafafa; }
.fc-shop__gallery-item img { width: 100%; height: auto; display: block; }