/*
 * Layout MiniMed para LPs do template padrão (pages/padrao.php).
 * Ativado pelo campo ACF "layout_variant" = minimed → body.lp-minimed.
 * Tudo escopado em body.lp-minimed para não afetar as demais LPs.
 * Medidas do design: Desktop/Mobile Porto Rico.pdf (1920px / 378px).
 *
 * Sobre os !important: o style.css base e os utilitários do Bootstrap
 * (py-*, mb-*, p-4, align-items-*, h-100, justify-content-*) usam !important,
 * e no mobile (<768px) o style.css zera com !important o padding de .container,
 * .row > * e .row > * > div. Só há !important onde algum deles compete.
 */
body.lp-minimed {
  --mm-blue: #0067f0;
  --mm-blue-hover: #0052c2;
  --mm-blue-dark: #003ead;
  --mm-cyan: #00ffff;
  --mm-ink: #181818;
  --mm-surface: #f0f4f4;
  --mm-border: #d9d9d9;
  --mm-input-border: #e2e1e4;
  color: var(--mm-ink);
}

body.lp-minimed .container {
  max-width: 1134px; /* 1110px úteis + gutters */
}

/* ---------- Botões ---------- */
body.lp-minimed .btn-primary-custom {
  background-color: var(--mm-blue) !important;
  border-color: var(--mm-blue) !important;
  color: #fff !important;
  font-weight: 700;
}

body.lp-minimed .btn-primary-custom:hover,
body.lp-minimed .btn-primary-custom:focus-visible {
  background-color: var(--mm-blue-hover) !important;
  border-color: var(--mm-blue-hover) !important;
}

/* Foco de teclado visível (os botões abaixo removem o outline padrão
   via Bootstrap/estilos herdados) */
body.lp-minimed .btn-primary-custom:focus-visible,
body.lp-minimed .lp-content-box .btn-pill-group:focus-visible {
  outline: 3px solid var(--mm-blue-dark);
  outline-offset: 2px;
}

/* ---------- Header (64px) ---------- */
body.lp-minimed .header {
  box-shadow: none !important;
  padding-top: 13px !important;
  padding-bottom: 13px !important;
}

body.lp-minimed .header .logo-container img {
  height: 24px;
  width: auto;
}

body.lp-minimed .links-header a:not(.btn),
body.lp-minimed #mobileMenu a:not(.btn) {
  color: var(--mm-blue) !important;
  font-weight: 400 !important;
}

body.lp-minimed .links-header a:not(.btn) {
  font-size: 14px;
  margin-right: 38px !important; /* inline 50px; design: ~62px entre links */
}

body.lp-minimed .header .bi-list {
  color: var(--mm-blue) !important;
}

/* ---------- Hero (fundo de 64 a 584px, sob o header fixo) ---------- */
body.lp-minimed .hero-section {
  background-color: var(--mm-surface);
  color: var(--mm-ink) !important;
  padding-top: 80px !important;
  padding-bottom: 32px !important;
}

body.lp-minimed .hero-section .hero-title {
  color: var(--mm-blue);
  font-size: 40px;
  font-weight: 600;
  line-height: 46px;
  margin-bottom: 28px !important;
}

body.lp-minimed .hero-section .hero-text {
  font-size: 16px !important;
  line-height: 24px;
  max-width: 420px;
  margin-bottom: 28px !important;
}

body.lp-minimed .hero-section .hero-text p {
  color: var(--mm-ink) !important;
  margin-bottom: 0 !important;
}

body.lp-minimed .hero-section .btn-hero-buy {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  padding: 11px 38px;
  font-size: 16px;
}

body.lp-minimed .hero-section .hero-image {
  height: 472px;
  width: auto;
  max-height: none;
}

