/* Readable type and enough room for content at every viewport width. */
body { font-size: 16px; line-height: 1.6; }
.eyebrow { font-size: 12px; line-height: 1.5; margin-bottom: 10px; }
.button { font-size: 16px; line-height: 1.3; min-height: 48px; padding: 12px 20px; }
.button-row { flex-wrap: wrap; }
.site-header { height: auto; }
.nav-wrap { min-height: 84px; gap: 20px; }
.main-nav { font-size: 15px; gap: 20px; }
.main-nav a { height: 84px; }
.header-cta { font-size: 15px; min-height: 46px; }
.hero { height: auto; min-height: 470px; }
.hero-content { min-height: 470px; padding-block: 48px; }
.hero h1 { font-size: clamp(38px, 4.3vw, 56px); line-height: 1.08; margin: 16px 0 20px; }
.hero-description { font-size: 18px; line-height: 1.6; max-width: 550px; margin-bottom: 24px; }
.hero .button { height: auto; min-height: 48px; }
.hero-card { height: auto; min-height: 86px; }
.hero-card b { font-size: 16px; line-height: 1.4; }
.services-strip { padding-block: 28px; }
.services-grid { gap: 16px; }
.service { flex-direction: column; align-items: flex-start; padding-inline: 12px; gap: 12px; }
.service h3 { font-size: 17px; line-height: 1.35; margin-bottom: 8px; }
.service p { font-size: 15px; line-height: 1.55; color: #465d86; }
.product-section { padding-block: 36px; }
.product-wrap { grid-template-columns: minmax(0, 1fr); gap: 28px; }
.product-intro { max-width: 680px; }
.product-intro h2 { font-size: 56px; line-height: 1.1; }
.product-intro h3 { font-size: 24px; line-height: 1.3; margin-block: 8px 14px; }
.product-intro > p:not(.eyebrow) { font-size: 16px; line-height: 1.6; max-width: 600px; margin-bottom: 20px; }
.product-intro .button { padding: 12px 16px; }
.profile-card { height: auto; min-height: 250px; }
.mini-browser { height: auto; min-height: 32px; padding: 8px; font-size: 11px; }
.mini-browser span { display: none; }
.profile-hero { height: auto; min-height: 210px; padding: 20px 16px; }
.profile-hero > div:first-child { width: 62%; }
.profile-hero h4 { font-size: 20px; line-height: 1.15; letter-spacing: -.5px; }
.profile-hero p { font-size: 12px; line-height: 1.5; }
.profile-hero a { display: inline-block; font-size: 12px; padding: 6px 8px; }
.profile-hero .portrait { position: absolute; inset: auto 0 0 auto; height: auto; width: 56%; aspect-ratio: 1; background-size: 300% auto; opacity: 1; }
.profile-links { height: auto; min-height: 64px; gap: 4px; padding: 10px 4px; }
.profile-links span { font-size: 20px; }
.profile-links small { font-size: 11px; line-height: 1.4; }
.preview-captions { font-size: 16px; line-height: 1.4; padding-top: 18px; }
.projects-section { padding-block: 36px; }
.section-heading { margin-bottom: 20px; }
.section-heading h2, .team-copy h2, .footer-cta h2 { font-size: clamp(26px, 2.6vw, 34px); line-height: 1.25; }
.project-grid { gap: 18px; }
.project-info { padding: 18px; }
.project-info h3 { font-size: 20px; line-height: 1.3; margin-bottom: 6px; }
.project-type { font-size: 15px; line-height: 1.45; margin-bottom: 12px !important; }
.project-info p:not(.project-type) { font-size: 16px; line-height: 1.6; min-height: 0; margin-bottom: 0; color: #465d86; }
.team-wrap { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; padding-block: 36px; }
.team-copy > p:not(.eyebrow) { font-size: 17px; line-height: 1.65; color: #465d86; margin-block: 16px 22px; }
.team-photo { display: block; width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; }
.team-wrap > .values-list { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.project-card .project-preview { display: block; width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; }
.project-card, .profile-card, .team-copy, .product-showcase { min-width: 0; }
.values-list { gap: 20px; }
.values-list article { align-items: flex-start; }
.values-list h3 { font-size: 16px; line-height: 1.4; margin-bottom: 4px; }
.values-list p { font-size: 15px; line-height: 1.5; color: #465d86; }
.process-section { padding-block: 36px; }
.process-grid { gap: 24px; }
.process-step { align-items: flex-start; flex-wrap: wrap; }
.process-step > div { flex: 1 1 150px; }
.process-step > b { display: none; }
.process-step h3 { font-size: 18px; line-height: 1.4; margin-bottom: 8px; }
.process-step p { font-size: 16px; line-height: 1.6; color: #465d86; }
.footer-cta-inner { min-height: 150px; padding-block: 28px; padding-left: 0; gap: 32px; }
.footer-cta p { font-size: 17px; line-height: 1.6; max-width: 780px; margin-top: 10px; }
.footer-cta .button { flex-shrink: 0; }
.footer-main { grid-template-columns: 1fr .8fr 1.2fr 1.1fr; gap: 28px; padding-block: 40px; }
.footer-column { min-width: 0; font-size: 16px; line-height: 1.6; gap: 8px; }
.footer-column h3 { font-size: 18px; line-height: 1.4; margin-bottom: 8px; }
.contact-column a { overflow-wrap: anywhere; }
.contact-column span { flex-shrink: 0; }

@media (max-width: 1150px) {
  .nav-wrap { flex-wrap: wrap; padding-block: 10px; gap: 10px; }
  .main-nav { order: 3; width: 100%; height: auto; overflow-x: auto; gap: 26px; }
  .main-nav a { height: 48px; }
  .main-nav a.active::after { bottom: 2px; }
  .product-wrap { grid-template-columns: 1fr; }
  .product-intro { max-width: 680px; }
  .services-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
  .service { border: 0; }
  .project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team-wrap { grid-template-columns: 1fr 1fr; }
  .team-copy { grid-column: 1 / -1; }
  .process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-main { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .hero-content { flex-direction: column; align-items: stretch; padding-block: 36px; gap: 28px; }
  .hero-copy { width: 100%; max-width: 600px; }
  .hero-description { max-width: 100%; }
  .hero-cards { position: static; width: 100%; height: auto; gap: 12px; }
  .hero-card, .hero-card:nth-child(2), .hero-card:nth-child(3) { width: 33.333%; max-width: none; min-height: 112px; height: auto !important; padding: 12px 8px; flex-direction: column; text-align: center; }
  .hero-card b { font-size: 14px; }
  .services-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service:last-child { grid-column: auto; }
  .service { padding: 8px 0 !important; }
  .preview-grid { gap: 14px; }
  .profile-hero h4 { font-size: 18px; }
  .profile-links { flex-wrap: wrap; }
  .profile-links span { width: 45%; }
  .preview-captions > span { flex-direction: column; text-align: center; }
  .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 540px) {
  .eyebrow-light { flex-wrap: wrap; letter-spacing: 1px; }
  .hero h1 { font-size: clamp(32px, 8.3vw, 44px); letter-spacing: -1px; }
  .hero-description { font-size: 16px; }
  .header-cta { font-size: 14px; padding-inline: 12px; }
  .site-header .brand.brand-image { width: 180px; }
  .project-grid, .team-wrap, .process-grid, .footer-main { grid-template-columns: 1fr; }
  .team-copy, .footer-brand { grid-column: auto; }
  .values-list { display: flex; }
  .team-photo { height: auto; }
  .product-showcase { padding-inline: 0; }
  .preview-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 12px; max-width: none; }
  .preview-grid .profile-card { display: block; flex: 0 0 88%; scroll-snap-align: start; }
  .preview-grid .profile-card:not(:first-child) { display: block; }
  .profile-hero h4 { font-size: 22px; }
  .profile-links span { width: auto; }
  .preview-captions { font-size: 14px; gap: 8px; }
  .footer-cta-inner { flex-direction: column; align-items: flex-start; gap: 20px; }
}

@media (max-width: 900px) {
  .team-wrap > .values-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .preview-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; max-width: none; gap: 18px; padding-bottom: 12px; }
  .preview-grid .profile-card, .preview-grid .profile-card:not(:first-child) { display: block; flex: 0 0 min(340px, 88%); scroll-snap-align: start; }
}
@media (max-width: 540px) {
  .team-wrap > .values-list { grid-template-columns: minmax(0, 1fr); }
}
