/* Supplement to nooschain-site.css (vendored from nooschain.noosware.com/assets/index-NJprxzAW.css).
   Only covers structures the homepage doesn't use: problem cards, FAQ accordion, contact blocks,
   honesty note, section-label spacing on light grounds. Same tokens, same discipline. */

/* Two-up problem cards (used where the homepage's 4-col capability-grid doesn't fit) */
.problem-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-top: 54px; }
.problem-grid article { padding: 34px; border: 1px solid var(--muted); }
.problem-grid h3 { margin: 0 0 12px; font-family: var(--display); font-size: 25px; font-weight: 400; }
.problem-grid p { margin: 0; color: #657083; line-height: 1.6; }
@media (max-width: 820px) { .problem-grid { grid-template-columns: 1fr; } .problem-grid article { padding: 28px 24px; } }

/* First-workload check list (healthcare) */
.workload-list { list-style: none; margin: 54px 0 0; padding: 0; border-top: 1px solid var(--muted); }
.workload-list li { display: grid; grid-template-columns: 50px 1fr; gap: 20px; padding: 28px 0; border-bottom: 1px solid var(--muted); }
.workload-list li::before { content: ''; width: 14px; height: 3px; margin-top: 11px; background: var(--teal); }
.workload-list h3 { margin: 0 0 6px; font-family: var(--display); font-size: 22px; font-weight: 400; }
.workload-list p { margin: 0; color: #657083; line-height: 1.55; max-width: 640px; }

/* Honesty note ("What we don't claim") */
.honesty-note { margin-top: 44px; padding: 26px 30px; border: 1px dashed #53617666; color: #536176; font-size: 15px; line-height: 1.6; }
.honesty-note strong { color: var(--navy); }

/* FAQ accordion (contact page) */
.faq { margin-top: 54px; border-top: 1px solid var(--muted); }
.faq details { border-bottom: 1px solid var(--muted); }
.faq summary { cursor: pointer; padding: 26px 0; font-family: var(--display); font-size: 24px; font-weight: 400; list-style: none; position: relative; padding-right: 48px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; position: absolute; right: 4px; top: 20px; font-size: 26px; color: var(--blue); font-weight: 400; }
.faq details[open] summary::after { content: '–'; color: var(--teal); }
.faq details p { margin: 0 0 26px; max-width: 720px; color: #536176; line-height: 1.65; }

/* Contact page booking columns */
.contact-cols { display: grid; grid-template-columns: 1.2fr .8fr; gap: 8vw; margin-top: 54px; align-items: start; }
.contact-placeholder { margin: 18px 0 0; font-size: 13px; color: #8792a8; font-style: italic; }
@media (max-width: 820px) { .contact-cols { grid-template-columns: 1fr; gap: 35px; } }

/* Warm and paper section helpers reusing live section paddings */
.section-warm { background: var(--warm); }
.section-paper { background: var(--paper); }

/* Section label spacing parity with live section-label use */
.section-label { margin-bottom: 44px; }

/* Steps list is reused on segment pages inside paper sections — navy circles match .steps li>span default */

/* Hero note on segment pages: same as live .hero-note */

/* Keep body text color default from :root (#2d3748) — matches live */

/* Heading scale override (2026-08-28: Spyros — headings were too large).
   Dials the live site's display clamps down ~30-35% while keeping hierarchy.
   Lives here, not in the vendored file, so nooschain-site.css can be re-synced
   from production without losing this adjustment. */

.hero h1 { font-size: clamp(44px, 5.6vw, 88px); line-height: 0.95; letter-spacing: -0.04em; }
.intro-copy h2, .capability-head h2, .control-head h2, .compute-intro h2,
.architecture-head h2, .get-started-grid h2, .web-ui-head h2 { font-size: clamp(32px, 3.6vw, 56px); }
.section h2 { font-size: clamp(32px, 3.6vw, 56px); }
.final-cta h2 { font-size: clamp(38px, 4.6vw, 72px); }
.problem-list h3 { font-size: 22px; }
.steps h3 { font-size: 21px; }
.capability-grid h3, .compute-journey h3, .compute-use-cases h3, .guide-grid h3 { font-size: 21px; }
.control-flow h3 { font-size: 23px; min-height: 0; }
.architecture-node h3 { font-size: 21px; }
.faq summary { font-size: 20px; }
.problem-grid h3 { font-size: 21px; }
.workload-list h3 { font-size: 19px; }
.control-outcome > p { font-size: clamp(22px, 2.4vw, 32px); }
@media (max-width: 820px) {
  .intro-copy h2, .capability-head h2, .control-head h2, .compute-intro h2,
  .architecture-head h2, .get-started-grid h2, .web-ui-head h2, .section h2 { font-size: 34px; }
  .hero h1 { font-size: 40px; }
  .final-cta h2 { font-size: 38px; }
}

/* Control-flow fix: live grid expects .control-arrow spacer columns (1fr 42px x4).
   Our pages use 4 cards without arrows, so re-template to plain columns. */
.control-flow { grid-template-columns: repeat(4, 1fr); }

/* Inline link on light grounds (live uses --blue for links on paper) */
.inline-link { color: var(--blue); font-weight: 600; text-decoration: underline; text-underline-offset: 5px; }
.inline-link:hover { opacity: .68; }
