.mp section {
  padding:64px 0
}

.mp h1 {
  font-size:46px;
  line-height:1.18;
  margin-bottom:22px;
  color:#2a4544
}

.mp h2 {
  font-size:31px;
  line-height:1.3;
  margin-bottom:18px;
  color:#2a4544
}

.mp h3 {
  font-size:20px;
  line-height:1.4;
  color:#2a4544;
  margin-bottom:12px
}

.mp p {
  font-size:17px;
  line-height:1.8;
  margin-bottom:18px
}

.mp .eyebrow {
  color:#2a4544;
  font-size:13px;
  font-weight:700;
  letter-spacing:1.6px;
  text-transform:uppercase;
  margin-bottom:14px
}

.mp .lead {
  font-size:19px
}

.mp .breadcrumb-line {
  font-size:13px;
  margin-bottom:26px;
  color:#656b68
}

.mp .split {
  display:grid;
  grid-template-columns:1.35fr 1fr;
  gap:52px;
  align-items:center
}

.mp .quote-box {
  padding:32px;
  background:#fff;
  border-top:4px solid #2a4544;
  box-shadow:0 7px 28px #2a45440c
}

.mp .quote-box h2 {
  font-size:25px
}

.mp .checks li {
  padding:12px 0;
  border-bottom:1px solid #e6e3dc;
  font-size:16px;
  line-height:1.6
}

.mp .checks li:last-child {
  border:0
}

.mp .checks li:before {
  content:'✓';
  color:#2a4544;
  font-weight:bold;
  margin-right:12px
}

.mp .actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:25px
}

.mp .cta {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:13px 21px;
  background:#2a4544;
  color:white;
  font-weight:700;
  font-size:15px;
  border:1px solid #2a4544;
  text-align:center
}

.mp .cta.secondary {
  background:transparent;
  color:#2a4544
}

.mp .cta:hover {
  background:#1c3332;
  color:white
}

.mp .small {
  font-size:14px;
  color:#666f6a;
  line-height:1.6;
  margin-top:16px;
  margin-bottom:0
}

.mp .white {
  background:white
}

.mp .cards {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  margin-top:30px
}

.mp .card-panel {
  padding:28px;
  background:#fcf8f0;
  border:1px solid #e7e2d8
}

.mp .card-panel p {
  font-size:16px;
  margin-bottom:0
}

.mp .num {
  font-size:13px;
  color:#2a4544;
  letter-spacing:1px;
  display:block;
  margin-bottom:18px;
  font-weight:700
}

.mp .section-intro {
  max-width:760px
}

.mp .two-cards {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:25px;
  margin-top:30px
}

.mp .product-card {
  padding:32px;
  background:white;
  border:1px solid #e1ded6;
  scroll-margin-top:120px
}

.mp .product-card p {
  font-size:16px
}

.mp .tag {
  font-size:12px;
  letter-spacing:1px;
  text-transform:uppercase;
  color:#2a4544;
  font-weight:700;
  margin-bottom:15px;
  display:block
}

.mp .text-link {
  text-decoration:underline;
  text-underline-offset:4px;
  font-weight:bold
}

.mp .photo-help {
  background:#f1eade;
  padding:28px
}

.mp .photo-help ol {
  list-style:decimal;
  padding-left:20px
}

.mp .photo-help li {
  font-size:16px;
  line-height:1.7;
  padding:6px 0
}

.mp details {
  border-bottom:1px solid #dcded8;
  padding:20px 0
}

.mp summary {
  font-size:18px;
  font-weight:600;
  color:#2a4544;
  cursor:pointer;
  list-style:revert;
  padding-right:10px
}

.mp details p {
  margin:15px 0 0;
  max-width:880px;
  font-size:16px
}

.mp .closing {
  background:#2a4544;
  text-align:center
}

.mp .closing h2,.mp .closing p {
  color:white
}

.mp .closing .actions {
  justify-content:center
}

.mp .closing .cta {
  background:#fcf8f0;
  color:#2a4544;
  border-color:#fcf8f0
}

.mp .closing .cta.secondary {
  color:white;
  background:transparent
}

.mp .area-links {
  display:flex;
  flex-wrap:wrap;
  gap:10px 22px;
  margin-top:18px
}

.mp .area-links a {
  text-decoration:underline;
  text-underline-offset:4px
}

.mp a:focus-visible,.mp summary:focus-visible {
  outline:3px solid #2a4544;
  outline-offset:5px
}

.mp .brand-banner {
  width:100%;
  height:auto;
  display:block
}

.mp .hero {
  padding-top:30px
}

.mp .availability {
  margin-top:24px;
  font-size:14px;
  color:#2a4544
}

.mp .availability span {
  margin-right:18px;
  display:inline-block
}

.mp .price-note {
  border-left:3px solid #2a4544;
  padding-left:18px
}

.mp-mobile {
  display:none
}

@media(max-width:991px) {
  .mp h1 {
    font-size:37px
  }

  .mp .split {
    gap:28px;
    grid-template-columns:1fr 1fr
  }

  .mp .cards {
    gap:14px
  }

  .mp .card-panel {
    padding:22px
  }

}

@media(max-width:767px) {
  .mp section {
    padding:40px 0
  }

  .mp .split,.mp .cards,.mp .two-cards {
    grid-template-columns:1fr;
    gap:20px
  }

  .mp h1 {
    font-size:32px
  }

  .mp h2 {
    font-size:26px
  }

  .mp .lead {
    font-size:17px
  }

  .mp .actions {
    flex-direction:column
  }

  .mp .cta {
    width:100%
  }

  .mp .quote-box,.mp .product-card {
    padding:24px
  }

  .mp .breadcrumb-line {
    font-size:12px
  }

  .mp .availability span {
    display:block;
    margin:7px 0
  }

  .mp .brand-banner {
    min-height:92px;
    object-fit:cover
  }

  .mp-mobile {
    display:flex;
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    z-index:10000;
    background:#2a4544;
    box-shadow:0 -3px 15px #0002;
    padding-bottom:env(safe-area-inset-bottom)
  }

  .mp-mobile a {
    width:50%;
    padding:16px 7px;
    color:white;
    text-align:center;
    font-weight:700
  }

  .mp-mobile a+a {
    border-left:1px solid #ffffff55
  }

  body {
    padding-bottom:57px
  }

  .footer__copyright img {
    margin:8px!important
  }

  #scrollTopBtn {
    bottom:75px
  }

}

@media(max-width:991px) {
  .navbar .navbar-collapse:not(.menu-opened) {
    visibility:hidden;
    pointer-events:none
  }

  .navbar .navbar-collapse.menu-opened {
    visibility:visible;
    background:#fcf8f0;
    z-index:9999
  }

}

.mp-feature-photo {
  margin:0;
  background:#fff;
  padding:12px;
  border:1px solid #e1ded6
}

.mp-feature-photo img {
  display:block;
  width:100%;
  height:auto
}

.mp-feature-photo figcaption {
  padding:14px 7px 5px;
  font-size:13px;
  line-height:1.6;
  color:#556562
}

a:hover {
  color:#2a4544
}