/* Business-first pages, using the shared PickBits paper / ink theme. */
.growth-page :where(main[id], section[id], div[id]) { scroll-margin-top: 7rem; }
.growth-page :where(a, button, input, select, textarea):focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
.growth-page .btn { max-width: 100%; min-width: 0; white-space: normal; }
.growth-page .skip-link { position: absolute; top: -5rem; left: var(--gutter); z-index: 100; padding: .8rem 1rem; background: var(--paper-2); }
.growth-page .skip-link:focus { top: .5rem; }
.growth-hero { padding-block: clamp(3rem, 6vw, 5rem); }
.growth-hero .wrap { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, .85fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.growth-hero h1.display { max-width: 12ch; margin: 1.1rem 0 1.6rem; font-size: clamp(2.8rem, 5.6vw, 4.7rem); }
.growth-hero .lead { max-width: 42ch; margin: 0 0 1rem; }
.growth-page .kicker { font-size: .8rem; letter-spacing: .12em; }
.growth-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: 1.8rem; }
.growth-text-link { font-weight: 600; text-decoration: underline; text-underline-offset: .3em; text-decoration-color: var(--accent); }
.growth-hero-note { color: var(--muted); font-size: .9rem; margin-top: 1.2rem; }
.growth-start { background: var(--panel); color: var(--panel-ink); padding: clamp(1.5rem, 3vw, 2.3rem); border-top: 4px solid var(--accent); }
.growth-start .kicker { color: var(--panel-muted); }
.growth-start h2 { font-family: var(--ff-display); font-size: clamp(1.55rem, 2.5vw, 2rem); line-height: 1.25; margin: 1rem 0 1.5rem; }
.growth-start-links { display: grid; border-top: 1px solid var(--panel-line); }
.growth-start-links a { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--panel-line); font-size: 1rem; }
.growth-start-links a:hover { color: var(--panel-ink); text-decoration: underline; text-underline-offset: .2em; }
.growth-start-links span { color: var(--panel-muted); }
.growth-start > p:last-child { color: var(--panel-muted); font-size: .9rem; margin: 1.4rem 0 0; }
.growth-section { padding-block: clamp(3.5rem, 7vw, 6rem); }
.growth-section-head { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem 3rem; margin-bottom: 2.3rem; }
.growth-section-head h2 { max-width: 20ch; margin: .8rem 0 0; }
.growth-section-head > p { max-width: 34ch; margin: 0; color: var(--ink-soft); }
.growth-number { font-family: var(--ff-mono); font-size: .85rem; color: var(--accent-deep); }
.growth-process { background: var(--paper-2); }
.growth-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; list-style: none; margin: 0; padding: 0; }
.growth-steps li { border-top: 3px solid var(--accent); padding-top: 1.25rem; }
.growth-steps h3 { font-family: var(--ff-display); font-size: 1.6rem; margin: .7rem 0; }
.growth-steps p { color: var(--ink-soft); font-size: 1rem; }
.growth-steps .growth-deliverable { border-top: 1px solid var(--line); padding-top: 1rem; margin-top: 1.3rem; }
.growth-proof { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); background: var(--paper-2); border: 1px solid var(--line-2); }
.growth-proof-image { margin: 0; min-width: 0; align-self: stretch; background: var(--paper-3); }
.growth-proof-image img { width: 100%; height: 100%; object-fit: cover; }
.growth-proof-copy { padding: clamp(1.4rem, 3vw, 2.5rem); }
.growth-proof h3 { font-family: var(--ff-display); font-size: clamp(1.5rem, 2.8vw, 2rem); line-height: 1.25; margin: 1rem 0; }
.growth-proof p { color: var(--ink-soft); font-size: 1rem; }
.growth-proof dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; border-block: 1px solid var(--line); padding-block: 1rem; margin: 1.4rem 0; }
.growth-proof dt { font-family: var(--ff-display); font-size: 1.4rem; font-weight: 600; }
.growth-proof dd { font-size: .85rem; color: var(--muted); margin: .3rem 0 0; }
.growth-proof-note { margin-top: 1.3rem; color: var(--muted); font-size: .95rem; }
.growth-mark { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: center; border-top: 1px solid var(--line); padding-top: 2.5rem; margin-top: 3rem; }
.growth-mark img { width: 180px; height: 180px; object-fit: cover; border-radius: var(--radius); }
.growth-mark h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); margin: .6rem 0 1rem; }
.growth-mark p { color: var(--ink-soft); max-width: 65ch; font-size: 1rem; }
.growth-lab { background: var(--paper-3); }
.growth-lab .wrap { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); align-items: start; gap: 2rem 4rem; }
.growth-lab h2 { max-width: 19ch; margin: .8rem 0 1.3rem; }
.growth-lab p { color: var(--ink-soft); }
.growth-lab-links { display: grid; border-top: 1px solid var(--line-2); }
.growth-lab-links a { display: flex; justify-content: space-between; gap: 1.5rem; border-bottom: 1px solid var(--line-2); padding-block: 1rem; }
.growth-lab-links span { font-size: .9rem; color: var(--muted); text-align: right; }
.growth-contact { border-top: 1px solid var(--line); background: var(--paper-2); }
.growth-contact .wrap { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(2rem, 6vw, 5rem); align-items: start; }
.growth-contact h2 { margin: .8rem 0 1.3rem; }
.growth-contact p { color: var(--ink-soft); }
.growth-contact .contact-direct { padding-top: 1.2rem; border-top: 1px solid var(--line); margin-top: 1.5rem; }
.growth-contact .contact-direct a { text-decoration: underline; text-underline-offset: .2em; }
.growth-form { display: grid; gap: 1rem; }
.growth-form .row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.growth-form label { display: grid; gap: .4rem; font-size: .9rem; font-weight: 600; min-width: 0; }
.growth-form label small { color: var(--muted); font-weight: 400; font-size: .85rem; }
.growth-form input, .growth-form select, .growth-form textarea { width: 100%; min-width: 0; border: 1px solid var(--line-2); background: var(--paper); color: var(--ink); font: inherit; font-size: 1rem; padding: .85rem; border-radius: var(--radius); }
.growth-form textarea { min-height: 160px; resize: vertical; }
.growth-form .growth-form-note { font-size: .85rem; color: var(--muted); margin: 0; }
.growth-form-note a { text-decoration: underline; }
.growth-form .growth-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.growth-detail { max-width: 48rem; }
.growth-detail h2 { margin: .75rem 0 1.3rem; }
.growth-detail p, .growth-detail li { color: var(--ink-soft); }
.growth-agreements { margin-top: 2rem; border-top: 1px solid var(--line-2); }
.growth-agreements details { border-bottom: 1px solid var(--line-2); padding-block: 1.2rem; }
.growth-agreements summary { font-weight: 600; cursor: pointer; }
.growth-agreements details p { max-width: 64ch; margin-bottom: 0; }
.growth-catalog-intro { margin: 1.2rem 0; color: var(--ink-soft); font-size: 1rem; }
.growth-page .svc-rail h1.display { font-size: clamp(2.8rem, 4vw, 4rem); }
.growth-page .svc-grid [hidden] { display: none; }
/* Homepage: the production image board, with room to read each outcome. */
.outcome-board { display: grid; grid-template-columns: minmax(0, 290px) minmax(0, 1fr); gap: clamp(2rem, 3.5vw, 3.5rem); width: 100%; max-width: 1480px; margin-inline: auto; padding: clamp(2rem, 4vw, 3.5rem) var(--gutter) clamp(3rem, 6vw, 5rem); }
.outcome-rail { position: sticky; top: 6rem; align-self: start; }
.outcome-rail .kicker { max-width: 25ch; font-size: .7rem; line-height: 1.6; }
.outcome-rail h1.display { font-size: clamp(2.6rem, 3.2vw, 2.8rem); line-height: 1.08; margin: 1.1rem 0 1.5rem; }
.outcome-rail h1 em { color: var(--accent); font-style: normal; }
.outcome-rail > p:not(.kicker) { color: var(--ink-soft); font-size: 1rem; line-height: 1.6; }
.outcome-rail .outcome-intro { font-family: var(--ff-display); font-size: 1.3rem; line-height: 1.4; color: var(--ink); }
.outcome-rail .growth-actions { margin-top: 1.4rem; }
.outcome-rail .btn { width: 100%; justify-content: space-between; font-size: .9rem; }
.outcome-operator { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: .7rem; margin-top: 1.6rem; padding-block: 1.2rem; border-block: 1px solid var(--line); }
.outcome-operator img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.outcome-operator strong { display: block; font-size: .85rem; font-weight: 600; }
.outcome-operator small { display: block; color: var(--muted); font-size: .75rem; line-height: 1.5; margin-top: .2rem; }
.outcome-operator > span:last-child { color: var(--accent); }
.outcome-feed { min-width: 0; }
.outcome-feed-heading { padding-bottom: 1.1rem; margin-bottom: 1.4rem; border-bottom: 1px solid var(--line); }
.outcome-feed-heading h2 { margin: 0; font-family: var(--ff-display); font-size: clamp(1.35rem, 2vw, 1.75rem); line-height: 1.25; }
.outcome-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 1.5rem; }
.outcome-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--line-2); border-radius: max(var(--radius), 8px); background: var(--paper-2); }
.outcome-image { display: block; background: var(--paper-3); border-bottom: 1px solid var(--line); }
.outcome-image img { display: block; width: 100%; height: auto; }
.outcome-card-body { display: flex; flex-direction: column; flex: 1; padding: 1.25rem 1.4rem; }
.outcome-card h3 { font-family: var(--ff-display); font-size: clamp(1.4rem, 1.9vw, 1.7rem); line-height: 1.2; letter-spacing: -.02em; margin: 0 0 .85rem; }
.outcome-card-body > p { color: var(--ink-soft); font-size: .95rem; line-height: 1.65; margin: 0 0 1.2rem; }
.outcome-feed-end { border-block: 1px solid var(--line); padding-block: 1.4rem; margin-top: 1.8rem; }
.outcome-feed-end p { font-family: var(--ff-display); font-size: 1.35rem; margin: 0 0 .5rem; }
.outcome-feed-end a { font-size: .9rem; }
@media (min-width: 1001px) and (max-height: 860px) { .outcome-rail { position: static; } }
@media (max-width: 1100px) and (min-width: 1001px) {
  .outcome-board { grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 1.5rem; }
  .outcome-grid { gap: 1rem; }
  .outcome-card-body { padding-inline: 1rem; }
}
@media (max-width: 1000px) {
  .outcome-board { grid-template-columns: minmax(0, 1fr); }
  .outcome-rail { position: static; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 0 2rem; }
  .outcome-rail .kicker, .outcome-rail h1 { grid-column: 1; }
  .outcome-rail h1.display { max-width: 15ch; grid-row: 2 / 6; margin-bottom: 0; }
  .outcome-rail > p:not(.kicker), .outcome-rail .growth-actions, .outcome-operator { grid-column: 2; }
  .outcome-rail .outcome-intro { grid-row: 1 / 3; margin-top: 0; }
  .outcome-operator { margin-top: 1rem; }
}
@media (max-width: 640px) {
  .outcome-board { padding-top: 1.75rem; gap: 1.75rem; }
  .outcome-rail { display: block; }
  .outcome-rail .kicker { max-width: none; font-size: .62rem; }
  .outcome-rail h1.display { font-size: clamp(2rem, 8.4vw, 2.75rem); max-width: 17ch; margin: .7rem 0 1rem; }
  .outcome-rail .outcome-intro { margin-bottom: .8rem; font-size: 1.15rem; }
  .outcome-rail .growth-actions { margin-top: 1.1rem; }
  .outcome-operator { grid-template-columns: 32px minmax(0, 1fr) auto; padding-block: .8rem; margin-top: .8rem; }
  .outcome-operator img { width: 32px; height: 32px; }
  .outcome-operator small { font-size: .7rem; }
  .outcome-grid { grid-template-columns: minmax(0, 1fr); }
  .outcome-feed-heading { align-items: start; }
  .outcome-feed-heading h2 { font-size: 1.35rem; }
  .outcome-card h3 { font-size: 1.55rem; }
}
@media (max-width: 900px) {
  .growth-hero .wrap, .growth-contact .wrap { grid-template-columns: 1fr; }
  .growth-hero h1.display { max-width: 17ch; }
  .growth-steps { gap: 1.2rem; }
  .growth-section-head { align-items: start; flex-direction: column; }
  .growth-section-head > p { max-width: 55ch; }
}
@media (max-width: 640px) {
  .growth-steps, .growth-proof, .growth-lab .wrap, .growth-form .row { grid-template-columns: 1fr; }
  .growth-proof-image img { aspect-ratio: 16 / 9; }
  .growth-mark { grid-template-columns: 1fr; }
  .growth-mark img { width: 112px; height: 112px; }
  .growth-lab-links a { flex-wrap: wrap; gap: .25rem 1rem; }
  .growth-lab-links span { text-align: left; }
  .growth-actions { align-items: stretch; flex-direction: column; }
  .growth-actions .btn { text-align: center; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
.outcome-card-cta { align-self: start; margin-top: auto; padding-block: .45rem; font-size: .9rem; font-weight: 600; color: var(--accent-deep); }
.outcome-card-cta:hover { text-decoration: underline; text-underline-offset: .2em; }
.growth-price-note { margin: 1.5rem 0 0; padding-top: 1.5rem; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: 1rem; }
