/* Small Business route styles. Scoped to .sb-page so the approved styles.css stays untouched. */
.sb-page .hero { align-items: stretch; }
.sb-page .hero-copy { padding: 44px 28px 40px 52px; }
.sb-page .hero-copy > p:not(.eyebrow):not(.principle) { font-size: 1rem; max-width: 680px; }
.sb-actions { display: flex; align-items: center; gap: 26px; margin-top: 4px; }
.sb-page .text-link { color: var(--accent-navy); font-size: .84rem; font-weight: 700; text-decoration: underline; text-decoration-color: rgba(38,78,104,.4); text-underline-offset: 5px; }

/* Hero art: the approved butterfly wing with a Small Business word column */
.sb-art { position: relative; overflow: hidden; display: grid; grid-template-columns: 50% 1fr; align-items: center; min-height: 100%;
  background: linear-gradient(100deg, #fbfcfd 0%, #f2f7f9 42%, #e4eef2 78%, #dae5e9 100%); }
.sb-art .wing { width: 100%; height: 100%; object-fit: cover; object-position: left center; mix-blend-mode: multiply; }
.sb-art-words { position: relative; height: 82%; display: flex; flex-direction: column; justify-content: center; padding-left: 13%; border-left: 1px solid rgba(38,78,104,.5); }
.sb-art-words ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.sb-art-words li { color: #2b3a45; font-size: .98rem; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; white-space: nowrap; }
.sb-art-words hr { width: 150px; margin: 38px 0 26px; border: 0; border-top: 1px solid rgba(38,78,104,.45); }
.sb-art-words p { margin: 0; color: #1f2b35; font-family: var(--serif); font-size: 2.1rem; font-style: italic; font-weight: 500; line-height: 1.05; }

/* Shared section heads */
.sb-section { width: min(1180px, calc(100% - 64px)); margin: 0 auto; padding: 72px 0; }
.sb-head { margin: 0 auto 38px; text-align: center; }
.sb-head .section-label { margin-bottom: 12px; }
.sb-head h2 { margin: 0 0 14px; color: var(--midnight); font-family: var(--serif); font-size: clamp(2.25rem, 3.5vw, 3.6rem); font-weight: 500; letter-spacing: -.035em; line-height: .96; white-space: nowrap; }
.sb-head h2 em { color: var(--accent-blue); font-style: normal; }
.sb-head > p:not(.section-label) { max-width: 820px; margin: 0 auto; color: #465963; font-size: 1rem; line-height: 1.62; }

/* Pain: landing diagnostic pattern */
.sb-page .diagnostics { padding: 64px 36px 56px; }
.sb-page .diagnostic-grid h2 { font-size: clamp(1.6rem, 2.3vw, 2.2rem); white-space: nowrap; }
.sb-page .diagnostic-grid p { max-width: 340px; font-size: .92rem; }
.sb-page .diagnostic-grid p strong { display: block; margin-top: 10px; color: var(--accent-navy); font-weight: 700; }

/* Outcome cards: landing path-card gradients */
.sb-band { background: linear-gradient(135deg, rgba(145,199,232,.2), rgba(250,250,250,.94) 45%, rgba(169,211,230,.23)); border-block: 1px solid rgba(38,78,104,.1); }
.sb-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.sb-card { min-width: 0; padding: 30px 30px 28px; border: 1px solid rgba(136,182,205,.47); background: radial-gradient(circle at 84% 2%, rgba(136,182,205,.26), transparent 48%), linear-gradient(135deg, #fff 0%, rgba(169,211,230,.26) 100%); box-shadow: 0 16px 36px rgba(34,54,67,.06); }
.sb-card .card-label { color: var(--accent-blue); }
.sb-card h3 { margin: 0 0 10px; color: var(--midnight); font-family: var(--serif); font-size: clamp(1.6rem, 2.2vw, 2.1rem); font-weight: 500; letter-spacing: -.025em; line-height: 1; white-space: nowrap; }
.sb-card p { margin: 0; color: #40515c; font-size: .93rem; line-height: 1.56; }
.sb-card svg { width: 40px; height: 40px; margin-bottom: 16px; padding: 7px; border: 1px solid rgba(47,111,159,.42); border-radius: 50%; fill: none; stroke: var(--accent-navy); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.55; }

/* Dark band: landing philosophy pattern */
.sb-page .philosophy { padding-block: 56px 46px; }
.sb-page .philosophy h2 span, .sb-page .philosophy h2 em { display: block; white-space: nowrap; }

/* Industries */
.sb-industries { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid rgba(38,78,104,.2); background: #fff; }
.sb-industries article { min-width: 0; padding: 26px 24px 24px; border-right: 1px solid rgba(38,78,104,.14); border-bottom: 1px solid rgba(38,78,104,.14); }
.sb-industries article:nth-child(4n) { border-right: 0; }
.sb-industries article:nth-last-child(-n+4) { border-bottom: 0; }
.sb-industries h3 { margin: 0 0 8px; color: var(--midnight); font-family: var(--serif); font-size: 1.5rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.05; white-space: nowrap; }
.sb-industries p { margin: 0; color: #4a5c67; font-size: .88rem; line-height: 1.5; }
.sb-industries .tint { background: linear-gradient(135deg, #fff 0%, rgba(169,211,230,.35) 100%); }
.sb-industries .tint h3 { color: var(--accent-blue); }

/* Website offer cards reuse the approved offer-card gradients */
.sb-page .offer-grid { grid-template-columns: repeat(4, 1fr); gap: 18px; }
.sb-page .offer-card { padding: 26px 24px 24px; }
.sb-page .offer-card h3 { font-size: clamp(1.3rem, 1.7vw, 1.7rem); }
.sb-page .offer-card p.sub { margin: 0 0 10px; color: var(--accent-navy); font-size: .86rem; font-weight: 700; }
.sb-page .offer-card > p { font-size: .9rem; }

/* Control row: landing lens pattern */
.sb-control { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid rgba(38,78,104,.2); background: #fff; }
.sb-control article { padding: 30px 30px 28px; }
.sb-control article + article { border-left: 1px solid rgba(38,78,104,.17); }
.sb-control .card-label { color: var(--accent-blue); }
.sb-control h3 { margin: 0 0 8px; color: var(--midnight); font-family: var(--serif); font-size: 1.65rem; font-weight: 500; line-height: 1.05; white-space: nowrap; }
.sb-control p { margin: 0; color: #4a5c67; font-size: .92rem; line-height: 1.55; }

/* Who you work with */
.sb-who { display: grid; grid-template-columns: 1.35fr 1fr; gap: 44px; align-items: center; }
.sb-who h2 { margin: 0 0 18px; color: var(--midnight); font-family: var(--serif); font-size: clamp(2.1rem, 3vw, 3.1rem); font-weight: 500; letter-spacing: -.035em; line-height: .98; }
.sb-who h2 span, .sb-who h2 em { display: block; white-space: nowrap; }
.sb-who h2 em { color: var(--accent-blue); font-style: normal; }
.sb-who > div > p { margin: 0 0 12px; color: #40515c; font-size: 1rem; line-height: 1.62; }

/* Steps */
.sb-steps { display: grid; grid-template-columns: repeat(3, 1fr); }
.sb-steps article { padding: 6px 34px 8px; text-align: center; }
.sb-steps article + article { border-left: 1px solid rgba(34,54,67,.2); }
.sb-steps .num { margin: 0 0 6px; color: var(--accent-blue); font-family: var(--serif); font-size: 3.4rem; font-weight: 500; line-height: 1; }
.sb-steps h3 { margin: 0 0 8px; color: var(--midnight); font-family: var(--serif); font-size: 1.75rem; font-weight: 500; line-height: 1.05; white-space: nowrap; }
.sb-steps p { max-width: 320px; margin: 0 auto; color: #475965; font-size: .9rem; line-height: 1.52; }

/* Partners */
.sb-partners { width: var(--content); margin: 0 auto 26px; padding: 22px 0 6px; border-top: 1px solid rgba(38,78,104,.14); text-align: center; }
.sb-partners .section-label { margin-bottom: 16px; }
.sb-prow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.sb-prow div { padding: 14px 16px; border: 1px solid rgba(136,182,205,.4); background: #fff; }
.sb-prow b { display: block; color: var(--midnight); font-size: .84rem; }
.sb-prow span { color: var(--stone); font-size: .74rem; }

@media (max-width: 1280px) {
  .sb-page .offer-grid, .sb-industries, .sb-prow { grid-template-columns: repeat(2, 1fr); }
  .sb-industries article:nth-child(2n) { border-right: 0; }
  .sb-industries article:nth-child(4n+1), .sb-industries article:nth-child(4n+3) { border-right: 1px solid rgba(38,78,104,.14); }
  .sb-industries article:nth-last-child(-n+4) { border-bottom: 1px solid rgba(38,78,104,.14); }
  .sb-industries article:nth-last-child(-n+2) { border-bottom: 0; }
}
@media (max-width: 900px) {
  .sb-page .hero-copy { padding: 44px 36px 38px; }
  .sb-art { aspect-ratio: 459 / 384; width: min(100%, 650px); margin: 0 auto; }
  .sb-cards, .sb-control, .sb-steps, .sb-who { grid-template-columns: 1fr; }
  .sb-control article + article, .sb-steps article + article { border-left: 0; border-top: 1px solid rgba(34,54,67,.16); }
  .sb-steps article { padding-block: 22px; }
}
@media (max-width: 660px) {
  .sb-page .diagnostic-grid h2, .sb-head h2, .sb-card h3, .sb-industries h3, .sb-control h3, .sb-steps h3, .sb-who h2 span, .sb-who h2 em, .sb-page .philosophy h2 span, .sb-page .philosophy h2 em, .sb-art-words li { white-space: normal; }
  .sb-section { width: calc(100% - 32px); padding: 52px 0; }
  .sb-page .offer-grid, .sb-industries, .sb-prow { grid-template-columns: 1fr; }
  .sb-industries article { border-right: 0 !important; border-bottom: 1px solid rgba(38,78,104,.14) !important; }
  .sb-actions { flex-wrap: wrap; }
  .sb-art-words li { font-size: .78rem; letter-spacing: .2em; }
  .sb-art-words p { font-size: 1.5rem; }
}

/* Compliance starburst: overlays the edge of the industries section and links to /compliance */
.sb-has-burst { position: relative; }
.sb-burst { position: absolute; top: -92px; right: -18px; z-index: 5; width: 210px; height: 210px; display: grid; place-items: center; color: var(--paper); text-decoration: none; transform: rotate(-8deg); transition: transform .25s ease; filter: drop-shadow(0 18px 30px rgba(6,4,31,.28)); }
.sb-burst:hover { transform: rotate(-3deg) scale(1.05); }
.sb-burst-shape { position: absolute; inset: 0; width: 100%; height: 100%; }
.sb-burst-shape polygon { fill: var(--accent-blue); stroke: var(--brass); stroke-width: 2.5; stroke-linejoin: round; }
.sb-burst::before { content: ""; position: absolute; inset: 22px; border: 1px dashed rgba(250,250,250,.55); border-radius: 50%; z-index: 1; }
.sb-burst-copy { position: relative; z-index: 2; display: grid; justify-items: center; text-align: center; line-height: 1.05; }
.sb-burst-copy small { font-size: .62rem; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: #dcebf3; }
.sb-burst-copy strong { margin: 3px 0 5px; font-family: var(--serif); font-size: 1.95rem; font-weight: 600; letter-spacing: -.02em; color: #fff; }
.sb-burst-copy em { max-width: 120px; font-style: normal; font-size: .66rem; font-weight: 700; line-height: 1.25; color: var(--brass); text-transform: uppercase; letter-spacing: .08em; }
.sb-burst-copy b { margin-top: 8px; padding: 4px 10px; border-radius: 999px; background: var(--midnight); font-size: .62rem; font-weight: 700; letter-spacing: .04em; }
@media (max-width: 900px) { .sb-burst { width: 170px; height: 170px; top: -70px; right: 0; } .sb-burst-copy strong { font-size: 1.55rem; } }
@media (max-width: 660px) { .sb-has-burst { padding-top: 130px; } .sb-burst { top: -40px; right: 50%; margin-right: -85px; } }

/* Compliance page */
.cp-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.cp-grid .sb-card { padding: 26px 24px 24px; }
.cp-grid .sb-card h3 { font-size: clamp(1.3rem, 1.75vw, 1.7rem); }
.cp-honest { padding-top: 24px; }
@media (max-width: 1280px) { .cp-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 660px) { .cp-grid { grid-template-columns: 1fr; } }

/* Compliance offer terms */
.cp-terms { max-width: 900px; margin: 30px auto 0; padding: 22px 28px; border: 1px solid rgba(136,182,205,.55); background: #fff; }
.cp-terms .card-label { color: var(--accent-blue); }
.cp-terms ul { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 32px; margin: 8px 0 0; padding-left: 18px; color: #40515c; font-size: .9rem; line-height: 1.5; }
@media (max-width: 660px) { .cp-terms ul { grid-template-columns: 1fr; } .cp-terms { padding: 20px; } }
