/*
 * Accessibility fixes, 2026-09-20. Loaded last so it wins the cascade.
 *
 * Kept in its own file rather than edited into the vendored stylesheets so
 * every deviation is visible in one place and revertible in one step.
 * Lighthouse mobile accessibility was 87 before this.
 *
 * Contrast ratios below are computed against the backgrounds Lighthouse
 * actually measured, not the ones the CSS nominally declares.
 */

/* --- Contrast -------------------------------------------------------- */

/* body was `color: gray` (#808080), which is 3.95:1 on white. Needs 4.5.
   #707070 is 4.95:1 and is a 6% darkening nobody will notice. */
body {
  color: #707070;
}

/* The template shipped `color: #4d4d4d` here. Someone commented it out and
   put `color: white` over a translucent white background, giving a contrast
   of 1.04:1 on the #fafafa that actually renders. The inactive tab labels
   are currently almost invisible. This restores the template's own value,
   which is 8.10:1. */
#colorlib-intro .nav-tabs li a {
  color: #4d4d4d;
}

/* .cinza is `color: gray !important` and sits on the #1e2022 footer, giving
   4.14:1. On a dark background the fix is a LIGHTER grey, not a darker one.
   #949494 is 5.39:1. */
.cinza,
#colorlib-footer .cinza,
#colorlib-footer p,
#colorlib-footer a.cinza {
  color: #949494 !important;
}

/* --- Touch targets --------------------------------------------------- */

/* The carousel dots are 11x11px against a 24x24px minimum. Expanding the hit
   area with a pseudo-element keeps the dots looking exactly the same while
   making them tappable. The extra margin stops neighbouring hit areas
   overlapping, which is the other half of what the audit checks. */
.flex-control-nav li {
  margin: 0 8px;
}

.flex-control-paging li a {
  position: relative;
}

.flex-control-paging li a::after {
  content: '';
  position: absolute;
  top: -7px;
  right: -7px;
  bottom: -7px;
  left: -7px;
}

/* Footer and contact links render 16px tall. Padding brings them to 24px
   without moving anything, because the line box already has the room. */
#colorlib-footer a,
#contatoblock a {
  display: inline-block;
  padding-top: 4px;
  padding-bottom: 4px;
}

/* --- Focus ----------------------------------------------------------- */

/* The template removes focus outlines wholesale, which leaves keyboard users
   with no idea where they are. This is not in the Lighthouse score; it is
   just wrong without it. */
a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #4caf50;
  outline-offset: 2px;
}