/* ==========================================================================
   PediaSuite — NRP Study Tools shared stylesheet
   Used by /nrp/ pages. Requires site.css loaded first.
   ========================================================================== */

/* --- Study page layout -------------------------------------------------- */
.study-wrap{ max-width:820px; margin-inline:auto; padding-inline:28px; }
.study-hero{ padding:54px 0 40px; }
.study-hero .eyebrow{ margin-bottom:14px; }
.study-hero h1{ margin-bottom:16px; }
.study-hero .lede{ max-width:54ch; }

/* --- Tool grid on /nrp/ landing ----------------------------------------- */
.nrp-tools{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin-bottom:48px; }
@media (max-width:700px){ .nrp-tools{ grid-template-columns:1fr; } }
.nrp-tool{ background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:24px 22px; text-decoration:none; display:flex; flex-direction:column; gap:10px;
  transition:border-color .15s, transform .15s; }
.nrp-tool:hover{ transform:translateY(-2px); border-color:var(--teal); }
.nrp-tool .tool-icon{ width:36px; height:36px; border-radius:7px; flex:none;
  display:flex; align-items:center; justify-content:center; font-size:1rem; }
.nrp-tool .tool-icon.teal{ background:var(--teal-wash); color:var(--teal); }
.nrp-tool .tool-icon.amber{ background:var(--amber-wash); color:var(--amber); }
.nrp-tool h3{ font-family:var(--sans); font-size:1.02rem; font-weight:700; margin:0; }
.nrp-tool p{ font-family:var(--sans); font-size:.86rem; color:var(--ink-soft); margin:0; }
.nrp-tool .tool-meta{ display:flex; gap:12px; margin-top:auto; padding-top:6px;
  font-family:var(--sans); font-size:.76rem; color:var(--ink-faint); }
.nrp-tool .tool-go{ font-family:var(--sans); font-size:.82rem; font-weight:600; color:var(--teal);
  margin-top:auto; padding-top:4px; }

/* --- CTA banner --------------------------------------------------------- */
.study-cta{ background:#0E1A2B; border:1px solid var(--line); border-radius:12px;
  padding:28px 26px; margin:44px 0; }
