/* The Pathway Home (ported 2026-11-01 from the 10-29 draft). Full-bleed standard. Scoped under .pathway-road-page.
   One painting (724 x 2172, its largest existing file) is shown once, whole, as one unbroken road from the
   father's house to the church. On desktop it is a column down the right edge of .pw-road, on phones a
   full-width image. Grounds are sampled from the painting and hand off by gradient: sky -> olive ->
   lamp-light -> amber -> bone -> dusk. No cards, boxes or rules. */

.pathway-road-page{
  --sky:#f6e4c6; --sky-2:#efce97;      /* painting sky / horizon */
  --olive:#4f4d26; --olive-2:#3f3e1f;  /* the hills */
  --amber:#e09d45;                     /* sunset gold, saturated */
  --bone:#f5f0e6;                      /* live --pj-paper */
  --lamp:#edd1a5;                      /* bottom-scene sky */
  --dusk:#263331;                      /* live --pj-ink */
  --ink:#263331; --earth:#7a4a22;      /* earth: em on light grounds (6.3:1 on bone, 5.0:1 on lamp) */
  --cream:#f8f1e1; --gold-lt:#f3c56f;  /* text / em on olive and dusk */
  --header-h:86px;
  --serif:Georgia,'Times New Roman',serif;
  --art-w:min(724px,56vw);
}
@media (max-width:1250px){.pathway-road-page{--header-h:78px}}
@media (max-width:600px){.pathway-road-page{--header-h:74px}}

.pathway-road-page main{overflow-x:clip;display:block}
.pathway-road-page main p{color:inherit}
.pathway-road-page main p,.pathway-road-page main h1,.pathway-road-page main h2,.pathway-road-page main h3{margin:0}
.pathway-road-page main:focus{outline:none}

