html { scroll-behavior: smooth; }
body { margin: 0; background: #f5f2ec; font-family: 'Noto Sans JP', sans-serif; color: #1b2a24; }
*, *::before, *::after { box-sizing: border-box; }
a { color: #0e3b34; text-decoration: none; }
a:hover { color: #8f9c3a; }

@keyframes riseIn {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}

.rd-grid-4 { display: grid; gap: 20px; grid-template-columns: repeat(4, 1fr); }
.rd-grid-3 { display: grid; gap: 24px; grid-template-columns: repeat(3, 1fr); }
.rd-grid-2 { grid-template-columns: repeat(2, 1fr); }
.rd-grid-5 { grid-template-columns: repeat(5, 1fr); }
.rd-toc { display: flex; }
.rd-article-layout { grid-template-columns: 220px 1fr; }
.rd-toc-sticky { position: sticky; top: 100px; display: flex; flex-direction: column; gap: 6px; }
.rd-toc-sticky a { font-size: 13px; color: #3a4740; padding: 8px 10px; border-radius: 8px; }
.rd-toc-sticky a:hover { background: #eef0e2; color: #0e3b34; }
.rd-cta-band { display: grid; align-items: center; gap: 32px; grid-template-columns: 1.3fr auto; }
.rd-nav-links { display: flex; align-items: center; gap: 28px; }
.rd-burger { display: none; }

.rd-nav-link { font-size: 14px; font-weight: 500; color: #1b2a24; }
.rd-nav-link:hover { color: #0e3b34; }
.rd-nav-cta { font-size: 13px; font-weight: 600; color: #fffdf8; background: #0e3b34; padding: 9px 18px; border-radius: 999px; white-space: nowrap; }
.rd-nav-cta:hover { background: #133f38; }

.rd-herosec { position: relative; overflow: hidden; min-height: 640px; }
.rd-hero-photo { position: absolute; inset: 0; opacity: 0; transition: opacity 1.4s ease; }
.rd-hero-photo.active { opacity: 1; }
.rd-hero-photo-img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; }
.rd-hero-photo-inner {
  width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1a4941, #0e3b34); color: rgba(255,253,248,0.4);
  font-size: 13px; letter-spacing: 0.08em; text-align: center; padding: 0 24px;
}
.rd-hero-photo-credit {
  position: absolute; right: 20px; bottom: 64px; z-index: 1;
  font-size: 13px; font-weight: 600; color: #fffdf8; text-decoration: none;
  background: rgba(9,28,24,0.55); padding: 8px 16px; border-radius: 999px;
  border: 1px solid rgba(255,253,248,0.3); backdrop-filter: blur(2px);
  text-decoration: underline;
}
.rd-hero-photo-credit:hover { background: rgba(9,28,24,0.75); }
.rd-hero-copy { font-size: 16px; }
.rd-hero-dot { width: 8px; height: 8px; border-radius: 999px; border: none; background: rgba(255,253,248,0.45); cursor: pointer; transition: all 0.3s ease; }
.rd-hero-dot.active { width: 26px; background: #fffdf8; }

.rd-hero-btn-primary { font-size: 15px; font-weight: 600; color: #0e3b34; background: #fffdf8; padding: 15px 30px; border-radius: 999px; }
.rd-hero-btn-primary:hover { background: #e9e4d8; }
.rd-hero-btn-outline { font-size: 15px; font-weight: 600; color: #fffdf8; background: transparent; padding: 15px 30px; border-radius: 999px; border: 1.5px solid rgba(255,253,248,0.7); }
.rd-hero-btn-outline:hover { background: rgba(255,253,248,0.12); }

.rd-search-card { display: block; background: #fffdf8; border-radius: 18px; padding: 30px 24px; border: 1px solid rgba(14,59,52,0.1); box-shadow: 0 1px 2px rgba(14,59,52,0.04); transition: box-shadow 0.25s ease, transform 0.25s ease; }
.rd-search-card:hover { box-shadow: 0 14px 28px rgba(14,59,52,0.12); transform: translateY(-3px); }
.rd-guide-card { display: block; background: #f5f2ec; border-radius: 18px; padding: 28px; border: 1px solid rgba(14,59,52,0.08); transition: background 0.2s ease; }
.rd-guide-card:hover { background: #eef0e2; }

.rd-cta-btn-primary { font-size: 14px; font-weight: 600; color: #0e3b34; background: #fffdf8; padding: 13px 24px; border-radius: 999px; white-space: nowrap; }
.rd-cta-btn-primary:hover { background: #e9e4d8; }
.rd-cta-btn-outline { font-size: 14px; font-weight: 600; color: #fffdf8; background: transparent; padding: 13px 24px; border-radius: 999px; border: 1.5px solid rgba(255,253,248,0.5); white-space: nowrap; }
.rd-cta-btn-outline:hover { background: rgba(255,253,248,0.08); }

.rd-burger-btn { align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; border: 1px solid rgba(14,59,52,0.2); background: transparent; cursor: pointer; flex-direction: column; gap: 4px; }

/* Form pages (formmail) */
.rd-form-card { background: #fffdf8; border: 1px solid rgba(14,59,52,0.1); border-radius: 22px; padding: 40px 44px; display: flex; flex-direction: column; gap: 36px; }
.rd-form-section-title { font-family: 'Shippori Mincho', serif; font-size: 17px; font-weight: 700; color: #0e3b34; margin: 0 0 18px; padding-bottom: 10px; border-bottom: 1px solid rgba(14,59,52,0.1); }
.rd-form-group { display: flex; flex-direction: column; gap: 18px; }
.rd-form-label { display: flex; flex-direction: column; gap: 6px; }
.rd-form-label-text { font-size: 13.5px; font-weight: 600; color: #1b2a24; }
.rd-form-required { color: #b0553f; margin-left: 4px; }
.rd-form-input, .rd-form-textarea, .rd-form-select {
  width: 100%; font-family: 'Noto Sans JP', sans-serif; font-size: 14.5px; color: #1b2a24;
  background: #f5f2ec; border: 1px solid rgba(14,59,52,0.18); border-radius: 10px; padding: 12px 14px; outline: none;
}
.rd-form-input:focus, .rd-form-textarea:focus, .rd-form-select:focus { border-color: #0e3b34; background: #fffdf8; }
.rd-form-input::placeholder, .rd-form-textarea::placeholder { color: #93a096; }
.rd-chip-check { display: flex; flex-wrap: wrap; gap: 8px; }
.rd-check-chip { display: flex; align-items: center; gap: 7px; font-size: 13px; color: #1b2a24; background: #f5f2ec; border: 1px solid rgba(14,59,52,0.15); padding: 8px 14px; border-radius: 999px; cursor: pointer; }
.rd-check-chip:hover { background: #eef0e2; border-color: rgba(14,59,52,0.3); }
.rd-checkbox-scroll-list {
  display: flex; flex-direction: column; max-height: 220px; overflow-y: auto;
  background: #f5f2ec; border: 1px solid rgba(14,59,52,0.18); border-radius: 10px; padding: 6px;
}
.rd-checkbox-scroll-item { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: #1b2a24; padding: 7px 10px; border-radius: 8px; cursor: pointer; }
.rd-checkbox-scroll-item:hover { background: #eef0e2; }
.rd-form-help { font-size: 12.5px; color: #8f9c3a; margin-top: 4px; }
.rd-form-error { background: #fbeceb; color: #8a3527; border: 1px solid rgba(176,85,63,0.35); border-radius: 12px; padding: 14px 18px; font-size: 14px; }
.rd-form-success { background: #eef4e6; color: #33502a; border: 1px solid rgba(143,156,58,0.35); border-radius: 16px; padding: 24px; font-size: 14.5px; line-height: 1.9; }
.rd-form-submit-btn { font-size: 15px; font-weight: 700; color: #fffdf8; background: #0e3b34; padding: 16px; border-radius: 999px; border: none; cursor: pointer; width: 100%; }
.rd-form-submit-btn:hover { background: #133f38; }
.rd-faq-item { background: #fffdf8; border: 1px solid rgba(14,59,52,0.1); border-radius: 14px; overflow: hidden; }
.rd-faq-item summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; cursor: pointer; font-weight: 700; font-size: 14.5px; color: #0e3b34; }
.rd-faq-item summary::-webkit-details-marker { display: none; }
.rd-faq-item summary::after { content: "+"; font-size: 18px; color: #8f9c3a; transition: transform 0.2s ease; }
.rd-faq-item[open] summary::after { transform: rotate(45deg); }
.rd-faq-item > div { padding: 0 22px 20px; font-size: 13.5px; color: #3a4740; line-height: 1.9; }
.rd-prose { font-size: 14.5px; color: #5a675f; line-height: 1.9; }
.rd-prose h2 { font-family: 'Shippori Mincho', serif; font-size: 17px; font-weight: 700; color: #0e3b34; margin: 24px 0 10px; }
.rd-prose h2:first-child { margin-top: 0; }
.rd-prose img { max-width: 200px; border-radius: 10px; }
.rd-prose p { margin: 0 0 14px; }
.rd-prose strong { color: #0e3b34; }
.rd-column-body { font-size: 15px; line-height: 2.15; color: #33403a; }
.rd-column-body p { margin: 0 0 22px; }
.rd-column-body p:last-child { margin-bottom: 0; }
.rd-column-body img { max-width: 100%; height: auto; border-radius: 16px; }
.rd-related-grid { display: grid; gap: 18px; grid-template-columns: repeat(3, 1fr); }
.rd-related-card {
  display: block; background: #fffdf8; border: 1px solid rgba(14,59,52,0.1);
  border-radius: 16px; padding: 22px; min-height: 120px; transition: background 0.2s ease, transform 0.2s ease;
}
.rd-related-card:hover { background: #f5f2ec; transform: translateY(-2px); }

@media (max-width: 720px) {
  .rd-form-card { padding: 26px 20px; }
}

/* Detail page */
.rd-detail-layout { display: grid; gap: 40px; align-items: start; grid-template-columns: 1fr 340px; }
.rd-info-grid { display: grid; gap: 16px; grid-template-columns: 160px 1fr; }
.rd-page-title { font-family: 'Shippori Mincho', serif; font-weight: 700; color: #0e3b34; margin: 0 0 6px; }

.rd-gallery-thumb { position: relative; flex: 0 0 110px; height: 78px; border-radius: 10px; overflow: hidden; display: block; cursor: pointer; }
.rd-gallery-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rd-gallery-hero { display: block; width: 100%; aspect-ratio: 16 / 8; border-radius: 18px; overflow: hidden; margin-bottom: 10px; cursor: pointer; }
.rd-gallery-hero img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }

.rd-blog-row:hover { color: #8f9c3a; }
.rd-link-accent { color: #0e3b34; font-weight: 600; }
.rd-link-accent:hover { color: #8f9c3a; }

.dojo-rss-feed { background: #fffdf8; border: 1px solid rgba(14,59,52,0.1); border-radius: 16px; overflow: hidden; }
.dojo-rss-feed .feed-items { list-style: none; margin: 0; padding: 0; }
.dojo-rss-feed .feed-item { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 22px; border-bottom: 1px solid rgba(14,59,52,0.08); }
.dojo-rss-feed .feed-item:last-child { border-bottom: none; }
.dojo-rss-feed .feed-item:hover { background: #f5f2ec; }
.dojo-rss-feed .feed-item a { font-size: 13.5px; font-weight: 600; color: #1b2a24; }
.dojo-rss-feed .feed-item-date { font-size: 12px; color: #8a978f; white-space: nowrap; }

/* Lightbox (shared with legacy gallery script) */
.legacy-lightbox-open { overflow: hidden; }
#legacy-lightbox { display: none; }
#legacy-lightbox.open {
  position: fixed; inset: 0; z-index: 9999; display: grid;
  grid-template-columns: 76px 1fr 76px; align-items: center;
  background: rgba(9,28,24,0.92); color: #fff;
}
.legacy-lightbox-stage { max-width: min(980px, 82vw); margin: 0 auto; }
.legacy-lightbox-stage img { display: block; width: 100%; max-height: 72vh; object-fit: contain; margin: 0 auto; }
.legacy-lightbox-counter { position: absolute; top: 18px; left: 18px; font-size: 20px; }
.legacy-lightbox-close { position: absolute; top: 10px; right: 18px; border: 0; background: transparent; color: #ddd; font-size: 56px; line-height: 1; cursor: pointer; }
.legacy-lightbox-arrow { border: 0; background: transparent; color: #d8d8d8; font-size: 84px; cursor: pointer; opacity: 0.85; }
.legacy-lightbox-arrow:hover, .legacy-lightbox-close:hover { opacity: 1; }
.legacy-lightbox-caption { margin-top: 14px; font-size: 20px; text-align: center; }
.legacy-lightbox-thumbs { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; margin-top: 20px; }
.legacy-lightbox-thumb { width: 102px; padding: 0; border: 2px solid transparent; background: transparent; cursor: pointer; }
.legacy-lightbox-thumb.active { border-color: #fff; }
.legacy-lightbox-thumb img { display: block; width: 100%; height: 76px; object-fit: cover; }

/* Dojo search/top page */
.rd-area-grid { display: grid; gap: 18px; grid-template-columns: repeat(3, 1fr); }
.rd-chip-wrap { display: flex; flex-wrap: wrap; }
.rd-chip-muted { font-size: 13px; color: #3a4740; background: #f5f2ec; padding: 6px 12px; border-radius: 999px; }
.rd-chip-muted:hover { background: #e6e0d1; color: #0e3b34; }
.rd-chip-outline { font-size: 14px; font-weight: 500; color: #0e3b34; background: #fffdf8; border: 1px solid rgba(14,59,52,0.14); padding: 10px 18px; border-radius: 999px; }
.rd-chip-outline:hover { background: #0e3b34; color: #fffdf8; border-color: #0e3b34; }
.rd-map-cta { display: flex; align-items: center; justify-content: space-between; gap: 20px; background: #0e3b34; border-radius: 18px; padding: 22px 28px; }
.rd-map-cta:hover { background: #133f38; }
.rd-search-form { display: flex; gap: 12px; background: #fffdf8; border: 1px solid rgba(14,59,52,0.14); border-radius: 999px; padding: 8px 8px 8px 22px; align-items: center; max-width: 640px; }
.rd-search-form input { flex: 1; border: none; outline: none; font-size: 14px; background: transparent; color: #1b2a24; font-family: 'Noto Sans JP', sans-serif; }

/* Search results list */
.rd-card { display: grid; gap: 24px; background: #fffdf8; border: 1px solid rgba(14,59,52,0.1); border-radius: 18px; padding: 22px 24px; grid-template-columns: 220px 1fr; }
.rd-result-photo { display: block; width: 100%; aspect-ratio: 4 / 3; border-radius: 12px; overflow: visible; position: relative; }
.rd-result-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rd-result-photo-grid { display: grid; gap: 4px; width: 100%; height: 78px; margin-bottom: 8px; max-width: 340px;}
.rd-result-photo-grid .rd-link-accent { height: 78px;}
.rd-result-photo-grid img { width: 100%; height: 100%; border-radius: 10px; object-fit: cover; object-position: top center; }
.rd-result-photo-placeholder {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-family: monospace; font-size: 11px; color: #8a9270;
  background: repeating-linear-gradient(135deg, #eef0e2 0px, #eef0e2 14px, #e3e6d3 14px, #e3e6d3 28px);
}
.rd-pager-btn { width: 36px; height: 36px; border-radius: 50%; border: 1px solid rgba(14,59,52,0.15); background: #fffdf8; color: #3a4740; font-size: 13px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
.rd-pager-btn:hover { border-color: #0e3b34; color: #3a4740; }
.rd-pager-btn.active { background: #0e3b34; color: #fffdf8; border-color: #0e3b34; }
.rd-pager-btn.active:hover { color: #fffdf8; }

@media (max-width: 980px) {
  .rd-grid-4 { grid-template-columns: repeat(2, 1fr); }
  .rd-grid-5 { grid-template-columns: repeat(2, 1fr); }
  .rd-related-grid { grid-template-columns: repeat(2, 1fr); }
  .rd-article-layout { grid-template-columns: 1fr; }
  .rd-toc-sticky { position: static; display: flex; flex-flow: row wrap; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid rgba(14,59,52,0.1); margin-bottom: 8px; }
  .rd-toc-sticky a { border: 1px solid rgba(14,59,52,0.15); border-radius: 999px; padding: 8px 14px; }
  .rd-cta-band { grid-template-columns: 1fr; text-align: left; }
  .rd-stat-strip { gap: 20px !important; }
  .rd-herosec { min-height: 560px; }
  .rd-detail-layout { grid-template-columns: 1fr; }
}

@media (max-width: 860px) {
  .rd-area-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 720px) {
  .rd-nav-links { display: none; }
  .rd-nav-links.rd-open { display: flex; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: flex-start; background: #f5f2ec; padding: 18px 28px 24px; border-bottom: 1px solid rgba(14,59,52,0.12); gap: 18px !important; }
  .rd-burger { display: flex; }
  .rd-grid-2, .rd-grid-5 { grid-template-columns: 1fr; }
  .rd-toc { flex-wrap: wrap; }
  .rd-herosec { min-height: 520px; }
  .rd-herosec h1 { font-size: 26px !important; }
  .rd-hero-copy { font-size: 15px !important; }
  .rd-grid-3 { grid-template-columns: 1fr; }
  .rd-cta-inner { padding: 36px 28px !important; }
  .rd-info-grid { grid-template-columns: 110px 1fr; }
  .rd-page-title--detail { font-size: 24px !important; }
  .rd-page-title--top { font-size: 28px !important; }
  .rd-page-title--list { font-size: 26px !important; }
  .rd-article-title { font-size: 24px !important; }
  .rd-area-grid { grid-template-columns: 1fr; }
  .rd-card { grid-template-columns: 1fr; }
  .rd-related-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .rd-grid-4 { grid-template-columns: 1fr; }
}