/* ---------- Bloco de produto (foto + texto) ---------- */
body.lp-minimed .lp-product-group {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.lp-minimed .borda-produtos {
  border: 0;
  border-radius: 0;
  padding: 0 12px;
}

body.lp-minimed .lp-product-info {
  padding: 44px 0 0 !important;
}

body.lp-minimed .lp-media-frame img {
  width: 100%;
  border-radius: 0;
}

body.lp-minimed .lp-product-info .title-produto {
  color: var(--mm-blue);
  font-size: 32px;
  font-weight: 400;
  line-height: 40px;
  margin-bottom: 20px !important;
}

body.lp-minimed .lp-product-info .subtitle-produto {
  color: var(--mm-blue);
  font-size: 14px;
  font-weight: 600;
  line-height: 24px;
  text-transform: uppercase;
  margin-bottom: 16px !important;
}

body.lp-minimed .lp-product-info .product-description,
body.lp-minimed .lp-product-info .product-description p {
  color: var(--mm-ink);
  font-size: 16px;
  line-height: 24px;
}

body.lp-minimed .lp-product-info .product-description p {
  margin-bottom: 18px;
}

body.lp-minimed .lp-product-info .product-description p:last-child {
  margin-bottom: 0;
}

body.lp-minimed .lp-product-info .product-disclaimer {
  color: var(--mm-ink);
  font-size: 10px;
  line-height: 12px;
}

@media (min-width: 992px) {
  /* Foto 541px colada à esquerda do container; texto a 80px da foto */
  body.lp-minimed .lp-product-info > .row {
    justify-content: flex-start !important;
  }

  body.lp-minimed .lp-media-frame {
    overflow: hidden;
  }

  /* scale(1.025) corta ~7px por lado: some com o canto arredondado
     embutido nas fotos do InPen e do i-Port (o design é reto) */
  body.lp-minimed .lp-media-frame img {
    aspect-ratio: 541 / 587;
    object-fit: cover;
    transform: scale(1.025);
  }
}

@media (min-width: 1080px) {
  /* Larguras fixas do design (foto 565px / texto 480px): só cabem a partir
     de ~1080px. Entre 992 e 1079px o col-lg-6 do Bootstrap (50/50) assume. */
  body.lp-minimed .lp-product-media {
    width: 565px;
  }

  body.lp-minimed .lp-product-info .container-description {
    width: 480px;
    max-width: none;
    padding-left: 68px;
  }
}

/* Legenda sobre a foto (MiniMed Champions) */
body.lp-minimed .lp-image-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 20px;
  margin: 0;
  text-align: center;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 16px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

/* Botão de play do vídeo */
body.lp-minimed .lp-video-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: none;
  border: 0;
  padding: 0;
  color: #fff;
  line-height: 0;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.3));
  transition: transform 0.2s ease;
}

body.lp-minimed .lp-video-play:hover {
  transform: translate(-50%, -50%) scale(1.06);
}

body.lp-minimed .lp-video-play:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 4px;
  border-radius: 50%;
}

body.lp-minimed .lp-video-modal video {
  width: 100%;
  height: 100%;
}

/* ---------- Cards de benefícios ---------- */
body.lp-minimed .lp-reasons {
  padding: 0 !important;
}

body.lp-minimed .lp-reasons > .py-5 {
  padding: 30px 0 !important;
}

body.lp-minimed .lp-reasons .row {
  --bs-gutter-x: 30px;
  --bs-gutter-y: 30px;
}

body.lp-minimed .lp-reasons-label {
  background-color: var(--mm-blue) !important;
  border-radius: 0;
  box-shadow: none !important;
  align-items: flex-start !important; /* vence .align-items-center */
  padding: 36px 36px 48px !important; /* vence .p-4 */
  min-height: 230px;
}

body.lp-minimed .lp-reasons-label h2 {
  color: var(--mm-cyan);
  font-size: 32px;
  font-weight: 400 !important;
  line-height: 46px;
  margin: 0 !important;
}

body.lp-minimed .lp-reason-card {
  border: 1px solid var(--mm-border);
  border-radius: 0;
  box-shadow: none !important;
  transform: none;
  padding: 24px 36px 9px !important;
  min-height: 230px;
}

