/*
Theme Name: CLUB EIKI
Theme URI: https://www.eiki-kk.com/clubeiki/
Author: EIKI
Description: CLUB EIKI の現行デザインと大会情報・お知らせ表示に対応した専用テーマ。
Version: 1.0.0
Requires at least: 6.2
Requires PHP: 7.4
Text Domain: club-eiki
*/

:root {
  --ce-bg: #f4f2ee;
  --ce-surface: #fff;
  --ce-ink: #121212;
  --ce-red: #c8102e;
  --ce-muted: #666;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.club-eiki-inner {
  margin: 0;
  background: var(--ce-bg);
  color: var(--ce-ink);
  font-family: "Noto Sans JP", sans-serif;
  line-height: 1.8;
}
.ce-site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(244, 242, 238, .96);
  border-bottom: 3px solid var(--ce-ink);
}
.admin-bar .ce-site-header { top: 32px; }
.ce-header-inner,
.ce-main,
.ce-footer-inner {
  width: min(1120px, calc(100% - 32px));
  margin-inline: auto;
}
.ce-header-inner {
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.ce-logo img { display: block; width: min(260px, 55vw); height: auto; }
.ce-nav { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.ce-nav a { color: var(--ce-ink); font-weight: 800; text-decoration: none; }
.ce-nav a:hover,
.ce-nav a:focus-visible { color: var(--ce-red); }
.ce-main { padding-block: clamp(40px, 7vw, 88px); min-height: 65vh; }
.ce-page-title {
  display: inline-block;
  margin: 0 0 34px;
  padding: 7px 18px;
  background: var(--ce-ink);
  color: #fff;
  font-size: clamp(26px, 4vw, 44px);
  line-height: 1.35;
  transform: rotate(-.5deg);
}
.ce-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 28px; }
.ce-card {
  display: flex;
  flex-direction: column;
  border: 4px solid var(--ce-ink);
  background: var(--ce-surface);
  box-shadow: 9px 9px 0 var(--ce-ink);
  color: var(--ce-ink);
  text-decoration: none;
}
.ce-card:hover { transform: translate(-2px, -2px); box-shadow: 11px 11px 0 var(--ce-red); }
.ce-card-image { aspect-ratio: 16 / 10; width: 100%; object-fit: cover; border-bottom: 4px solid var(--ce-ink); }
.ce-card-body { padding: 22px; }
.ce-meta { display: flex; flex-wrap: wrap; gap: 8px 16px; color: var(--ce-muted); font-size: 13px; font-weight: 700; }
.ce-tag { display: inline-block; padding: 2px 10px; background: var(--ce-red); color: #fff; }
.ce-card-title { margin: 12px 0 8px; font-size: 21px; line-height: 1.5; }
.ce-card-excerpt { margin: 0; color: #444; }
.ce-article { max-width: 850px; margin-inline: auto; }
.ce-article-image { width: 100%; height: auto; margin: 24px 0 34px; border: 4px solid var(--ce-ink); box-shadow: 10px 10px 0 var(--ce-ink); }
.ce-event-facts { display: grid; gap: 12px; margin: 24px 0 34px; padding: 20px; border: 3px solid var(--ce-ink); background: #fff; }
.ce-event-facts div { display: grid; grid-template-columns: 7em 1fr; gap: 12px; }
.ce-event-facts dt { font-weight: 900; }
.ce-event-facts dd { margin: 0; }
.ce-content { font-size: 16px; }
.ce-content img { max-width: 100%; height: auto; }
.ce-button {
  display: inline-block;
  margin-top: 20px;
  padding: 12px 22px;
  border: 3px solid var(--ce-ink);
  background: var(--ce-red);
  color: #fff;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 5px 5px 0 var(--ce-ink);
}
.ce-site-footer { margin-top: 60px; border-top: 4px solid var(--ce-ink); background: var(--ce-ink); color: #fff; }
.ce-footer-inner { padding-block: 30px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; }
.ce-site-footer a { color: #fff; }
.ce-empty { padding: 26px; border: 3px solid var(--ce-ink); background: #fff; }
@media (max-width: 782px) {
  .admin-bar .ce-site-header { top: 46px; }
  .ce-header-inner { padding-block: 12px; align-items: flex-start; flex-direction: column; }
  .ce-nav { gap: 10px 14px; }
  .ce-event-facts div { grid-template-columns: 1fr; gap: 2px; }
}

