/* Umbrella + Small Business additions. Uses existing tokens; no shadows, no new colours. */
.head-inner .section-label{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--cool-teal-text);border-left:1px solid var(--medium-neutral);padding-left:14px;margin-left:14px;white-space:nowrap;align-self:center}
.head-inner{align-items:center}
.nav-links a.switch{color:var(--cool-teal-text);border-left:1px solid var(--medium-neutral);padding-left:24px;font-size:12px}
.nav-links a.switch:hover{color:var(--deep-blue)}
.paths{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.path-panel{background:var(--white);border:1px solid var(--medium-neutral);border-radius:var(--radius);padding:40px 36px 36px;display:flex;flex-direction:column;align-items:flex-start;text-align:left}
.path-panel h2{margin:6px 0 12px}
.path-panel p{color:var(--ink);font-size:16.5px;line-height:1.62}
.path-panel .path-for{color:var(--ink-soft);font-size:14.5px;margin:14px 0 26px}
.path-panel .btn{margin-top:auto}
.path-panel .icon-sq{margin-bottom:18px}
.path-panel--azure{background:var(--azure);border-color:var(--azure)}
.path-panel--azure h2,.path-panel--azure p{color:var(--white)}
.path-panel--azure .path-for{color:var(--light-neutral)}
.path-panel--azure .eyebrow{color:var(--cool-teal-bright)}
.half-paths{display:grid;grid-template-columns:1fr 1fr}
.half{padding:76px max(40px,calc((100vw - 1200px)/2 + 40px)) 70px;display:flex;flex-direction:column;align-items:flex-start;min-height:430px}
.half:first-child{background:var(--white);padding-right:56px;border-bottom:1px solid var(--medium-neutral)}
.half:last-child{background:var(--deep-blue);padding-left:56px}
.half h2{margin:6px 0 14px}
.half p{font-size:17px;max-width:46ch}
.half .path-for{font-size:14.5px;margin:14px 0 28px}
.half:first-child .path-for{color:var(--ink-soft)}
.half:last-child h2,.half:last-child p{color:var(--white)}
.half:last-child .eyebrow,.half:last-child .path-for{color:var(--medium-neutral)}
.half .btn{margin-top:auto}
.half:first-child{padding-left:max(40px,calc((100vw - 1200px)/2 + 40px))}
.half:last-child{padding-right:max(40px,calc((100vw - 1200px)/2 + 40px))}
.intro-compact{padding:64px 0 52px;text-align:center}
.intro-compact h1{font-size:clamp(30px,3.6vw,44px);max-width:20ch;margin:0 auto 16px}
.intro-compact .lede{margin:0 auto}
.fam{list-style:none;display:grid;gap:14px;margin-top:22px}
.fam li{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:var(--ink)}
.fam li::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--cool-teal);margin-top:10px}
.fam-card{background:var(--white);border:1px solid var(--medium-neutral);border-radius:var(--radius);padding:34px 34px 30px}
.fam-card h2{font-size:22px;margin-bottom:4px}
.hero-split{padding:72px 0 80px}
.hero-split .grid-2{align-items:center;gap:56px}
.hero-split h1{margin:10px 0 18px}
.hero-split .hero-actions{justify-content:flex-start;margin-top:28px}
.formats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:36px}
.formats .card-light .tag{font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--cool-teal-text);margin-bottom:8px}
.example{background:var(--white);border:1px solid var(--medium-neutral);border-radius:var(--radius);padding:32px 30px}
.example .badge{display:inline-block;font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);border:1px solid var(--medium-neutral);border-radius:999px;padding:3px 12px;margin-bottom:14px}
.example h3{margin-bottom:14px}
.example h4{font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--cool-teal-text);margin:18px 0 6px}
.example p,.example li{font-size:15.5px;line-height:1.62;color:var(--ink)}
.example ul{padding-left:18px}
.example .note{margin-top:18px;padding-top:14px;border-top:1px solid var(--medium-neutral);font-size:14px;color:var(--ink-soft)}
@media(max-width:860px){.paths,.half-paths,.formats,.hero-split .grid-2{grid-template-columns:1fr}.half{min-height:0;padding:56px 24px}.head-inner .section-label{display:none}.nav-links a.switch{border-left:0;padding-left:0}}
.path-panel:not(.path-panel--azure) .icon-sq{color:var(--cool-teal-text);border-color:var(--cool-teal)}