body.lp-minimed .lp-reason-icon {
  margin-bottom: 0 !important;
  line-height: 0;
}

body.lp-minimed .lp-reason-icon img {
  width: 110px;
  height: 110px;
  object-fit: contain;
  object-position: left center;
}

/* Título centralizado no espaço abaixo do ícone, como no design */
body.lp-minimed .lp-reason-card h3 {
  color: var(--mm-blue) !important;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  margin: auto 0;
}

body.lp-minimed .lp-reason-card p {
  color: var(--mm-ink) !important;
  font-size: 14px;
  line-height: 20px;
  margin: 4px 0 0 !important;
}

body.lp-minimed .lp-reasons-statement {
  color: var(--mm-blue);
  font-size: 29px;
  font-weight: 600;
  line-height: 37px;
  text-align: center;
  max-width: 860px;
  margin: 55px auto 24px;
}

/* ---------- Conteúdo + grid de imagens ---------- */
body.lp-minimed .lp-content-images {
  margin: 0;
}

body.lp-minimed .lp-content-box {
  background-color: var(--mm-surface) !important;
  color: var(--mm-ink) !important;
  border-radius: 0 !important;
  padding: 20px 26px 20px 0 !important; /* + 10px da .mobile-padding-10 */
}

/* Grid 2+1 (Práctico): caixa de 522px com respiro maior */
body.lp-minimed .lp-content-box:has(.lp-image-grid > .row:not(.h-100)) {
  padding-top: 52px !important;
  padding-bottom: 52px !important;
}

body.lp-minimed .lp-content-box .col-lg-5 {
  padding-left: 76px !important;
}

body.lp-minimed .lp-content-box:has(.lp-image-grid > .row.h-100) .col-lg-5 {
  padding-left: 50px !important;
}

/* Ícones do topo no tamanho natural (o inline limita a 60x60 com p-2) */
body.lp-minimed .lp-content-box .col-lg-5 > .d-flex:first-child {
  gap: 22px !important;
  margin-bottom: 13px !important;
}

body.lp-minimed .lp-content-box .col-lg-5 > .d-flex:first-child > div {
  width: auto !important;
  height: 56px !important;
  padding: 0 !important;
}

body.lp-minimed .lp-content-box .col-lg-5 > .d-flex:first-child img {
  max-width: none;
}

body.lp-minimed .lp-content-title {
  color: var(--mm-blue);
  font-size: 32px;
  font-weight: 400 !important;
  line-height: 46px;
  max-width: 250px;
  margin-bottom: 15px !important;
}

body.lp-minimed .lp-content-text {
  color: var(--mm-ink) !important;
  font-size: 16px !important;
  line-height: 24px;
  max-width: 300px;
  margin-bottom: 35px !important;
}

body.lp-minimed .lp-content-box .btn-pill-group {
  background-color: var(--mm-blue);
  border: 0 !important;
  color: #fff !important;
  padding: 13px 40px !important;
  font-size: 16px;
}

body.lp-minimed .lp-content-box .btn-pill-group:hover {
  background-color: var(--mm-blue-hover);
}

body.lp-minimed .lp-image-grid .rounded {
  border-radius: 0 !important;
}

body.lp-minimed .lp-image-grid > .row:not(.h-100) > * > .rounded {
  height: 191px !important; /* vence o style="height: 250/300px" */
}

/* Grid 1+2 (Disponible): foto alta de 420px + duas de ~200px */
body.lp-minimed .lp-image-grid > .row.h-100 {
  height: auto !important;
}

body.lp-minimed .lp-image-grid > .row.h-100 > * > * {
  height: 420px !important;
}

/* ---------- Formulário ---------- */
body.lp-minimed .lp-form-section {
  background-color: var(--mm-blue) !important;
  padding: 64px 0 !important;
}

body.lp-minimed .lp-form-section > .container {
  padding-bottom: 0 !important;
}

