:root {
  --bg: #F5F0E7; --bg-alt: #EDE5D2; --paper: #FAF6ED;
  --ink: #16100E; --ink-soft: #3D3633; --ink-mute: #635C57;
  --accent: #A8351F; --accent-deep: #862719;
  --warm: #7A6447; --line: #C0B69E; --line-soft: #D6CCB3;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
a:focus-visible, button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
body {
  background:var(--bg); color:var(--ink);
  font-family:'Noto Sans JP', sans-serif; font-weight:400;
  line-height:1.8; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden; font-size:16px;
}
body::before {
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background-image:
    radial-gradient(ellipse 1.5px 2.2px at 18% 22%, rgba(184,73,58,0.035) 60%, transparent 70%),
    radial-gradient(ellipse 1.2px 1.8px at 67% 38%, rgba(139,115,85,0.04) 60%, transparent 70%),
    radial-gradient(ellipse 1.5px 2.3px at 42% 71%, rgba(26,23,23,0.025) 60%, transparent 70%);
  background-size: 64px 64px, 96px 96px, 80px 80px;
}
main { position:relative; z-index:1; }

.masthead {
  border-bottom:1px solid var(--line); padding:1rem 2rem;
  display:flex; justify-content:space-between; align-items:center;
  font-family:'Zen Kaku Gothic Antique', sans-serif; font-weight:500;
  font-size:.8rem; letter-spacing:.12em; color:var(--ink-soft); text-transform:uppercase;
}
.masthead a { color:var(--ink-mute); text-decoration:none; transition:color .25s; }
.masthead a:hover { color:var(--accent); }
.masthead .accent-dot { width:5px; height:5px; background:var(--accent); border-radius:50%; display:inline-block; margin-right:.5rem; }
.masthead { flex-wrap:wrap; gap:.7rem 1.2rem; }
.masthead .left { display:flex; gap:1.2rem; align-items:center; flex-wrap:wrap; }
.masthead .brand-link { color:var(--ink); font-weight:700; }
.masthead-nav { display:flex; gap:1.2rem; align-items:center; flex-wrap:wrap; }
.masthead-nav a { color:var(--ink-mute); text-decoration:none; transition:color .25s; padding:.45rem .25rem; margin:-.45rem -.25rem; }
.masthead-nav a:hover { color:var(--accent); }
@media (max-width:640px){ .masthead-nav{ gap:.9rem; font-size:.72rem; } }

.hero {
  max-width:1100px; margin:0 auto; padding:5rem 2rem 3rem;
}
.hero__eyebrow {
  font-family:'Cormorant Garamond', serif; font-style:italic;
  font-size:.95rem; color:var(--accent); letter-spacing:.15em;
  margin-bottom:1rem;
}
.hero__title {
  font-family:'Shippori Mincho', serif; font-weight:700;
  font-size:clamp(2.5rem, 6vw, 4rem);
  letter-spacing:.02em; line-height:1.2; color:var(--ink);
  margin-bottom:1rem;
}
.hero__title .accent { color:var(--accent); }
.hero__lede {
  font-size:1.05rem; color:var(--ink-soft); max-width:680px;
  border-left:3px solid var(--accent); padding-left:1.5rem; line-height:1.9;
  font-weight:400;
}
.hero__guide {
  font-family:'Zen Kaku Gothic Antique', sans-serif;
  font-size:.92rem; color:var(--ink-mute); max-width:680px;
  margin-top:1.6rem; line-height:2.1; letter-spacing:.02em; font-weight:400;
}
.hero__guide a { color:var(--accent); text-decoration:none; border-bottom:1px solid var(--accent); padding-bottom:1px; }
.hero__guide a:hover { color:var(--accent-deep); border-color:var(--accent-deep); }

.section { max-width:1100px; margin:0 auto; padding:0 2rem 4rem; }
.section-meta {
  display:flex; align-items:baseline; gap:1.25rem; margin-bottom:1.5rem;
}
.section-meta__num {
  font-family:'Cormorant Garamond', serif; font-style:italic;
  font-size:1.15rem; color:var(--accent); letter-spacing:.05em;
}
.section-meta__label {
  font-family:'Zen Kaku Gothic Antique', sans-serif;
  font-size:.88rem; font-weight:700; letter-spacing:.18em; color:var(--ink);
  text-transform:uppercase;
}
.section-meta__count {
  font-family:'Cormorant Garamond', serif; font-style:italic;
  font-size:1rem; color:var(--ink-soft); letter-spacing:.05em;
}
.section-meta__rule { flex:1; height:1px; background:var(--line); }

.cat-title {
  font-family:'Shippori Mincho', serif; font-weight:700;
  font-size:1.65rem; letter-spacing:.02em; color:var(--ink);
  margin-bottom:.6rem;
}
.cat-title .accent { color:var(--accent); }
.cat-desc {
  font-size:.98rem; color:var(--ink-soft); margin-bottom:1.5rem; line-height:1.8;
  font-weight:400;
}

.entries {
  display:flex; flex-direction:column;
  border:1px solid var(--line);
  margin-bottom:3rem;
}
.entry {
  background:var(--bg); padding:1.1rem 1.5rem;
  display:grid; grid-template-columns:1fr; gap:.4rem;
  transition:background .3s;
  text-decoration:none; color:var(--ink);
  border-bottom:1px solid var(--line);
}
.entry:last-child { border-bottom:none; }
@media (min-width:760px) {
  .entry { grid-template-columns:1.5fr 1fr 1fr; align-items:center; gap:1rem; }
}
.entry:hover { background:var(--paper); }
.entry__brand {
  font-family:'Shippori Mincho', serif; font-weight: 700;
  font-size:1.08rem; color:var(--ink); line-height:1.5;
}
.entry__brewery {
  font-family:'Noto Sans JP', sans-serif; font-weight:400;
  font-size:.88rem; color:var(--ink-soft); letter-spacing:.02em;
  margin-top:.15rem;
}
.entry__brewery::before { content:"— "; color:var(--accent); }
.entry__specs { display:flex; gap:.4rem; flex-wrap:wrap; }
.spec-pill {
  font-family:'Zen Kaku Gothic Antique', sans-serif; font-weight:500;
  font-size:.78rem; letter-spacing:.02em; color:var(--ink-soft);
  background:var(--bg-alt); padding:.25rem .65rem;
}
.spec-pill.accent { color:var(--accent); background:transparent; border:1px solid var(--accent); }
.spec-pill.warm { color:var(--warm); background:transparent; border:1px solid var(--warm); }



/* ふるさと納税の行（行全体リンクをやめ、蔵名とポータルを個別リンクに） */
.entry--furusato { cursor:default; }
.entry--furusato:hover { background:var(--bg); }
.entry__brand a { color:var(--ink); text-decoration:none; border-bottom:1px solid transparent; }
.entry__brand a:hover { color:var(--accent); border-bottom-color:var(--accent); }
a.spec-pill.portal-link { text-decoration:none; display:inline-flex; align-items:center;
  min-height:36px; transition:background .2s,color .2s; }
a.spec-pill.portal-link:hover { background:var(--accent); color:var(--paper); border-color:var(--accent); }

.brewery-cell { display:flex; flex-direction:column; border-bottom:1px solid var(--line); }
@media (min-width:600px) {
  .brewery-cell { border-right:1px solid var(--line); }
  .brewery-cell:nth-child(2n) { border-right:none; }
}
.brewery-cell .brewery-card { border-bottom:none; border-right:none; flex:1; }
.card-picks { display:flex; flex-wrap:wrap; align-items:baseline; gap:.4rem .55rem;
  padding:0 1.5rem 1.1rem; }
.card-picks__label { font-family:'Cormorant Garamond',serif; font-style:italic;
  font-size:.72rem; color:var(--ink-mute); letter-spacing:.08em; }
.card-picks__item { font-family:'Zen Kaku Gothic Antique',sans-serif; font-size:.82rem;
  color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line);
  padding-bottom:1px; }
