/*

 * サツドコ｜グルメニュース v2（既存 event.php デザインに統一）

 * public_html/gourmet/index.php と article.php だけに適用する。

 * /admin/gourmet.php・既存イベントページ・Cron の動作には一切介入しない。

 * 2026-10-12

 */

body.gourmet-public {
  --green: #157052;

  --deep: #0d4736;

  --dark: #0d4736;

  --ink: #202428;

  --muted: #6c7378;

  --bg: #f5f6f7;

  --border: #e6e9eb;

  --mint: #e9f6f1;

  --shadow: 0 8px 32px rgba(0, 0, 0, 0.03);

  background: var(--bg);

  color: var(--ink);

  font-family:
    -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP",
    "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;

  font-size: 16px;

  line-height: 1.8;
}

.gourmet-public .container {
  width: 100%;

  max-width: none;

  margin-inline: auto;

  padding-inline: clamp(12px, 3vw, 48px);
}

.gourmet-public .site-header {
  position: sticky;

  top: 0;

  z-index: 1030;

  background: rgba(255, 255, 255, 0.95);

  border-bottom: 1px solid var(--border);

  backdrop-filter: blur(14px);

  -webkit-backdrop-filter: blur(14px);
}

.gourmet-public .site-header-inner {
  display: flex;

  align-items: center;

  justify-content: space-between;

  min-height: 80px;

  padding-block: 14px;

  gap: 16px;
}

.gourmet-public .site-logo {
  display: block;

  flex: 0 0 auto;

  width: 158px;

  max-width: 40%;

  line-height: 1;
}

.gourmet-public .site-logo-image {
  display: block;

  width: 100%;

  height: auto;
}

.gourmet-public .site-nav {
  display: flex;

  align-items: center;

  justify-content: flex-end;

  gap: 9px;

  margin-left: auto;
}

.gourmet-public .site-nav a {
  display: inline-flex;

  align-items: center;

  gap: 7px;

  padding: 9px 14px;

  border-radius: 999px;

  color: #454b50;

  font-size: 0.875rem;

  font-weight: 700;

  line-height: 1.4;
}

.gourmet-public .site-nav .header-search {
  background: #f4f6f7;
}

.gourmet-public .site-nav a.active {
  background: #e9f6f1;

  color: #126047;
}

.gourmet-public .site-nav a:hover {
  background: #e2f2eb;

  color: var(--green);
}

/* イベント詳細と共通のヒーロー配色・タイポグラフィ */

