/* Intellect Juris — Insights hub
   Section layout follows the supplied Insights mock (light version, stacked scroll); type, colour,
   buttons and radii come from site.css. The closing CTA reuses .ab-cta from about.css. */

.in-muted { color: var(--bronze); }

/* ---------- stacked scroll: each [data-stack] block sticks once its bottom reaches the screen's bottom
   (insights.js sets the negative top), so the next section slides over it ---------- */
.in-stage { position: relative; }
html.motion-ok [data-stack] { position: sticky; top: 0; }
.in-hero { z-index: 0; }
.in-stack { z-index: 1; }
.in-hb { position: relative; z-index: 2; }

/* ---------- hero ---------- */
.in-hero { padding: 168px 0 96px; text-align: center; background: radial-gradient(90% 75% at 50% 0%, var(--sand) 0%, rgba(232, 225, 214, .55) 45%, var(--page) 100%); }
.in-badge { display: inline-flex; align-items: center; gap: 10px; padding: 5px 16px 5px 6px; border: 1px solid var(--stone); border-radius: 999px; background: var(--page); font-size: .875rem; font-weight: 500; text-decoration: none; transition: background-color .3s var(--ease); }
.in-badge:hover { background: var(--sand); }
.in-badge b { padding: 6px 12px; border-radius: 999px; background: var(--espresso); color: #fff; font-size: .6875rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.in-badge svg { width: 13px; height: 13px; transition: translate .3s var(--ease); }
.in-badge:hover svg { translate: 3px 0; }
.in-hero .ab-h1 { max-width: 15em; margin: 8px auto 0; }
.in-hero .hero__line { display: block; }
.in-hero .ab-lede { max-width: 46ch; margin: 24px auto 0; }

/* ---------- collections ---------- */
.in-stack { padding-bottom: 96px; }
.in-panel { padding: 72px 40px 40px; border-radius: var(--radius); background: var(--sand); text-align: center; }
.in-panel .h2 { margin-top: 22px; }
.in-panel__sub { max-width: 520px; margin: 18px auto 48px; color: var(--taupe); }
.in-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; text-align: left; }
.in-grid > li { display: flex; }
.in-card { position: relative; display: flex; flex-direction: column; gap: 10px; width: 100%; padding: 30px 28px 26px; border-radius: var(--radius); background: var(--page); transition: translate .35s var(--ease), box-shadow .35s var(--ease); }
.in-card:hover { translate: 0 -4px; box-shadow: 0 14px 30px -18px rgba(41, 45, 48, .45); }
.in-card__icon svg { display: block; width: 58px; height: 58px; }
.in-card__n { position: absolute; top: 32px; right: 28px; font-size: .875rem; font-weight: 600; letter-spacing: .1em; color: var(--bronze); }
.in-card h3 { margin-top: 14px; font: 500 1.375rem/1.2 var(--font-display); letter-spacing: -0.01em; }
.in-card p { margin-bottom: 10px; font-size: .9375rem; color: var(--taupe); }
.in-soon { align-self: flex-start; margin-top: auto; padding: 6px 12px; border: 1px solid var(--stone); border-radius: 999px; font-size: .8125rem; color: var(--taupe); }

/* ---------- the founder's legal handbook ---------- */
.in-hb { border-radius: 24px 24px 0 0; background: var(--sand); box-shadow: 0 -18px 40px -24px rgba(41, 45, 48, .25); }
.in-hb > .container { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: start; gap: 64px; padding-block: 88px; }
.in-kicker { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; font-size: .75rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--taupe); }
.in-kicker::before { content: ""; width: 44px; height: 1px; background: var(--copper); }
.in-hb__copy p:not(.in-kicker) { max-width: 44ch; margin-top: 20px; font-size: 1.0625rem; color: var(--taupe); }
.in-hb__copy .in-hb__note { margin-top: 16px; font-size: .875rem; color: var(--bronze); }
.in-books { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.in-book { display: flex; flex-direction: column; justify-content: space-between; gap: 20px; min-height: 250px; padding: 24px 20px 20px 26px; border-left: 8px solid var(--copper); border-radius: 4px 10px 10px 4px; background: var(--page); box-shadow: 0 10px 24px -14px rgba(41, 45, 48, .3); transition: translate .35s var(--ease), rotate .35s var(--ease), box-shadow .35s var(--ease); }
.in-book:hover { translate: 0 -6px; rotate: -.6deg; box-shadow: 0 18px 32px -16px rgba(41, 45, 48, .35); }
.in-book__n { font-size: .8125rem; font-weight: 600; letter-spacing: .1em; color: var(--bronze); }
.in-book b { font: 500 1.125rem/1.3 var(--font-display); }
.in-book__meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 12px; border-top: 1px solid var(--stone); }
.in-book__meta em { padding: 5px 8px; border: 1px solid var(--espresso); border-radius: 4px; font-size: .6875rem; font-style: normal; font-weight: 600; letter-spacing: .14em; }
.in-book__meta small { font-size: .75rem; color: var(--taupe); }

/* ---------- CTA ---------- */
.in-cta { padding-top: 72px; }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .in-grid { grid-template-columns: 1fr 1fr; }
  .in-hb > .container { grid-template-columns: 1fr; gap: 40px; padding-block: 56px; }
  .in-books { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px) {
  .in-hero { padding: 120px 0 64px; }
  .in-stack { padding-bottom: 64px; }
  .in-panel { padding: 44px 16px 16px; }
  .in-hb { border-radius: 16px 16px 0 0; }
  .in-cta { padding-top: 48px; }
}
@media (max-width: 560px) {
  .in-grid, .in-books { grid-template-columns: 1fr; }
  .in-book { min-height: 190px; }
}