.card-picks__item:hover { color:var(--accent); border-bottom-color:var(--accent); }
.card-picks__more { font-size:.78rem; color:var(--ink-mute); }
@media (max-width:640px){ .card-picks { padding:0 1.25rem 1rem; } }

.brewery-grid {
  display:grid; grid-template-columns:1fr; gap:0;
  border-top:1px solid var(--line);
}
@media (min-width:600px) { .brewery-grid { grid-template-columns:repeat(2, 1fr); } }
.brewery-card {
  padding:1.5rem; border-bottom:1px solid var(--line);
  background:var(--bg); text-decoration:none; color:var(--ink);
  display:flex; flex-direction:column; gap:.4rem;
  transition:background .3s, padding-left .3s;
}
@media (min-width:600px) {
  .brewery-card { border-right:1px solid var(--line); }
  .brewery-card:nth-child(2n) { border-right:none; }
}
.brewery-card:hover { background:var(--paper); padding-left:1.75rem; }
.brewery-card__num {
  font-family:'Cormorant Garamond', serif; font-style:italic;
  font-size:.85rem; color:var(--accent); letter-spacing:.05em;
}
.brewery-card__name {
  font-family:'Shippori Mincho', serif; font-weight:700;
  font-size:1.25rem; color:var(--ink); letter-spacing:.02em;
}
.brewery-card__meta {
  font-family:'Noto Sans JP', sans-serif; font-weight:400;
  font-size:.85rem; color:var(--ink-soft); letter-spacing:.02em;
}
.brewery-card__features {
  font-size:.9rem; color:var(--ink-soft); line-height:1.7; margin-top:.35rem;
  font-weight:400;
}