body.lp-minimed .lp-form-section .col-xl-10 {
  flex: 0 0 100%;
  max-width: 100%;
}

body.lp-minimed .lp-form-card {
  background-color: #fff;
  padding: 30px 30px 40px;
}

body.lp-minimed .lp-form-title {
  color: var(--mm-blue);
  font-size: 48px;
  font-weight: 300;
  line-height: 50px;
  max-width: 700px;
  margin-bottom: 37px;
}

body.lp-minimed .lp-form-lead {
  color: var(--mm-ink);
  font-size: 16px;
  margin-bottom: 24px;
}

body.lp-minimed .lp-form-card .form-label {
  color: var(--mm-blue-dark);
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 3px;
}

body.lp-minimed .lp-form-card .form-control {
  border: 1px solid var(--mm-input-border);
  border-radius: 0;
  height: 56px;
  color: var(--mm-ink);
}

body.lp-minimed .lp-form-card form > .row {
  --bs-gutter-x: 30px;
  margin-bottom: 8px !important;
}

body.lp-minimed .lp-form-card form > .mb-4 {
  margin-bottom: 30px !important;
}

body.lp-minimed .lp-form-card textarea.form-control {
  height: 144px;
  resize: vertical;
}

body.lp-minimed .lp-form-card .form-control:focus {
  border-color: var(--mm-blue);
  box-shadow: 0 0 0 3px rgba(0, 103, 240, 0.2);
}

body.lp-minimed .lp-form-submit {
  padding: 12px 28px;
  font-size: 16px;
}

body.lp-minimed .lp-form-error {
  color: #b00020;
  font-size: 14px;
}

/* ---------- Footer ---------- */
body.lp-minimed .footer-padrao {
  background-color: var(--mm-surface) !important;
  color: var(--mm-ink) !important;
  padding-top: 58px !important;
}

body.lp-minimed .footer-padrao > .container {
  max-width: none;
  padding: 0 64px;
}

body.lp-minimed .footer-padrao .footer-top-section {
  justify-content: center;
  margin-bottom: 81px;
}

body.lp-minimed .footer-padrao .footer-logo-social {
  align-items: center;
  text-align: center;
}

body.lp-minimed .footer-padrao .footer-logo {
  height: 25px;
  width: auto;
  margin-bottom: 30px;
}

body.lp-minimed .footer-padrao .footer-logo-social > .d-flex {
  gap: 24px !important; /* vence .gap-3 */
}

body.lp-minimed .footer-padrao .footer-logo-social a {
  color: var(--mm-blue) !important; /* vence .text-white */
  font-size: 32px !important; /* vence .fs-4 */
  line-height: 1;
}

body.lp-minimed .footer-padrao .footer-legal {
  color: var(--mm-ink) !important;
  font-size: 14px !important;
  line-height: 20px !important;
  text-align: left !important;
  margin-bottom: 0 !important; /* vence .mb-5; o respiro vem das margens internas */
}

/* Último bloco legal (referências) → barra azul: 67px */
body.lp-minimed .footer-padrao > .container > :last-child {
  margin-bottom: 67px !important;
}

body.lp-minimed .footer-padrao .footer-legal h3 {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-transform: uppercase;
  margin: 0 0 18px;
}

body.lp-minimed .footer-padrao .footer-legal p,
body.lp-minimed .footer-padrao .footer-legal ol {
  margin-bottom: 18px;
}

body.lp-minimed .footer-padrao .footer-legal ol {
  padding-left: 20px;
}

body.lp-minimed .footer-padrao .footer-legal a {
  color: var(--mm-blue);
}

body.lp-minimed .footer-padrao .footer-copyright-bar {
  background-color: var(--mm-blue) !important;
  font-size: 16px;
  line-height: 19px;
  padding: 12px 0 !important;
}

