/* Shared stylesheet for aienhancedsolutions.net.
   Extracted from inline <style> blocks. Edit here, not per page. */

    :root {
      --ink:            #0E1B2C;
      --ink-soft:       #2B3A4E;
      --ink-muted:      #5C6B7E;
      --canvas:         #F6F1E8;
      --canvas-raised:  #FBF7EF;
      --paper:          #FFFFFF;
      --accent:         #2E7D6B;
      --accent-2:       #E66A4E;
      --hairline:       rgba(14, 27, 44, 0.10);
      --hairline-soft:  rgba(14, 27, 44, 0.06);
      --shadow-rest:    0 1px 0 rgba(14, 27, 44, 0.04), 0 2px 8px rgba(14, 27, 44, 0.04);
      --shadow-lift:    0 4px 16px rgba(14, 27, 44, 0.08), 0 1px 0 rgba(14, 27, 44, 0.04);
      --radius-sm:      10px;
      --radius-md:      14px;
      --radius-lg:      20px;
      --radius-xl:      28px;
      --f-display:      'Instrument Serif', 'Cormorant Garamond', Georgia, serif;
      --f-body:         'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
      --f-mono:         'JetBrains Mono', 'IBM Plex Mono', ui-monospace, Menlo, monospace;
    }

    * { box-sizing: border-box; }

    html { font-size: 16px; }

    body {
      margin: 0;
      min-height: 100vh;
      background: var(--canvas);
      font-family: var(--f-body);
      font-size: 16px;
      color: var(--ink);
      line-height: 1.5;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }

    /* Icon sprite */
    .icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
    .icon {
      width: 16px; height: 16px;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.5;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    /* Header / nav */
    .site-header {
      position: sticky;
      top: 0;
      z-index: 10;
      background: rgba(246, 241, 232, 0.85);
      backdrop-filter: saturate(140%) blur(10px);
      -webkit-backdrop-filter: saturate(140%) blur(10px);
      border-bottom: 1px solid var(--hairline-soft);
      padding: 18px 32px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 12px;
    }
    .brand {
      font-family: var(--f-display);
      font-weight: 400;
      font-size: 24px;
      color: var(--ink);
      letter-spacing: -0.02em;
      line-height: 1;
    }
    .brand em {
      font-style: italic;
      color: var(--accent);
    }
    nav {
      display: flex;
      gap: 4px;
      flex-wrap: wrap;
    }
    nav a {
      color: var(--ink-soft);
      text-decoration: none;
      font-size: 14px;
      font-weight: 500;
      padding: 8px 14px;
      border-radius: 999px;
      transition: all 200ms ease;
    }
    nav a:hover {
      background: rgba(14, 27, 44, 0.04);
      color: var(--ink);
    }

    /* Page container */
    .page {
      max-width: 1240px;
      margin: 0 auto;
      padding: 0 32px;
    }
    @media (max-width: 640px) {
      .page { padding: 0 20px; }
      .site-header { padding: 16px 20px; }
    }

    .section { padding: 96px 0; border-top: 1px solid var(--hairline-soft); }
    .section:first-of-type { border-top: none; }
    @media (max-width: 640px) { .section { padding: 72px 0; } }

    /* Eyebrow */
    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-family: var(--f-mono);
      font-size: 11px;
      font-weight: 400;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--accent);
    }
    .eyebrow::before {
      content: '';
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--accent);
      animation: pulse 2.4s ease-in-out infinite;
    }
    .eyebrow--plain::before { display: none; }

    /* Hero */
    .hero {
      padding: 112px 0 96px;
      text-align: center;
      animation: fade-in-up 0.6s cubic-bezier(.22,1,.36,1) both;
    }
    .hero__inner { max-width: 840px; margin: 0 auto; }
    .hero__title {
      font-family: var(--f-display);
      font-size: clamp(44px, 6vw, 78px);
      font-weight: 400;
      line-height: 1.06;
      letter-spacing: -0.02em;
      color: var(--ink);
      margin: 24px 0 20px;
    }
    .hero__title em {
      font-style: italic;
      color: var(--accent);
      position: relative;
    }
    .hero__title em::after {
      content: '';
      position: absolute;
      left: 0; right: 0;
      bottom: 0.04em;
      height: 0.08em;
      background: var(--accent-2);
      opacity: 0.35;
      border-radius: 4px;
    }
    .hero__sub {
      font-size: 19px;
      color: var(--ink-soft);
      margin: 0 auto;
      max-width: 660px;
      line-height: 1.55;
    }
    .hero__sub strong { color: var(--ink); font-weight: 600; }
    .hero__actions {
      margin-top: 36px;
      display: flex;
      gap: 12px;
      justify-content: center;
      flex-wrap: wrap;
    }
    @media (max-width: 640px) {
      .hero { padding: 72px 0 64px; }
    }

    /* Buttons */
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      height: 44px;
      padding: 0 20px;
      border-radius: 999px;
      font-family: var(--f-body);
      font-size: 14px;
      font-weight: 500;
      cursor: pointer;
      text-decoration: none;
      transition: all 240ms cubic-bezier(.22,1,.36,1);
      border: 1px solid transparent;
      line-height: 1;
      white-space: nowrap;
    }
    .btn .icon { width: 16px; height: 16px; }
    .btn-lg { height: 52px; padding: 0 28px; font-size: 15px; }
    .btn-lg .icon { width: 18px; height: 18px; }

    .btn-primary {
      background: var(--ink);
      color: var(--canvas);
      border-color: var(--ink);
    }
    .btn-primary:hover {
      transform: translateY(-1px);
      box-shadow: 0 6px 24px rgba(14, 27, 44, 0.2);
    }
    .btn-outline {
      background: transparent;
      border-color: var(--hairline);
      color: var(--ink);
    }
    .btn-outline:hover {
      border-color: var(--ink);
      background: rgba(14, 27, 44, 0.03);
    }
    .btn-ghost {
      background: transparent;
      color: var(--ink-soft);
    }
    .btn-ghost:hover { color: var(--ink); }

    /* On-dark button overrides */
    .surface-dark .btn-primary {
      background: var(--canvas);
      color: var(--ink);
      border-color: var(--canvas);
    }
    .surface-dark .btn-primary:hover {
      box-shadow: 0 6px 24px rgba(246, 241, 232, 0.22);
    }
    .surface-dark .btn-outline {
      color: var(--canvas);
      border-color: rgba(246, 241, 232, 0.24);
    }
    .surface-dark .btn-outline:hover {
      border-color: var(--canvas);
      background: rgba(246, 241, 232, 0.06);
    }

    /* Section head */
    .section-head {
      max-width: 720px;
      margin: 0 auto 56px;
      text-align: center;
    }
    .section-title {
      font-family: var(--f-display);
      font-size: clamp(32px, 4vw, 48px);
      font-weight: 400;
      line-height: 1.08;
      letter-spacing: -0.02em;
      color: var(--ink);
      margin: 16px 0 14px;
    }
    .section-title em {
      font-style: italic;
      color: var(--accent);
      position: relative;
    }
    .section-title em::after {
      content: '';
      position: absolute;
      left: 0; right: 0;
      bottom: 0.04em;
      height: 0.08em;
      background: var(--accent-2);
      opacity: 0.32;
      border-radius: 4px;
    }
    .section-sub {
      font-size: 17px;
      color: var(--ink-soft);
      line-height: 1.6;
      margin: 0;
    }

    /* Prose block */
    .prose p {
      font-size: 17px;
      line-height: 1.7;
      color: var(--ink-soft);
      margin: 0 0 16px;
    }
    .prose p:last-child { margin-bottom: 0; }
    .prose strong { color: var(--ink); font-weight: 600; }

    /* About — two-column body */
    .about-body {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 40px;
      max-width: 960px;
      margin: 0 auto;
    }
    .principle {
      padding-top: 24px;
      border-top: 1px solid var(--hairline);
    }
    .principle__label {
      font-family: var(--f-mono);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--accent);
      margin: 0 0 8px;
    }
    .principle h3 {
      font-family: var(--f-display);
      font-size: 26px;
      font-weight: 400;
      letter-spacing: -0.01em;
      color: var(--ink);
      margin: 0 0 10px;
    }
    .principle p {
      font-size: 15px;
      line-height: 1.6;
      color: var(--ink-soft);
      margin: 0;
    }

    /* Product spotlight tag */
    .spotlight-tag {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--canvas-raised);
      border: 1px solid var(--hairline);
      color: var(--accent-2);
      font-family: var(--f-mono);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      padding: 6px 14px;
      border-radius: 999px;
    }
    .spotlight-tag .icon { width: 12px; height: 12px; }

    /* Feature grid */
    .feature-grid {
      display: grid;
      gap: 20px;
      grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    }
    .feature-tile {
      background: var(--canvas-raised);
      border: 1px solid var(--hairline);
      border-radius: var(--radius-lg);
      padding: 28px;
      transition: all 240ms cubic-bezier(.22,1,.36,1);
    }
    .feature-tile:hover {
      border-color: var(--ink);
      transform: translateY(-2px);
      box-shadow: var(--shadow-lift);
    }
    .feature-tile__icon {
      width: 44px; height: 44px;
      border-radius: 12px;
      background: var(--paper);
      border: 1px solid var(--hairline);
      color: var(--accent);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 20px;
    }
    .feature-tile__icon .icon { width: 20px; height: 20px; }
    .feature-tile h3 {
      font-family: var(--f-display);
      font-size: 22px;
      font-weight: 400;
      line-height: 1.2;
      letter-spacing: -0.01em;
      color: var(--ink);
      margin: 0 0 8px;
    }
    .feature-tile p {
      font-size: 15px;
      line-height: 1.55;
      color: var(--ink-soft);
      margin: 0;
    }

    /* Product marquee card (branding dark card) */
    .marquee {
      margin-top: 56px;
      padding: 48px;
      background: var(--ink);
      color: var(--canvas);
      border-radius: var(--radius-xl);
      display: grid;
      grid-template-columns: 1.2fr 1fr;
      gap: 48px;
      align-items: center;
    }
    .marquee.surface-dark { }
    .marquee__eyebrow {
      font-family: var(--f-mono);
      font-size: 11px;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--accent-2);
      margin: 0 0 16px;
    }
    .marquee h3 {
      font-family: var(--f-display);
      font-size: clamp(30px, 3.2vw, 42px);
      font-weight: 400;
      line-height: 1.1;
      letter-spacing: -0.02em;
      color: var(--canvas);
      margin: 0 0 16px;
    }
    .marquee h3 em {
      font-style: italic;
      color: var(--accent-2);
    }
    .marquee p {
      font-size: 16px;
      line-height: 1.6;
      color: rgba(246, 241, 232, 0.72);
      margin: 0 0 28px;
    }
    .marquee__stat {
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
    .marquee__stat .stat {
      padding: 16px 0;
      border-top: 1px solid rgba(246, 241, 232, 0.10);
    }
    .marquee__stat .stat:first-child { border-top: none; padding-top: 0; }
    .marquee__stat .stat-value {
      font-family: var(--f-display);
      font-size: 44px;
      font-weight: 400;
      letter-spacing: -0.03em;
      line-height: 1;
      color: var(--canvas);
      display: block;
    }
    .marquee__stat .stat-label {
      font-family: var(--f-mono);
      font-size: 11px;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: rgba(246, 241, 232, 0.56);
      margin-top: 10px;
      display: block;
    }
    @media (max-width: 900px) {
      .marquee {
        grid-template-columns: 1fr;
        padding: 36px 28px;
        gap: 32px;
      }
    }

    /* Services two-up */
    .two-up {
      display: grid;
      gap: 20px;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      margin-top: 32px;
    }
    .mini-card {
      background: var(--paper);
      border: 1px solid var(--hairline);
      border-radius: var(--radius-lg);
      padding: 32px;
      transition: all 240ms cubic-bezier(.22,1,.36,1);
    }
    .mini-card:hover {
      border-color: var(--ink);
      transform: translateY(-2px);
      box-shadow: var(--shadow-lift);
    }
    .mini-card__eyebrow {
      font-family: var(--f-mono);
      font-size: 11px;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--accent);
      margin: 0 0 14px;
    }
    .mini-card h3 {
      font-family: var(--f-display);
      font-size: 26px;
      font-weight: 400;
      line-height: 1.15;
      letter-spacing: -0.01em;
      color: var(--ink);
      margin: 0 0 12px;
    }
    .mini-card p {
      color: var(--ink-soft);
      font-size: 15px;
      line-height: 1.6;
      margin: 0 0 20px;
    }
    .mini-card ul {
      list-style: none;
      padding: 0;
      margin: 0;
    }
    .mini-card ul li {
      padding: 12px 0;
      border-top: 1px solid var(--hairline-soft);
      color: var(--ink-soft);
      font-size: 14px;
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .mini-card ul li::before {
      content: '';
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--accent);
      flex-shrink: 0;
    }

    /* Steps */
    .steps {
      display: grid;
      gap: 20px;
      grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    }
    .step {
      padding: 32px 28px;
      background: var(--canvas-raised);
      border: 1px solid var(--hairline);
      border-radius: var(--radius-lg);
      transition: all 240ms cubic-bezier(.22,1,.36,1);
    }
    .step:hover {
      border-color: var(--ink);
      transform: translateY(-2px);
      box-shadow: var(--shadow-lift);
    }
    .step-num {
      font-family: var(--f-mono);
      font-size: 11px;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--accent);
      display: block;
      margin-bottom: 18px;
    }
    .step h3 {
      font-family: var(--f-display);
      font-size: 24px;
      font-weight: 400;
      line-height: 1.2;
      letter-spacing: -0.01em;
      color: var(--ink);
      margin: 0 0 8px;
    }
    .step p {
      font-size: 15px;
      line-height: 1.55;
      color: var(--ink-soft);
      margin: 0;
    }

    /* Inline links */
    a.inline {
      color: var(--ink);
      font-weight: 500;
      text-decoration: underline;
      text-decoration-color: var(--accent);
      text-decoration-thickness: 1px;
      text-underline-offset: 3px;
      transition: all 200ms ease;
    }
    a.inline:hover {
      text-decoration-color: var(--accent-2);
      text-decoration-thickness: 2px;
    }

    /* Contact card */
    .contact-card {
      background: var(--paper);
      border: 1px solid var(--hairline);
      border-radius: var(--radius-lg);
      padding: 40px;
      max-width: 720px;
      margin: 0 auto;
      text-align: center;
    }
    .contact-card .contact-email {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin: 8px 0 20px;
      font-family: var(--f-mono);
      font-size: 16px;
      color: var(--ink);
      text-decoration: none;
      padding: 10px 18px;
      border: 1px solid var(--hairline);
      border-radius: 999px;
      transition: all 200ms ease;
    }
    .contact-card .contact-email:hover {
      border-color: var(--ink);
      background: var(--canvas-raised);
    }
    .contact-card p {
      color: var(--ink-muted);
      font-size: 14px;
      margin: 0;
    }

    /* CTA band */
    .cta-band {
      margin-top: 96px;
      background: var(--ink);
      color: var(--canvas);
      border-radius: var(--radius-xl);
      padding: 72px 48px;
      text-align: center;
    }
    .cta-band.surface-dark { }
    .cta-band__eyebrow {
      font-family: var(--f-mono);
      font-size: 11px;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--accent-2);
      margin: 0 0 16px;
      display: block;
    }
    .cta-band h2 {
      font-family: var(--f-display);
      font-size: clamp(32px, 4.5vw, 54px);
      font-weight: 400;
      line-height: 1.05;
      letter-spacing: -0.02em;
      color: var(--canvas);
      margin: 0 0 16px;
      max-width: 720px;
      margin-left: auto;
      margin-right: auto;
    }
    .cta-band h2 em {
      font-style: italic;
      color: var(--accent-2);
    }
    .cta-band p {
      font-size: 17px;
      line-height: 1.55;
      color: rgba(246, 241, 232, 0.72);
      max-width: 560px;
      margin: 0 auto 32px;
    }
    .cta-band__actions {
      display: flex;
      gap: 12px;
      justify-content: center;
      flex-wrap: wrap;
    }
    @media (max-width: 640px) {
      .cta-band { padding: 56px 24px; margin-top: 72px; }
    }

    /* Footer */
    .site-footer {
      background: var(--ink);
      color: rgba(246, 241, 232, 0.64);
      padding: 56px 32px 40px;
      margin-top: 0;
    }
    .site-footer__inner {
      max-width: 1240px;
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 24px;
    }
    .site-footer__brand {
      font-family: var(--f-display);
      font-size: 22px;
      font-weight: 400;
      letter-spacing: -0.02em;
      color: var(--canvas);
    }
    .site-footer__brand em { font-style: italic; color: var(--accent-2); }
    .site-footer__meta {
      font-family: var(--f-mono);
      font-size: 11px;
      letter-spacing: 0.08em;
      color: rgba(246, 241, 232, 0.5);
      text-transform: uppercase;
    }
    .site-footer__links {
      display: flex;
      gap: 24px;
      flex-wrap: wrap;
    }
    .site-footer__links a {
      color: rgba(246, 241, 232, 0.72);
      text-decoration: none;
      font-family: var(--f-mono);
      font-size: 11px;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      transition: color 160ms ease;
    }
    .site-footer__links a:hover { color: var(--accent-2); }
    .site-footer__base {
      max-width: 1240px;
      margin: 32px auto 0;
      padding-top: 24px;
      border-top: 1px solid rgba(246, 241, 232, 0.10);
      color: rgba(246, 241, 232, 0.5);
      font-family: var(--f-mono);
      font-size: 11px;
      letter-spacing: 0.08em;
      text-align: center;
    }

    /* Animations */
    @keyframes fade-in-up {
      from { opacity: 0; transform: translateY(12px); }
      to   { opacity: 1; transform: none; }
    }
    @keyframes card-in {
      from { opacity: 0; transform: translateY(12px) scale(0.98); }
      to   { opacity: 1; transform: none; }
    }
    @keyframes pulse {
      0%, 100% { opacity: 1; }
      50%      { opacity: 0.4; }
    }

    .reveal { animation: card-in 0.6s cubic-bezier(.22,1,.36,1) both; }
    .reveal:nth-child(2) { animation-delay: 0.08s; }
    .reveal:nth-child(3) { animation-delay: 0.16s; }
    .reveal:nth-child(4) { animation-delay: 0.24s; }
    .reveal:nth-child(5) { animation-delay: 0.32s; }
    .reveal:nth-child(6) { animation-delay: 0.40s; }

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

