/* =========================================================
   NUVO CHURCH — The Nuvo YTH Parent Field Guide (/yth/field-guide/)
   Same reading layout as /women-in-leadership/ (paper.css),
   recolored for Nuvo YTH, plus the guide's own pieces:
   "Try this week" boxes, things to say, checklists, conversation
   starters and linked sources.
   ========================================================= */
.page-guide {
  --forest: #1B5FC1;            /* paper.css accent -> YTH blue */
  --sage: #A9C2EC;
  --w-deep: #10264A;            /* deep navy */
  --w-deep-2: #173463;
  --w-gold: #8FB2EC;            /* light blue accent on navy */
  --w-paper: #FBFAF6;
  --g-soft: #E6EEFA;
}
.page-guide .whero {
  background:
    radial-gradient(70% 60% at 85% 10%, rgba(143, 178, 236, .22), transparent 60%),
    radial-gradient(60% 70% at 0% 100%, rgba(27, 95, 193, .55), transparent 65%),
    var(--w-deep);
}
.page-guide .whero__t em { color: #BFD3F2; }
.page-guide .wbtn--light { color: var(--w-deep); }
.page-guide .wsum__pts a, .page-guide .wprose a { color: var(--forest); font-weight: 600; text-underline-offset: 3px; }
.page-guide .wq { background: var(--g-soft); }
.page-guide .wnext a:hover { background: rgba(27, 95, 193, .06); }
.page-guide .wpart { background: radial-gradient(80% 120% at 100% 0%, rgba(143, 178, 236, .25), transparent 60%), var(--w-deep-2); }
.page-guide .wcard--books { background: var(--g-soft); }
.page-guide .wcard--plan { background: var(--forest); color: #fff; border-color: transparent; }
.page-guide .wcard--plan .wcard__t { color: #fff; }
.page-guide .wcard--plan .wcard__k, .page-guide .wcard--plan .wcard__go { color: #DCE6F5; }
.page-guide .wcard--plan .wcard__d { color: rgba(255, 255, 255, .85); }

/* chapter subtitle */
.wch__dek { margin: 14px 0 0; font-family: var(--font-serif); font-style: italic; font-size: clamp(1.3rem, 2.2vw, 1.6rem); line-height: 1.35; color: var(--forest); }

/* bold-lead lists */
.wlist--b li b { color: var(--charcoal); font-family: var(--font-display); }

/* numbered lists */
.gol { list-style: none; counter-reset: g; margin: 0 0 1.3em; padding: 0; display: grid; gap: 10px; }
.gol li { counter-increment: g; position: relative; padding: 14px 18px 14px 58px; background: var(--w-paper); border: 1px solid var(--line); border-radius: 14px; line-height: 1.55; }
.gol li::before { content: counter(g); position: absolute; left: 16px; top: 13px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--forest); color: #fff; font-family: var(--font-display); font-weight: 800; font-size: 14px; }
.gol b { color: var(--charcoal); font-family: var(--font-display); }

/* words you can say */
.gsay { position: relative; margin: 1.5em 0 !important; padding: 22px 24px 22px 26px; border-left: 4px solid var(--forest); border-radius: 4px 18px 18px 4px; background: var(--g-soft);
  font-family: var(--font-serif); font-style: italic; font-size: clamp(1.25rem, 2.1vw, 1.5rem); line-height: 1.4; color: var(--charcoal); }
.gsay__k { display: block; margin-bottom: 6px; font-family: var(--font-display); font-style: normal; font-weight: 800; font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--forest); }

/* try this week */
.gtry { margin: 2.2em 0 .4em; padding: clamp(22px, 3vw, 30px); border-radius: 22px; background: var(--w-deep); color: #EEF2FA; }
.gtry__h { margin: 0 0 14px !important; font-family: var(--font-display); font-weight: 800; font-size: 13px; letter-spacing: .18em; text-transform: uppercase; color: var(--w-gold); }
.gtry ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.gtry li { position: relative; padding-left: 34px; line-height: 1.55; font-size: 1.04rem; color: rgba(238, 242, 250, .86); }
.gtry li::before { content: ""; position: absolute; left: 0; top: 2px; width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--w-gold); }
.gtry li b { color: #fff; font-family: var(--font-display); }

/* notes, crisis line */
.gnote { padding: 16px 18px; border-radius: 14px; border: 1px dashed rgba(37, 39, 35, .2); font-size: .98rem; line-height: 1.6; color: var(--muted); }
.gcrisis { padding: 20px 22px; border-radius: 16px; background: #FFF1EC; border: 1px solid #F3C7B8; color: #6B2A17; font-size: 1.02rem; line-height: 1.6; }
.gcrisis a { color: #9A3412 !important; }
.gh4 { margin: 1.6em 0 .6em; font-family: var(--font-display); font-weight: 800; font-size: 1.1rem; color: var(--charcoal); }

/* 90-day checklists */
.gcheck { list-style: none; margin: 0 0 1.4em; padding: 0; display: grid; gap: 8px; }
.gcheck label { display: flex; gap: 14px; align-items: flex-start; padding: 13px 16px; border-radius: 14px; background: var(--w-paper); border: 1px solid var(--line); cursor: pointer; line-height: 1.5; transition: background .2s, border-color .2s; }
.gcheck input { appearance: none; -webkit-appearance: none; flex: 0 0 24px; width: 24px; height: 24px; margin: 1px 0 0; border-radius: 7px; border: 2px solid var(--sage); background: #fff; cursor: pointer; display: grid; place-items: center; transition: background .2s, border-color .2s; }
.gcheck input::after { content: ""; width: 12px; height: 7px; border: solid #fff; border-width: 0 0 2.5px 2.5px; transform: rotate(-45deg) translate(1px, -1px); opacity: 0; }
.gcheck input:checked { background: var(--forest); border-color: var(--forest); }
.gcheck input:checked::after { opacity: 1; }
.gcheck input:focus-visible { outline: 3px solid var(--sage); outline-offset: 2px; }
.gcheck label:has(input:checked) { background: var(--g-soft); border-color: transparent; }
.gcheck label:has(input:checked) span { color: var(--muted); text-decoration: line-through; text-decoration-color: rgba(27, 95, 193, .4); }

/* conversation starters */
.gcs__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 1.2em; }
.gcs { padding: 22px 22px 18px; border-radius: 20px; background: var(--w-paper); border: 1px solid var(--line); }
.gcs:last-child:nth-child(odd) { grid-column: 1 / -1; }
.gcs__h { margin: 0 0 12px; font-family: var(--font-display); font-weight: 800; font-size: 12.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--forest); }
.gcs ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.gcs li { font-family: var(--font-serif); font-style: italic; font-size: 1.2rem; line-height: 1.35; color: var(--charcoal); }
@media (max-width: 640px) { .gcs__grid { grid-template-columns: minmax(0, 1fr); } }

/* citations + sources */
.gcite { font-size: .62em; line-height: 0; vertical-align: super; margin-left: 1px; }
.gcite a { text-decoration: none; font-family: var(--font-display); font-weight: 800; padding: 0 2px; }
.gsrc { list-style: none; margin: 0 0 1.4em; padding: 0; display: grid; gap: 10px; }
.gsrc li { display: flex; gap: 14px; padding: 14px 16px; border-radius: 14px; background: var(--w-paper); border: 1px solid var(--line); line-height: 1.5; font-size: 1rem; scroll-margin-top: 110px; }
.gsrc li:target { border-color: var(--forest); box-shadow: 0 0 0 3px rgba(27, 95, 193, .15); }
.gsrc__n { flex: 0 0 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--g-soft); color: var(--forest); font-family: var(--font-display); font-weight: 800; font-size: 13px; }
.gsrc b { color: var(--charcoal); }

/* the plan chapter stands out a little */
.wch--plan .wch__num { color: var(--forest); }

/* end card */
.gend { margin: 10px 0 30px; padding: clamp(26px, 4vw, 40px); border-radius: 26px; background: var(--forest); color: #fff; }
.gend .eyebrow { color: #DCE6F5; }
.gend__h { margin: 6px 0 12px; font-family: var(--font-display); font-weight: 800; font-size: clamp(1.5rem, 3vw, 2.1rem); line-height: 1.1; letter-spacing: -.02em; }
.gend p:not(.eyebrow) { margin: 0 0 22px; color: rgba(255, 255, 255, .86); line-height: 1.6; }
.gend__btn { background: #fff; color: var(--forest); }

@media print {
  .gtry { background: none; color: #000; border: 2px solid #000; }
  .gtry li, .gtry li b, .gtry__h { color: #000; }
  .gsay, .gcheck label, .gcs, .gsrc li, .gol li { background: none; break-inside: avoid; }
  .gend { display: none; }
  .gsrc a::after { content: " " attr(href); font-size: 10px; }
}