.gourmet-public .gourmet-hero,
.gourmet-public .article-hero {
  width: 100%;

  min-height: 500px;

  position: relative;

  overflow: hidden;

  color: #fff;

  background:
    radial-gradient(
      circle at 90% 10%,

      rgba(255, 255, 255, 0.18),
      transparent 28%
    ),
    linear-gradient(125deg, #0b3d2e 0%, #17664c 55%, #288b6a 100%);
}

.gourmet-public .gourmet-hero-inner,
.gourmet-public .article-hero-inner {
  position: relative;

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: flex-start;

  min-height: 500px;

  padding-block: 60px;
}

.gourmet-public .article-hero-content {
  width: 100%;

  max-width: 1050px;
}

.gourmet-public .gourmet-hero h1,
.gourmet-public .article-hero h1 {
  max-width: 1100px;

  margin: 18px 0 22px;

  color: #fff;

  font-size: clamp(2.25rem, 5vw, 5rem);

  font-weight: 900;

  line-height: 1.1;

  letter-spacing: -0.055em;

  overflow-wrap: anywhere;

  text-shadow: 0 4px 24px rgba(0, 0, 0, 0.18);
}

.gourmet-public .gourmet-hero h1 span {
  color: #e4f4eb;
}

.gourmet-public .gourmet-hero p,
.gourmet-public .article-lead {
  max-width: 850px;

  margin: 0 0 20px;

  color: rgba(255, 255, 255, 0.92);

  font-size: clamp(1rem, 1.4vw, 1.18rem);

  line-height: 1.8;
}

.gourmet-public .eyebrow,
.gourmet-public .hero-category,
.gourmet-public .hero-period-status,
.gourmet-public .hero-tag {
  display: inline-flex;

  align-items: center;

  gap: 7px;

  padding: 8px 14px;

  color: #fff;

  background: rgba(255, 255, 255, 0.15);

  border: 1px solid rgba(255, 255, 255, 0.22);

  border-radius: 999px;

  font-size: 0.82rem;

  font-weight: 800;

  line-height: 1.35;

  letter-spacing: 0;

  backdrop-filter: blur(8px);
}

.gourmet-public .eyebrow-dot {
  background: #fff;
}

.gourmet-public .article-category-row {
  display: flex;

  align-items: center;

  flex-wrap: wrap;

  gap: 9px;
}

.gourmet-public .hero-links {
  display: flex;

  align-items: center;

  flex-wrap: wrap;

  gap: 18px;

  margin-top: 3px;
}

.gourmet-public .hero-secondary {
  font-size: 0.9rem;

  color: #fff;

  font-weight: 800;

  text-decoration: underline;

  text-underline-offset: 4px;
}

.gourmet-public .article-hero-bottom {
  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 12px 22px;

  margin-top: 3px;

  font-size: 0.875rem;

  color: rgba(255, 255, 255, 0.9);

  font-weight: 700;

  line-height: 1.5;
}

.gourmet-public .article-hero-bottom .bi {
  margin-right: 5px;
}

.gourmet-public .hero-deco,
.gourmet-public .article-hero-deco {
  display: none;
}

/* 共通パンくず・本文幅 */

.gourmet-public .breadcrumbs {
  display: flex;

  align-items: center;

  flex-wrap: wrap;

  gap: 9px;

  margin: 0 0 23px;

  color: var(--muted);

  font-size: 0.82rem;

  line-height: 1.6;
}

.gourmet-public .breadcrumbs .bi {
  color: #a6adb1;

  font-size: 0.72rem;
}

.gourmet-public .breadcrumbs a {
  color: var(--muted);
}

.gourmet-public .breadcrumbs a:hover {
  color: var(--green);
}

.gourmet-public .article-layout-wrap {
  padding-top: 24px;

  padding-bottom: 42px;
}

.gourmet-public .article-layout {
  display: grid;

  grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr);

  gap: 24px;

  align-items: start;
}

.gourmet-public .article-main {
  min-width: 0;

  display: grid;

  gap: 24px;
}

.gourmet-public .article-paper,
.gourmet-public .store-panel {
  padding: clamp(22px, 3vw, 38px);

  background: #fff;

  border: 1px solid var(--border);

  border-radius: 22px;

  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.03);
}

.gourmet-public .article-section-head,
.gourmet-public .store-panel-header {
  display: flex;

  align-items: center;

  gap: 12px;

  margin-bottom: 22px;

  padding: 0;

  background: none;

  border: 0;
}

.gourmet-public .article-section-head h2,
.gourmet-public .store-panel-header h2 {
  margin: 0;

  color: var(--ink);

  font-size: clamp(1.25rem, 2vw, 1.7rem);

  line-height: 1.35;

  font-weight: 900;

  letter-spacing: -0.035em;
}

.gourmet-public .heading-icon {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  flex: 0 0 42px;

  width: 42px;

  height: 42px;

  border-radius: 13px;

  background: var(--mint);

  color: var(--green);

  font-size: 1.15rem;

  line-height: 1;
}

.gourmet-public .article-prose,
.gourmet-public .highlights-list {
  color: var(--ink);

  font-size: 1rem;

  line-height: 1.9;

  overflow-wrap: anywhere;
}

.gourmet-public .article-prose p {
  margin: 0 0 1.2em;
}

.gourmet-public .article-prose p:last-child {
  margin-bottom: 0;
}

.gourmet-public .article-prose h2,
.gourmet-public .article-prose h3 {
  margin-top: 1.8rem;

  margin-bottom: 0.9rem;

  padding: 0;

  border: none;

  font-size: 1.08rem;

  font-weight: 900;
}

