/* Opt-in hub presentation only. Article pages retain their individual styles.
   Titles, description markup and the single-column reading order are preserved. */
body.guide-hub-design{--hub-ink:#203b4d;--hub-gold:#967547;--hub-muted:#617078;background:#fffefa;color:var(--hub-ink)}
.guide-hub-design .public-shell{background:#fffefa}
.guide-hub-design .public-container{width:min(1000px,calc(100% - 64px))}
.guide-hub-design .public-nav .public-container{width:min(1100px,calc(100% - 64px))}
.guide-hub-design .seo-breadcrumb{padding:17px 0;font-size:12px;color:var(--hub-muted)}
.guide-hub-design .seo-breadcrumb a{color:var(--hub-ink)}
body.guide-hub-design .public-hero.dictionary-hero{padding:54px 0 58px;background:linear-gradient(90deg,#102e43fa,#133448ed 40%,#15374abd 68%,#14344885),url('/img/renewal/guide-study-hero-v1.jpg') center 54%/cover no-repeat;box-shadow:none;border:0}
.guide-hub-design .dictionary-hero::before{display:none}
.guide-hub-design .dictionary-hero .public-hero-grid{max-width:1000px;display:block}
.guide-hub-design .dictionary-hero .public-tag{background:transparent;border:0;border-radius:0;padding:0;color:#e7d29c;font-size:12px;letter-spacing:.06em;margin-bottom:15px}
.guide-hub-design .dictionary-hero h1{font-size:clamp(25px,3vw,36px);font-weight:700;line-height:1.6;color:#fff;text-shadow:none;max-width:850px;margin:0 0 20px}
.guide-hub-design .dictionary-hero p{color:#edf1f3;font-size:15px;line-height:1.95;max-width:760px;margin:0}
body.guide-hub-design main>section.public-section:nth-of-type(n){background:#fffefa;padding:46px 0}
.guide-hub-design main h2:not(.grade3-lesson *){color:var(--hub-ink);font-size:clamp(21px,2.2vw,26px);line-height:1.65;margin:0 0 18px;padding-left:16px;border-left:3px solid #bea26f}
.guide-hub-design main h2 a{color:inherit;text-decoration:none}
.guide-hub-design main h2 a:hover{text-decoration:underline;text-decoration-color:#bea26f}
.guide-hub-design .public-section>.public-container>p{color:var(--hub-muted);font-size:14px;line-height:1.95;margin:0 0 24px;max-width:74ch}
.guide-hub-design .article-index-list{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;counter-reset:hub-article}
.guide-hub-design .article-index-list>.public-card.article-index-card{position:relative;padding:30px 34px 30px 90px;border:1px solid #e1e3dc;border-radius:10px;background:#fff;box-shadow:0 3px 12px #203b4d03;counter-increment:hub-article;transition:border-color .18s,box-shadow .18s}
.guide-hub-design .article-index-list>.public-card.article-index-card::before{content:counter(hub-article,decimal-leading-zero);position:absolute;top:29px;left:25px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#f5f2e9;color:var(--hub-gold);font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}
.guide-hub-design .article-index-card h3{margin:0 0 15px;font-size:18px;line-height:1.7}
.guide-hub-design .article-index-card h3 a{display:block;position:relative;padding-right:28px;color:var(--hub-ink);text-decoration:none;line-height:1.7}
.guide-hub-design .article-index-card h3 a::after{content:'↗';position:absolute;right:0;top:0;color:var(--hub-gold);font-size:21px;font-weight:400}
.guide-hub-design .article-index-card h3 a:hover{color:#74572f;text-decoration:underline;text-decoration-thickness:1px}
.guide-hub-design .article-index-card:focus-within,.guide-hub-design .article-index-card:hover{border-color:#bba582;box-shadow:0 8px 24px #203b4d09}
body.guide-hub-design main .article-index-card p{font-size:14px;line-height:2;color:#56646d;margin:0;max-width:74ch}
.guide-hub-design .article-index-card p strong{font-weight:650;color:var(--hub-ink);background:none}
.guide-hub-design main :is(a,summary):focus-visible{outline:3px solid #a4814d;outline-offset:5px}
body.guide-hub-design main>section.article-category-links:nth-of-type(n){background:#f3f3ed;border-top:1px solid #e4e4da}
.guide-hub-design .article-category-links .article-shell{max-width:1000px;width:min(1000px,calc(100% - 64px))}
.guide-hub-design .article-category-links .article-link-card{padding:22px 26px;border:1px solid #e1e3dc;border-radius:8px;background:#fff}
.guide-hub-design .article-category-links .article-link-card h3{color:var(--hub-ink);margin-bottom:5px;font-size:16px}
.guide-hub-design .public-cta{background:#fffefa;padding:36px 0}
.guide-hub-design .public-cta>.public-container>.public-card{background:#f1f4f3;border:1px solid #dee4df;padding:28px;border-radius:10px}
.guide-hub-design .public-cta .public-btn{background:#203b4d;color:#fff;border:1px solid #203b4d;margin-top:12px}
.guide-hub-design .public-cta .public-btn+.public-btn{background:transparent;color:#203b4d;margin-left:8px}
.guide-hub-design .article-trust-panel{background:#fffefa;border-top:1px solid #e4e4da;color:var(--hub-muted)}
.guide-hub-design .public-footer{background:#fffefa;border-top:1px solid #e4e4da;color:var(--hub-muted)}
.guide-hub-design .grade3-toc{padding:22px;border:1px solid #e1e3dc;background:#f7f6f0;border-radius:10px}
.guide-hub-design .grade3-toc summary{color:var(--hub-ink);font-size:14px}
.guide-hub-design .grade3-toc summary::after{color:var(--hub-gold)}
.guide-hub-design .grade3-toc ol{display:block;list-style:none;padding:0;margin:16px 0 0;counter-reset:hub-topic}
.guide-hub-design .grade3-toc li{counter-increment:hub-topic;border-top:1px solid #e4e4da}
.guide-hub-design .grade3-toc a{display:flex;align-items:baseline;gap:10px;padding:11px 0;font-size:12px;line-height:1.7;color:var(--hub-ink);text-decoration:none}
.guide-hub-design .grade3-toc a::before{content:counter(hub-topic,decimal-leading-zero);color:var(--hub-gold);font-size:11px;flex:none}
.guide-hub-design .grade3-toc a:hover{color:#74572f;background:#eeece2}
/* 2026-09-24: Keep the overview TOC above the articles, including on desktop.
   Long descriptions use the full card width; titles and copy stay unchanged. */
body.guide-hub-overview main .article-index-card p{max-width:none}
.guide-hub-overview .public-section>.public-container>p{max-width:none}
@media(max-width:640px){
  .guide-hub-design .public-container,.guide-hub-design .public-nav .public-container,.guide-hub-design .article-category-links .article-shell{width:calc(100% - 32px)}
  body.guide-hub-design .public-hero.dictionary-hero{padding:34px 0 38px;background-position:60% center}
  .guide-hub-design .dictionary-hero h1{font-size:25px}
  .guide-hub-design .dictionary-hero p{font-size:14px}
  body.guide-hub-design main>section.public-section:nth-of-type(n){padding:30px 0}
  .guide-hub-design .article-index-list>.public-card.article-index-card{padding:22px 20px}
  .guide-hub-design .article-index-list>.public-card.article-index-card::before{position:static;width:32px;height:32px;margin-bottom:12px;font-size:11px}
  .guide-hub-design .article-index-card h3{font-size:17px;margin-bottom:12px}
  body.guide-hub-design main .article-index-card p{font-size:14px;line-height:1.95}
  .guide-hub-design .public-cta .public-btn{display:block;text-align:center}
  .guide-hub-design .public-cta .public-btn+.public-btn{margin-left:0}
}
@media(prefers-reduced-motion:reduce){.guide-hub-design .article-index-card{transition:none}}