.empty-region {
  background:var(--bg-alt); padding:2rem; border-left:3px solid var(--warm);
  font-family:'Shippori Mincho', serif;
  color:var(--ink-soft); font-size:.95rem;
}
.empty-region em {
  font-family:'Cormorant Garamond', serif; font-style:italic;
  color:var(--accent); letter-spacing:.05em;
}

.divider {
  max-width:1100px; margin:3rem auto; padding:0 2rem;
  display:flex; align-items:center; gap:1rem;
}
.divider .rule { flex:1; height:1px; background:var(--line); }
.divider .ornament { width:8px; height:8px; background:var(--accent); transform:rotate(45deg); }
.divider .ornament.outer { width:4px; height:4px; background:var(--warm); }

footer { margin-top:5rem; border-top:1px solid var(--ink); position:relative; z-index:1; }
.colophon {
  max-width:1100px; margin:0 auto; padding:2rem;
  display:grid; grid-template-columns:1fr; gap:1.5rem;
}
@media (min-width:700px) { .colophon { grid-template-columns:2fr 3fr; } }
.colophon__brand {
  font-family:'Shippori Mincho', serif; font-weight:700;
  font-size:1.5rem; letter-spacing:.02em;
}
.colophon__brand .dot { color:var(--accent); }
.colophon__brand a { color:var(--ink); text-decoration:none; }
.colophon__brand small {
  display:block; font-family:'Cormorant Garamond', serif; font-style:italic;
  font-size:.8rem; color:var(--ink-soft); margin-top:.25rem;
  font-weight:400; letter-spacing:.08em;
}
.colophon__notes {
  font-family:'Noto Sans JP', sans-serif; font-weight:400;
  font-size:.88rem; color:var(--ink-soft); line-height:1.9; letter-spacing:.02em;
}
.colophon__notes strong { color:var(--accent); font-weight:500; }
.colophon__notes a { color:var(--warm); text-decoration:none; }
.colophon__notes a:hover { color:var(--accent); }
.colophon__sep { color:var(--line); margin:0 .5rem; }

