/* R39 homepage only. The R38 hero, header, dock and shared tokens remain untouched. */
.r39-home .r39-below { background:#f3f2ed; color:#101b2a; }
.r39-home .r39-inner { width:min(1160px,calc(100% - 2 * clamp(20px,5vw,64px))); margin-inline:auto; }
.r39-home .r39-kicker { margin:0 0 12px; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:#a65d32; line-height:1.4; }
.r39-home .r39-below h2 { margin:0; font-size:clamp(30px,4.3vw,57px); line-height:1.03; font-weight:820; letter-spacing:-.047em; font-variation-settings:"wdth" 103; text-wrap:balance; }
.r39-home .r39-below p { text-wrap:pretty; }
.r39-home .r39-arrow { font-size:1.25em; line-height:1; font-weight:450; flex:none; }
.r39-home .r39-join { padding:clamp(48px,6vw,92px) 0 clamp(50px,7vw,96px); }
.r39-home .r39-join-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.94fr); gap:clamp(42px,6vw,90px); align-items:center; }
.r39-home .r39-join-copy { min-width:0; }
.r39-home .r39-join-copy h2 { max-width:12ch; }
.r39-home .r39-intro { font-size:clamp(17px,1.7vw,21px); line-height:1.5; max-width:36ch; margin:20px 0 0; color:#4e5b64; }
.r39-home .r39-steps { list-style:none; margin:28px 0 0; padding:0; border-top:1px solid #d6d9d6; }
.r39-home .r39-steps li { display:flex; align-items:baseline; gap:15px; border-bottom:1px solid #d6d9d6; padding:10px 0; font-size:15px; line-height:1.35; }
.r39-home .r39-steps b { color:#a65d32; font-size:11px; letter-spacing:.1em; }
.r39-home .r39-join-actions { display:flex; align-items:center; flex-wrap:wrap; gap:10px 18px; margin-top:26px; }
.r39-home .r39-primary { display:inline-flex; justify-content:center; align-items:center; min-height:50px; padding:11px 20px; background:#a64d27; color:#fff; font-size:15px; font-weight:780; text-decoration:none; border-radius:3px; gap:16px; box-shadow:0 5px 0 #743519; }
.r39-home .r39-primary:hover { background:#823c1f; }
.r39-home .r39-text-link { display:inline-flex; align-items:center; gap:8px; min-height:44px; color:#172c47; font-weight:730; font-size:14px; text-decoration-color:#c09f84; text-underline-offset:5px; }
.r39-home .r39-join-figure { position:relative; margin:0; min-width:0; }
.r39-home .r39-join-figure img { width:100%; height:clamp(350px,42vw,540px); object-fit:cover; object-position:center; filter:saturate(.84); }
.r39-home .r39-join-figure figcaption { position:absolute; left:0; bottom:0; background:#f3f2ed; color:#4b5764; padding:12px 20px 0 0; font-size:11px; font-weight:700; letter-spacing:.11em; text-transform:uppercase; }
.r39-home .r39-game { background:#0a1c32; color:#f7f5ef; padding:clamp(48px,6vw,80px) 0; }
.r39-home .r39-game .r39-inner { display:grid; grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr); gap:clamp(30px,5vw,72px); align-items:start; }
.r39-home .r39-game .r39-kicker { color:#eda36b; }
.r39-home .r39-game .r39-inner > div:first-child > p:not(.r39-kicker) { margin:16px 0 0; color:#bfcbcf; font-size:16px; line-height:1.5; max-width:34ch; }
.r39-home .r39-game-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:25px; }
.r39-home .r39-game-links a { display:flex; justify-content:space-between; align-items:center; min-height:54px; padding:12px 15px; border:1px solid rgba(255,255,255,.23); color:#fff; text-decoration:none; font-weight:700; font-size:14px; gap:10px; }
.r39-home .r39-game-links a:hover { background:rgba(255,255,255,.1); }
.r39-home .r39-game-links .r39-external { grid-column:1/-1; min-height:46px; padding:8px 0; border:0; border-bottom:1px solid rgba(255,255,255,.23); color:#e9a878; }
.r39-home .r39-desktop-board { margin-top:-6px; min-width:0; }
.r39-home .r39-game #r19-mobile-controls { display:none; }
.r39-home .r39-stories { padding:clamp(52px,6vw,86px) 0; }
.r39-home .r39-stories-head { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:28px; }
.r39-home .r39-stories-head h2 { max-width:17ch; }
.r39-home .r39-story-list { border-top:1px solid #bec5c6; }
.r39-home .r39-story-list a { display:grid; grid-template-columns:58px minmax(0,1fr) auto; align-items:center; gap:16px; border-bottom:1px solid #bec5c6; padding:15px 0; text-decoration:none; min-height:73px; }
.r39-home .r39-story-list a:hover strong { text-decoration:underline; text-underline-offset:4px; }
.r39-home .r39-story-list .r39-story-index { color:#a55b36; font-size:12px; letter-spacing:.08em; font-weight:760; }
.r39-home .r39-story-list strong { font-size:clamp(16px,2vw,21px); font-weight:700; line-height:1.25; }
.r39-home .r39-story-list .r39-arrow { color:#a55b36; }
.r39-home .r39-paths { padding:clamp(45px,5vw,72px) 0 clamp(50px,5vw,78px); background:#e8e9e4; }
.r39-home .r39-paths .r39-section-title { margin-bottom:24px; }
.r39-home .r39-path-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 44px; border-top:1px solid #b9c1c1; }
.r39-home .r39-path-grid details { border-bottom:1px solid #b9c1c1; min-width:0; }
.r39-home .r39-path-grid summary { display:flex; align-items:center; justify-content:space-between; gap:16px; cursor:pointer; min-height:74px; padding:11px 4px; list-style:none; font-size:clamp(18px,2vw,23px); font-weight:720; line-height:1.22; }
.r39-home .r39-path-grid summary::-webkit-details-marker { display:none; }
.r39-home .r39-path-grid summary::after { content:'+'; color:#a65d32; font-size:27px; font-weight:450; line-height:1; }
.r39-home .r39-path-grid details[open] summary::after { content:'−'; }
.r39-home .r39-path-grid ul { list-style:none; margin:0; padding:0 4px 16px; display:grid; gap:2px; }
.r39-home .r39-path-grid li a { display:flex; align-items:center; min-height:44px; padding:6px 0; font-size:15px; text-decoration:underline; text-decoration-color:#aab4b3; text-underline-offset:4px; }
.r39-home .r39-archive { background:#d9d7cf; }
.r39-home .r39-archive a { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 20px; align-items:center; padding:22px 0; min-height:90px; text-decoration:none; }
.r39-home .r39-archive small { display:block; font-size:11px; color:#88522f; text-transform:uppercase; letter-spacing:.15em; font-weight:820; }
.r39-home .r39-archive strong { display:block; font-size:18px; line-height:1.25; font-weight:730; }
.r39-home .r39-archive a:hover strong { text-decoration:underline; text-underline-offset:3px; }
.r39-home .r39-footer { padding:37px 0 25px; background:#071423; color:#f2f0e9; font-size:14px; }
.r39-home .r39-footer .r39-footer-top { display:flex; justify-content:space-between; gap:20px 40px; flex-wrap:wrap; align-items:start; }
.r39-home .r39-footer strong { display:block; font-size:17px; letter-spacing:-.02em; }
.r39-home .r39-footer p { color:#c1c7cc; margin:5px 0 0; line-height:1.5; }
.r39-home .r39-footer a { color:#f2f0e9; text-underline-offset:4px; }
.r39-home .r39-footer .r39-footer-links { display:flex; gap:9px 22px; flex-wrap:wrap; }
.r39-home .r39-footer .r39-footer-links a { display:inline-flex; min-height:44px; align-items:center; }
.r39-home .r39-footer-bottom { border-top:1px solid #314050; padding-top:16px; margin-top:22px; color:#b1bcc1; font-size:12px; }
@media(max-width:960px) {
  .r39-home .r39-join { padding:36px 0 46px; }
  .r39-home .r39-join-grid, .r39-home .r39-game .r39-inner { display:block; }
  .r39-home .r39-join-copy { display:contents; }
  .r39-home .r39-join-grid { display:flex; flex-direction:column; align-items:stretch; gap:0; }
  .r39-home .r39-join-copy h2 { max-width:13ch; }
  .r39-home .r39-join-figure { order:1; margin-top:20px; }
  .r39-home .r39-join-figure img { height:clamp(208px,35svh,380px); object-position:center top; }
  .r39-home .r39-intro { margin-top:14px; font-size:16px; line-height:1.45; }
  .r39-home .r39-steps { margin-top:20px; }
  .r39-home .r39-steps li { font-size:14px; padding:8px 0; }
  .r39-home .r39-join-actions { margin-top:20px; }
  .r39-home .r39-game { padding:44px 0 48px; }
  .r39-home .r39-game h2 { max-width:13ch; }
  .r39-home .r39-game .r39-desktop-board, .r39-home .r39-game .r39-board-mirror { display:none; }
  .r39-home .r39-game .r39-inner > div:first-child > p:not(.r39-kicker) { margin-top:13px; }
  .r39-home .r39-game-links { margin-top:22px; }
  .r39-home .r39-stories { padding:44px 0 49px; }
  .r39-home .r39-stories-head { align-items:start; display:block; margin-bottom:20px; }
  .r39-home .r39-stories-head .r39-text-link { margin-top:12px; }
  .r39-home .r39-story-list a { grid-template-columns:32px minmax(0,1fr) auto; gap:12px; min-height:67px; padding:12px 0; }
  .r39-home .r39-paths { padding:44px 0 49px; }
  .r39-home .r39-paths .r39-section-title { margin-bottom:22px; }
  .r39-home .r39-path-grid { display:block; }
  .r39-home .r39-path-grid summary { min-height:69px; }
  .r39-home .r39-archive a { min-height:98px; }
  .r39-home .r39-footer { padding:32px 0 90px; }
}
@media(max-width:380px) {
  .r39-home .r39-below h2 { font-size:30px; }
  .r39-home .r39-join { padding-top:28px; padding-bottom:36px; }
  .r39-home .r39-join-figure img { height:clamp(218px,38svh,250px); }
  .r39-home .r39-game { padding:35px 0 38px; }
  .r39-home .r39-stories { padding:36px 0 39px; }
  .r39-home .r39-paths { padding:36px 0 40px; }
  .r39-home .r39-path-grid summary { min-height:62px; }
  .r39-home .r39-archive a { min-height:85px; padding:16px 0; }
}
/* Portrait pacing: a complete learning photo and four compact chapters.
   Short/small screens keep natural flow; no hero or shared ancestor rule. */
@media(max-width:960px) {
  .r39-home .r39-join-figure img { height:auto; aspect-ratio:960 / 1113; object-fit:contain; }
  .r39-home .r39-join-figure figcaption { position:static; padding:10px 0 0; }
}
@media(min-width:350px) and (max-width:960px) and (min-height:620px) and (orientation:portrait) {
  .r39-home .r39-join { min-block-size:132svh; display:grid; align-content:center; }
  .r39-home .r39-game { min-block-size:68svh; display:grid; align-content:center; }
  .r39-home .r39-stories, .r39-home .r39-paths { min-block-size:80svh; display:grid; align-content:center; }
  .r39-home .r39-below h2 { font-size:clamp(34px,10vw,45px); }
  .r39-home .r39-story-list a { min-height:82px; }
  .r39-home .r39-story-list strong { font-size:18px; }
  .r39-home .r39-path-grid summary { min-height:76px; }
}
