@media (max-width: 1199px) {
  .inicio::before {
    background-size: cover;
    background-position: bottom;
  }
}
@media (max-width: 1024px) {
  .admin-nav {
    gap: 18px;
  }
  .admin-nav a {
    font-size: 16px;
  }
  .admin-topbar .admin-brand img {
    height: 38px;
  }
  .admin-logout {
    min-width: 76px;
    min-height: 44px;
    font-size: 15px;
  }
  .production-board {
    padding: 24px 24px;
  }
  .production-row-wide label,
  .production-line-colors .production-row:first-child label {
    width: 112px;
  }
  .production-line-split .production-row {
    grid-template-columns: 112px minmax(0, 1fr);
  }
  .production-line-colors .production-row {
    grid-template-columns: 112px 46px;
  }
  .production-line-colors .production-row:last-child {
    grid-template-columns: auto 46px;
  }
  .production-row input {
    height: 40px;
  }
  .production-row label {
    font-size: 22px;
  }
  .production-row input {
    font-size: 20px;
  }
  .sequence-board {
    padding: 24px;
  }
  .sequence-board legend,
  .sequence-row label {
    font-size: 22px;
  }
  .sequence-grid {
    grid-template-columns: 1fr;
  }
  .sequence-row:nth-child(2),
  .sequence-row:nth-child(4) {
    grid-template-columns: 150px minmax(0, 1fr);
  }
  .sequence-row:nth-child(2) label,
  .sequence-row:nth-child(4) label {
    text-align: right;
  }
  .sequence-color-row {
    grid-template-columns: 48px minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px;
  }
  .sequence-color-dot {
    width: 42px;
    height: 42px;
  }
  .wristband-preview {
    grid-template-columns: 84px minmax(0, 1fr) 132px;
  }
  .event-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .event-detail-grid {
    grid-template-columns: 1fr;
  }
  .wristband-brand img {
    width: 64px;
  }
  .color-option span {
    width: 20px;
    height: 20px;
  }
  .inicio .hero-produto img {
    left: 60px;
    max-width: 360px;
  }
  .carousel-track {
    gap: 20px;
  }
  .beneficio .beneficio-img img {
    max-width: 300px;
  }
  .section-title {
    margin-bottom: 44px;
  }
}

@media (max-width: 991px) {
  .header {
    padding: 5px 0;
  }
  .header .navbar-light .navbar-toggler {
    background-color: #ff6b00;
  }
  .header .navbar #collapsibleNavbar {
    margin-top: 12px;
    padding: 12px 14px;
    border-radius: 18px;
    background: rgba(30, 29, 28, 0.5);
  }

  .header .navbar #collapsibleNavbar .nav-item .nav-link {
    padding: 10px 15px 10px;
    opacity: 1;
  }

  .inicio {
    padding: 130px 0 130px;
  }
  .inicio .hero-content {
    text-align: center;
  }
  .inicio .hero-content h1 {
    text-align: center;
    margin-top: 0;
  }
  .inicio .hero-content p {
    margin-bottom: 28px;
  }
  .inicio .hero-produto {
    display: flex;
    justify-content: center;
  }
  .produto .produto-content,
  .depoimentos .testi-item {
    padding-left: 22px;
    padding-right: 22px;
  }
  .beneficio .section-title,
  .beneficio .beneficio-content {
    text-align: center;
  }
  .beneficio .btn-success {
    justify-self: center;
  }
  .beneficio .beneficio-content ul {
    text-align: left;
  }
  .contato .contact-form {
    padding-right: 0;
  }
  .contato .contact-item {
    max-width: 440px;
    margin-left: auto;
    margin-right: auto;
  }
  .footer {
    padding-top: 64px;
  }
}