/* セクションヘッダー画像 (Vertex AI) */
.cat-image {
  margin: 0 0 2rem;
  overflow: hidden;
  border: 1px solid var(--line);
  position: relative;
}
.cat-image img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 280px;
  object-fit: cover;
  filter: contrast(0.98) saturate(0.95);
}
.cat-image__cap {
  position: absolute;
  bottom: .5rem;
  right: .75rem;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: .65rem;
  color: rgba(255,255,255,0.92);
  letter-spacing: .12em;
  background: rgba(26,23,23,0.45);
  padding: .15rem .5rem;
}

.article { max-width:1100px; margin:0 auto; padding:0 2rem 2rem; }
.prose { max-width:760px; }
.prose p { font-size:1.02rem; color:var(--ink-soft); line-height:1.95; margin-bottom:1.4rem; }
.prose strong { color:var(--ink); font-weight:600; }
.prose a { color:var(--accent); text-decoration:none; border-bottom:1px solid var(--line-soft); transition:border-color .25s; }
.prose a:hover { border-bottom-color:var(--accent); }
.lead {
  font-family:'Shippori Mincho', serif; font-size:1.22rem; line-height:1.95;
  color:var(--ink); margin-bottom:1.8rem; font-weight:500;
}
.lead .accent { color:var(--accent); }

/* 用語・区分グリッド */
.term-grid { display:grid; grid-template-columns:1fr; border:1px solid var(--line); margin:1rem 0 2.5rem; max-width:860px; }
@media (min-width:680px){ .term-grid { grid-template-columns:1fr 1fr; } }
.term { padding:1.2rem 1.4rem; border-bottom:1px solid var(--line); background:var(--bg); }
@media (min-width:680px){ .term { border-right:1px solid var(--line); } .term:nth-child(2n){ border-right:none; } }
.term:last-child{ border-bottom:none; }
.term__name { font-family:'Shippori Mincho',serif; font-weight:700; font-size:1.12rem; color:var(--ink); margin-bottom:.4rem; }
.term__name .en { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:.82rem; color:var(--accent); margin-left:.5rem; letter-spacing:.05em; }
.term__desc { font-size:.92rem; color:var(--ink-soft); line-height:1.8; }

/* 温度テーブル */
.temp-table { width:100%; max-width:760px; border-collapse:collapse; margin:1rem 0 1rem; font-size:.92rem; }
.temp-table th, .temp-table td { text-align:left; padding:.7rem 1rem; border-bottom:1px solid var(--line-soft); }
.temp-table thead th {
  font-family:'Zen Kaku Gothic Antique',sans-serif; font-weight:700; letter-spacing:.1em;
  font-size:.75rem; text-transform:uppercase; color:var(--ink); border-bottom:1px solid var(--line);
}
.temp-table td.t { font-family:'Zen Kaku Gothic Antique',sans-serif; font-weight:700; font-style:normal; color:var(--accent); white-space:nowrap; font-size:1rem; letter-spacing:.01em; }
.temp-table tr.grp td { background:var(--bg-alt); font-family:'Shippori Mincho',serif; font-weight: 700; color:var(--ink); letter-spacing:.04em; }
.temp-note { font-size:.82rem; color:var(--ink-mute); margin:0 0 2.2rem; max-width:760px; line-height:1.7; }

/* 注意ボックス */
.callout { background:var(--bg-alt); border-left:3px solid var(--accent); padding:1.3rem 1.5rem; margin:1.6rem 0 2.2rem; max-width:760px; }
.callout__label {
  font-family:'Zen Kaku Gothic Antique',sans-serif; font-weight:700; letter-spacing:.12em;
  font-size:.74rem; color:var(--accent); text-transform:uppercase; margin-bottom:.5rem;
}
.callout p { font-size:.9rem; color:var(--ink-soft); line-height:1.85; margin:0; }
.callout a { color:var(--accent); text-decoration:none; border-bottom:1px solid var(--line-soft); }