/* ---- Privacy / legal page ---- */

    /* Narrow content column for prose layout */
    .page--narrow {
      max-width: 820px;
    }

    /* Page head */
    .page-head {
      text-align: center;
      padding: 96px 0 48px;
      animation: fade-in-up 0.5s cubic-bezier(.22,1,.36,1) both;
    }
    .page-head .eyebrow {
      margin-bottom: 20px;
    }
    .page-title {
      font-family: var(--f-display);
      font-size: clamp(40px, 5vw, 64px);
      font-weight: 400;
      line-height: 1.06;
      letter-spacing: -0.02em;
      color: var(--ink);
      margin: 0 0 14px;
    }
    .page-title em {
      font-style: italic;
      color: var(--accent);
      position: relative;
    }
    .page-title em::after {
      content: '';
      position: absolute;
      left: 0; right: 0;
      bottom: 0.04em;
      height: 0.08em;
      background: var(--accent-2);
      opacity: 0.35;
      border-radius: 4px;
    }
    .updated {
      font-family: var(--f-mono);
      font-size: 12px;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--ink-muted);
      margin: 0;
    }
    @media (max-width: 640px) {
      .page-head { padding: 64px 0 32px; }
    }

    /* Prose surface */
    .prose-card {
      background: var(--paper);
      border: 1px solid var(--hairline);
      border-radius: var(--radius-lg);
      padding: 56px 56px 64px;
      margin-bottom: 96px;
      animation: fade-in-up 0.6s cubic-bezier(.22,1,.36,1) 0.05s both;
    }
    @media (max-width: 640px) {
      .prose-card { padding: 32px 24px 40px; margin-bottom: 64px; }
    }

    .prose-card p,
    .prose-card li {
      font-size: 16px;
      line-height: 1.75;
      color: var(--ink-soft);
      margin: 0 0 16px;
    }
    .prose-card p:last-child { margin-bottom: 0; }
    .prose-card strong { color: var(--ink); font-weight: 600; }

    .prose-card h2 {
      font-family: var(--f-display);
      font-size: 28px;
      font-weight: 400;
      line-height: 1.2;
      letter-spacing: -0.01em;
      color: var(--ink);
      margin: 40px 0 14px;
      padding-top: 32px;
      border-top: 1px solid var(--hairline-soft);
    }
    .prose-card h2:first-child {
      margin-top: 0;
      padding-top: 0;
      border-top: none;
    }

    .prose-card ul {
      margin: 0 0 16px;
      padding: 0;
      list-style: none;
    }
    .prose-card ul li {
      padding-left: 20px;
      position: relative;
      margin-bottom: 10px;
    }
    .prose-card ul li::before {
      content: '';
      position: absolute;
      left: 2px;
      top: 12px;
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--accent);
    }