.gourmet-public .article-prose ul,
.gourmet-public .article-prose ol,
.gourmet-public .highlights-list ul {
  padding-left: 1.4rem;

  margin: 0;
}

.gourmet-public .article-prose li,
.gourmet-public .highlights-list li {
  margin: 0 0 8px;

  padding: 0;
}

.gourmet-public .article-prose li:last-child,
.gourmet-public .highlights-list li:last-child {
  margin-bottom: 0;
}

.gourmet-public .article-period-card {
  display: flex;

  align-items: center;

  gap: 17px;

  padding: 19px;

  background: #eff8f4;

  border: 1px solid #daeee5;

  border-radius: 17px;

  box-shadow: none;
}

.gourmet-public .card-icon {
  display: inline-flex;

  justify-content: center;

  align-items: center;

  flex: 0 0 48px;

  width: 48px;

  height: 48px;

  background: #fff;

  color: var(--green);

  border-radius: 14px;

  font-size: 1.4rem;
}

.gourmet-public .period-value {
  color: var(--ink);

  font-weight: 900;

  font-size: 1.06rem;

  line-height: 1.45;

  margin: 0;
}

.gourmet-public .period-sub {
  margin: 5px 0 0;

  color: #60786c;

  font-size: 0.86rem;

  line-height: 1.6;
}

.gourmet-public .period-sub.ended-text {
  color: #90653d;
}

.gourmet-public .article-source p {
  font-size: 0.96rem;

  color: #4f565b;

  line-height: 1.85;
}

.gourmet-public .article-source .source-meta {
  color: var(--muted);
}

.gourmet-public .btn {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 8px;

  min-height: 44px;

  padding: 12px 19px;

  border-radius: 14px;

  font-size: 0.96rem;

  font-weight: 800;

  text-align: center;

  line-height: 1.35;
}

.gourmet-public .btn-main {
  background: var(--green);

  border-color: var(--green);

  color: #fff;
}

.gourmet-public .btn-main:hover {
  background: var(--deep);

  color: #fff;
}

.gourmet-public .btn-outline {
  background: #fff;

  color: var(--green);

  border: 1px solid #b6d5c5;
}

.gourmet-public .btn-outline:hover {
  background: #eff8f4;
}

/* サイドバー：イベント詳細と同じ「基本情報」カード */

.gourmet-public .article-sidebar-sticky {
  position: sticky;

  top: 96px;
}

.gourmet-public .store-panel {
  overflow: visible;
}

.gourmet-public .store-data {
  padding: 0;

  margin: 0;
}

.gourmet-public .store-data > div {
  padding: 15px 0;

  border-bottom: 1px solid var(--border);
}

.gourmet-public .store-data > div:first-child {
  padding-top: 0;
}

.gourmet-public .store-data > div:last-child {
  border-bottom: none;

  padding-bottom: 0;
}

.gourmet-public .store-data dt {
  margin: 0 0 4px;

  color: var(--muted);

  font-size: 0.75rem;

  font-weight: 800;
}

.gourmet-public .store-data dd {
  margin: 0;

  color: var(--ink);

  font-size: 0.95rem;

  font-weight: 800;

  line-height: 1.65;

  overflow-wrap: anywhere;
}

.gourmet-public .store-actions {
  margin-top: 20px;
}

.gourmet-public .store-actions .btn {
  display: flex;

  width: 100%;

  margin: 0 0 10px;

  white-space: normal;
}

.gourmet-public .store-actions .btn:last-child {
  margin-bottom: 0;
}

.gourmet-public .sidebar-note {
  display: flex;

  align-items: flex-start;

  gap: 14px;

  margin-top: 24px;

  padding: 24px;

  background: #fff8e8;

  border: 1px solid #f0dfaa;

  border-radius: 22px;

  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.025);
}

.gourmet-public .sidebar-note-icon {
  color: #d99a00;

  font-size: 1.45rem;

  line-height: 1.2;
}

