/* Readable contrast and layouts that grow with their text. */
:root { --blue: #075fcb; --muted: #526277; }
body { line-height: 1.65; }
h1, h2, h3, p, a, blockquote, figcaption, span, strong { overflow-wrap: break-word; }
.hero > *, .panel-grid > *, .service-grid > *, .client-list > *,
.why > *, .review-layout > *, .contact > *, footer > * { min-width: 0; }
.hero { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: 5vw; }
.hero h1 { font-size: clamp(2.1rem, 5.1vw, 4.5rem); }
.hero h1, .section h2, .visual-copy h2 { line-height: 1.14; letter-spacing: -.035em; }
.hero .eyebrow, .hero h1 span, .light .eyebrow { color: #66baff; }
.eyebrow, .trust-row, .panel-top, .panel-grid b, .panel-grid span,
.num, .review-source, footer { font-size: .875rem; }
.eyebrow { line-height: 1.7; letter-spacing: .1em; }
.intro { color: #e0e8f3; }
.btn { padding: 14px 20px; max-width: 100%; font-size: 1rem; line-height: 1.5; text-align: center; white-space: normal; }
.actions { min-width: 0; }
.actions > * { min-width: 0; }
.hero-panel { min-height: 0; overflow: visible; padding: clamp(20px, 2.5vw, 34px); background: #061b3aee; }
.panel-top { flex-wrap: wrap; gap: 8px 16px; color: #c4d2e4; }
.panel-title { max-width: none; margin: 28px 0; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.3; letter-spacing: -.025em; }
.panel-grid { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; }
.panel-grid div { padding: 16px 12px; }
.panel-grid span { display: block; }
.panel-grid b { color: #66baff; margin-bottom: 4px; }
.service-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.service-grid article { overflow: visible; }
.service-grid h3, .client-list h3 { line-height: 1.4; }
.client-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.why { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.review-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); }
.review-card { padding: clamp(20px, 3vw, 30px); }
.review-card .eyebrow { color: var(--blue); }
.contact { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: center; gap: 40px; }
.contact p { color: #fff; }
.contact .actions { align-items: flex-start; flex-direction: column; }
.contact-link { font-size: 1rem; line-height: 1.6; }
footer { padding-right: max(100px, 7vw); }
.whatsapp-float { background: #08773e; }
.site-header { height: auto; min-height: 112px; }
.site-header nav a, .menu-toggle { padding: 10px 0; }
a:focus-visible, button:focus-visible { outline: 3px solid currentColor; outline-offset: 5px; }
@media (max-width: 1100px) {
  .menu-toggle { display: block; min-height: 44px; }
  .header-call { display: none; }
  .site-header nav { display: none; position: absolute; top: 100%; left: 0; right: 0; padding: 16px 24px; gap: 8px; flex-direction: column; background: #06182f; max-height: calc(100dvh - 112px); overflow-y: auto; }
  .site-header nav.open { display: flex; }
  .hero { grid-template-columns: 1fr; }
  .hero-copy { max-width: 760px; }
  .client-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .site-header { min-height: 96px; }
  .service-grid, .client-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .why, .review-layout { grid-template-columns: 1fr; }
  .hero-panel { min-height: 0; }
  .mobile-contact { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
  .mobile-contact a { min-width: 0; font-size: .875rem; line-height: 1.5; background: var(--blue); }
  body { padding-bottom: calc(7rem + env(safe-area-inset-bottom)); }
  footer { padding-right: 24px; }
}
@media (max-width: 560px) {
  .hero h1 { font-size: clamp(2rem, 8.7vw, 3rem); }
  .section h2, .visual-copy h2 { font-size: clamp(1.8rem, 7.8vw, 2.5rem); }
  .hero-panel { margin: 0; }
  .panel-grid { grid-template-columns: 1fr; }
  .service-grid, .client-list { grid-template-columns: 1fr; }
  .visual-copy { padding: 48px 20px; }
  .contact .actions { align-items: stretch; }
  .contact-link { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .service-grid article, .service-grid article:before { transition: none; }
}