/* ---- Insights articles & hub ---- */

/* Article wrapper — vertical rhythm */
.article {
  padding: 96px 0 112px;
  animation: fade-in-up 0.6s cubic-bezier(.22,1,.36,1) both;
}
@media (max-width: 640px) {
  .article { padding: 72px 0 96px; }
}

/* Article header — narrow column, centred */
.article-header {
  max-width: 720px;
  margin: 0 auto 64px;
  text-align: center;
}
.article-header .eyebrow {
  margin-bottom: 16px;
}

/* Article title — same Instrument Serif treatment as section titles */
.article-title {
  font-family: var(--f-display);
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 400;
  line-height: 1.06;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 18px;
}
.article-title em {
  font-style: italic;
  color: var(--accent);
  position: relative;
}
.article-title em::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  bottom: 0.04em;
  height: 0.08em;
  background: var(--accent-2);
  opacity: 0.32;
  border-radius: 4px;
}

/* Article meta — mono, ink-muted */
.article-meta {
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-muted);
  margin: 0;
}
.article-meta::before {
  content: '— ';
  color: var(--accent);
}

/* Long-form prose — narrower reading column */
.prose-long {
  max-width: 680px;
  margin: 0 auto;
}
.prose-long p {
  font-size: 18px;
  line-height: 1.72;
  color: var(--ink-soft);
  margin: 0 0 24px;
}
.prose-long p:last-child { margin-bottom: 0; }
.prose-long strong { color: var(--ink); font-weight: 600; }
.prose-long em { font-style: italic; }
.prose-long h2 {
  font-family: var(--f-display);
  font-size: 32px;
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 56px 0 16px;
}
.prose-long h2:first-child { margin-top: 0; }
.prose-long h3 {
  font-family: var(--f-display);
  font-size: 24px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 36px 0 12px;
}
.prose-long ul,
.prose-long ol {
  font-size: 17px;
  line-height: 1.7;
  color: var(--ink-soft);
  padding-left: 1.5em;
  margin: 0 0 24px;
}
.prose-long li { margin-bottom: 8px; }
.prose-long blockquote {
  margin: 32px 0;
  padding: 8px 0 8px 24px;
  border-left: 2px solid var(--accent);
  font-family: var(--f-display);
  font-style: italic;
  font-size: 22px;
  line-height: 1.5;
  color: var(--ink);
}
.prose-long a {
  color: var(--ink);
  font-weight: 500;
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.prose-long a:hover {
  text-decoration-color: var(--accent-2);
  text-decoration-thickness: 2px;
}
.prose-long code {
  font-family: var(--f-mono);
  font-size: 0.92em;
  background: var(--canvas-raised);
  border: 1px solid var(--hairline-soft);
  border-radius: 4px;
  padding: 1px 6px;
}
.prose-long figure {
  margin: 32px 0;
}
.prose-long figcaption {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-muted);
  margin-top: 12px;
  text-align: center;
}