.gourmet-public .sidebar-note strong {
  font-size: 1rem;

  color: var(--ink);
}

.gourmet-public .sidebar-note p {
  margin-top: 7px;

  color: #666a65;

  font-size: 0.9rem;

  line-height: 1.75;
}

.gourmet-public .bottom-nav {
  display: flex;

  justify-content: space-between;

  flex-wrap: wrap;

  gap: 12px;

  padding: 3px 0 6px;
}

.gourmet-public .bottom-nav a {
  color: var(--green);

  font-size: 0.92rem;

  font-weight: 800;
}

/* 一覧側：同じヒーロー・本文・カード・検索UI */

.gourmet-list-page .content-wrap {
  padding-top: 24px;

  padding-bottom: 70px;
}

.gourmet-public .search-panel {
  padding: clamp(22px, 3vw, 38px);

  background: #fff;

  border: 1px solid var(--border);

  border-radius: 22px;

  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.03);
}

.gourmet-public .search-heading {
  display: flex;

  align-items: baseline;

  flex-wrap: wrap;

  margin-bottom: 22px;

  gap: 8px 16px;
}

.gourmet-public .search-heading h2 {
  font-size: clamp(1.25rem, 2vw, 1.7rem);

  font-weight: 900;
}

.gourmet-public .search-heading span {
  color: var(--muted);

  font-size: 0.9rem;
}

.gourmet-public .search-form {
  grid-template-columns:
    minmax(180px, 1.4fr) repeat(3, minmax(130px, 0.85fr))
    auto;

  gap: 12px;
}

.gourmet-public .form-field {
  gap: 7px;
}

.gourmet-public .form-field span {
  font-size: 0.88rem;

  color: #454b50;

  font-weight: 800;
}

.gourmet-public .form-field input,
.gourmet-public .form-field select {
  min-height: 48px;

  height: 48px;

  border-color: #d8e2dc;

  border-radius: 10px;

  font-size: 1rem;

  color: var(--ink);
}

.gourmet-public .search-submit {
  min-height: 48px;

  height: 48px;
}

.gourmet-public .search-shortcuts {
  gap: 10px;

  font-size: 0.86rem;

  margin-top: 19px;
}

.gourmet-public .search-shortcuts a {
  padding: 7px 14px;
}

.gourmet-public .news-section {
  margin-top: 46px;
}

.gourmet-public .news-section-head {
  margin-bottom: 22px;
}

.gourmet-public .news-section-head h2 {
  font-size: clamp(1.4rem, 2.4vw, 2rem);
}

.gourmet-public .count-label {
  font-size: 0.92rem;
}

.gourmet-public .news-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 24px;
}

.gourmet-public .news-card {
  background: #fff;

  border-color: var(--border);

  border-radius: 22px;

  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.03);
}

.gourmet-public .news-card-visual,
.gourmet-public .news-card-visual.visual-campaign,
.gourmet-public .news-card-visual.visual-opening,
.gourmet-public .news-card-visual.visual-event,
.gourmet-public .news-card-visual.visual-limited_menu,
.gourmet-public .news-card-visual.visual-notice {
  height: auto;

  aspect-ratio: 16 / 9;

  color: var(--green);

  background:
    radial-gradient(
      circle at 88% 15%,

      rgba(255, 255, 255, 0.85),
      transparent 33%
    ),
    #e9f6f1;
}

.gourmet-public .visual-symbol {
  font-size: 3.4rem;

  transform: none;

  opacity: 0.6;
}

.gourmet-public .visual-label {
  color: #537968;

  font-size: 0.77rem;
}

.gourmet-public .news-card-content {
  min-height: 270px;

  padding: 23px 24px;
}

.gourmet-public .category-chip,
.gourmet-public .period-chip {
  font-size: 0.78rem;

  border-radius: 999px;

  padding: 5px 11px;
}

.gourmet-public .news-card h3 {
  font-size: 1.22rem;

  line-height: 1.5;

  margin: 13px 0 9px;
}

