/*
 * Product Design System — v49
 * The stable source for global visual tokens, accessibility and shared surfaces.
 * Page-specific layout stays in home.css, writings.css, article.css, learning.css and toolbox.css.
 */
:root{
  --color-ink:#171714;
  --color-copy:#4f4c46;
  --color-muted:#65625b;
  --color-paper:#f7f6f2;
  --color-surface:#fff;
  --color-surface-muted:#efeee9;
  --color-line:rgba(23,23,20,.12);
  --color-line-strong:rgba(23,23,20,.2);
  --color-accent:var(--yellow,#f1d113);
  --color-plum:var(--plum,#815299);
  --radius-control:14px;
  --radius-card:22px;
  --radius-feature:32px;
  --shadow-soft:0 12px 36px rgba(23,23,20,.055);
  --shadow-float:0 22px 70px rgba(23,23,20,.11);
  --focus-ring:0 0 0 4px rgba(129,82,153,.24);
}

html{scroll-padding-top:96px}
body{color:var(--color-ink);background:var(--color-paper)}
body.has-active-layer .consent-banner,
body.mobile-menu-open .consent-banner{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(16px);
}

:where(a,button,input,textarea,select,summary,[tabindex]):focus-visible{
  outline:2px solid var(--color-plum);
  outline-offset:3px;
}
:where(button,.btn,.search-trigger,.menu-trigger,.mobile-menu-close,.back-to-top){min-width:44px;min-height:44px}
:where(.muted,.card-meta,.archive-count,.writing-byline){color:var(--color-muted)}

/* Shared editorial hierarchy */
.page-hero{padding-block:clamp(100px,10vw,146px) clamp(52px,7vw,88px)}
.page-hero h1{max-width:920px;margin-block:16px 20px;text-wrap:balance}
.page-hero .lead{max-width:790px;color:var(--color-copy)}
.archive-hero-tools{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.archive-count{display:inline-flex;align-items:center;min-height:36px;padding:7px 11px;border:1px solid var(--color-line);border-radius:999px;background:rgba(255,255,255,.55);font-size:12px}
.section-head{align-items:start}
.section-head p{color:var(--color-copy)}

/* Two card levels only: standard and feature. */
:where(.writing-grid-card,.learning-card,.resource-card,.smart-link-card,.archive-item){
  border-color:var(--color-line);
  border-radius:var(--radius-card);
  box-shadow:none;
}
:where(.writing-grid-card,.learning-card,.resource-card,.smart-link-card,.archive-item):hover{
  border-color:var(--color-line-strong);
  box-shadow:var(--shadow-soft);
}
:where(.writing-feature-card,.resource-detail,.lp43-hero-card){
  border-radius:var(--radius-feature);
  box-shadow:var(--shadow-soft);
}

/* Filters never impersonate navigation when there is little content. */
.filter-btn,.tab{min-height:44px}
.filters:has(.filter-btn:only-child){display:none}
.toolbox-toolbar.is-simple{display:none}

/* Search and empty states */
.empty-state{border-radius:var(--radius-card)}
.search-suggestions{display:grid;gap:14px;margin-top:22px}
.search-suggestions__label{margin:0;color:var(--color-muted);font-size:12px;font-weight:700}
.search-suggestions__links{display:flex;flex-wrap:wrap;gap:8px}
.search-suggestion{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:9px 13px;
  border:1px solid var(--color-line);
  border-radius:999px;
  background:var(--color-surface);
  color:var(--color-copy);
  font-size:13px;
  font-weight:700;
}
.search-suggestion:hover{border-color:var(--color-plum);color:var(--color-ink)}

/* Compact Consent Mode UI; it must never cover the primary task. */
.consent-banner{
  position:fixed;
  z-index:1200;
  right:max(14px,env(safe-area-inset-right));
  left:max(14px,env(safe-area-inset-left));
  bottom:max(14px,env(safe-area-inset-bottom));
  width:min(100% - 28px,820px);
  margin-inline:auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px 18px;
  align-items:center;
  padding:14px 16px;
  border:1px solid var(--color-line-strong);
  border-radius:18px;
  background:rgba(255,255,255,.96);
  color:var(--color-ink);
  box-shadow:var(--shadow-float);
  backdrop-filter:blur(18px) saturate(140%);
  transition:opacity .18s ease,visibility .18s ease,transform .18s ease;
}
.consent-banner[hidden]{display:none}
.consent-copy{min-width:0}
.consent-copy strong{display:block;font-size:14px;line-height:1.55}
.consent-copy p{margin:2px 0 0;color:var(--color-copy);font-size:11.5px;line-height:1.75}
.consent-copy a{display:inline-flex;margin-top:2px;color:var(--color-plum);font-size:11px;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.consent-actions{display:flex;align-items:center;gap:7px}
.consent-actions .btn{min-height:42px;padding:8px 12px;font-size:12px;white-space:nowrap}
.consent-actions .btn-quiet{border:0;background:transparent;color:var(--color-plum);box-shadow:none}
.consent-detail{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr)) auto;
  gap:10px;
  align-items:center;
  padding-top:12px;
  border-top:1px solid var(--color-line);
}
.consent-detail[hidden]{display:none}
.consent-detail label{display:flex;align-items:center;gap:8px;min-height:40px;font-size:12px}
.consent-detail input{width:18px;height:18px;accent-color:var(--color-plum)}

/* Mobile menu and overlay reachability */
.mobile-menu-nav a{min-height:72px}
.mobile-menu-footer a{display:inline-flex;align-items:center;min-height:44px}
.search-close{min-height:44px}

/* Less motion and less glass on constrained devices. */
@media(max-width:780px){
  .container,.reading{width:min(calc(100% - 32px),var(--max))}
  .section{padding-block:72px}
  .page-hero{padding-top:96px;padding-bottom:54px}
  .page-hero h1{font-size:clamp(36px,11vw,52px)}
  .consent-banner{
    grid-template-columns:1fr;
    gap:10px;
    padding:13px 14px calc(13px + env(safe-area-inset-bottom));
    border-radius:18px;
  }
  .consent-copy p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
  .consent-actions{display:grid;grid-template-columns:1fr 1fr}
  .consent-actions .btn{width:100%}
  .consent-actions .btn-quiet{grid-column:1/-1;min-height:36px;padding-block:4px}
  .consent-detail{grid-template-columns:1fr;padding-top:10px}
  .consent-detail label{min-height:36px}
}

@media(max-width:420px){
  .container,.reading{width:min(calc(100% - 24px),var(--max))}
  .archive-count{font-size:11px}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

@media(prefers-reduced-transparency:reduce){
  .consent-banner,.site-header,.nav--polished{backdrop-filter:none!important;background:#fff!important}
}

/* Product Design v49 — search, editorial density and mobile continuity */
.search-page-v49 .search-page-hero{max-width:980px}
.search-page-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;max-width:760px;margin-top:24px}
.search-page-form .field{min-height:54px}
.search-page-suggestions{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin-top:16px;color:var(--color-muted);font-size:13px}
.search-page-suggestions>span{font-weight:800}
.search-page-suggestions>div{display:flex;flex-wrap:wrap;gap:8px}
.search-page-suggestions a{display:inline-flex;align-items:center;min-height:40px;padding:7px 12px;border:1px solid var(--border);border-radius:999px;background:var(--surface);font-weight:700}
.search-page-suggestions a:hover{border-color:var(--ink);background:var(--color-accent)}
.search-page-results{display:grid;gap:36px}
.search-page-summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:20px;border-bottom:1px solid var(--border)}
.search-start-state{max-width:720px;padding:clamp(28px,5vw,58px);border:1px solid var(--border);border-radius:var(--radius-card);background:var(--paper)}
.search-start-state h2{margin:10px 0;font-size:clamp(25px,3vw,40px)}
.search-start-state p{margin:0;color:var(--color-muted);line-height:2}
.search-result-group{display:grid;gap:14px}
.search-result-group>header{display:flex;align-items:end;justify-content:space-between;gap:16px}
.search-result-group>header h2{margin:0;font-size:clamp(22px,2.4vw,32px)}
.search-result-group>header span{color:var(--color-muted);font-size:13px}
.search-result-group .archive-item h3{margin:0 0 8px;font-size:clamp(17px,1.8vw,22px)}
.search-empty-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:20px}
@media(max-width:640px){
  .search-page-form{grid-template-columns:1fr}
  .search-page-form .btn{width:100%}
  .search-page-suggestions{align-items:flex-start;flex-direction:column}
  .search-page-suggestions>div{flex-wrap:nowrap;width:100%;overflow-x:auto;padding-bottom:5px;scrollbar-width:none}
  .search-page-summary{align-items:stretch;flex-direction:column}
  .search-result-group>header{align-items:flex-start}
}

/* Product Design v49 — credibility logos remain secondary to the personal narrative. */
#organizations .orgs{gap:12px}
#organizations .org{min-height:88px;border:1px solid var(--color-line);border-radius:16px;background:rgba(255,255,255,.7);box-shadow:none}
#organizations .org img{filter:grayscale(1);opacity:.72;transition:filter .18s ease,opacity .18s ease}
#organizations .org:hover img,#organizations .org:focus-visible img{filter:none;opacity:1}
@media(max-width:480px){
  .consent-copy p{display:none}
  .consent-copy a{margin-top:0}
  .consent-banner{gap:8px;padding-top:11px}
}

/* V49.2 — consent stays visible without covering the primary content. */
.consent-banner{width:min(100% - 28px,760px);padding:11px 13px;border-radius:15px;gap:8px 14px}
.consent-copy strong{font-size:13px}.consent-copy p{font-size:10.5px;line-height:1.65}.consent-actions .btn{min-height:44px;padding:7px 10px;font-size:11px}
@media(max-width:780px){
  .consent-banner{right:max(8px,env(safe-area-inset-right));left:max(8px,env(safe-area-inset-left));bottom:max(8px,env(safe-area-inset-bottom));width:calc(100% - 16px);grid-template-columns:minmax(0,1fr);gap:6px;padding:9px 10px calc(9px + env(safe-area-inset-bottom));border-radius:14px}
  .consent-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:5px 10px}.consent-copy strong{font-size:12px}.consent-copy p{display:none}.consent-copy a{margin:0;font-size:10px;white-space:nowrap}
  .consent-actions{display:grid;grid-template-columns:1fr 1fr auto;gap:6px}.consent-actions .btn{min-height:42px;padding:6px 8px;font-size:10.5px}.consent-actions .btn-quiet{grid-column:auto;min-width:70px;min-height:42px;padding:6px}
  .consent-detail{max-height:min(46vh,310px);grid-template-columns:1fr 1fr;gap:5px 9px;padding-top:8px;overflow:auto}.consent-detail label{min-height:34px;font-size:11px}.consent-detail .btn{grid-column:1/-1;width:100%;min-height:42px}
}
@media(max-width:370px){.consent-actions{grid-template-columns:1fr 1fr}.consent-actions .btn-quiet{grid-column:1/-1;min-height:34px}.consent-copy{grid-template-columns:1fr}.consent-copy a{display:none}}