/* About: Our Mission and Our Vision — two bands, each with a large square photo and copy side by side */
.mv { position: relative; overflow: hidden; color: #2c1f16; }
.mv--mission { background: #f3efe2; padding: 30px 0; border-top: 1px solid #e6dfcc; }
.mv--vision { background: #faf8f2; padding: 30px 0; }
@media (min-width: 768px) { .mv--mission, .mv--vision { padding: 40px 0; } }
.mv-wrap { max-width: 1280px; margin: 0 auto; padding: 0 20px; }
@media (min-width: 1024px) { .mv-wrap { padding: 0 48px; } }

.mv-head { max-width: 46rem; margin: 0 auto 36px; text-align: center; }
.mv-head .section-label { color: #bc8c3f; }
.mv-sub { margin: 14px 0 0; color: #5a4d43; }

.mv-row { display: grid; gap: 32px; align-items: center; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 960px) {
  .mv-row { grid-template-columns: minmax(0, 1.06fr) minmax(0, 1fr); gap: 72px; }
  .mv-row--rev { grid-template-columns: minmax(0, 1fr) minmax(0, 1.06fr); }
}

/* large square photo with soft corners and an offset gold outline */
.mv-photo { position: relative; margin: 0; padding: 0 16px 16px 0; }
.mv-photo::before { content: ''; position: absolute; top: 16px; left: 16px; right: 0; bottom: 0; border: 1px solid rgba(188,140,63,.55); border-radius: 34px; }
.mv-row--rev .mv-photo { padding: 0 0 16px 16px; }
.mv-row--rev .mv-photo::before { left: 0; right: 16px; }
.mv-frame { position: relative; z-index: 1; overflow: hidden; aspect-ratio: 1 / 1; border-radius: 28px; background: #e0dad2; box-shadow: 0 40px 70px -46px rgba(49,39,33,.7); }
.mv-frame img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; transition: transform 1.4s cubic-bezier(.2,.7,.2,1); }
.mv--mission .mv-frame img { object-position: 72% 40%; }
.mv-photo:hover .mv-frame img { transform: scale(1.05); }
.mv-since { position: absolute; z-index: 2; left: 18px; bottom: 34px; display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px 8px 8px; border-radius: 999px; background: rgba(36,24,19,.9); color: #f1e6cc; box-shadow: 0 16px 28px -16px rgba(0,0,0,.6); }
.mv-row--rev .mv-since { left: 34px; }
.mv-since i { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #e8bd55; color: #2a1c13; font-size: 13px; }
.mv-since b { font-family: 'Playfair Display', Georgia, serif; font-size: 14px; font-weight: 600; color: #e8bd55; }
@media (max-width: 959px) { .mv-photo { max-width: 560px; width: 100%; margin: 0 auto; } }
@media (max-width: 520px) { .mv-photo::before { border-radius: 26px; } .mv-frame { border-radius: 22px; aspect-ratio: 4 / 3.4; } }

/* copy */
.mv-tag { margin: 0; display: inline-flex; align-items: center; gap: .8rem; color: #8a5a22; font-size: 12.5px; font-weight: 700; letter-spacing: .3em; text-transform: uppercase; }
.mv-tag::after { content: ''; width: 46px; height: 1px; background: #bc8c3f; }
.mv-h3 { margin: 16px 0 0; color: #2a1c13; }
html body #mission-vision h3.mv-h3:not(#_):not(#_), html body #our-vision h3.mv-h3:not(#_):not(#_) { font-size: clamp(1.6rem, 2.5vw, 2.25rem) !important; line-height: 1.2 !important; }
.mv-p { margin: 16px 0 0; color: #5a4d43; }
html body .mv-p:not(#_):not(#_) { font-size: 16px !important; line-height: 1.85 !important; text-align: left; }
.mv-motto { margin: 22px 0 0; padding: 16px 22px; border-left: 3px solid #bc8c3f; border-radius: 0 16px 16px 0; background: rgba(188,140,63,.11); }
.mv-motto span { display: block; color: #8a5a22; font-size: 11.5px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
html body .mv-motto strong:not(#_):not(#_) { display: block; margin-top: 4px; font-family: 'Playfair Display', Georgia, serif; font-size: 21px !important; font-weight: 500; font-style: italic; line-height: 1.35 !important; color: #2a1c13; }

.mv-feats { list-style: none; margin: 26px 0 0; padding: 0; display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 560px) { .mv-feats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mv-feat { display: flex; align-items: flex-start; gap: 14px; padding: 16px 18px; border-radius: 18px; background: rgba(255,255,255,.72); border: 1px solid rgba(188,140,63,.28); }
.mv--vision .mv-feat { background: #f6f1e4; }
.mv-ic { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(145deg, #3b2a1f, #241813); color: #e8bd55; }
.mv-ic svg { width: 20px; height: 20px; }
.mv-feat h4 { margin: 2px 0 0; color: #2a1c13; }
html body .mv-feat h4:not(#_):not(#_) { font-size: 17px !important; line-height: 1.3 !important; font-family: 'Playfair Display', Georgia, serif; }
.mv-feat h4 em { font-style: normal; color: #bc8c3f; font-size: 1.35em; margin-right: .25rem; }
.mv-feat p { margin: 4px 0 0; color: #6a5c50; }
html body .mv-feat p:not(#_):not(#_) { font-size: 14px !important; line-height: 1.6 !important; text-align: left; }

/* Vision photo: show the whole tiger instead of a tight square crop. */
.mv--vision .mv-frame { aspect-ratio: 4 / 3; }
.mv--vision .mv-frame img { object-position: 72% center; }
@media (max-width: 520px) { .mv--vision .mv-frame { aspect-ratio: 4 / 3.2; } }
