/* Pray the Land in the look of Walking into the Pages (Tai, 16.10.2026). Loaded after apple.css and tokens.css on every page.
   Values are the reference's own: canvas #f5f5f7, card #fff, ink #1d1d1f, secondary #6e6e73, line #d2d2d7, hairline .5px #0000001f,
   accent #0071e3, glass #faf8f5c7 with blur(20px) saturate(180%), spring cubic-bezier(.22,1,.36,1), measure 65ch. */
html{background:var(--canvas)}
body{background:var(--canvas);color:var(--ink);font-family:var(--font);font-size:19px;line-height:1.55}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--ink)}
h1,h2{font-weight:700;letter-spacing:-.022em;line-height:1.08}
a{color:var(--accent-text)}
::selection{background:#0071e333}
p,li{max-width:var(--measure)}
.hero p,.head p,.cta p,footer p,nav p,.fcols p,.card p,.verse p{max-width:none}

/* ---------- glass bar (reference header: slim, blurred, hairline) ---------- */
body > nav:not(.ptl-tabbar){background:transparent;border-bottom:var(--hairline);min-height:56px}
body > nav:not(.ptl-tabbar)::before{background:var(--glass);-webkit-backdrop-filter:var(--glass-filter);backdrop-filter:var(--glass-filter)}
body > nav.solid{border-bottom:var(--hairline)}
nav .brand{font-family:var(--font-display);font-weight:600;font-size:19px;letter-spacing:-.01em;color:var(--ink)!important;text-decoration:none}
nav .brand *{color:inherit}
nav .brand svg circle,nav .brand svg ellipse,nav .brand svg line,nav .brand svg path{stroke:var(--accent)}
nav .brand svg [fill]:not([fill="none"]){fill:var(--accent)}
nav .back,.navlinks a,.navactions a:not(.navjoin),nav .links a:not(.navjoin){color:var(--secondary);font-weight:500;font-size:15px}
.navlinks a:hover,nav .back:hover{color:var(--ink)}
.navlinks a[aria-current="page"],nav .links a[aria-current="page"]{color:var(--accent-text)}
nav .navjoin,.navactions .navjoin,nav .links .navjoin{background:var(--accent);color:#fff!important;font-weight:600;transition:transform .3s var(--spring),background .3s var(--spring)}
nav .navjoin:hover,.navactions .navjoin:hover{background:var(--accent-hover)}
nav .navtoggle{color:var(--accent-text);font-weight:600;background:transparent}
nav .navtoggle:hover{background:#0000000a;color:var(--accent-text)}
.navpanel{background:#f5f5f7f2;-webkit-backdrop-filter:var(--glass-filter);backdrop-filter:var(--glass-filter)}
.navpanel a{color:var(--ink);font-family:var(--font-display);font-weight:600;font-size:26px;letter-spacing:-.01em;border-bottom:var(--hairline)}
.navpanel a:hover,.navpanel a[aria-current="page"]{color:var(--accent-text)}
.navpanel .pgroup{color:var(--secondary);font:600 15px/1.3 var(--font);letter-spacing:.14em;text-transform:uppercase;border:0}
.navpanel a.sister{color:var(--accent-text)}

/* ---------- bottom tab bar (reference: glass, hairline top, ink labels, selected pill) ---------- */
nav.ptl-tabbar{background:var(--glass)!important;-webkit-backdrop-filter:var(--glass-filter)!important;backdrop-filter:var(--glass-filter)!important;
  border-top:var(--hairline)!important;box-shadow:0 -8px 24px #0000000a}
nav.ptl-tabbar a{color:var(--secondary)!important;font-weight:600!important;letter-spacing:0!important}
nav.ptl-tabbar a.on,nav.ptl-tabbar a:focus-visible{color:var(--accent-text)!important}
.ptl-a2hs{background:var(--card);color:var(--ink);border:var(--hairline);box-shadow:var(--shadow)}

/* ---------- headings, eyebrows, sections ---------- */
.eyebrow,.kicker,.hero .eyebrow,.head .eyebrow,.hero .place,.k{font-family:var(--font);font-size:15px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--secondary)}
.head h1,.hero h1{font-weight:700;letter-spacing:-.025em;color:var(--ink)}
.head .sub,.hero .sub,.hero .tag,.lede{color:var(--secondary);font-weight:500}
section.alt,section.band,.band{background:var(--card)}
hr,.rule{border:0;border-top:var(--hairline);background:none;height:0;opacity:1}

/* ---------- buttons ---------- */
.btn-gold,.btn.solid,a.btn.solid,.cta a.btn.solid,.btn-primary,.btn,.cta a,.foot .btn,form button[type=submit],form .btn-gold{
  background:var(--accent);color:#fff!important;border:0;border-radius:var(--pill);min-height:48px;font-weight:600;font-size:17px;box-shadow:none;
  transition:transform .3s var(--spring),background .3s var(--spring)}
.btn-gold:hover,.btn.solid:hover,.btn-primary:hover,.btn:hover,.cta a:hover,.foot .btn:hover,form button[type=submit]:hover{background:var(--accent-hover);color:#fff!important}
.btn-ghost,a.btn.ghost,.cta a.btn-ghost,.btn:not(.solid):not(.btn-gold):not(.btn-primary):not(.btn-link){
  background:var(--card);color:var(--accent-text)!important;border:0;box-shadow:var(--shadow)}
.btn-ghost:hover,a.btn.ghost:hover,.cta a.btn-ghost:hover,.btn:not(.solid):not(.btn-gold):not(.btn-primary):not(.btn-link):hover{background:var(--card);color:var(--accent-text)!important;box-shadow:0 2px 4px #00000014,0 10px 28px #0000000f}
.btn-link,.cta a.btn-link{background:none!important;color:var(--accent-text)!important;border:0;box-shadow:none}
.btn:active,.cta a:active,.navjoin:active{transform:scale(.98)}

/* ---------- cards ---------- */
.card,.tri,.video-card,.station,.dayrow,.letter-card,.tile,.tier,.tile-hover,details.letter,.fcard{background:var(--card);color:var(--ink);border:0;border-radius:var(--radius);box-shadow:var(--shadow)}
.card h3,.tri h3,.tier h3,.letter-card h3{color:var(--ink)}
input,select,textarea{background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:12px}
input:focus,select:focus,textarea:focus{outline:3px solid #0071e340;border-color:var(--accent)}
::placeholder{color:var(--secondary)}

/* ---------- scripture and quote blocks ---------- */
blockquote{border-inline-start:3px solid var(--accent);color:var(--ink);font-family:var(--font-serif)}
.verse,.quote,.scripture{color:var(--ink)}
.verse .ref,.vref,.quote .ref,cite{color:var(--accent-text);font-style:normal;font-weight:600}
.heb,.hebv,.vheb,.fheb,.he,.heb-quote,[lang="he"]{font-family:var(--font-he);color:var(--ink)}
.pray,.rest,.promise,.heal{background:var(--card);border:0;border-inline-start:3px solid var(--accent);box-shadow:var(--shadow)}

/* ---------- footer (reference: canvas, hairline top, quiet secondary type) ---------- */
.foot,footer{background:var(--canvas);color:var(--secondary);border-top:var(--hairline)}
footer .word,.foot .word{font-family:var(--font-display);font-weight:700;color:var(--ink);letter-spacing:-.02em}
footer h3,.foot h3{color:var(--ink);font:600 15px/1.3 var(--font);letter-spacing:.14em;text-transform:uppercase}
footer a,.foot a{color:var(--accent-text)}
footer .sig,.foot .sig{color:var(--secondary)}
.sister-line{display:block;margin:20px auto 0;text-align:center;font-size:15px;line-height:1.6;color:var(--secondary)}
.sister-line a{display:inline;min-height:0;padding:0;color:var(--accent-text);font-weight:600}

/* ---------- photo and night zones: same tokens, dark values (white text over the photo's own overlay) ---------- */
html.stage-dark,.phero,.verseband,.on-photo{
  --canvas:#000; --card:#1d1d1f; --ink:#fff; --secondary:#e5e5ea; --line:#3a3a3c; --hairline:.5px solid #ffffff2e;
  --accent-text:#fff; --glass:#000000c7; --shadow:0 1px 2px #00000040,0 8px 24px #00000040;
  --bg:#000; --bg-2:#1d1d1f; --ink-2:#e5e5ea; --ink-3:#e5e5ea;
  --dark:#000; --dark-2:#000; --dark-3:#3a3a3c; --on-dark:#fff; --muted-dark:#e5e5ea;
  --basalt:#000; --basalt-2:#000; --basalt-3:#3a3a3c; --parchment:#fff; --parchment-dim:#e5e5ea; --warm-white:#fff; --muted:#e5e5ea; --olive:#1d1d1f;
  --gold-deep:#fff; --gold-dim:#fff; --tekhelet:#fff; --tekhelet-on-dark:#fff; --tekhelet-d:#fff;
  color:#fff}
html.stage-dark body{background:#000;color:#fff}
html.stage-dark nav.ptl-tabbar,html.stage-dark body > nav::before{background:#000000c7!important}
.phero .eyebrow,.phero .k,.verseband .vref,.on-photo .eyebrow{color:#ffffffd9}
.phero .btn:not(.solid),.on-photo .btn-ghost{background:#ffffff26;color:#fff!important;box-shadow:none}
.walk-foot.on-photo{background:#000;border-top:var(--hairline)}
.verseband .heb,.verseband .heb span{color:#fff!important}

/* round 2: brand reads as one phrase; gap only between the mark and the text, same markup on every page */
nav .brand{display:inline-flex!important;align-items:center;gap:9px;white-space:nowrap!important;letter-spacing:.02em}
nav .brand .bmark{flex:0 0 auto;display:block}
nav .brand .bt{display:inline;white-space:nowrap;word-spacing:normal}