/* ハブへのリンク行 */
.pill-links { display:flex; flex-wrap:wrap; gap:.6rem; margin:1rem 0 2.5rem; }
.pill-links a {
  font-family:'Zen Kaku Gothic Antique',sans-serif; font-weight:500; font-size:.9rem;
  letter-spacing:.03em; color:var(--ink); text-decoration:none;
  border:1px solid var(--line); padding:.55rem 1.1rem; transition:border-color .25s,color .25s;
}
.pill-links a:hover { border-color:var(--accent); color:var(--accent); }
.pill-links a .arr { color:var(--accent); margin-left:.45rem; }

/* 蔵リンクのインライン群 */
.kura-links { display:flex; flex-wrap:wrap; gap:.55rem 1rem; margin:.2rem 0 2rem; max-width:760px; }
.kura-links a { font-family:'Shippori Mincho',serif; font-size:.98rem; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); padding-bottom:1px; transition:color .25s,border-color .25s; }
.kura-links a:hover { color:var(--accent); border-bottom-color:var(--accent); }

/* 次に読む */
.readmore { display:grid; grid-template-columns:1fr; gap:1rem; margin:1.5rem 0 0; max-width:860px; }
@media (min-width:680px){ .readmore { grid-template-columns:1fr 1fr; } }
.readmore a { display:block; border:1px solid var(--line); padding:1.4rem 1.5rem; text-decoration:none; background:var(--bg); transition:background .3s,padding-left .3s; }
.readmore a:hover { background:var(--paper); padding-left:1.75rem; }
.readmore__k { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:.8rem; color:var(--accent); letter-spacing:.08em; }
.readmore__t { font-family:'Shippori Mincho',serif; font-weight:700; font-size:1.18rem; color:var(--ink); margin-top:.3rem; line-height:1.4; }

.sub-h { font-family:'Shippori Mincho',serif; font-weight:700; font-size:1.3rem; color:var(--ink); margin:.4rem 0 .9rem; letter-spacing:.02em; line-height:1.5; }
.sub-h.tight { margin-top:1.8rem; }
.sub-h .accent { color:var(--accent); }

/* 読みもの一覧（ガイドのハブ） */
.guide-list { border-top:1px solid var(--line); max-width:980px; margin:0 auto; }
.guide-card {
  display:grid; grid-template-columns:auto 1fr auto; gap:1.5rem; align-items:center;
  padding:1.9rem 1rem; border-bottom:1px solid var(--line);
  text-decoration:none; color:var(--ink); transition:background .3s,padding-left .3s;
}
.guide-card:hover { background:var(--paper); padding-left:1.5rem; }
.guide-card__mark { width:10px; height:10px; background:var(--line); transform:rotate(45deg); transition:background .3s; }
.guide-card:hover .guide-card__mark { background:var(--accent); }
.guide-card__eyebrow { font-family:'Zen Kaku Gothic Antique',sans-serif; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); margin-bottom:.4rem; }
.guide-card__title { font-family:'Shippori Mincho',serif; font-weight:700; font-size:1.5rem; color:var(--ink); margin-bottom:.5rem; line-height:1.4; }
.guide-card__sum { font-size:.92rem; color:var(--ink-soft); line-height:1.8; }
.guide-card__arr { font-family:'Cormorant Garamond',serif; font-style:italic; color:var(--accent); font-size:1rem; white-space:nowrap; letter-spacing:.08em; }
@media (max-width:680px){ .guide-card { grid-template-columns:auto 1fr; } .guide-card__arr{ display:none; } }
.cat-lead { max-width:760px; font-size:.95rem; color:var(--ink-soft); line-height:1.85; margin:-.4rem 0 1.2rem; }
.guide-foot { max-width:760px; margin:2.6rem auto 0; font-size:.95rem; color:var(--ink-soft); line-height:1.9; }
.guide-foot a { color:var(--accent); text-decoration:none; border-bottom:1px solid var(--line-soft); }