.gourmet-public .card-description {
  font-size: 0.94rem;

  line-height: 1.8;
}

.gourmet-public .card-footer {
  font-size: 0.84rem;
}

.gourmet-public .card-period {
  font-size: 0.86rem;
}

.gourmet-public .empty-state {
  border-color: var(--border);

  border-radius: 22px;

  padding: 65px 20px;
}

.gourmet-public .empty-state p {
  font-size: 0.94rem;
}

.gourmet-public .pagination {
  font-size: 0.9rem;
}

.gourmet-public .info-footer {
  margin-top: 48px;

  padding: 25px 28px;

  border-radius: 17px;

  border: 1px solid #dceae0;

  color: #345f4c;
}

.gourmet-public .info-footer strong {
  font-size: 1rem;
}

.gourmet-public .info-footer p,
.gourmet-public .info-footer a {
  font-size: 0.9rem;
}

/* イベント詳細と同じフッター */

.gourmet-public .site-footer {
  margin-top: 18px;

  padding: 50px 20px;

  background: #10271f;

  color: rgba(255, 255, 255, 0.72);

  text-align: center;
}

.gourmet-public .footer-inner {
  display: flex;

  align-items: center;

  flex-direction: column;

  justify-content: center;

  gap: 5px;
}

.gourmet-public .footer-logo {
  color: #fff;

  font-size: 1.45rem;

  font-weight: 900;

  letter-spacing: -0.04em;
}

.gourmet-public .footer-inner small {
  color: rgba(255, 255, 255, 0.72);

  font-size: 0.875rem;
}

/* 管理プレビューの警告バーは残し、デザインだけ統一 */

.gourmet-public .preview-bar {
  background: #fff3cd;

  border-bottom: 1px solid #f0dfaa;

  color: #664d03;
}

.gourmet-public .preview-bar .container {
  display: flex;

  align-items: center;

  flex-wrap: wrap;

  gap: 8px 18px;
}

.gourmet-public .preview-bar strong {
  font-size: 0.9rem;
}

.gourmet-public .preview-bar span {
  font-size: 0.88rem;
}

.gourmet-public .preview-bar a {
  margin-left: auto;

  font-size: 0.88rem;
}

@media (max-width: 1199.98px) {
  .gourmet-public .article-layout {
    grid-template-columns: 1fr;
  }

  .gourmet-public .article-sidebar-sticky {
    position: static;
  }

  .gourmet-public .article-sidebar {
    display: grid;

    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);

    gap: 24px;
  }

  .gourmet-public .article-sidebar-sticky {
    display: contents;
  }

  .gourmet-public .sidebar-note {
    margin-top: 0;

    align-self: start;
  }

  .gourmet-public .search-form {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .gourmet-public .search-form .grow {
    grid-column: span 2;
  }

  .gourmet-public .search-form .search-submit {
    grid-column: auto;
  }
}

@media (max-width: 991.98px) {
  .gourmet-public .gourmet-hero,
  .gourmet-public .article-hero,
  .gourmet-public .gourmet-hero-inner,
  .gourmet-public .article-hero-inner {
    min-height: 420px;
  }

  .gourmet-public .news-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 18px;
  }

  .gourmet-public .article-sidebar {
    display: grid;

    grid-template-columns: 1fr;
  }

  .gourmet-public .article-sidebar-sticky {
    display: block;
  }

  .gourmet-public .sidebar-note {
    margin-top: 24px;
  }
}

