/* ---------------------------------------------------------------------- *
 * Research page (page-research.php).
 *
 * Its own file, loaded only on that template, so a cached older theme.css can
 * never leave it half-styled. One layout, two palettes (the dark values are the
 * site's Signal tokens), and two library layouts: a grid of cards (default) or a
 * list with the type and date in a left column.
 * ---------------------------------------------------------------------- */

.ss-res{
	--r-page:#fff;
	--r-card:#f4f2f7;
	--r-line:#e2dee9;
	--r-line-soft:#eae7ef;
	--r-rule:#cfcad8;
	--r-ink:#1a1c22;
	--r-text:#57555f;
	--r-muted:#7d7a85;
	--r-note:#7d7a85;
	--r-label:#7d7a85;
	--r-accent:#00859a;
	--r-accent-fill:#00abba;
	--r-chip-on:#1a1c22;
	--r-chip-on-fg:#fff;
	--r-chip-line:#cfcad8;
	--r-chip-text:#57555f;
	--r-deep:#f4f2f7;
	--r-cta-from:#0a1030;
	--r-cta-to:#13243f;
	background:var(--r-page);
	color:var(--r-text);
}
.ss-res--dark{
	--r-page:#0a1030;
	--r-card:#141a3a;
	--r-line:#232845;
	--r-line-soft:#1b213f;
	--r-rule:#4e536a;
	--r-ink:#edeff4;
	--r-text:#c4c9d4;
	--r-muted:#9aa1b0;
	--r-note:#8b93a6;
	--r-label:#838fa6;
	--r-accent:#00abba;
	--r-btn-line:#3b4059;
	--r-chip-on:#1a1c22;
	--r-chip-on-fg:#fff;
	--r-chip-line:rgba(237,239,244,.62);
	--r-chip-text:#8b93a6;
	--r-deep:#070b22;
	--r-cta-from:#141a3a;
	--r-cta-to:#132341;
}
.ss-res *{ box-sizing:border-box; }
.ss-res h1,.ss-res h2,.ss-res h3,.ss-res p{ margin:0; }

/* The site's one container formula (theme.css §3): side padding on the section,
   the content column (.ss-inner) centered inside it. */
.ss-res__hero,.ss-res__sec,.ss-res__disc{ padding-inline:max(clamp(16px,5vw,44px), calc((100% - var(--content-max, 1152px)) / 2)); }

/* ---- hero ---- */
.ss-res__hero{ border-bottom:1px solid var(--r-line); padding-block:clamp(40px,3.3vw,62px) clamp(32px,2.6vw,50px); }
.ss-res__hero-in{ display:grid; grid-template-columns:minmax(0,60%) minmax(0,1fr); align-items:end; column-gap:0; row-gap:28px; }
.ss-res__hero-text{ min-width:0; }
.ss-res__eyebrow{ font-size:11.5px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--r-label); }
.ss-res__h1{ margin-top:18px !important; max-width:9.5em; font-size:clamp(40px,3.75vw,72px); line-height:1; font-weight:700; letter-spacing:-.035em; color:var(--r-ink); }
.ss-res__lead{ margin-top:22px !important; max-width:28.5em; font-size:clamp(17px,1.04vw,20px); line-height:1.5; color:var(--r-text); }
.ss-res__stat{ display:flex; align-items:baseline; gap:12px; padding-bottom:4px; }
.ss-res__stat strong{ font-size:clamp(32px,2.3vw,44px); line-height:1; font-weight:700; letter-spacing:-.02em; color:var(--r-ink); font-variant-numeric:tabular-nums; }
.ss-res__stat span{ font-size:11.5px; letter-spacing:.08em; color:var(--r-label); }