/* Four-up card rows: 4 -> 2 -> 1 as the viewport narrows. */
.why-cards.cols-4, .cards.cols-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 980px) { .why-cards.cols-4, .cards.cols-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 860px) { .grid-2 { grid-template-columns: 1fr; } .path-panel { padding: 32px 24px; } }
@media (max-width: 600px) { .why-cards.cols-4, .cards.cols-4 { grid-template-columns: 1fr; } }

/* Three-up navy cards (Small Business "Does this sound familiar?"): 3 -> 2 -> 1. */
.cards.cols-3 { grid-template-columns: repeat(3, 1fr); }
.cards.cols-3 .card-navy { justify-content: center; min-height: 120px; }
.cards.cols-3 .card-navy p { font-size: 16.5px; line-height: 1.55; color: var(--white); }
@media (max-width: 980px) { .cards.cols-3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .cards.cols-3 { grid-template-columns: 1fr; } }
.intro-compact h1 { max-width: 24ch; }

/* Contact: embedded Google Form. The form is Google's own page, so only the box around it is styled here. */
.form-embed iframe { display: block; width: 100%; min-height: 1193px; border: 0; background: transparent; }
.form-embed .form-note { margin-top: 14px; }
@media (max-width: 600px) { .form-embed iframe { min-height: 1400px; } }

/* Header crowding between ~860 and 1100px: drop the section label and keep the switch link on one line. */
@media (max-width: 1100px) { .head-inner .section-label { display: none; } }
.nav-links a.switch { white-space: nowrap; }

/* Small Business overview hero: the two phrases stack on wide screens by CSS only,
   so on phones the headline simply wraps at its natural points. */
.hero-sb h1 { font-size: clamp(32px, 4.8vw, 54px); max-width: 22ch; margin-left: auto; margin-right: auto; margin-bottom: 0; text-wrap: balance; }
.hero-sb .hero-sb-lead { color: var(--deep-blue); }
.hero-sb .lede { max-width: 600px; }
@media (min-width: 900px) { .hero-sb h1 { max-width: none; } .hero-sb .hero-sb-lead { display: block; } }

/* Small Business "Does this sound familiar?" subheading: even line lengths. */
.slab-head .sb-familiar-sub { max-width: 560px; margin-left: auto; margin-right: auto; margin-bottom: 0; text-wrap: balance; }

/* Umbrella home: focus ring must clear the navy half. */
.half:last-child :focus-visible { outline-color: var(--light-neutral); }

/* Footer: four content columns (logo, Life Sciences, Small Business, Company). */
@media (min-width: 1101px) { .foot-grid { grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 40px; } }

/* Umbrella home, phones: both halves share the page gutter so the white and navy
   panels line up and the text gets the full width. (The desktop side padding has
   higher specificity than the earlier mobile rule, so it must be overridden here.) */
@media (max-width: 860px) {
  .half, .half:first-child, .half:last-child { padding: 52px var(--gutter) 48px; }
  .half p { max-width: none; }
}

/* Umbrella home: one original wave between the shared-approach section and the
   navy contact band. The wave (.wave from styles.css) is unchanged; only the
   spacing either side is traded against its height, scoped to this page. */
.hm-before-wave { padding-bottom: 28px; }
.wave + .hm-after-wave { margin-top: -1px; padding-top: 34px; }

/* Small Business Overview: one compact credibility section (replaces the two boxed cards). */
.sb-cred { border-top: 1px solid var(--medium-neutral); }
.sb-cred-inner { max-width: 760px; }
.sb-cred h2 { font-size: clamp(24px, 2.6vw, 32px); margin-bottom: 14px; }
.sb-cred .arrowlink { margin-top: 10px; }

/* Contact: tidy the outer container around the embedded Google Form. The form brings its own
   borders and side gutter, so the card gives up some of its own padding on small screens;
   nothing inside the frame is cropped. */
.form-card .form-embed { margin: 0 -8px; }
@media (max-width: 860px) { .form-card { padding: 26px 22px 28px; } }
@media (max-width: 600px) {
  .form-card { padding: 22px 14px 24px; }
  .form-card h2 { margin-bottom: 18px; }
  .form-card .form-embed { margin: 0 -6px; }
}
@media (max-width: 420px) { .form-embed iframe { min-height: 1560px; } }

/* Very narrow screens: the email address may wrap instead of pushing the page wider. */
.info-row > span:last-child { min-width: 0; }
.info-value { overflow-wrap: anywhere; }

.sb-cred .body-copy + .body-copy { margin-top: 14px; }