/* Phase 1–3 UX - Guard the Flock */

/* Landing */
.landing{display:none;padding-block:28px 40px}
body.landing-mode .landing{display:block}
body.landing-mode .nav-tabs,
body.landing-mode .section,
body.landing-mode .help-now-btn{display:none!important}
body:not(.landing-mode) .landing{display:none}
.landing-intro{font-family:Lora,Georgia,serif;font-size:1.05rem;color:var(--fg-muted);max-width:52ch;margin:0 0 28px;line-height:1.65}
.path-cards{display:grid;grid-template-columns:1fr;gap:14px;margin-bottom:28px}
@media(min-width:640px){.path-cards{grid-template-columns:repeat(3,1fr);gap:16px}}
.path-card{background:var(--card-bg);border:1px solid var(--border);border-radius:10px;padding:22px 20px;cursor:pointer;text-align:left;font-family:inherit;color:inherit;transition:border-color .15s,box-shadow .15s,transform .12s;display:flex;flex-direction:column;gap:8px;min-height:100%}
.path-card:hover,.path-card:focus-visible{border-color:var(--accent);box-shadow:0 4px 16px rgba(0,0,0,.08);outline:none}
.path-card:active{transform:scale(.985)}
.path-card .path-icon{font-size:1.6rem;line-height:1}
.path-card .path-title{font-family:Lora,Georgia,serif;font-size:1.05rem;font-weight:600;margin:0;color:var(--fg)}
.path-card .path-desc{font-size:.875rem;color:var(--fg-muted);margin:0;line-height:1.5;flex:1}
.path-card .path-cta{font-size:.78rem;font-weight:600;color:var(--accent);margin-top:6px}
.landing-alt{text-align:center;font-size:.9rem;color:var(--fg-muted)}
.landing-alt button{background:none;border:none;color:var(--link);font:inherit;font-weight:600;cursor:pointer;text-decoration:underline;padding:0}
.landing-alt button:hover{color:var(--accent)}

/* Start here nav control */
.nav-start-here{
  border-color:var(--accent)!important;
  color:var(--accent)!important;
  font-weight:600!important;
}
.nav-start-here:hover{
  background:var(--accent-soft)!important;
  color:var(--accent)!important;
}

/* Help Now button */
.help-now-btn{position:fixed;bottom:20px;right:16px;z-index:90;display:flex;align-items:center;gap:8px;padding:10px 16px;background:var(--accent);color:#fff;border:none;border-radius:28px;font-family:Inter,system-ui,sans-serif;font-size:.85rem;font-weight:600;cursor:pointer;box-shadow:0 4px 18px rgba(139,28,46,.35)}
.help-now-btn:hover{background:#6e1524}
.help-now-btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:380px){.help-now-btn .hn-label{display:none}.help-now-btn{padding:12px;border-radius:50%}}

/* Cases soft gate */
.cases-soft-gate{border:1px solid var(--border);background:var(--bg-alt);border-radius:8px;padding:18px 20px;margin-bottom:1.5rem;font-size:.9rem}
.cases-soft-gate p{margin:0 0 12px}
.cases-show-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;background:var(--card-bg);border:1px solid var(--border);border-radius:6px;font:inherit;font-size:.85rem;font-weight:600;color:var(--fg);cursor:pointer;margin-top:4px}
.cases-show-btn:hover{border-color:var(--accent);color:var(--accent)}
#case-content-wrapper.hidden-cases{display:none}
.inline-goto{background:none;border:none;padding:0;font:inherit;color:var(--link);font-weight:600;cursor:pointer;text-decoration:underline}
.inline-goto:hover{color:var(--accent)}

/* Phase 2: Discern progressive disclosure — preserve original L/R alignment */
.discern-layers{
  margin: 32px 0 8px;
}
.layer-toggle{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
  padding:14px 16px;
  background:var(--card-bg);
  border:1px solid var(--border);
  border-radius:8px;
  cursor:pointer;
  font:inherit;
  text-align:left;
  color:var(--fg);
  transition:border-color .15s,box-shadow .15s;
  box-sizing:border-box;
}
.layer-toggle:hover,.layer-toggle:focus-visible{
  border-color:var(--accent);
  box-shadow:0 2px 12px rgba(0,0,0,.06);
  outline:none;
}
.layer-toggle-label{font-family:Lora,Georgia,serif;font-size:1.05rem;font-weight:600}
.layer-toggle-hint{font-size:.8rem;color:var(--fg-muted)}
.layer-toggle::after{
  content:"Show ▾";
  font-size:.78rem;
  font-weight:600;
  color:var(--accent);
  margin-top:6px;
}
.layer-toggle[aria-expanded="true"]::after{content:"Hide ▴"}

/* Expanded deeper content: same horizontal edge as rest of section (no indent) */
.discern-deeper{
  margin: 24px 0 0;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  max-width: none;
}
.discern-deeper[hidden]{display:none!important}
.discern-deeper > .sec-sub:first-child,
.discern-deeper > h3:first-child{
  margin-top: 0;
}

.discussion-steps .step{scroll-margin-top:72px}

/* Phase 2: Mobile More menu */
@media(max-width:640px){
  .nav-more-item{display:none!important}
  .nav-more-item.nav-more-visible{display:inline-flex!important}
  .nav-more-toggle{display:inline-flex!important}
  .nav-tabs.nav-more-open .nav-more-item{display:inline-flex!important}
}
@media(min-width:641px){
  .nav-more-toggle{display:none!important}
}

/* Phase 3 polish */
.last-reviewed{font-size:.8rem;color:var(--fg-muted)}
.nav-tab:focus-visible,
.path-card:focus-visible,
.help-now-btn:focus-visible,
.layer-toggle:focus-visible,
.cases-show-btn:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}
.skip-link{
  position:absolute;
  left:-9999px;
  top:auto;
  width:1px;height:1px;
  overflow:hidden;
}
.skip-link:focus{
  position:fixed;
  left:12px;top:12px;
  z-index:200;
  width:auto;height:auto;
  padding:10px 14px;
  background:var(--accent);
  color:#fff;
  border-radius:6px;
  font-weight:600;
  text-decoration:none;
}

/* Keep related-links boxes within the same column as tab content */
.related-links{
  box-sizing:border-box;
  width:100%;
  max-width:100%;
  margin-top:32px;
}
.related-links-wrap{
  box-sizing:border-box;
  width:100%;
  max-width:100%;
}
.faq-standalone .related-links{
  margin-left:0;
  margin-right:0;
}