/* ---- sections ---- */
.ss-res__sec{ padding-block:clamp(36px,3.4vw,52px) 0; }
.ss-res__sechead{ display:flex; align-items:baseline; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:22px; }
.ss-res__sechead h2,.ss-res__sub h2,.ss-res__disc h2{ font-size:clamp(24px,1.56vw,30px); line-height:1.1; font-weight:700; letter-spacing:-.02em; color:var(--r-ink); }
.ss-res__aside{ font-size:12px; color:var(--r-note); }

/* ---- featured ---- */
.ss-res__featured{ padding:clamp(24px,2.6vw,40px); border:1px solid var(--r-line); }
.ss-res__kicker{ font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--r-accent); }
.ss-res__ftitle{ margin-top:16px !important; max-width:13em; font-size:clamp(26px,1.9vw,36px); line-height:1.13; font-weight:700; letter-spacing:-.025em; color:var(--r-ink); }
.ss-res__fexcerpt{ margin-top:22px !important; max-width:36em; font-size:clamp(15px,.9vw,17px); line-height:1.65; color:var(--r-text); }
.ss-res__fmeta{ margin-top:18px !important; font-size:12px; letter-spacing:.02em; color:var(--r-note); }
.ss-res__fbtns{ display:flex; gap:12px; flex-wrap:wrap; margin-top:22px; }
.ss-res .ss-btn{ text-transform:none; letter-spacing:0; font-size:14.5px; font-weight:700; padding:0 24px; min-height:50px; }
.ss-res .ss-btn--outline-light{ border-color:var(--r-btn-line, var(--r-chip-line)); color:var(--r-ink); }
.ss-res--light .ss-btn--outline-light{ background:transparent; }

/* ---- filter chips (and the pager, which reuses them) ---- */
.ss-res__chips{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:28px; }
.ss-res__chip{
	display:inline-block; padding:11px 20px; border:1px solid var(--r-chip-line); border-radius:999px; background:transparent;
	font-size:11.5px; font-weight:600; letter-spacing:.06em; line-height:1; text-decoration:none; color:var(--r-chip-text);
	transition:border-color .15s ease, color .15s ease;
}
.ss-res__chip:hover{ border-color:var(--r-accent); color:var(--r-ink); }
.ss-res__chip.is-active{ background:var(--r-chip-on); border-color:var(--r-chip-on); color:var(--r-chip-on-fg); font-weight:700; }
.ss-res__chip:focus-visible,.ss-res__item:focus-visible{ outline:2px solid var(--r-accent); outline-offset:3px; }
.ss-res__pager{ margin:34px 0 0; }

/* ---- library items: shared parts ---- */
.ss-res__item{ display:flex; text-decoration:none; color:inherit; }
.ss-res__type{ font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--r-accent); }
.ss-res__date{ font-size:12px; color:var(--r-note); }
.ss-res__title{ display:block; font-size:clamp(17px,1vw,19.5px); line-height:1.25; font-weight:700; letter-spacing:-.015em; color:var(--r-ink); }
.ss-res__excerpt{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; margin-top:8px; font-size:14.5px; line-height:1.55; color:var(--r-muted); }
.ss-res__tags{ display:block; margin-top:12px; font-size:11px; font-weight:600; letter-spacing:.06em; color:var(--r-accent); }
.ss-res__read{ font-size:12px; font-weight:700; letter-spacing:.03em; color:var(--r-accent); white-space:nowrap; }
.ss-res__item:hover .ss-res__title,.ss-res__item:focus-visible .ss-res__title{ text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; }
.ss-res__empty{ padding:26px 0; font-size:15px; color:var(--r-note); border-top:1px solid var(--r-line); }