@media (max-width: 767px) {
  .auth-panel {
    padding: 26px 20px;
  }
  .auth-copy h1,
  .admin-welcome h1 {
    font-size: 28px;
    line-height: 34px;
  }
  .admin-topbar {
    align-items: center;
    flex-direction: column;
    min-height: auto;
    padding: 18px;
  }
  .admin-topbar .admin-brand img {
    height: 40px;
  }
  .admin-nav {
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px 20px;
    margin-left: 0;
  }
  .admin-nav a {
    font-size: 16px;
  }
  .production-page {
    padding-top: 18px;
  }
  .production-page h1 {
    margin-bottom: 14px;
  }
  .production-board {
    min-height: auto;
    gap: 18px;
    padding: 22px 16px;
  }
  .production-row,
  .production-line,
  .production-line-colors {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }
  .production-line-split,
  .production-line-colors {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 10px;
  }
  .production-line-split .production-row,
  .production-line-colors .production-row,
  .production-line-colors .production-row:last-child {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .production-row-wide label,
  .production-line-colors .production-row:first-child label,
  .production-line-split .production-row label {
    width: auto;
    text-align: left;
  }
  .production-row label {
    font-size: 22px;
  }
  .production-row input,
  .production-line input,
  .production-row .mini-input {
    width: 100%;
    height: 44px;
    font-size: 20px;
  }
  .color-slots {
    flex-wrap: wrap;
    justify-content: center;
  }
  .production-board button {
    height: 54px;
    font-size: 24px;
  }
  .sequence-board fieldset,
  .sequence-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .sequence-board legend {
    margin: 0;
  }
  .sequence-grid,
  .layout-upload-grid {
    grid-template-columns: 1fr;
  }
  .sequence-row,
  .sequence-row:nth-child(2),
  .sequence-row:nth-child(4),
  .sequence-color-row .sequence-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .sequence-color-row {
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: end;
  }
  .sequence-color-row .sequence-row:last-child {
    grid-column: 2;
  }
  .sequence-row label,
  .sequence-row:nth-child(2) label,
  .sequence-row:nth-child(4) label,
  .sequence-color-row .sequence-row label {
    text-align: left;
  }
  .sequence-actions button {
    width: 100%;
    height: 54px;
    font-size: 22px;
  }
  .preview-board {
    padding: 16px;
  }
  .wristband-preview {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .wristband-brand {
    min-height: 42px;
  }
  .wristband-layout {
    min-height: 42px;
  }
  .wristband-code {
    border-top: 1px dashed rgba(0, 0, 0, 0.28);
    border-left: 0;
  }
  .wristband-color {
    width: 100%;
    height: 6px;
  }
  .preview-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .preview-actions button {
    width: 100%;
    height: 54px;
    font-size: 20px;
  }
  .events-heading,
  .event-detail-header {
    align-items: stretch;
    flex-direction: column;
  }
  .event-detail-actions {
    justify-content: flex-start;
  }
  .event-links div {
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }
  .event-links label,
  .event-links input,
  .event-links form {
    grid-column: 1 / -1;
  }
  .event-test-header {
    flex-direction: column;
  }
  .event-test-grid {
    grid-template-columns: 1fr;
  }
  .event-maintenance,
  .event-maintenance-card,
  .event-extra-form {
    grid-template-columns: 1fr;
  }
  .event-maintenance-card {
    align-items: stretch;
    flex-direction: column;
  }
  .event-extra-form button,
  .event-danger-card button {
    width: 100%;
  }
  .user-form {
    grid-template-columns: 1fr;
    padding: 16px;
  }
  .events-heading h1 {
    text-align: center;
  }
  .events-table-wrap {
    overflow-x: auto;
  }
  .events-table {
    min-width: 760px;
  }
  .event-detail {
    padding: 16px;
  }
  .event-stats {
    grid-template-columns: 1fr;
  }
  .event-color-item,
  .event-wristband-row {
    grid-template-columns: 24px minmax(0, 1fr);
  }
  .event-color-item small,
  .event-wristband-row code,
  .event-wristband-row span:last-child {
    grid-column: 2;
  }
  .checkin-card,
  .checkin-result {
    padding: 16px;
  }
  .checkin-input-row,
  .checkin-result dl {
    grid-template-columns: 1fr;
  }
  .checkin-result > strong {
    min-height: 58px;
    font-size: 22px;
  }
  .public-gate-form {
    padding: 20px;
    gap: 14px;
  }
  .public-gate-result > strong {
    min-height: 76px;
    font-size: 24px;
  }
  .public-gate-result dl div {
    padding: 18px;
  }
  .public-gate-result dd.checkin-number {
    font-size: 52px;
  }
  .public-gate-form.has-result .checkin-input-row input {
    padding: 0 18px;
    font-size: 22px;
  }
  .gate-camera-panel video {
    max-height: 52vh;
  }
  .public-stats {
    grid-template-columns: 1fr;
  }
  .public-dashboard-header h1 {
    font-size: 25px;
  }
  .inicio {
    padding: 82px 0 88px;
  }
  .inicio .hero-produto img {
    position: relative;
    left: auto;
    top: auto;
    margin-bottom: 34px;
    max-width: 290px;
  }
  .inicio .hero-content h1 {
    font-size: 34px;
    line-height: 40px;
  }
  .inicio .hero-content p {
    font-size: 16px;
    line-height: 26px;
  }
  .section-title {
    margin-bottom: 34px;
  }
  .section-title .subtitle {
    font-size: 28px;
    line-height: 34px;
  }
  .beneficio,
  .ultilizacao,
  .produto,
  .depoimentos,
  .duvidas,
  .contato {
    padding: 64px 0;
  }
  .carousel-track {
    gap: 16px;
    padding-inline: 2px;
  }
  .carousel-slide {
    flex-basis: calc((100% - (16px * (var(--items) - 1))) / var(--items));
  }
  .produto .produto-content {
    padding: 0 18px;
  }
  .produto .produto-content .nome-produto {
    min-height: auto;
  }
  .depoimentos .testi-item {
    padding: 24px 20px;
  }
  .depoimentos .client-info {
    padding-left: 72px;
  }
  .duvidas .faq-item {
    margin-bottom: 20px;
    padding: 22px 18px;
  }
  .contato .section-title p,
  .duvidas .section-title p,
  .produto .section-title p {
    margin-top: 14px;
  }
  .footer .footer-text p {
    padding: 0 8px;
  }
}

@media (max-width: 534px) {
  .inicio {
    padding: 100px 0 100px;
  }
  .btn-success {
    width: 100%;
    padding: 14px 20px;
  }
  .btn-light {
    padding: 12px 18px;
  }
  .carousel-controls {
    margin-top: 22px;
  }
  .beneficio .beneficio-content ul li {
    padding-left: 30px;
  }
  .contato .contact-item {
    padding-left: 58px;
  }
  .footer .footer-social-links {
    margin-bottom: 56px;
  }
}

@media (max-width: 378px) {
  .inicio {
    padding: 90px 0 90px;
  }
  .inicio .hero-content h1 {
    font-size: 30px;
    line-height: 36px;
  }
  .section-title .subtitle {
    font-size: 24px;
    line-height: 30px;
  }
  .depoimentos .client-info {
    padding-left: 0;
    padding-top: 74px;
    text-align: center;
  }
  .depoimentos .client-info img {
    left: 50%;
    transform: translateX(-50%);
  }
  .contato .contact-item {
    padding-left: 0;
    padding-top: 62px;
    text-align: center;
  }
  .contato .contact-item .icon {
    left: 50%;
    transform: translateX(-50%);
  }
}