.pathway-road-page main h1,.pathway-road-page main h2,.pathway-road-page main h3{font-family:var(--display);font-weight:600;letter-spacing:-.06em;color:inherit;margin:0}
.pathway-road-page main em{font-family:var(--serif);font-weight:400;font-style:italic;letter-spacing:-.04em}
.pathway-road-page .eyebrow{font-size:11px;font-weight:750;letter-spacing:.16em;line-height:1.7;margin-bottom:22px;color:#6f5236}
.pathway-road-page .pw-poster{line-height:.92}
.pathway-road-page .pw-scene-description{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* buttons: the live ink button, larger */
.pathway-road-page .pw-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-height:58px;padding:17px 24px;background:var(--ink);color:#fffaf1;font-size:14px;font-weight:650;line-height:1.4;border-radius:2px;transition:background .2s,transform .2s;max-width:100%}
.pathway-road-page .pw-btn>span:last-child{font-size:19px;line-height:1}
.pathway-road-page .pw-btn:hover{background:#415344;transform:translateY(-2px)}
.pathway-road-page .pw-btn-light{background:var(--cream);color:var(--ink)}
.pathway-road-page .pw-btn-light:hover{background:var(--gold-lt)}

/* the painting: a column/band that crops the 724px file and never scales it up */
.pathway-road-page .pw-art{position:absolute;top:0;bottom:0;right:0;width:var(--art-w);overflow:hidden;pointer-events:none;z-index:0}
.pathway-road-page .pw-art img{position:absolute;right:0;width:724px;max-width:none;height:auto}
.pathway-road-page .pw-hero,.pathway-road-page .pw-support,.pathway-road-page .pw-resource,.pathway-road-page .pw-choose,.pathway-road-page .pw-welcome,.pathway-road-page .pw-closing{position:relative;isolation:isolate}
.pathway-road-page .pw-road{position:relative;isolation:isolate;display:flex;flex-direction:column;min-height:2172px;background:linear-gradient(180deg,var(--sky) 0,#f3d9ad 22.1%,var(--sky-2) 39.6%,#8c7a45 46%,var(--olive) 53.4%,var(--olive-2) 77%,#8a7a4a 81%,var(--lamp) 86%,#e8c48f 100%)}
.pathway-road-page .pw-art-long{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%),linear-gradient(180deg,#000 96%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 30%),linear-gradient(180deg,#000 96%,transparent 100%);mask-composite:intersect}
.pathway-road-page .pw-art-long img{top:0;height:100%;object-fit:cover;object-position:100% 0}
.pathway-road-page .pw-road-lower{display:contents}
.pathway-road-page .pw-hero>*:not(.pw-art):not(.pw-sun),.pathway-road-page .pw-support>*:not(.pw-art),.pathway-road-page .pw-welcome>*:not(.pw-art){position:relative;z-index:2}
.pathway-road-page .pw-closing>*:not(.pw-art){position:relative;z-index:2}

/* ---------- I · Hero ---------- */
.pathway-road-page .pw-hero{min-height:860px;max-height:none;padding:44px max(60px,calc((100vw - 1320px)/2)) 90px;display:flex;align-items:center}
.pathway-road-page .pw-sun{position:absolute;left:-14vw;top:4%;width:62vw;height:62vw;max-width:980px;max-height:980px;border-radius:50%;background:radial-gradient(circle,#fff4d8 0%,#fbe3b0cc 28%,#f6d79e55 52%,transparent 70%);z-index:1;pointer-events:none;animation:pw-breathe 9s ease-in-out infinite alternate}
@keyframes pw-breathe{from{opacity:.75;transform:translate3d(0,0,0)}to{opacity:1;transform:translate3d(2vw,-1vw,0)}}
.pathway-road-page .pw-hero-copy{max-width:1000px}
.pathway-road-page .pw-back{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:13px;font-weight:600;color:#5a4a37;margin-bottom:30px}
.pathway-road-page .pw-back:hover{color:var(--earth)}
.pathway-road-page .pw-hero h1{font-size:clamp(76px,10.4vw,176px);letter-spacing:-.075em;line-height:.86;margin:0 0 30px;font-weight:600;text-shadow:0 0 40px #f6e4c680}
.pathway-road-page .pw-subtitle{font-family:var(--serif);font-style:italic;font-size:clamp(22px,2.1vw,32px);line-height:1.25;letter-spacing:-.02em;margin-bottom:10px;max-width:520px}
.pathway-road-page .pw-author{font-size:13px;font-weight:650;letter-spacing:.06em;color:#5a4a37;margin-bottom:34px}
.pathway-road-page .pw-identity{display:flex;align-items:center;gap:26px;margin-bottom:34px;max-width:520px}
.pathway-road-page .pw-identity>img{width:96px;flex:0 0 96px;box-shadow:6px 12px 22px #3a2a1440;transform:rotate(-3deg)}
.pathway-road-page .pw-identity h2{font-size:clamp(28px,2.5vw,38px);line-height:1.05;margin-bottom:8px}
.pathway-road-page .pw-identity p{font-size:15px;line-height:1.6;max-width:320px;color:#3f3a2e}
.pathway-road-page .pw-actions{display:flex;align-items:center;flex-wrap:wrap;gap:14px 30px}
.pathway-road-page .pw-follow{display:inline-flex;gap:22px;align-items:center;min-height:44px;font-size:14px;font-weight:650;border-bottom:1px solid #5a4a3766}
.pathway-road-page .pw-follow:hover{color:var(--earth)}

/* ---------- II · Support: olive ground, the middle of the road ---------- */
.pathway-road-page .pw-support{flex:1 0 auto;color:var(--cream);padding:160px max(60px,calc((100vw - 1320px)/2)) 90px;display:flex;align-items:center}
.pathway-road-page .pw-support .eyebrow{color:var(--gold-lt)}
.pathway-road-page .pw-support h2{font-size:clamp(60px,8.4vw,142px);letter-spacing:-.07em;margin-bottom:46px;max-width:1080px;text-shadow:0 2px 30px #2b2a1466}
.pathway-road-page .pw-support h2 em{color:var(--gold-lt)}
.pathway-road-page .pw-support-text{max-width:540px}
.pathway-road-page .pw-support-text p{font-size:17px;line-height:1.75;color:#efe6d0;margin-bottom:18px}
.pathway-road-page .pw-support-text .pw-note{font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.4;color:var(--gold-lt);margin-top:28px}

/* ---------- III · Resource: amber ground, the books arrive (signature motion) ---------- */
.pathway-road-page .pw-resource{background:linear-gradient(180deg,#e8c48f 0,var(--amber) 220px,var(--amber) 82%,#ecc58c 100%);padding:130px max(60px,calc((100vw - 1320px)/2)) 60px;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:40px;align-items:center}
.pathway-road-page .pw-resource .eyebrow{color:#4a2c10}
.pathway-road-page .pw-resource h2{font-size:clamp(60px,7.6vw,128px);letter-spacing:-.07em;margin-bottom:34px}
.pathway-road-page .pw-resource h2 em{color:#5b2f0b}
.pathway-road-page .pw-resource-copy p:not(.eyebrow){font-size:18px;line-height:1.7;max-width:440px;color:#2c2a22}
.pathway-road-page .pw-books{position:relative;height:clamp(520px,48vw,700px);width:100%;max-width:700px;justify-self:end}
.pathway-road-page .pj-volume{position:absolute;bottom:60px;filter:drop-shadow(18px 30px 24px #3b240b66);transition:transform 1.5s cubic-bezier(.2,.7,.15,1),opacity 1.1s ease}
.pathway-road-page .pj-volume img{display:block;width:100%;height:auto}
.pathway-road-page .pj-main-volume{width:min(400px,60%);left:4%;z-index:3;transform:perspective(1400px) rotateY(0deg) rotateZ(-5deg)}
.pathway-road-page .pj-guide-volume{width:min(340px,50%);right:0;bottom:44px;z-index:2;transform:perspective(1400px) rotateY(0deg) rotateZ(5deg)}
.pathway-road-page .pj-book-shadow{position:absolute;width:92%;height:44px;bottom:30px;left:4%;border-radius:50%;background:#4a2a0a66;filter:blur(20px);z-index:0}
/* armed by JS only (no JS = books in place) */
.pathway-road-page .pw-books.is-armed .pj-main-volume{transform:perspective(1400px) translate3d(-60px,220px,0) rotateY(-24deg) rotateZ(-14deg);opacity:0}
.pathway-road-page .pw-books.is-armed .pj-guide-volume{transform:perspective(1400px) translate3d(80px,260px,0) rotateY(-20deg) rotateZ(16deg);opacity:0;transition-delay:.18s}
.pathway-road-page .pw-books.is-armed.is-arrived .pj-main-volume{transform:perspective(1400px) rotateY(0deg) rotateZ(-5deg);opacity:1}
.pathway-road-page .pw-books.is-armed.is-arrived .pj-guide-volume{transform:perspective(1400px) rotateY(0deg) rotateZ(5deg);opacity:1}
.pathway-road-page .pw-books.is-settled .pj-main-volume img{animation:pw-float 7s ease-in-out infinite alternate}
.pathway-road-page .pw-books.is-settled .pj-guide-volume img{animation:pw-float 8s 1s ease-in-out infinite alternate-reverse}
@keyframes pw-float{from{transform:translateY(0)}to{transform:translateY(-10px)}}

/* ---------- IV · Choose: bone ground ---------- */
.pathway-road-page .pw-choose{background:linear-gradient(180deg,#ecc58c 0,var(--bone) 160px);padding:80px max(60px,calc((100vw - 1320px)/2)) 90px}
.pathway-road-page .pw-purchase-intro{margin-bottom:44px}
.pathway-road-page .pw-purchase-intro h3{font-size:clamp(52px,6.6vw,112px);letter-spacing:-.07em;margin-bottom:18px}
.pathway-road-page .pw-purchase-intro p{font-size:18px;color:#4c4a40}
.pathway-road-page .pw-choices{display:grid;grid-template-columns:1fr 1fr;gap:70px}
.pathway-road-page .pw-format{font-size:11px;font-weight:750;letter-spacing:.16em;color:#6f5236;margin-bottom:16px}
.pathway-road-page .pw-choice h3{font-size:clamp(34px,3.6vw,56px);line-height:1;letter-spacing:-.06em;margin-bottom:20px}
.pathway-road-page .pw-choice>p:not(.pw-format){font-size:17px;line-height:1.7;max-width:500px;color:#3b3f38;margin-bottom:28px}
.pathway-road-page .pw-retailer{display:block;font-size:13px;color:#5a5d52;margin:14px 0 6px}
.pathway-road-page .pw-alternate{display:inline-flex;gap:14px;align-items:center;min-height:44px;font-size:14px;font-weight:650;border-bottom:1px solid #5a4a3766}
.pathway-road-page .pw-alternate:hover{color:var(--earth)}
.pathway-road-page .pw-choice .pw-separate-note{font-size:14px!important;color:#5a5d52!important;margin:6px 0 0!important}
.pathway-road-page .pw-store-note{font-size:13px;color:#5a5d52;margin-top:40px}

/* ---------- V · Welcome: lamp-lit ground, the bottom of the road ---------- */
.pathway-road-page .pw-welcome{min-height:470px;padding:40px max(60px,calc((100vw - 1320px)/2)) 120px;display:flex;align-items:center}
.pathway-road-page .pw-welcome h2{font-size:clamp(60px,6.6vw,112px);letter-spacing:-.07em;max-width:1100px;text-shadow:0 0 40px #edd1a599}
.pathway-road-page .pw-welcome h2 em{color:var(--earth)}
@media (min-width:1101px){
  /* Keep the welcome heading in the text column, clear of the arriving man. */
  .pathway-road-page .pw-welcome-copy{max-width:calc(100vw - var(--art-w) + 60px - max(60px,calc((100vw - 1320px)/2)))}
  .pathway-road-page .pw-welcome h2{font-size:clamp(60px,5.8vw,100px)}
}
@media (min-width:1101px) and (max-height:820px){
  /* Laptop: start the hero copy near the top so the main button shows without scrolling. */
  .pathway-road-page .pw-hero{align-items:flex-start;padding-top:20px}
  .pathway-road-page .pw-back{margin-bottom:14px}
  .pathway-road-page .pw-hero h1{font-size:clamp(64px,min(7.4vw,13vh),150px);margin-bottom:16px}
  .pathway-road-page .pw-author{margin-bottom:20px}
  .pathway-road-page .pw-identity{margin-bottom:20px}
  .pathway-road-page .pw-identity>img{width:76px;flex-basis:76px}
}

/* ---------- VI · Closing: dusk ---------- */
.pathway-road-page .pw-closing{background:linear-gradient(180deg,var(--bone) 0,#8a6a45 110px,var(--dusk) 260px);color:var(--cream);padding:180px max(60px,calc((100vw - 1320px)/2)) 100px}
.pathway-road-page .pw-closing .eyebrow{color:var(--gold-lt)}
.pathway-road-page .pw-closing h2{font-size:clamp(56px,8.2vw,140px);letter-spacing:-.07em;margin-bottom:34px}
.pathway-road-page .pw-closing h2 em{color:var(--gold-lt)}
.pathway-road-page .pw-closing>p:not(.eyebrow){font-size:18px;line-height:1.7;max-width:520px;color:#dfe2d8;margin-bottom:34px}
.pathway-road-page .pw-closing>p.pw-art-note{font-size:13px;color:#b9c0b4;margin:48px 0 0!important}

/* ---------- narrow desktop / tablet ---------- */
@media (max-width:1100px) and (min-width:800px){
  .pathway-road-page{--art-w:min(724px,62vw)}
  .pathway-road-page .pw-resource{grid-template-columns:1fr;gap:20px}
  .pathway-road-page .pw-books{justify-self:center;height:790px}
  .pathway-road-page .pw-welcome h2{font-size:clamp(46px,5.8vw,64px);max-width:calc(100vw - var(--art-w) - 70px)}
  .pathway-road-page .pw-choices{gap:44px}
  /* the support copy runs over the painting here: give it an olive panel so it stays readable */
  .pathway-road-page .pw-support-text{padding:24px 28px;margin-left:-28px;border-radius:6px;background:#3f3e1fd9}
}

/* ---------- phone: the hero copy, then one unbroken painting behind the support and welcome copy.
   The road never breaks: .pw-road-lower carries the whole 724x2172 painting at its own height,
   top padding shows the father and son, bottom padding the church welcome. ---------- */
@media (max-width:799px){
  .pathway-road-page .pw-hero,.pathway-road-page .pw-support,.pathway-road-page .pw-welcome{display:block;min-height:0;padding:0 0 70px}
  .pathway-road-page .pw-hero{background:linear-gradient(180deg,var(--sky) 0%,#f3d9ad 55%,var(--sky-2) 100%);padding:28px 0 30px}
  .pathway-road-page .pw-road-lower{display:block;position:relative;padding:min(166vw,1100px) 0 min(97vw,700px);background:url(/assets/pathway-continuous-road-724.webp?v=4) 80% 0/auto 100% no-repeat,var(--olive-2)}
  .pathway-road-page .pw-road-lower::before{content:"";position:absolute;inset:0 0 auto;height:70px;background:linear-gradient(180deg,var(--sky-2),transparent);pointer-events:none}
  .pathway-road-page .pw-road{display:block;min-height:0;background:none}
  .pathway-road-page .pw-art-long{display:none}
  .pathway-road-page .pw-sun{display:none}
  .pathway-road-page .pw-hero-copy{padding:0 20px}
  .pathway-road-page .pw-back{margin-bottom:6px}
  .pathway-road-page .pw-hero h1{font-size:clamp(58px,19vw,104px);margin-bottom:22px}
  .pathway-road-page .pw-identity{gap:18px}
  .pathway-road-page .pw-identity>img{width:76px;flex-basis:76px}
  .pathway-road-page .pw-actions{flex-direction:column;align-items:flex-start}
  .pathway-road-page .pw-support{padding:80px 0 80px;background:linear-gradient(180deg,#3f3e1f00 0,#3f3e1fd9 80px,#3f3e1fd9 calc(100% - 80px),#3f3e1f00 100%)}
  .pathway-road-page .pw-support-copy{padding:0 20px}
  .pathway-road-page .pw-support h2{font-size:clamp(44px,12.6vw,80px);margin-bottom:24px}
  .pathway-road-page .pw-support-text p{font-size:16px}
  .pathway-road-page .pw-resource{grid-template-columns:1fr;padding:80px 20px 60px;min-height:0;gap:10px}
  .pathway-road-page .pw-resource h2{font-size:clamp(52px,15.4vw,90px)}
  .pathway-road-page .pw-books{height:min(104vw,480px);justify-self:center;width:100%;max-width:500px;margin-top:20px}
  .pathway-road-page .pj-main-volume{width:58%;left:2%}
  .pathway-road-page .pj-guide-volume{width:48%}
  .pathway-road-page .pw-choose{padding:60px 20px 70px}
  .pathway-road-page .pw-purchase-intro{margin-bottom:36px}
  .pathway-road-page .pw-purchase-intro h3{font-size:clamp(46px,13.6vw,80px)}
  .pathway-road-page .pw-choices{grid-template-columns:1fr;gap:48px}
  .pathway-road-page .pw-welcome{padding:60px 0 60px;background:linear-gradient(180deg,#edd1a500 0,#edd1a5e0 60px,#edd1a5e0 calc(100% - 60px),#edd1a500 100%)}
  .pathway-road-page .pw-welcome-copy{padding:0 20px}
  .pathway-road-page .pw-welcome h2{font-size:clamp(44px,12.6vw,80px);text-shadow:none}
  .pathway-road-page .pw-closing{padding:150px 20px 80px;background:linear-gradient(180deg,var(--bone) 0,#8a6a45 80px,var(--dusk) 200px)}
  .pathway-road-page .pw-closing h2{font-size:clamp(50px,14.6vw,90px)}
}
@media (max-width:360px){
  .pathway-road-page .pw-hero-copy,.pathway-road-page .pw-support-copy,.pathway-road-page .pw-welcome-copy{padding-inline:16px}
  .pathway-road-page .pw-resource,.pathway-road-page .pw-choose,.pathway-road-page .pw-closing{padding-inline:16px}
  .pathway-road-page .pw-btn{gap:16px;padding-inline:18px}
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  
  .pathway-road-page .pw-sun{animation:none}
  .pathway-road-page .pj-volume{transition:none}
  .pathway-road-page .pw-books.is-settled .pj-volume img{animation:none}
  .pathway-road-page .pw-btn,.pathway-road-page .pw-btn:hover{transition:none;transform:none}
}