/* Resources hub: dark brand band up top, light bone page for long reads. Loads after style.css. */
:root{--ink:#1c1f1e;--ink-soft:#3d4541;--paper:#efede4;--paper-2:#f7f6f1;--rule:#d4d0c2}
.rs-page{background:var(--paper);color:var(--ink)}
.rs-page .header{position:sticky;background:var(--deep);color:var(--bone)}
.rs-page .footer{background:var(--deep);color:var(--bone)}
.rs-wrap{width:min(1080px,calc(100% - 64px))}

/* Brand band */
.rs-hero{background:var(--deep);color:var(--bone);padding:56px 0 46px}
.rs-hero h1{font-size:clamp(36px,4.86vw,70px);letter-spacing:-1px;line-height:1.02;text-transform:uppercase;max-width:900px;margin-top:14px}
.rs-hero h1 span{color:var(--neon)}
.rs-hero-hub h1{font-size:clamp(36px,4.86vw,70px)}
.rs-intro{font-size:18px;color:#cfdbcf;max-width:640px;margin-top:18px}
.rs-meta{font-size:13px;color:var(--muted);margin-top:16px}
.rs-meta a{color:var(--bone);border-bottom:1px solid var(--neon)}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:12px;font-weight:700;color:var(--muted)}
.crumbs a:hover{color:var(--neon)}
.crumbs span[aria-current]{color:var(--bone);max-width:40ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Video + short answer */
.rs-top{display:grid;grid-template-columns:minmax(0,340px) 1fr;gap:44px;align-items:start;margin-top:-1px;padding-top:40px}
.rs-video{margin:0}
.rs-video video,.rs-video img{display:block;width:100%;height:auto;aspect-ratio:9/16;background:#000;border-radius:6px}
.rs-video-missing figcaption{font-size:12px;color:var(--ink-soft);margin-top:8px}
.rs-transcript{margin-top:12px;font-size:14px;color:var(--ink-soft)}
.rs-transcript summary{cursor:pointer;font-weight:700;color:var(--ink)}
.rs-transcript p{margin-top:10px;line-height:1.6}
.rs-answer{background:#fff;border-top:4px solid var(--neon);padding:28px 30px;box-shadow:0 10px 30px rgba(11,33,24,.08)}
.rs-answer h2,.rs-answer h3{font-family:Arial,Helvetica,sans-serif;font-weight:700;letter-spacing:0;line-height:1.2}
.rs-answer h2{font-size:15px;text-transform:uppercase;letter-spacing:1.5px;color:var(--forest)}
.rs-answer>p{font-size:20px;line-height:1.5;margin:12px 0 0}
.rs-answer h3{font-size:15px;margin-top:22px}
.rs-answer ul{margin:10px 0 0;padding-left:20px}
.rs-answer li{margin-bottom:6px}

/* Long read */
.rs-body{max-width:760px;margin:0;padding:44px 0 10px;font-size:18px;line-height:1.7}
.rs-wrap.rs-body{margin-left:max(32px,calc((100% - 1080px)/2))}
.rs-body h2,.rs-faq h2,.rs-related h2,.rs-h2{font-family:Arial,Helvetica,sans-serif;font-weight:700;font-size:28px;letter-spacing:-.3px;line-height:1.2;margin:42px 0 14px;color:var(--ink)}
.rs-body h3{font-family:Arial,Helvetica,sans-serif;font-weight:700;font-size:21px;line-height:1.3;margin:28px 0 10px}
.rs-body p{margin:0 0 18px}
.rs-body ul,.rs-body ol{margin:0 0 20px;padding-left:24px}
.rs-body li{margin-bottom:8px}
.rs-body a,.rs-faq a,.rs-answer a{color:var(--forest);text-decoration:underline;text-decoration-color:#0aff00;text-decoration-thickness:2px;text-underline-offset:3px}
.rs-quote{margin:26px 0;padding:6px 0 6px 22px;border-left:4px solid var(--neon);font-size:21px;line-height:1.5;color:var(--forest)}
.rs-quote p{margin:0 0 8px}
.rs-quote footer{font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--ink-soft)}
.rs-callout{background:var(--paper-2);border:1px solid var(--rule);padding:18px 20px;margin:24px 0;font-size:16px}
.rs-callout p:last-child{margin:0}
.rs-safety{border-left:4px solid #b8912a}
.rs-table{overflow-x:auto;margin:0 0 22px}
.rs-table table{border-collapse:collapse;width:100%;font-size:16px;background:#fff}
.rs-table th,.rs-table td{border:1px solid var(--rule);padding:10px 12px;text-align:left;vertical-align:top}
.rs-table th{background:var(--deep);color:var(--bone);font-size:13px;letter-spacing:.5px}
.rs-sources{font-size:13px;color:var(--ink-soft);margin-top:26px}
.rs-more-videos{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px}
.rs-more-videos h2{grid-column:1/-1}

/* FAQ */
.rs-faq{max-width:760px;margin-left:max(32px,calc((100% - 1080px)/2));padding-bottom:10px}
.rs-faq-item{border-top:1px solid var(--rule);padding:16px 0}
.rs-faq-item:last-child{border-bottom:1px solid var(--rule)}
.rs-faq-item summary{cursor:pointer;font-weight:700;font-size:18px;list-style:none;display:flex;justify-content:space-between;gap:16px}
.rs-faq-item summary::after{content:"+";font-size:22px;line-height:1;color:var(--forest)}
.rs-faq-item[open] summary::after{content:"−"}
.rs-faq-item div{margin-top:10px;font-size:17px;line-height:1.65}
.rs-faq-item div p{margin:0 0 10px}

/* Author */
.rs-author{display:flex;gap:22px;align-items:center;max-width:760px;margin:44px 0 0 max(32px,calc((100% - 1080px)/2));padding:24px;background:#fff;border:1px solid var(--rule)}
.rs-author img{width:96px;height:96px;object-fit:cover;border-radius:50%;flex-shrink:0}
.rs-author p{margin:0 0 6px;font-size:15px;color:var(--ink-soft)}
.rs-author .rs-author-name{font:20px BlackOps,Impact,sans-serif;color:var(--ink);letter-spacing:.5px}
.rs-author .text-link{color:var(--forest);border-color:var(--neon)}
.rs-about-photo{width:100%;max-width:520px;height:auto;margin:0 0 26px;border-radius:6px}

/* Cards */
.rs-h2{margin:48px 0 18px}
.rs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px}
.rs-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--rule);transition:transform .2s,box-shadow .2s;color:var(--ink)}
.rs-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(11,33,24,.14)}
.rs-card img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 30%;display:block;background:var(--deep)}
.rs-card-topic{font-size:11px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--forest);padding:14px 16px 0}
.rs-card-title{font-weight:700;font-size:18px;line-height:1.3;padding:6px 16px 0}
.rs-card-sum{font-size:14px;line-height:1.5;color:var(--ink-soft);padding:8px 16px 18px}
.rs-related{padding-bottom:10px}

/* Hub tools */
.rs-tools{display:flex;flex-direction:column;gap:14px;margin-bottom:24px}
.rs-search{width:100%;max-width:520px;border:1px solid #8a9a8d;background:#fff;color:var(--ink);padding:14px 16px;font-size:16px;border-radius:0}
.rs-chips{display:flex;flex-wrap:wrap;gap:8px}
.rs-chip{border:1px solid #8a9a8d;background:#fff;color:var(--ink);padding:8px 13px;font-size:13px;font-weight:700}
.rs-chip.is-on,.rs-chip:hover{background:var(--deep);color:var(--bone);border-color:var(--deep)}
.rs-empty{margin-top:18px;color:var(--ink-soft)}
.rs-topics{margin-top:30px;font-size:14px;color:var(--ink-soft)}
.rs-topics a{color:var(--forest);font-weight:700}

/* Instagram feed (Elfsight, as on the home page) */
.rs-insta{padding-top:10px}
.rs-ig{display:flex;justify-content:center;margin:22px 0 0}
.rs-ig .ig-btn-lg{color:var(--forest);border-color:var(--forest)}
.rs-ig .ig-btn-lg:hover{background:var(--forest);color:var(--bone)}

/* Email card, same as the home page */
.rs-join{padding:64px 0 80px}
.rs-join .signup-box{max-width:560px}

/* Review bar (drafts only) */
.rs-review{background:#b8912a;color:var(--deep);padding:14px 0;font-size:14px}
.rs-review ul{margin:6px 0 0;padding-left:20px}
.rv-list{padding-left:22px;margin:40px 0}
.rv-item{margin-bottom:26px}
.rv-item a{font-size:19px;color:var(--forest);text-decoration:underline;text-decoration-color:var(--neon)}
.rv-item span{display:block;font-size:13px;color:var(--ink-soft);margin:4px 0}
.rv-item p{margin:6px 0;font-size:15px}
.rv-item ul{font-size:14px;color:#7a5a00}


@media(max-width:900px){
  .rs-top{grid-template-columns:1fr;gap:28px}
  .rs-video{max-width:380px;width:100%;margin:0 auto}
}
@media(max-width:600px){
  .rs-wrap{width:calc(100% - 32px)}
  .rs-wrap.rs-body,.rs-faq,.rs-author{margin-left:16px;margin-right:16px}
  .rs-hero{padding:36px 0 32px}
  .rs-hero h1{font-size:clamp(30px,9vw,44px)}
  .rs-hero-hub h1{font-size:clamp(40px,12vw,60px)}
  .rs-intro{font-size:16px}
  .rs-answer{padding:22px 20px}
  .rs-answer>p{font-size:18px}
  .rs-body{font-size:17px;padding-top:30px}
  .rs-body h2,.rs-faq h2,.rs-related h2,.rs-h2{font-size:23px}
  .rs-quote{font-size:19px}
  .rs-author{flex-direction:column;align-items:flex-start}
  .rs-grid{grid-template-columns:1fr 1fr;gap:12px}
  .rs-card-title{font-size:15px;padding:6px 10px 0}
  .rs-card-topic{padding:10px 10px 0;font-size:10px}
  .rs-card-sum{display:none}
  .header .nav-link{font-size:11px}
}
@media(max-width:360px){.rs-grid{grid-template-columns:1fr}}

/* Free downloads page and the hub's link to it (24 Oct 2026) */
.rs-dls{padding-top:36px;padding-bottom:24px}
.rs-dl img{height:auto;aspect-ratio:496/702;object-fit:cover;object-position:top;background:#fff;border-bottom:1px solid var(--rule)}
.rs-dl-get{align-self:flex-start;margin:auto 16px 18px;padding-top:4px;font-weight:700;font-size:15px;color:var(--forest);border-bottom:2px solid var(--neon)}
.rs-hub-dl{margin-top:16px}
.rs-hub-dl a{color:var(--bone);font-weight:700;border-bottom:2px solid var(--neon)}
@media(max-width:600px){
  .rs-dls .rs-card-sum{display:block;font-size:12.5px;padding:6px 10px 0}
  .rs-dl-get{margin:auto 10px 14px;padding-top:10px;font-size:13px}
}

/* Mobile readability (24 Oct 2026): see style.css and docs/meataxe/MOBILE-READABILITY.md. Bigger words, more room, and
   less on the screen at once: cards become one per row with just the picture and the title, the meta line drops to the
   author and the date, and the breadcrumbs drop the page you're already on. */
/* The erg calculator line in the 2k articles (build.py CALC_LINES): one line in the site's voice, not a banner */
.rs-body .rs-tool{border-left:3px solid var(--neon);padding:2px 0 2px 16px}
@media(max-width:600px){
  .rs-wrap{width:calc(100% - 40px)}
  .rs-wrap.rs-body,.rs-faq,.rs-author{margin-left:20px;margin-right:20px}
  .rs-hero{padding:30px 0 34px}
  .rs-hero h1{font-size:clamp(32px,9.6vw,46px);line-height:1.04}
  .rs-hero-hub h1{font-size:clamp(42px,12.5vw,60px)}
  .rs-intro{font-size:19px;line-height:1.6}
  .rs-meta{font-size:16px;line-height:1.5}
  .rs-meta .m-more{display:none}
  .crumbs{font-size:16px;gap:0 10px;align-items:center}
  .crumbs a{display:inline-flex;align-items:center;min-height:44px}
  .crumbs [aria-current],.crumbs>[aria-hidden]:nth-last-child(2){display:none}
  .rs-answer{padding:22px 20px}
  .rs-answer h2{font-size:17px;letter-spacing:0;text-transform:none}
  .rs-answer>p{font-size:20px;line-height:1.55}
  .rs-answer h3{font-size:18px}
  .rs-answer li{font-size:19px;line-height:1.55;margin-bottom:10px}
  .rs-body{font-size:19px;line-height:1.65}
  .rs-body p{margin:0 0 22px}
  .rs-body li{margin-bottom:10px}
  .rs-body h2,.rs-faq h2,.rs-related h2,.rs-h2{font-size:27px;line-height:1.2;margin:46px 0 16px}
  .rs-body h3{font-size:23px}
  .rs-quote{font-size:21px}
  .rs-quote footer{font-size:16px;letter-spacing:0;text-transform:none}
  .rs-callout{font-size:19px;line-height:1.6}
  .rs-table table{font-size:17px}
  .rs-table th{font-size:16px}
  .rs-sources{font-size:16px;line-height:1.6}
  .rs-transcript{font-size:17px}
  .rs-transcript summary{display:flex;align-items:center;min-height:44px}
  .rs-faq-item summary{font-size:19px;min-height:44px;align-items:center}
  .rs-faq-item div{font-size:19px;line-height:1.65}
  .rs-author p{font-size:17px}
  .rs-author .text-link{font-size:16px;min-height:44px}
  /* cards: one per row, the picture and the title */
  .rs-grid{grid-template-columns:1fr;gap:12px}
  .rs-card{display:grid;grid-template-columns:96px minmax(0,1fr);align-items:center;column-gap:16px;padding:10px 14px 10px 10px}
  .rs-card img{grid-row:1/span 3;width:96px;height:96px;aspect-ratio:1/1}
  .rs-card-topic,.rs-card-sum{display:none}
  .rs-card-title{padding:0;font-size:18px;line-height:1.35}
  .rs-dls .rs-card{grid-template-columns:112px minmax(0,1fr);align-items:start;padding:12px 14px 14px 12px}
  .rs-dls .rs-dl img{width:112px;height:auto;aspect-ratio:496/702}
  .rs-dls .rs-card-sum{display:block;padding:6px 0 0;font-size:16px;line-height:1.45}
  .rs-dl-get{margin:12px 0 0;padding-top:0;font-size:17px}
  /* hub tools */
  .rs-chips{gap:10px}
  .rs-chip{min-height:44px;padding:0 15px;font-size:16px}
  .rs-search{min-height:52px;font-size:17px}
  .rs-topics{font-size:16px}
  .rs-topics a{display:inline-block;padding:10px 0}
  .rs-empty{font-size:17px}
  .rs-hub-dl{font-size:18px}
  /* review pages (Shaun reads these on his phone too) */
  .rs-review{font-size:16px}
  .rv-item a{font-size:20px}
  .rv-item span,.rv-item ul{font-size:16px}
  .rv-item p{font-size:17px}
}
/* Desktop and tablets: nothing people read under 14px (it was 11 to 13px), 13px for the caps topic label on cards */
@media(min-width:601px){
  .crumbs,.rs-meta,.rs-sources,.rs-chip,.rs-author .text-link,.rs-table th{font-size:14px}
  .rs-quote footer{font-size:14px}
  .rs-card-topic{font-size:13px;letter-spacing:1px}
}