@media (max-width: 767.98px) {
  .gourmet-public .container {
    padding-inline: 11px;
  }

  .gourmet-public .site-header-inner {
    min-height: 68px;

    padding-block: 10px;
  }

  .gourmet-public .site-logo {
    width: 132px;

    max-width: 48%;
  }

  .gourmet-public .site-nav {
    gap: 6px;
  }

  .gourmet-public .site-nav a {
    padding: 8px 10px;

    font-size: 0.82rem;
  }

  .gourmet-public .site-nav .header-search span {
    display: none;
  }

  .gourmet-public .gourmet-hero,
  .gourmet-public .article-hero,
  .gourmet-public .gourmet-hero-inner,
  .gourmet-public .article-hero-inner {
    min-height: 390px;
  }

  .gourmet-public .gourmet-hero-inner,
  .gourmet-public .article-hero-inner {
    padding-block: 46px;
  }

  .gourmet-public .gourmet-hero h1,
  .gourmet-public .article-hero h1 {
    font-size: 2.35rem;

    line-height: 1.14;
  }

  .gourmet-public .gourmet-hero p,
  .gourmet-public .article-lead {
    font-size: 0.96rem;
  }

  .gourmet-public .article-layout-wrap {
    padding-top: 20px;
  }

  .gourmet-public .article-main {
    gap: 18px;
  }

  .gourmet-public .article-paper,
  .gourmet-public .store-panel {
    padding: 21px;

    border-radius: 17px;
  }

  .gourmet-public .article-section-head,
  .gourmet-public .store-panel-header {
    gap: 11px;

    margin-bottom: 18px;
  }

  .gourmet-public .heading-icon {
    flex-basis: 39px;

    width: 39px;

    height: 39px;
  }

  .gourmet-public .article-prose,
  .gourmet-public .highlights-list {
    font-size: 1rem;
  }

  .gourmet-public .article-period-card {
    gap: 12px;

    padding: 15px;
  }

  .gourmet-public .card-icon {
    flex-basis: 42px;

    width: 42px;

    height: 42px;
  }

  .gourmet-list-page .content-wrap {
    padding-top: 20px;
  }

  .gourmet-public .search-panel {
    padding: 21px;

    border-radius: 17px;
  }

  .gourmet-public .search-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 12px;
  }

  .gourmet-public .search-form .grow {
    grid-column: 1 / -1;
  }

  .gourmet-public .search-form .search-submit {
    grid-column: 1 / -1;
  }

  .gourmet-public .news-grid {
    grid-template-columns: 1fr;
  }

  .gourmet-public .news-card-content {
    min-height: 0;
  }

  .gourmet-public .info-footer {
    flex-direction: column;

    align-items: flex-start;

    gap: 8px;
  }

  .gourmet-public .site-footer {
    padding: 40px 20px;
  }
}

@media (max-width: 400px) {
  .gourmet-public .site-logo {
    width: 120px;
  }

  .gourmet-public .site-nav a {
    font-size: 0.76rem;

    padding-inline: 8px;
  }

  .gourmet-public .gourmet-hero h1,
  .gourmet-public .article-hero h1 {
    font-size: 2rem;
  }

  .gourmet-public .article-hero-bottom {
    font-size: 0.78rem;
  }

  .gourmet-public .article-section-head h2,
  .gourmet-public .store-panel-header h2 {
    font-size: 1.2rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gourmet-public .news-card,
  .gourmet-public .btn {
    transition: none;
  }
}

/* グルメニュース一覧だけ、専用メイン画像を背景に使用。
   記事詳細（.article-hero）のヒーローには適用しない。 */
.gourmet-public.gourmet-list-page .gourmet-hero {
  background-color: #0d4736;
  background-image:
    linear-gradient(
      90deg,
      rgba(5, 32, 24, 0.84) 0%,
      rgba(5, 32, 24, 0.62) 48%,
      rgba(5, 32, 24, 0.22) 100%
    ),
    url("/images/satsudoko-gourmet-hero.webp");
  background-position:
    center,
    center 48%;
  background-repeat: no-repeat;
  background-size: cover;
}
@media (max-width: 767.98px) {
  .gourmet-public.gourmet-list-page .gourmet-hero {
    background-image:
      linear-gradient(
        90deg,
        rgba(5, 32, 24, 0.86) 0%,
        rgba(5, 32, 24, 0.62) 72%,
        rgba(5, 32, 24, 0.32) 100%
      ),
      url("/images/satsudoko-gourmet-hero.webp");
    background-position:
      center,
      68% center;
  }
}