/* ---------- Mobile (< 992px) ---------- */
@media (max-width: 991.98px) {
  /* Header de 80px, logo a 25px da borda */
  body.lp-minimed .header .container {
    padding-left: 25px !important;
    padding-right: 12px !important;
  }

  body.lp-minimed .header .logo-container img {
    height: 19px;
  }

  body.lp-minimed .header .bi-list {
    -webkit-text-stroke: 1px; /* barras mais grossas, como no design */
  }

  /* Hero */
  body.lp-minimed .hero-section {
    padding-top: 100px !important;
    padding-bottom: 27px !important;
  }

  body.lp-minimed .hero-section > .container {
    padding-left: 26px !important;
    padding-right: 26px !important;
  }

  body.lp-minimed .hero-section .row {
    --bs-gutter-y: 25px;
  }

  body.lp-minimed .hero-section .row > * > * {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* o style.css empurra o texto 160px para baixo no mobile */
  body.lp-minimed #hero .col-lg-6.text-start {
    margin-top: var(--bs-gutter-y);
  }

  body.lp-minimed .hero-section .hero-title {
    line-height: 42px;
    margin-bottom: 20px !important;
  }

  body.lp-minimed .hero-section .hero-text {
    max-width: none;
    margin-bottom: 22px !important;
  }

  body.lp-minimed .hero-section .btn-hero-buy {
    width: auto;
    padding: 6px 28px;
  }

  body.lp-minimed .hero-section .col-lg-6.position-relative {
    justify-content: flex-start !important;
  }

  body.lp-minimed .hero-section .hero-image {
    height: 341px;
    max-width: none;
    margin-left: -22px;
  }

  /* Foto do produto em largura total, colada no bloco anterior */
  body.lp-minimed .lp-product-info {
    padding-top: 0 !important;
  }

  body.lp-minimed .lp-product-media {
    flex: 0 0 100vw;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-left: 0;
    padding-right: 0;
  }

  body.lp-minimed .lp-product-media > .lp-media-frame {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.lp-minimed .lp-media-frame img {
    aspect-ratio: 378 / 339;
    object-fit: cover;
    object-position: center 30%;
  }

  body.lp-minimed .lp-product-info .container-description {
    max-width: none;
  }

  body.lp-minimed .lp-product-info .container-description > .py-5 {
    padding: 31px 25px 0 !important;
  }

  body.lp-minimed .lp-product-info .title-produto {
    font-size: 20px;
    line-height: 25px;
    margin-bottom: 18px !important;
  }

  body.lp-minimed .lp-product-info .product-description,
  body.lp-minimed .lp-product-info .product-description p {
    font-size: 14px;
    line-height: 20px;
  }

  body.lp-minimed .lp-product-info .product-description {
    margin-bottom: 16px !important;
  }

  body.lp-minimed .lp-product-info .product-description:last-child,
  body.lp-minimed .lp-product-info .product-disclaimer {
    margin-bottom: 0 !important;
  }

  /* Cards: 25px das bordas, 12px entre eles */
  body.lp-minimed .lp-reasons > .py-5 {
    padding: 41px 25px 0 !important;
  }

  body.lp-minimed .lp-reasons .row {
    --bs-gutter-y: 12px;
  }

  body.lp-minimed .lp-reasons-label {
    min-height: 0;
    padding: 30px 36px !important;
  }

  /* 24px: ciano sobre azul (3,99:1) só passa AA como texto grande */
  body.lp-minimed .lp-reasons-label h2 {
    font-size: 24px;
    line-height: 31px;
  }

  body.lp-minimed .lp-reason-card {
    min-height: 208px;
  }

  body.lp-minimed .lp-reason-card p {
    font-size: 11px;
    line-height: 14px;
  }

  body.lp-minimed .lp-reasons-statement {
    font-size: 14px;
    line-height: 20px;
    margin: 12px 0 0;
  }

  /* Caixa cinza em largura total */
  body.lp-minimed .lp-content-images {
    margin: 26px calc(50% - 50vw) 0;
  }

  body.lp-minimed .lp-reasons + .lp-content-images,
  body.lp-minimed .lp-reasons ~ .lp-content-images {
    margin-top: 26px;
  }

  body.lp-minimed .lp-content-box,
  body.lp-minimed .lp-content-box:has(.lp-image-grid > .row:not(.h-100)) {
    padding: 21px 25px 23px !important;
  }

  body.lp-minimed .lp-content-box > .row {
    --bs-gutter-y: 0;
    margin: 0;
    padding: 0 !important; /* vence .mobile-padding-10 */
  }

  body.lp-minimed .lp-content-box .row > * > * {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.lp-minimed .lp-content-box .col-lg-5,
  body.lp-minimed .lp-content-box .col-lg-7,
  body.lp-minimed .lp-content-box:has(.lp-image-grid > .row.h-100) .col-lg-5 {
    padding-left: 0 !important;
    padding-right: 0;
  }

  body.lp-minimed .lp-content-box .col-lg-5 > .d-flex:first-child {
    zoom: 0.72;
    margin-bottom: 17px !important; /* 12px após o zoom */
  }

  body.lp-minimed .lp-content-title {
    font-size: 20px;
    line-height: 28px;
    max-width: none;
    margin-bottom: 16px !important;
  }

  body.lp-minimed .lp-content-text {
    font-size: 14px !important;
    line-height: 20px;
    max-width: none;
    margin-bottom: 27px !important;
  }

  body.lp-minimed .lp-content-box .btn-pill-group {
    font-size: 16px !important;
    padding: 8px 30px !important;
  }

  body.lp-minimed .lp-content-box .lp-image-grid {
    margin-top: 29px;
  }

  body.lp-minimed .lp-image-grid .row {
    --bs-gutter-y: 10px;
  }

  body.lp-minimed .lp-image-grid .row > .col-6:first-child {
    padding-right: 5px !important;
  }

  body.lp-minimed .lp-image-grid .row > .col-6 + .col-6 {
    padding-left: 5px !important;
  }

  /* no mobile o design inverte as duas fotos menores */
  body.lp-minimed .lp-image-grid .d-flex.flex-column {
    flex-direction: column-reverse !important;
    gap: 10px !important;
  }

  body.lp-minimed .lp-image-grid > .row:not(.h-100) > .col-6 > .rounded {
    height: 140px !important;
  }

  body.lp-minimed .lp-image-grid > .row:not(.h-100) > .col-12 > .rounded {
    height: 160px !important;
  }

  body.lp-minimed .lp-image-grid > .row.h-100 > * > * {
    height: 290px !important;
  }

  /* Formulário */
  body.lp-minimed .lp-form-section {
    padding: 46px 25px !important;
  }

  body.lp-minimed .lp-form-card {
    padding: 35px 29px 41px !important; /* vence .row > * > div do style.css */
  }

  body.lp-minimed .lp-form-title {
    font-size: 28px;
    line-height: 32px;
    margin-bottom: 33px;
  }

  body.lp-minimed .lp-form-lead {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 30px;
  }

  body.lp-minimed .lp-form-card .row {
    --bs-gutter-y: 12px;
  }

  body.lp-minimed .lp-form-submit {
    padding: 8px 28px;
  }

  /* Footer: texto a 32px das bordas, barra azul em largura total */
  body.lp-minimed .footer-padrao {
    padding: 48px 0 0 !important;
  }

  body.lp-minimed .footer-padrao > .container {
    padding: 0 32px !important;
  }

  body.lp-minimed .footer-padrao .footer-logo {
    height: 23px;
    margin-bottom: 20px;
  }

  body.lp-minimed .footer-padrao .footer-logo-social {
    align-items: flex-start;
  }

  body.lp-minimed .footer-padrao .footer-logo-social > .d-flex {
    gap: 12px !important;
  }

  body.lp-minimed .footer-padrao .footer-logo-social a {
    font-size: 24px !important;
  }

  body.lp-minimed .footer-padrao .footer-top-section {
    margin-bottom: 51px;
  }
}