.study-cta .k{ font-family:var(--sans); font-size:.7rem; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:#E8A75C; }
.study-cta h3{ color:#F4F6F6; margin:8px 0 6px; font-size:1.2rem; }
.study-cta p{ font-family:var(--sans); font-size:.88rem; color:#A9B7C4; margin:0 0 16px; max-width:52ch; }

/* --- Flashcard deck ----------------------------------------------------- */
.fc-controls{ display:flex; flex-wrap:wrap; gap:10px; align-items:center;
  margin-bottom:24px; font-family:var(--sans); font-size:.85rem; }
.fc-controls select{ font-family:var(--sans); font-size:.85rem; padding:8px 12px;
  border:1px solid var(--line-strong); border-radius:6px;
  background:var(--panel); color:var(--ink); cursor:pointer; }
.fc-count{ color:var(--ink-faint); font-size:.82rem; margin-left:auto; }

.fc-grid{ display:flex; flex-direction:column; gap:14px; margin-bottom:48px; }

.fc-card{ background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; transition:border-color .15s; }
.fc-card:hover{ border-color:var(--line-strong); }

.fc-q{ padding:18px 20px; cursor:pointer; display:flex; gap:14px; align-items:flex-start;
  font-family:var(--sans); font-size:.92rem; color:var(--ink); user-select:none; }
.fc-q::before{ content:"Q"; flex:none; width:26px; height:26px; border-radius:5px;
  background:var(--teal-wash); color:var(--teal); font-weight:700; font-size:.72rem;
  display:flex; align-items:center; justify-content:center; letter-spacing:.03em; }
.fc-q::after{ content:"+"; flex:none; margin-left:auto; font-family:var(--mono);
  color:var(--ink-faint); font-size:1.1rem; transition:transform .2s; }
.fc-card[open] .fc-q::after{ content:"\2212"; transform:rotate(180deg); }

.fc-a{ padding:0 20px 18px 60px; font-family:var(--sans); font-size:.88rem;
  color:var(--ink-soft); line-height:1.65; }
.fc-a strong{ color:var(--ink); font-weight:600; }
.fc-a .fc-note{ margin-top:8px; padding-top:8px; border-top:1px dashed var(--line);
  font-size:.82rem; color:var(--ink-faint); font-style:italic; }

.fc-lesson-head{ font-family:var(--sans); font-size:.72rem; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:var(--amber);
  margin:32px 0 10px; padding-bottom:8px; border-bottom:1px solid var(--line); }
.fc-lesson-head:first-child{ margin-top:0; }

/* --- Breadcrumb (shared) ------------------------------------------------ */
.study-crumb{ font-family:var(--sans); font-size:.8rem; color:var(--ink-faint);
  padding:28px 0 0; display:flex; gap:8px; flex-wrap:wrap; }
.study-crumb a{ color:var(--ink-soft); text-decoration:none; }
.study-crumb a:hover{ color:var(--teal); }

/* --- Language toggle ---------------------------------------------------- */
.lang-toggle{ display:inline-flex; border:1px solid var(--line-strong); border-radius:100px;
  overflow:hidden; font-family:var(--sans); font-size:.78rem; font-weight:600; }
.lang-toggle button{ padding:6px 14px; border:none; background:transparent;
  color:var(--ink-soft); cursor:pointer; transition:background .15s, color .15s; }
.lang-toggle button.active{ background:var(--teal-wash); color:var(--teal); }

/* ==========================================================================
   /nrp/ landing redesign — hero, page nav, comparison table, trust band, FAQ.
   Additive only: nothing above this line is touched, so the other /nrp/*
   subpages (which also load this file) are unaffected.
   ========================================================================== */

/* --- Hero (two-column: copy + photo) ------------------------------------ */
.nrp-hero-wrap{ max-width:1120px; margin-inline:auto; padding-inline:28px; }
.nrp-hero{
  display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center;
  padding:56px 0 40px;
}
@media (max-width:900px){
  .nrp-hero{ grid-template-columns:1fr; gap:32px; padding:32px 0 28px; }
  .nrp-hero-visual{ order:-1; }
}
.nrp-hero h1{ margin-bottom:16px; }
.nrp-hero .lede{ margin-bottom:26px; }
.nrp-hero-ctas{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-bottom:18px; }
.nrp-hero-ctas .btn-primary svg{ width:16px; height:16px; }
.nrp-hero-link{
  font-family:var(--sans); font-size:.92rem; font-weight:600; color:var(--ink-soft);
  text-decoration:none; border-bottom:1px solid var(--line-strong);
  transition:color .15s, border-color .15s;
}
.nrp-hero-link:hover{ color:var(--teal); border-color:var(--teal); }
.nrp-trust-line{
  font-family:var(--sans); font-size:.8rem; color:var(--ink-faint);
  display:flex; flex-wrap:wrap; gap:8px 14px; align-items:center;
}
.nrp-trust-line span{ display:inline-flex; align-items:center; gap:8px; }
.nrp-trust-line span + span::before{ content:"·"; margin-right:6px; color:var(--line-strong); }

.nrp-hero-visual{ position:relative; }
.nrp-hero-photo{
  border-radius:18px; overflow:hidden; border:1px solid var(--line);
  box-shadow:var(--shadow); aspect-ratio:4/3;
}
.nrp-hero-photo img{ width:100%; height:100%; object-fit:cover; }
.nrp-hero-chip{
  position:absolute; left:20px; bottom:-18px; z-index:2;
  background:var(--panel); border:1px solid var(--line-strong); border-radius:12px;
  box-shadow:var(--shadow); padding:12px 16px;
  display:flex; align-items:center; gap:10px; max-width:calc(100% - 40px);
}
.nrp-hero-chip svg{ width:20px; height:20px; color:var(--teal); flex:none; }
.nrp-hero-chip-text{ font-family:var(--sans); line-height:1.25; }
.nrp-hero-chip-title{ font-size:.82rem; font-weight:700; color:var(--ink); }
.nrp-hero-chip-sub{ font-size:.72rem; color:var(--ink-faint); }
@media (max-width:900px){ .nrp-hero-chip{ bottom:-16px; left:16px; } }

/* --- In-page section nav (pills) ----------------------------------------- */
.nrp-page-nav{
  display:flex; gap:10px; flex-wrap:wrap; margin:0 0 44px;
  padding-top:28px; border-top:1px solid var(--line);
}
.nrp-page-nav a{
  font-family:var(--sans); font-size:.84rem; font-weight:600; color:var(--ink-soft);
  text-decoration:none; padding:8px 16px; border:1px solid var(--line-strong); border-radius:100px;
  transition:border-color .15s, color .15s, background .15s;
}
.nrp-page-nav a:hover{ border-color:var(--teal); color:var(--teal); background:var(--teal-wash); }

/* --- Section headers inside the page ------------------------------------- */
.nrp-section{ padding-top:8px; margin-bottom:56px; scroll-margin-top:24px; }
.nrp-section-head{ max-width:60ch; margin-bottom:26px; }
.nrp-section-head h2{ margin-bottom:10px; }
.nrp-section-head p{ font-family:var(--sans); font-size:.96rem; color:var(--ink-soft); margin:0; }

/* --- Free vs. Full Module comparison table -------------------------------- */
.compare-table-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius); }
.compare-table{ width:100%; border-collapse:collapse; font-family:var(--sans); font-size:.88rem; min-width:520px; }
.compare-table th, .compare-table td{ padding:14px 18px; text-align:left; border-bottom:1px solid var(--line); }
.compare-table thead th{
  font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-faint); background:var(--paper);
}
.compare-table thead th.col-paid{ color:var(--teal); }
.compare-table tbody th{ font-weight:600; color:var(--ink); white-space:nowrap; }
.compare-table td{ color:var(--ink-soft); }
.compare-table td.col-paid{ color:var(--ink); font-weight:600; }
.compare-table tbody tr:last-child th, .compare-table tbody tr:last-child td{ border-bottom:none; }
.compare-table .dash{ color:var(--line-strong); }
.compare-cta{ display:flex; justify-content:center; margin-top:26px; }

