/* === page-about.css — About page component styles === */

/* nd-diff-grid card grid (defined in page-product.css, duplicated here) */
.nd-diff-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--color-line-strong); border-radius: var(--r-md); overflow: hidden; background: #fff; }
.nd-diff-card { padding: 36px 32px; border-right: 1px solid var(--color-line-strong); border-bottom: 1px solid var(--color-line-strong); display: flex; flex-direction: column; gap: 14px; min-height: 240px; }
.nd-diff-card:nth-child(3n) { border-right: 0; }
.nd-diff-card:nth-child(n+4) { border-bottom: 0; }
.nd-diff-tag { font-family: var(--font-heading); font-size: 11px; color: var(--c-blue); letter-spacing: 1.6px; text-transform: uppercase; font-weight: 600; }
.nd-diff-card h3 { font-family: var(--font-heading); font-size: 19px; font-weight: 700; color: var(--c-navy); line-height: 1.3; margin: 0; }
.nd-diff-card p { font-size: 16px; color: rgba(0,31,84,.72); line-height: 1.55; margin: 0; }
.nd-diff-card--feat { background: var(--c-navy); color: #fff; }
.nd-diff-card--feat .nd-diff-tag { color: var(--c-sky); }
.nd-diff-card--feat h3 { color: #fff; }
.nd-diff-card--feat p { color: rgba(255,255,255,.82); }

/* nd-cta-banner (defined in page-product.css / page-partners.css, duplicated here) */
.nd-cta-banner { border-radius: var(--r-lg); overflow: hidden; background: linear-gradient(135deg, var(--c-navy) 0%, var(--c-blue) 100%); color: #fff; padding: 64px 56px; position: relative; }
.nd-cta-banner::before { content: ""; position: absolute; right: -120px; top: -120px; width: 480px; height: 480px; border-radius: 50%; background: radial-gradient(circle, rgba(160,228,241,.18), transparent 60%); pointer-events: none; }
.nd-cta-grid { position: relative; display: grid; grid-template-columns: 1.4fr 1fr; gap: 48px; align-items: end; }
.nd-cta-title { font-family: var(--font-heading); font-size: 48px; font-weight: var(--weight-heading-main); letter-spacing: -0.8px; line-height: 1.05; margin: 14px 0 12px; color: #fff; }
.nd-cta-body { font-size: 18px; line-height: 1.5; color: rgba(255,255,255,.82); margin: 0; max-width: 560px; }
.nd-cta-actions { display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
.nd-cta-actions a.b1 { font-family: var(--font-heading); padding: 16px 24px; border-radius: var(--r-sm); font-size: 14px; font-weight: 700; background: #fff; color: var(--c-navy); text-decoration: none; display: inline-flex; align-items: center; gap: 10px; }
.nd-cta-actions a.b2 { font-family: var(--font-heading); padding: 14.5px 22px; border-radius: var(--r-sm); font-size: 14px; font-weight: 600; border: 1.5px solid rgba(255,255,255,.5); color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: 10px; }
.nd-kicker--sky { color: var(--c-sky); }

/* Founder split layout */
.nd-about-founder { display: grid; grid-template-columns: 5fr 7fr; gap: 56px; align-items: start; }
.nd-about-founder-media { position: relative; border-radius: var(--r-md); overflow: hidden; aspect-ratio: 1/1; background: var(--c-cream); max-width: 300px; }
.nd-about-founder-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nd-about-founder-copy { display: flex; flex-direction: column; gap: 24px; }
.nd-about-quote { font-family: var(--font-heading); font-size: 26px; font-weight: 700; color: var(--c-navy); line-height: 1.35; letter-spacing: -0.3px; margin: 0; padding-left: 24px; border-left: 3px solid var(--c-blue); }
.nd-about-quote-author { font-size: 15px; color: rgba(0,31,84,.6); margin: 0; }

/* Geography map + formats layout */
.nd-about-geo { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
.nd-about-geo-map { border-radius: var(--r-md); overflow: hidden; }
.nd-about-geo-map img { width: 100%; display: block; }
.nd-about-geo-formats { display: flex; flex-direction: column; gap: 16px; }
.nd-about-format-card { background: #fff; border: 1px solid var(--color-line-strong); border-radius: var(--r-md); padding: 28px 32px; }
.nd-about-format-card h3 { font-family: var(--font-heading); font-size: 19px; font-weight: 700; color: var(--c-navy); margin: 0 0 10px; line-height: 1.3; }
.nd-about-format-card p { font-size: 16px; line-height: 1.55; color: rgba(0,31,84,.72); margin: 0; }

/* Vision bullet list */
.nd-about-list { list-style: none; padding: 0; margin: 16px 0 0; display: flex; flex-direction: column; gap: 8px; }
.nd-about-list li { font-size: 15px; line-height: 1.55; color: rgba(0,31,84,.72); padding-left: 16px; position: relative; }
.nd-about-list li::before { content: "—"; position: absolute; left: 0; color: var(--c-blue); }
.nd-diff-card--feat .nd-about-list li { color: rgba(255,255,255,.82); }
.nd-diff-card--feat .nd-about-list li::before { color: var(--c-sky); }

@media (max-width: 1024px) {
  .nd-diff-grid { grid-template-columns: 1fr 1fr; }
  .nd-diff-card:nth-child(3n) { border-right: 1px solid var(--color-line-strong); }
  .nd-diff-card:nth-child(2n) { border-right: 0; }
  .nd-diff-card:nth-child(n+4) { border-bottom: 1px solid var(--color-line-strong); }
  .nd-diff-card:nth-last-child(-n+2) { border-bottom: 0; }
}

@media (max-width: 900px) {
  .nd-about-founder { grid-template-columns: 1fr; }
  .nd-about-founder-media { max-width: 100%; aspect-ratio: 4/3; }
  .nd-about-geo { grid-template-columns: 1fr; }
  .nd-cta-grid { grid-template-columns: 1fr; }
  .nd-cta-title { font-size: 32px; }
}

/* 2-column diff-grid variant */
.nd-diff-grid--2col { grid-template-columns: 1fr 1fr; }
/* Reset default 3-col border rules for 2-col variant */
.nd-diff-grid--2col .nd-diff-card:nth-child(3n) { border-right: 1px solid var(--color-line-strong); }
.nd-diff-grid--2col .nd-diff-card:nth-child(n+4) { border-bottom: 1px solid var(--color-line-strong); }
/* Apply 2-col border rules */
.nd-diff-grid--2col .nd-diff-card:nth-child(2n) { border-right: 0; }
.nd-diff-grid--2col .nd-diff-card:nth-last-child(-n+2) { border-bottom: 0; }

@media (max-width: 600px) {
  .nd-diff-grid { grid-template-columns: 1fr; }
  .nd-diff-card { border-right: 0; }
  .nd-diff-card:nth-last-child(1) { border-bottom: 0; }
  /* Reset 2-col border rules to 1-col at mobile */
  .nd-diff-grid--2col .nd-diff-card:nth-child(n) { border-right: 0; border-bottom: 1px solid var(--color-line-strong); }
  .nd-diff-grid--2col .nd-diff-card:nth-last-child(1) { border-bottom: 0; }
}