/* おすすめ（ランキング）カード */
.pick-group { font-family:'Shippori Mincho',serif; font-weight:700; font-size:1.18rem; color:var(--ink); max-width:820px; margin:2.6rem 0 1.1rem; padding-bottom:.5rem; border-bottom:1px solid var(--line); letter-spacing:.03em; }
.pick-group:first-of-type { margin-top:.6rem; }
.pick-group .en { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:.8rem; color:var(--accent); margin-left:.6rem; letter-spacing:.06em; }
.pick { display:grid; grid-template-columns:auto 1fr; gap:1.1rem 1.3rem; max-width:820px; padding:1.5rem 0; border-bottom:1px solid var(--line-soft); }
.pick__no { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:2rem; line-height:1; color:var(--line); padding-top:.1rem; }
.pick__head { display:flex; flex-wrap:wrap; align-items:baseline; gap:.5rem .9rem; margin-bottom:.5rem; }
.pick__kura { font-size:.82rem; color:var(--ink-mute); letter-spacing:.04em; }
.pick__kura a { color:var(--warm); text-decoration:none; border-bottom:1px solid var(--line-soft); }
.pick__kura a:hover { color:var(--accent); }
.pick__name { font-family:'Shippori Mincho',serif; font-weight:700; font-size:1.24rem; color:var(--ink); line-height:1.4; width:100%; }
.pick__tags { display:flex; flex-wrap:wrap; gap:.4rem; margin:.1rem 0 .55rem; }
.pick__tag { font-family:'Zen Kaku Gothic Antique',sans-serif; font-size:.72rem; letter-spacing:.04em; color:var(--ink-soft); border:1px solid var(--line); padding:.16rem .6rem; }
.pick__spec { font-size:.84rem; color:var(--ink-mute); letter-spacing:.02em; margin-bottom:.6rem; }
.pick__spec b { color:var(--ink-soft); font-weight:600; }
.pick__note { font-size:.95rem; color:var(--ink-soft); line-height:1.85; margin-bottom:.9rem; }
.pick__links { display:flex; flex-wrap:wrap; gap:.6rem .9rem; align-items:center; }
.pick__detail { font-family:'Shippori Mincho',serif; font-size:.92rem; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); padding-bottom:1px; }
.pick__detail:hover { color:var(--accent); border-bottom-color:var(--accent); }
.pick__btn { font-family:'Zen Kaku Gothic Antique',sans-serif; font-weight:500; font-size:.9rem; letter-spacing:.03em; color:var(--paper); background:var(--accent); border:1px solid var(--accent); padding:.5rem 1.1rem; text-decoration:none; }
.pick__btn:hover { background:var(--accent-deep); border-color:var(--accent-deep); }
.pick__btn--amazon { color:var(--accent); background:transparent; border:1px solid var(--accent); margin-left:.5rem; }
.pick__btn--amazon:hover { color:var(--paper); background:var(--accent); }
.pick__pr { font-size:.72rem; color:var(--ink-mute); letter-spacing:.04em; }
@media (max-width:600px){ .pick { grid-template-columns:1fr; gap:.2rem; } .pick__no { font-size:1.4rem; } }

/* スペック比較表 */
.cmp-wrap { max-width:820px; overflow-x:auto; margin:1rem 0 1rem; }
.cmp { width:100%; border-collapse:collapse; font-size:.84rem; white-space:nowrap; }
.cmp th, .cmp td { text-align:left; padding:.6rem .8rem; border-bottom:1px solid var(--line-soft); }
.cmp thead th { font-family:'Zen Kaku Gothic Antique',sans-serif; font-weight:700; letter-spacing:.06em; font-size:.72rem; color:var(--ink); border-bottom:1px solid var(--line); }
.cmp td.nm { font-family:'Shippori Mincho',serif; color:var(--ink); white-space:normal; min-width:11rem; }
.cmp td.p { font-family:'Zen Kaku Gothic Antique',sans-serif; color:var(--accent); font-weight:700; }
.cmp a { color:inherit; text-decoration:none; border-bottom:1px solid var(--line-soft); }
.cmp a:hover { color:var(--accent); }