/* --- Trust band ------------------------------------------------------------ */
.trust-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
@media (max-width:820px){ .trust-grid{ grid-template-columns:1fr; } }
.trust-item{ display:flex; gap:14px; align-items:flex-start; }
.trust-item svg{ width:22px; height:22px; color:var(--teal); flex:none; margin-top:2px; }
.trust-item p{ font-family:var(--sans); font-size:.9rem; color:var(--ink-soft); margin:0; line-height:1.5; }
.trust-item strong{ color:var(--ink); }

/* --- FAQ accordion (same visual language as .fc-card, distinct content) --- */
.faq-list{ display:flex; flex-direction:column; gap:12px; }
.faq-item{ background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:border-color .15s; }
.faq-item:hover{ border-color:var(--line-strong); }
.faq-q{ padding:18px 20px; cursor:pointer; display:flex; gap:14px; align-items:center;
  font-family:var(--sans); font-size:.95rem; font-weight:600; color:var(--ink); list-style:none; user-select:none; }
.faq-q::-webkit-details-marker{ display:none; }
.faq-q::after{ content:"+"; flex:none; margin-left:auto; font-family:var(--mono);
  color:var(--ink-faint); font-size:1.2rem; transition:transform .2s; }
.faq-item[open] .faq-q::after{ content:"\2212"; }
.faq-a{ padding:0 20px 18px; font-family:var(--sans); font-size:.88rem; color:var(--ink-soft); line-height:1.65; max-width:70ch; }

/* --- Mid-page CTA (compact variant of .study-cta) -------------------------- */
.nrp-cta-inline{
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  background:var(--panel); border:1px solid var(--line-strong); border-radius:var(--radius);
  padding:22px 26px; margin:0 0 56px;
}
.nrp-cta-inline p{ font-family:var(--sans); font-size:.92rem; color:var(--ink-soft); margin:0; max-width:48ch; }
.nrp-cta-inline strong{ color:var(--ink); }