/* ==========================================================
   Quem Somos — importadora-distribuidora-produtos-acessorios-linha-montagem
   (depende de style.css e pages.css)
   ========================================================== */

@media (min-width: 768px) { .about { padding-bottom: 50px; } }

/* Etiqueta um pouco mais alta nesta página */
.tag { height: 34px; }


/* ---------- Selo sobre a foto ---------- */
.photo-badge {
  position: relative; width: 88%; padding: 10px; border-radius: 15px;
  background: linear-gradient(150deg, #FF8800 0%, #DD6B03 100%);
}
.photo-badge-inner { display: flex; flex-direction: column; padding: 10px; }
.photo-badge h2 {
  font-family: "Montserrat", sans-serif; font-size: 22px; font-weight: 600;
  line-height: 1.4; letter-spacing: .2px; text-transform: uppercase; color: #fff;
}
.photo-badge p {
  margin: 0 0 14.4px; font-family: "Montserrat", sans-serif; font-size: 14px;
  font-weight: 500; line-height: 1.4; letter-spacing: -.2px; text-transform: uppercase; color: #fff;
}

/* ---------- Destaque ---------- */
.highlight { padding: 0; }
.highlight-inner {
  display: flex; flex-direction: column; gap: 20px; text-align: center;
  max-width: var(--content); margin: 0 auto;
}
.dash { padding: 15px 0; margin-bottom: 30px; }
.dash span { display: block; border-top: 2.3px dashed #CECECE; }
.dash-bottom { margin: 30px 0 0; }
.highlight h2 {
  font-family: "Rubik", sans-serif; font-size: 35px; font-weight: 600;
  line-height: 1.4; color: var(--navy);
}
.highlight h2 span { color: var(--orange); }
.highlight .rich {
  margin-top: 20px; font-family: "Montserrat", sans-serif; font-size: 17px;
  line-height: 27px; color: var(--text);
}

/* ---------- Missão, Visão e Valores ---------- */
.mvv { padding: 75px 0; }
.mvv-inner {
  display: flex; flex-direction: column; gap: 20px;
  max-width: var(--content); margin: 0 auto;
}
.mvv-head { display: flex; flex-direction: column; align-items: center; gap: 20px; padding: 10px; }
.mvv-head h2 {
  width: 83%; font-family: "Rubik", sans-serif; font-size: 35px; font-weight: 600;
  line-height: 1.4; color: var(--navy); text-align: center; text-wrap: balance;
}
.mvv-head h3 {
  width: 80%; margin: -10px 0 40px; font-family: "Rubik", sans-serif; font-size: 18px;
  font-weight: 400; line-height: 1.5; color: rgba(78, 78, 78, .9); text-align: center;
}
.mvv-cards { display: flex; gap: 20px; }
.mvv-card {
  flex: 1 1 0; display: flex; flex-direction: column; min-width: 0;
  padding: 30px; background: #fff; box-shadow: 0 0 10px 0 rgba(0, 0, 0, .16);
  transition: transform .3s, box-shadow .3s;
}
.mvv-card:hover { transform: translateY(-4px); box-shadow: 0 8px 22px rgba(0, 0, 0, .18); }
.mvv-card img { width: 80px; margin-bottom: 20px; }
.mvv-card h4 {
  margin: 0 0 20px; font-family: "Rubik", sans-serif; font-size: 30px; font-weight: 600;
  line-height: 1.4; color: var(--navy); text-wrap: balance;
}
.mvv-card .rich {
  font-family: "Montserrat", sans-serif; font-size: 15px; line-height: 25px; color: var(--text);
}

/* ---------- Política de Qualidade ---------- */
.about.policy { padding: 75px 0 150px; }
.policy .split-text { order: -1; }
.checks {
  flex: none; margin-top: 0; padding: 40px 50px 40px 40px;
  background: var(--navy); border-left: 4px solid var(--orange); border-radius: 16px;
  --ic: 24px;
}
.checks li { display: flex; align-items: center; }
.checks li:not(:last-child) { padding-bottom: 5px; }
.checks li + li { margin-top: 5px; }
.checks svg {
  width: var(--ic); height: var(--ic); fill: var(--orange); flex-shrink: 0;
  margin-right: calc(var(--ic) * .25 + 4px);
}
.checks span {
  padding-left: 5px; font-family: "Roboto", sans-serif; font-size: 16px;
  line-height: 1.5; color: #fff;
}

/* ==========================================================
   Responsivo
   ========================================================== */
@media (max-width: 1366px) {
  .photo-badge { padding: 20px; }
  .photo-badge h2 { font-size: 18px; }
  .photo-badge p { font-size: 13px; }
  .highlight h2 { font-size: 30px; }
  .highlight .rich { font-size: 15px; line-height: 25px; }
  .mvv-head h2 { width: 100%; }
  .mvv-card .rich { font-size: 14px; line-height: 24px; }
  .about.policy { padding: 120px 0 50px; }
  .policy .split-title { font-size: 30px; line-height: 1; }
  .checks { width: 530px; max-width: 100%; --ic: 17px; }
  .checks span { font-size: 15px; }
}

@media (max-width: 1200px) {
  .about.policy { padding: 70px 60px 50px; }
  .highlight { padding: 0 60px 40px; }
  .mvv-card .rich { font-size: 13px; line-height: 23px; }
  .mvv-card--culture .rich { font-size: 16px; line-height: 26px; }
}

@media (max-width: 1024px) {
  .about.policy { padding: 50px 0; }
  .policy .split-text { order: 0; }
  .photo-badge h2, .photo-badge p { font-size: 16px; }
  .policy .split-title { font-size: 35px; line-height: 1.3; }
  .checks { padding: 30px; }
}

@media (max-width: 767px) {
  .about.policy { padding: 50px 20px 30px; }
  .photo-badge { width: 100%; padding: 20px 20px 10px; }
  .photo-badge-inner { gap: 10px; }
  .photo-badge h2 { font-size: 18px; }
  .policy .split-title { font-size: 30px; line-height: 1.1; }
  .highlight { padding: 0 20px; }
  .highlight-inner { gap: 0; }
  .highlight h2 { font-size: 26px; }
  .mvv { padding: 50px 20px; }
  .mvv-head h2 { font-size: 26px; }
  .mvv-cards { flex-direction: column; }
  .mvv-card h4 { font-size: 26px; margin-bottom: 0; }
  .mvv-card .rich, .mvv-card--culture .rich { font-size: 16px; line-height: 1.5; }
  .checks { width: 100%; padding: 35px 25px; }
  .checks li:not(:last-child) { padding-bottom: 8px; }
  .checks li + li { margin-top: 8px; }
}