/* spoke.css - landing (spoke) pages only, 2026-10-26. Loaded after main.css and sumo-training-overhaul.css, so it
   reuses their tokens (--sumi ink, --washi / --washi-pure paper, --shu amber, --kasumi hairline, --ink-wash text) and
   the magazine look: flat panels, sharp corners, no shadows. CTA-kit devices: guide-inline-cta, choice-cta,
   guide-cta-card; plus the pinned calendar, the compare table, map figures and the partner devices. */

/* The homepage's masthead dateline names the training dojo; the show spokes carry their own */
.hero-content::before { content: "相撲 · SUMO SHOWS · TOKYO"; }
.hero::after { content: "相撲"; }

.spoke-article { padding-top: 2.5rem; }
.spoke-breadcrumb { margin-bottom: 1.25rem; font-size: 0.85rem; }
.spoke-breadcrumb .breadcrumb-list { display: flex; flex-wrap: wrap; gap: 0.4rem; list-style: none; padding: 0; margin: 0; }
.spoke-breadcrumb .breadcrumb-list li + li::before { content: "/"; margin-right: 0.4rem; color: var(--cha); }
.spoke-updated { font-family: var(--font-ui); font-size: 0.8rem; letter-spacing: 0.06em; color: var(--ink-wash); margin-top: 0.5rem; }

.editorial-prose h2 { margin-top: 2.6rem; }
.editorial-prose h3 { margin-top: 1.8rem; }
.editorial-prose p, .editorial-prose li { line-height: 1.7; }

/* Buttons inside prose keep button colours, never the link underline (feedback_prose_button_contrast_guard) */
.prose a.btn-primary, .prose a.btn-primary:visited { color: var(--washi-pure); text-decoration: none; }
.prose a.btn-primary:hover { color: #8E5D15; }

/* Inline verdict button */
.guide-inline-cta { margin: 1.4rem 0 1.8rem; }

/* Pinned availability calendar */
.spoke-widget { margin: 1.8rem 0 2.2rem; padding: 1.25rem; background: var(--washi-pure); border: 1px solid var(--kasumi); }
.spoke-widget__title { font-family: var(--font-ui); font-size: 0.85rem; letter-spacing: 0.1em; text-transform: uppercase; margin: 0 0 0.8rem; color: var(--sumi); }
.spoke-widget__facts { font-size: 0.9rem; color: var(--ink-wash); margin: 0.9rem 0 0; }

/* Compare table */
.editorial-prose table { width: 100%; border-collapse: collapse; margin: 1.4rem 0; font-size: 0.92rem; display: block; overflow-x: auto; }
.editorial-prose th, .editorial-prose td { border: 1px solid var(--kasumi); padding: 0.55rem 0.65rem; text-align: left; vertical-align: top; }
.editorial-prose th { background: var(--sumi); color: var(--washi-pure); font-family: var(--font-ui); font-weight: 500; letter-spacing: 0.04em; }
.editorial-prose tr:nth-child(even) td { background: rgba(255, 255, 255, 0.35); }

/* Choice cards (persona split) */
.choice-cta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 1.2rem 0 0.6rem; }
.choice-cta--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.choice-card { display: flex; flex-direction: column; gap: 0.5rem; padding: 1.1rem; background: var(--washi-pure); border: 1px solid var(--kasumi); }
.choice-card--primary { border: 2px solid var(--shu); }
.choice-card__tag { font-family: var(--font-ui); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--kincha); }
.choice-card__title { font-size: 1.05rem; margin: 0; line-height: 1.3; }
.choice-card__meta { font-size: 0.85rem; color: var(--ink-wash); margin: 0; }
.choice-card__why { font-size: 0.92rem; margin: 0; flex: 1; }
.choice-card .btn-primary { white-space: normal; text-align: center; margin-top: 0.4rem; }
.choice-note { font-size: 0.85rem; color: var(--ink-wash); }

/* Map and image figures */
.editorial-figure { margin: 1.8rem 0; }
.editorial-figure img { width: 100%; height: auto; display: block; border: 1px solid var(--kasumi); }
.editorial-figure figcaption { font-size: 0.85rem; color: var(--ink-wash); margin-top: 0.5rem; }

/* Stay22 hotel map */
.stay22-map { margin: 1.4rem 0; }
.stay22-map iframe { display: block; width: 100%; height: 420px; border: 1px solid var(--kasumi); }
.stay22-map figcaption { font-size: 0.85rem; color: var(--ink-wash); margin-top: 0.4rem; }

/* GuruWalk image card: a card, never a btn-* (owner 2026-10-26) */
.prose a.guruwalk-card, a.guruwalk-card { display: grid; grid-template-columns: 200px 1fr; gap: 1rem; align-items: center; margin: 1.6rem 0; padding: 0.9rem; background: var(--washi-pure); border: 1px solid var(--kasumi); color: var(--sumi); text-decoration: none; }
a.guruwalk-card--text { grid-template-columns: 1fr; }
a.guruwalk-card img { width: 100%; height: auto; display: block; }
.guruwalk-card__body { display: flex; flex-direction: column; gap: 0.35rem; }
.guruwalk-card__title { font-weight: 700; font-size: 1.02rem; }
.guruwalk-card__text { font-size: 0.92rem; color: var(--ink-wash); }
.guruwalk-card__go { font-family: var(--font-ui); font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; color: #8E5D15; }
a.guruwalk-card:hover { border-color: var(--shu); }

/* End-of-page media card */
.spoke-end { padding-top: 1rem; }
.guide-cta-card { display: grid; grid-template-columns: 240px 1fr; gap: 1.4rem; align-items: center; padding: 1.2rem; background: var(--sumi); color: var(--washi-pure); }
.guide-cta-card__img { width: 100%; height: auto; display: block; }
.guide-cta-card__title { color: var(--washi-pure); font-size: 1.3rem; margin: 0 0 0.5rem; }
.guide-cta-card p.guide-cta-card__meta { font-size: 0.9rem; color: var(--washi); margin: 0 0 0.6rem; }
.guide-cta-card p.guide-cta-card__text { font-size: 0.95rem; color: var(--washi-pure); margin: 0 0 0.9rem; }
.guide-cta-card .promo-note { color: inherit; }
.guide-cta-card .btn-primary { white-space: normal; text-align: center; }

@media (max-width: 760px) {
  .choice-cta, .choice-cta--three { grid-template-columns: 1fr; }
  .guide-cta-card { grid-template-columns: 1fr; }
  a.guruwalk-card { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  main .btn-primary, main .btn-lg { white-space: normal; max-width: 100%; }
  .spoke-widget { padding: 0.9rem; }
}