/*
 * MPConsultoria — otimização responsiva compartilhada
 * Ajustes exclusivamente visuais para telas menores.
 * Não altera links, formulários, scripts ou comportamentos.
 */

:root {
  --mp-mobile-gutter: clamp(16px, 4vw, 30px);
  --mp-header-offset: 84px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  min-width: 320px;
  max-width: 100%;
  overflow-x: hidden;
  scroll-padding-top: var(--mp-header-offset);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  min-width: 320px;
  max-width: 100%;
  overflow-x: hidden;
  overscroll-behavior-x: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img,
svg,
video,
canvas,
picture,
iframe {
  display: block;
  max-inline-size: 100%;
}

img,
video {
  block-size: auto;
}

video,
iframe {
  inline-size: 100%;
}

.container,
.hero-content,
.factory-billboard-content,
.platform-billboard-content,
.stats-billboard-section .dark-stats {
  max-inline-size: 100%;
}

.nav > *,
.intro-panel > *,
.quick-grid > *,
.service-grid > *,
.stats-band > *,
.stats-band-highlight > *,
.sector-panel > *,
.contact-grid > *,
.form-grid > *,
.about-grid > *,
.about-summary-grid > *,
.founder-grid > *,
.method-grid > *,
.policy-grid > *,
.policy-layout > *,
.video-grid > *,
.video-placeholder-grid > *,
.footer-columns > *,
.platform-billboard-card > *,
.factory-billboard-grid > *,
.case-row > *,
.timeline-item > * {
  min-width: 0;
}

h1,
h2,
h3,
h4,
p,
li,
blockquote,
figcaption,
a,
span,
strong,
label {
  overflow-wrap: break-word;
}

input,
select,
textarea,
button,
.btn {
  max-width: 100%;
  touch-action: manipulation;
}

input,
select,
textarea {
  font-size: max(16px, 1rem);
}

textarea {
  resize: vertical;
}

.service-image,
.sector-panel-image,
.founder-photo,
.video-card,
.video-placeholder-card,
.platform-card-visual,
.logo-card,
.case-logo,
.client-logo {
  overflow: hidden;
}

@media (hover: none) {
  .btn:hover,
  .quick-card:hover,
  .service-card:hover,
  .sector-tab:hover,
  .billboard-arrow:hover,
  .faq-chatbot-option:hover,
  .faq-chatbot-link:hover {
    transform: none !important;
  }
}

/* Evita falhas de renderização de fundos fixos em Safari/Chrome mobile. */
@media (max-width: 1120px), (pointer: coarse) {
  .hero-billboard,
  .factory-billboard-section,
  .platform-billboard-section,
  .stats-billboard-section,
  .founder-billboard-section,
  .page-hero,
  .cta-blue {
    background-attachment: scroll !important;
  }
}

@media (max-width: 1120px) {
  .hero-title,
  .hero-title-single-line,
  .page-title,
  .factory-hours-headline h2,
  .stats-billboard-section .section-head h2,
  .section-head h2,
  .intro-panel h2,
  .cta-blue h2,
  .platform-card-copy h3 {
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  .factory-billboard-section,
  .platform-billboard-section,
  .stats-billboard-section {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .intro-panel,
  .cta-blue,
  .founder-grid,
  .contact-grid,
  .policy-layout,
  .platform-billboard-card,
  .sector-panel.active {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .quick-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .service-grid,
  #solucoes .service-grid,
  .about-grid,
  .method-grid,
  .policy-grid,
  .video-grid,
  .video-placeholder-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .footer-columns {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .case-row,
  .case-row.reverse {
    grid-template-columns: 150px minmax(0, 1fr) !important;
  }
}

@media (max-width: 840px) {
  :root {
    --mp-mobile-gutter: clamp(16px, 4.5vw, 24px);
    --mp-header-offset: 74px;
  }

  .container,
  .hero-content,
  .factory-billboard-content,
  .platform-billboard-content,
  .stats-billboard-section .dark-stats {
    width: min(calc(100% - (var(--mp-mobile-gutter) * 2)), var(--max, 1240px)) !important;
    margin-inline: auto !important;
  }

  .section {
    padding-top: clamp(52px, 10vw, 70px) !important;
    padding-bottom: clamp(52px, 10vw, 70px) !important;
  }

  .site-header {
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
  }

  .nav {
    min-height: 66px !important;
    gap: 10px !important;
  }

  .brand {
    min-width: 0;
    gap: 9px !important;
  }

  .brand-badge {
    flex: 0 0 42px;
    width: 42px !important;
    height: 42px !important;
    border-radius: 14px !important;
    padding: 6px !important;
  }

  .brand > span:last-child {
    min-width: 0;
    line-height: 1.18;
  }

  .brand small {
    max-width: 23ch;
    white-space: normal;
    line-height: 1.2;
  }

  .nav-cta {
    min-width: 0;
    gap: 8px !important;
  }

  .menu-btn {
    flex: 0 0 44px;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px;
    min-height: 44px;
    display: inline-grid !important;
    place-items: center;
  }

  .nav.mobile-open {
    max-height: calc(100dvh - env(safe-area-inset-top));
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-top: 12px !important;
    padding-bottom: max(14px, env(safe-area-inset-bottom)) !important;
  }

  .nav.mobile-open .nav-links,
  .nav.mobile-open .nav-cta {
    width: 100% !important;
  }

  .nav.mobile-open .nav-links {
    align-items: stretch;
    gap: 5px !important;
  }

  .nav.mobile-open .nav-links > a,
  .nav.mobile-open .nav-dropdown-toggle,
  .nav.mobile-open .nav-dropdown-menu a {
    width: 100%;
    min-height: 44px;
    padding: 11px 12px !important;
    border-radius: 12px;
  }

  .nav.mobile-open .nav-dropdown {
    width: 100%;
  }

  .nav.mobile-open .nav-dropdown-menu {
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin-top: 7px;
  }

  .nav.mobile-open .nav-cta {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .nav.mobile-open .nav-cta .btn {
    width: 100%;
    white-space: normal;
    text-align: center;
  }

  .hero-billboard,
  .hero-content {
    min-height: clamp(520px, 132vw, 650px) !important;
  }

  .hero-content {
    width: min(calc(100% - 48px), var(--max, 1240px)) !important;
    padding: 68px 0 112px !important;
    align-content: center !important;
    justify-items: start !important;
    text-align: left !important;
  }

  .billboard-slide img,
  .page-hero-bg img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  .hero-title,
  .hero-title-single-line,
  .page-title {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    white-space: normal !important;
    text-align: left !important;
    font-size: clamp(2.05rem, 10.5vw, 3.55rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -.045em !important;
    overflow-wrap: anywhere !important;
  }

  .hero-lead,
  .page-subtitle {
    max-width: 100% !important;
    font-size: clamp(1rem, 4.2vw, 1.12rem) !important;
    line-height: 1.65 !important;
  }

  .hero-actions,
  .page-cta {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100%;
    gap: 11px !important;
  }

  .hero-actions .btn,
  .page-cta .btn {
    width: 100%;
    min-width: 0;
    white-space: normal;
    text-align: center;
  }

  .eyebrow {
    max-width: 100%;
    width: fit-content;
    white-space: normal;
    line-height: 1.35;
  }

  .billboard-arrow {
    top: auto !important;
    bottom: 54px !important;
    width: 44px !important;
    height: 44px !important;
    font-size: 1.55rem !important;
  }

  .billboard-arrow-prev {
    left: calc(50% - 61px) !important;
  }

  .billboard-arrow-next {
    right: calc(50% - 61px) !important;
  }

  .billboard-dots {
    bottom: 20px !important;
  }

  .section-intro {
    margin-top: -28px !important;
  }

  .intro-panel,
  .cta-blue,
  .contact-card,
  .form-card,
  .info-card,
  .policy-article,
  .policy-note,
  .sector-panel-copy,
  .platform-billboard-card,
  .dark-stats {
    padding: clamp(22px, 5.5vw, 30px) !important;
    border-radius: 24px !important;
  }

  .intro-panel,
  .cta-blue {
    gap: 20px !important;
  }

  .intro-panel .btn,
  .cta-blue .btn {
    width: 100%;
    white-space: normal;
    text-align: center;
  }

  .section-head {
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 28px !important;
  }

  .section-head h2,
  .intro-panel h2,
  .cta-blue h2,
  .factory-hours-headline h2,
  .stats-billboard-section .section-head h2,
  .platform-card-copy h3,
  .contact-card h3,
  .form-card h3,
  .info-card h3,
  .policy-article h2 {
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    font-size: clamp(1.75rem, 8vw, 2.65rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -.035em !important;
    overflow-wrap: anywhere !important;
  }

  .section-head p,
  .intro-panel p,
  .cta-blue p,
  .platform-card-copy p,
  .policy-article p,
  .policy-article li {
    max-width: 100% !important;
    line-height: 1.68 !important;
  }

  .quick-grid,
  .service-grid,
  #solucoes .service-grid,
  .stats-band,
  .stats-band-highlight,
  .about-grid,
  .about-summary-grid,
  .method-grid,
  .policy-grid,
  .policy-layout,
  .video-grid,
  .video-placeholder-grid,
  .footer-columns,
  .factory-billboard-grid,
  .form-grid,
  .contact-grid,
  .founder-grid,
  .platform-billboard-card,
  .sector-panel.active {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .quick-card,
  .service-card,
  .factory-feature-card,
  .stat,
  .value-card,
  .timeline-content,
  .case-bubble {
    min-height: 0 !important;
  }

  .quick-card,
  .service-body,
  .factory-feature-card,
  .value-card,
  .timeline-content {
    padding: clamp(20px, 5vw, 26px) !important;
  }

  .quick-card .icon {
    max-width: 100%;
  }

  .service-image,
  #solucoes .service-image {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 16 / 11 !important;
  }

  .service-image img,
  #solucoes .service-image img {
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    transform: none !important;
    object-fit: cover !important;
    object-position: center top !important;
  }

  #solucoes .service-card:hover .service-image img {
    transform: none !important;
  }

  .sector-tabs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 9px !important;
  }

  #setores .sector-tab,
  .sector-tab {
    width: 100%;
    min-width: 0;
    min-height: 46px !important;
    padding: 10px 12px !important;
    white-space: normal;
    line-height: 1.25 !important;
  }

  .sector-panel-image img {
    width: 100% !important;
    height: auto !important;
    min-height: 230px;
    max-height: 360px;
    object-fit: cover !important;
  }

  #setores .sector-panel-copy p,
  #setores .sector-panel-copy p span {
    display: block !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  .case-row,
  .case-row.reverse {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .case-row.reverse .case-logo {
    order: 1;
  }

  .case-row.reverse .case-bubble {
    order: 2;
  }

  .case-logo {
    min-height: 104px !important;
    border-radius: 22px !important;
    padding: 20px !important;
  }

  .case-bubble,
  .case-row:not(.reverse) .case-bubble,
  .case-row.reverse .case-bubble {
    margin: -7px 0 0 !important;
    padding: 23px !important;
    border-radius: 18px !important;
  }

  .factory-billboard-section,
  .platform-billboard-section,
  .stats-billboard-section,
  .founder-billboard-section {
    min-height: auto !important;
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }

  .factory-billboard-content,
  .platform-billboard-content,
  .stats-billboard-section .dark-stats {
    padding: 0 !important;
  }

  .factory-hours-headline h2 {
    font-size: clamp(1.5rem, 7vw, 2.25rem) !important;
  }

  .stats-billboard-section .stats-band-highlight,
  .dark-stats .stats-band-highlight {
    max-width: 100% !important;
    gap: 14px !important;
  }

  .stats-billboard-section .stats-band-highlight .stat,
  .dark-stats .stats-band-highlight .stat {
    min-height: 0 !important;
    padding: 28px 18px !important;
  }

  .stats-billboard-section .stats-band-highlight .stat strong,
  .dark-stats .stats-band-highlight .stat strong,
  .dark-stats .stat strong {
    min-height: 0 !important;
    margin-bottom: 14px !important;
    font-size: clamp(3rem, 18vw, 5.2rem) !important;
    line-height: .94 !important;
    letter-spacing: -.055em !important;
    flex-wrap: wrap;
  }

  .stats-billboard-section .stats-band-highlight .stat > span:not([data-counter]),
  .dark-stats .stats-band-highlight .stat > span:not([data-counter]) {
    min-height: 0 !important;
    max-width: 100% !important;
  }

  .platform-billboard-card {
    gap: 22px !important;
  }

  .platform-card-visual {
    width: 100% !important;
    min-height: 210px !important;
    padding: 20px !important;
    border-radius: 22px !important;
  }

  .platform-card-visual img {
    width: min(100%, 360px) !important;
    height: auto !important;
    max-height: 210px !important;
    object-fit: contain !important;
  }

  .logo-carousel-wrap {
    max-width: 100%;
  }

  .logo-card {
    min-width: 145px !important;
    height: 96px !important;
    padding: 12px 15px !important;
  }

  .logo-card img {
    max-height: 68px !important;
  }

  .form-grid {
    gap: 14px !important;
  }

  .field,
  .field.full,
  .full {
    grid-column: 1 / -1 !important;
    min-width: 0;
  }

  .field input,
  .field select,
  .field textarea {
    width: 100%;
    min-width: 0;
  }

  .form-card .btn,
  form .btn-block {
    width: 100%;
    min-width: 0;
    white-space: normal;
    text-align: center;
  }

  .contact-item {
    min-width: 0;
    align-items: flex-start;
  }

  .contact-item > div:last-child {
    min-width: 0;
  }

  .contact-item a,
  .contact-item span {
    overflow-wrap: anywhere;
  }

  .page-hero {
    padding-top: 70px !important;
    padding-bottom: 64px !important;
  }

  .policy-article ul,
  .policy-article ol {
    padding-left: 20px;
  }

  .policy-aside {
    position: static !important;
  }

  .founder-photo img,
  .founder-billboard-section .founder-photo img {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: 560px !important;
    object-fit: contain !important;
    object-position: center !important;
  }

  .timeline-item {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  .timeline-step {
    width: 100%;
  }

  .video-placeholder-card,
  .video-card {
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 10;
    border-radius: 22px !important;
  }

  .video-placeholder-card video,
  .video-card video {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    object-fit: cover !important;
  }

  .video-play-icon {
    width: 68px !important;
    height: 68px !important;
  }

  .video-play-icon::before {
    left: 28px !important;
    top: 20px !important;
    border-top-width: 14px !important;
    border-bottom-width: 14px !important;
    border-left-width: 21px !important;
  }

  .footer-main {
    padding-top: 44px !important;
    padding-bottom: calc(112px + env(safe-area-inset-bottom)) !important;
  }

  .footer-columns {
    gap: 26px !important;
  }

  .footer-brand {
    align-items: flex-start;
  }

  .footer-copy {
    text-align: center;
  }

  .sticky-mobile {
    left: max(10px, env(safe-area-inset-left)) !important;
    right: max(10px, env(safe-area-inset-right)) !important;
    bottom: max(10px, env(safe-area-inset-bottom)) !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 8px !important;
    gap: 8px !important;
  }

  .sticky-mobile .btn {
    min-width: 0;
    padding-inline: 12px !important;
    white-space: normal;
    text-align: center;
    line-height: 1.2;
  }

  .faq-chatbot {
    right: max(12px, env(safe-area-inset-right)) !important;
    bottom: calc(82px + env(safe-area-inset-bottom)) !important;
  }

  .faq-chatbot-toggle {
    width: 58px !important;
    height: 58px !important;
  }

  .faq-chatbot-box {
    position: fixed !important;
    left: max(10px, env(safe-area-inset-left)) !important;
    right: max(10px, env(safe-area-inset-right)) !important;
    bottom: calc(78px + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    max-width: none !important;
    height: min(72dvh, 620px) !important;
    max-height: calc(100dvh - 100px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
    border-radius: 22px !important;
  }

  .faq-chatbot-header {
    grid-template-columns: 36px 40px minmax(0, 1fr) 36px !important;
    min-height: 68px !important;
    gap: 8px !important;
    padding: 10px 11px !important;
  }

  .faq-chatbot-title strong,
  .faq-chatbot-title small {
    max-width: 100%;
  }

  .faq-chatbot-messages {
    padding: 14px !important;
  }

  .faq-chatbot-message {
    max-width: 92% !important;
    overflow-wrap: anywhere;
  }

  .faq-chatbot-form {
    grid-template-columns: minmax(0, 1fr) auto !important;
    padding: 10px !important;
  }

  .faq-chatbot-input {
    min-width: 0 !important;
  }
}

@media (max-width: 640px) {
  :root {
    --mp-mobile-gutter: 16px;
  }

  .brand small {
    display: none !important;
  }

  .brand > span:last-child {
    font-size: .92rem;
  }

  .hero-content {
    width: calc(100% - 36px) !important;
  }

  .hero-billboard,
  .hero-content {
    min-height: clamp(500px, 145vw, 620px) !important;
  }

  .quick-grid,
  .service-grid,
  #solucoes .service-grid,
  .stats-band,
  .about-grid,
  .about-summary-grid,
  .method-grid,
  .policy-grid,
  .video-grid,
  .video-placeholder-grid,
  .footer-columns,
  .factory-billboard-grid,
  .form-grid,
  .contact-grid,
  .founder-grid,
  .platform-billboard-card,
  .sector-panel.active {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .sector-tabs {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .intro-panel,
  .cta-blue,
  .contact-card,
  .form-card,
  .info-card,
  .policy-article,
  .policy-note,
  .sector-panel-copy,
  .platform-billboard-card,
  .dark-stats {
    padding: 20px !important;
    border-radius: 21px !important;
  }

  .service-image,
  #solucoes .service-image {
    aspect-ratio: 4 / 3 !important;
  }

  .hero-title,
  .hero-title-single-line,
  .page-title {
    font-size: clamp(1.95rem, 10.8vw, 3rem) !important;
  }

  .section-head h2,
  .intro-panel h2,
  .cta-blue h2,
  .factory-hours-headline h2,
  .stats-billboard-section .section-head h2,
  .platform-card-copy h3,
  .contact-card h3,
  .form-card h3,
  .info-card h3,
  .policy-article h2 {
    font-size: clamp(1.6rem, 8.5vw, 2.25rem) !important;
  }

  .sticky-mobile {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  }

  .faq-chatbot-title small {
    display: none !important;
  }
}

@media (max-width: 420px) {
  .brand-badge {
    flex-basis: 38px;
    width: 38px !important;
    height: 38px !important;
  }

  .brand > span:last-child {
    font-size: .84rem;
  }

  .hero-content {
    width: calc(100% - 30px) !important;
  }

  .hero-title,
  .hero-title-single-line,
  .page-title {
    font-size: clamp(1.82rem, 10.2vw, 2.65rem) !important;
  }

  .section-head h2,
  .intro-panel h2,
  .cta-blue h2,
  .factory-hours-headline h2,
  .stats-billboard-section .section-head h2,
  .platform-card-copy h3,
  .contact-card h3,
  .form-card h3,
  .info-card h3,
  .policy-article h2 {
    font-size: clamp(1.48rem, 8vw, 2rem) !important;
  }

  .sticky-mobile .btn {
    min-height: 46px !important;
    font-size: .78rem;
    padding-inline: 8px !important;
  }

  .faq-chatbot-box {
    left: 7px !important;
    right: 7px !important;
    border-radius: 18px !important;
  }

  .faq-chatbot-form {
    grid-template-columns: minmax(0, 1fr) 46px !important;
    gap: 7px !important;
  }

  .faq-chatbot-send {
    min-width: 46px !important;
    padding-inline: 0 !important;
  }
}

@media (max-height: 520px) and (orientation: landscape) {
  .faq-chatbot-box {
    top: max(7px, env(safe-area-inset-top)) !important;
    bottom: max(7px, env(safe-area-inset-bottom)) !important;
    height: auto !important;
    max-height: none !important;
  }

  .nav.mobile-open {
    max-height: 100dvh;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