/* Related articles — appears at end of every article */
.related-articles {
  max-width: 960px;
  margin: 96px auto 0;
  padding-top: 56px;
  border-top: 1px solid var(--hairline);
}
.related-articles__label {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 24px;
  text-align: center;
}
.related-articles__grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.related-articles__card {
  background: var(--canvas-raised);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-lg);
  padding: 24px;
  text-decoration: none;
  color: inherit;
  display: block;
  transition: all 240ms cubic-bezier(.22,1,.36,1);
}
.related-articles__card:hover {
  border-color: var(--ink);
  transform: translateY(-2px);
  box-shadow: var(--shadow-lift);
}
.related-articles__card .eyebrow {
  margin-bottom: 10px;
}
.related-articles__card h3 {
  font-family: var(--f-display);
  font-size: 19px;
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0;
}

/* Insights hub — grid of all articles */
.insights-grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.insights-card {
  background: var(--canvas-raised);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-lg);
  padding: 28px;
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: all 240ms cubic-bezier(.22,1,.36,1);
}
.insights-card:hover {
  border-color: var(--ink);
  transform: translateY(-2px);
  box-shadow: var(--shadow-lift);
}
.insights-card .eyebrow { margin: 0; }
.insights-card h3 {
  font-family: var(--f-display);
  font-size: 22px;
  font-weight: 400;
  line-height: 1.22;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 4px 0 0;
}
.insights-card p {
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink-soft);
  margin: 0;
}

/* Homepage "Latest from Insights" strip */
.latest-insights {
  margin-top: 96px;
  padding-top: 56px;
  border-top: 1px solid var(--hairline-soft);
}
.latest-insights__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 32px;
}
.latest-insights__title {
  font-family: var(--f-display);
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 400;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0;
}
.latest-insights__title em {
  font-style: italic;
  color: var(--accent);
}
.latest-insights__more {
  font-family: var(--f-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-soft);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: color 200ms ease;
}
.latest-insights__more:hover { color: var(--ink); }