/* ---- layout 1: columns (a grid of cards) ---- */
.ss-res--columns .ss-res__items{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,1.6vw,24px); }
.ss-res--columns .ss-res__item{ flex-direction:column; gap:16px; min-width:0; padding:clamp(20px,1.6vw,28px); background:var(--r-card); border:1px solid var(--r-line); transition:border-color .15s ease; }
.ss-res--columns .ss-res__item:hover{ border-color:var(--r-accent); }
.ss-res--columns .ss-res__meta{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.ss-res--columns .ss-res__body{ flex:1 1 auto; min-width:0; }

/* ---- layout 2: list (type and date in a left column, "Read →" at the right) ---- */
.ss-res--list .ss-res__items{ border-top:1px solid var(--r-rule); }
.ss-res--list .ss-res__item{ display:grid; grid-template-columns:clamp(96px,10.8%,126px) minmax(0,1fr) auto; column-gap:clamp(20px,1.7vw,32px); align-items:start; padding:clamp(20px,1.9vw,28px) 0; border-bottom:1px solid var(--r-line-soft); }
.ss-res--list .ss-res__meta{ display:flex; flex-direction:column; gap:8px; padding-top:3px; }
.ss-res--list .ss-res__excerpt{ max-width:84ch; -webkit-line-clamp:2; }
.ss-res--list .ss-res__read{ padding-top:3px; }

/* ---- subscribe panel ---- */
.ss-res__sub{
	display:grid; grid-template-columns:minmax(0,1.9fr) minmax(0,1fr); gap:clamp(24px,3vw,44px); align-items:center;
	margin-top:clamp(28px,3vw,44px); padding:clamp(28px,3.2vw,44px);
	background:radial-gradient(ellipse 60% 140% at 92% -10%, rgba(0,171,186,.2), transparent 70%), linear-gradient(110deg, var(--r-cta-from), var(--r-cta-to));
}
.ss-res__sub h2{ color:#fff; font-size:clamp(22px,1.5vw,28px); }
.ss-res__sub p{ margin-top:12px !important; max-width:34em; font-size:15px; line-height:1.55; color:#c4c9d4; }
.ss-res__sub-form{ display:flex; flex-direction:column; align-items:flex-start; gap:12px; max-width:300px; }
.ss-res__sub-form input{
	width:100%; min-height:46px; padding:0 14px; font:inherit; font-size:14.5px; color:#edeff4;
	background:rgba(255,255,255,.05); border:1px solid rgba(237,239,244,.42); border-radius:0;
}
.ss-res__sub-form input::placeholder{ color:#8b93a6; opacity:1; }
.ss-res__sub-form input:focus{ outline:2px solid #00abba; outline-offset:2px; }

/* ---- disclosures ---- */
.ss-res__disc{ margin-top:clamp(44px,5vw,72px); padding-block:clamp(32px,4vw,52px) clamp(36px,4.4vw,56px); background:var(--r-deep); border-top:1px solid var(--r-line); }
.ss-res__disc h2{ font-size:15px; letter-spacing:-.005em; margin-bottom:14px !important; }
.ss-res__disc p{ font-size:15px; line-height:1.65; color:var(--r-muted); }
.ss-res__disc p + p{ margin-top:12px !important; }
.ss-res__disc strong{ color:var(--r-text); }

/* ---- smaller screens ---- */
@media (max-width:1100px){
	.ss-res--columns .ss-res__items{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:980px){
	.ss-res__hero-in{ grid-template-columns:1fr; }
	.ss-res__sub{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width:700px){
	.ss-res--list .ss-res__item{ grid-template-columns:minmax(0,1fr); row-gap:10px; }
	.ss-res--list .ss-res__meta{ flex-direction:row; align-items:baseline; gap:14px; }
	.ss-res--list .ss-res__read{ padding-top:0; }
}
@media (max-width:620px){
	.ss-res--columns .ss-res__items{ grid-template-columns:minmax(0,1fr); }
	.ss-res__chip{ padding:10px 16px; }
	.ss-res__fbtns .ss-btn,.ss-res__sub-form .ss-btn{ flex:1 1 100%; justify-content:center; text-align:center; }
	.ss-res__sub-form{ max-width:none; align-items:stretch; }
}
@media (prefers-reduced-motion:reduce){ .ss-res *{ transition:none !important; } }
