.opp-core-heading h2,
.opp-core-heading h3 {
  font-family: "Bebas Neue", Impact, sans-serif;
  margin: 0;
  text-transform: uppercase;
}
.opp-core-heading h2 { font-size: clamp(3rem, 7vw, 7rem); line-height: .86; letter-spacing: -.025em; }
.opp-core-heading h3 { font-size: clamp(2.2rem, 5vw, 5.3rem); line-height: .92; }
.opp-core-eyebrow { color: #1e6142; font-size: .76rem; font-weight: 800; letter-spacing: .14em; margin-bottom: 1rem; text-transform: uppercase; }
.opp-core-eyebrow span { align-items: center; display: inline-flex; gap: .65rem; }
.opp-core-eyebrow span::before { background: #bfa954; border-radius: 50%; content: ""; height: .5rem; width: .5rem; }
.opp-core-description { color: #55635c; font-size: 1rem; line-height: 1.75; max-width: 42rem; }

.opp-before-after { background: #e7ebe7; min-height: 260px; overflow: hidden; position: relative; touch-action: none; user-select: none; }
.opp-before-after img { display: block; height: 100%; inset: 0; object-fit: cover; position: absolute; width: 100%; }
.opp-ba-before { height: 100%; inset: 0; overflow: hidden; position: absolute; width: 100%; }
.opp-ba-handle { align-items: center; background: #fff; border: 3px solid #fff; border-radius: 50%; box-shadow: 0 7px 24px rgba(16,59,42,.25); color: #103b2a; cursor: ew-resize; display: flex; height: 48px; justify-content: center; padding: 0; position: absolute; top: 50%; transform: translate(-50%,-50%); width: 48px; z-index: 4; }
.opp-ba-handle::before { background: #fff; content: ""; height: 200vh; left: 50%; position: absolute; top: 50%; transform: translate(-50%,-50%); width: 2px; z-index: -1; }
.opp-ba-label { background: rgba(16,59,42,.88); border-radius: 999px; color: #fff; font-size: .7rem; font-weight: 800; letter-spacing: .12em; padding: .55rem .85rem; position: absolute; text-transform: uppercase; top: 1rem; z-index: 3; }
.opp-ba-label-before { left: 1rem; }
.opp-ba-label-after { right: 1rem; }

.opp-project-tabs { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 2rem; }
.opp-project-tabs button { background: transparent; border: 1px solid #cdd6d0; border-radius: 999px; color: #315043; cursor: pointer; font: inherit; font-size: .78rem; font-weight: 700; padding: .75rem 1rem; }
.opp-project-tabs button.is-active { background: #103b2a; border-color: #103b2a; color: #fff; }
.opp-project-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(3,minmax(0,1fr)); }
.opp-project-card { background: #fff; border: 1px solid #e2e8e3; border-radius: 16px; overflow: hidden; }
.opp-project-card[hidden] { display: none; }
.opp-project-image { aspect-ratio: 4/3; background: #e7ebe7; border: 0; cursor: zoom-in; display: block; overflow: hidden; padding: 0; position: relative; width: 100%; }
.opp-project-image img { height: 100%; object-fit: cover; transition: transform .5s ease; width: 100%; }
.opp-project-image:hover img { transform: scale(1.035); }
.opp-project-image span { background: #bfa954; bottom: .8rem; color: #103b2a; font-size: .72rem; font-weight: 900; left: .8rem; padding: .45rem .6rem; position: absolute; }
.opp-project-card > div { padding: 1rem 1.1rem 1.25rem; }
.opp-project-card small { color: #1e6142; font-size: .68rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.opp-project-card h3 { color: #103b2a; font-family: "Bebas Neue", Impact, sans-serif; font-size: 1.9rem; line-height: 1; margin: .45rem 0 0; text-transform: uppercase; }
.opp-project-lightbox { align-items: center; background: rgba(5,18,13,.94); display: flex; inset: 0; justify-content: center; padding: 5vw; position: fixed; z-index: 99999; }
.opp-project-lightbox[hidden] { display: none; }
.opp-project-lightbox img { max-height: 88vh; max-width: 92vw; object-fit: contain; }
.opp-project-lightbox button { background: #fff; border: 0; border-radius: 50%; color: #103b2a; cursor: pointer; font-size: 1.6rem; height: 44px; position: absolute; right: 1.25rem; top: 1.25rem; width: 44px; }
.opp-lightbox-open { overflow: hidden; }

.opp-whatsapp-cta { align-items: center; border-radius: 999px; display: inline-flex; font-size: .82rem; font-weight: 800; gap: .7rem; justify-content: center; letter-spacing: .04em; min-height: 48px; padding: .85rem 1.2rem; text-decoration: none; transition: transform .25s ease, box-shadow .25s ease; }
.opp-whatsapp-cta:hover { box-shadow: 0 12px 26px rgba(16,59,42,.2); transform: translateY(-2px); }
.opp-widget-placeholder { background: #f4f6f3; border: 1px dashed #9dad9f; color: #52675c; padding: 2rem; text-align: center; }

@media (max-width: 1024px) {
  .opp-project-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 767px) {
  .opp-core-heading h2 { font-size: clamp(2.8rem,15vw,4.6rem); }
  .opp-core-heading h3 { font-size: clamp(2.2rem,12vw,3.8rem); }
  .opp-project-grid { grid-template-columns: 1fr; }
  .opp-project-tabs { flex-wrap: nowrap; margin-inline: -1rem; overflow-x: auto; padding: 0 1rem .4rem; scrollbar-width: none; }
  .opp-project-tabs button { flex: 0 0 auto; }
}
@media (prefers-reduced-motion: reduce) {
  .opp-project-image img, .opp-whatsapp-cta { transition: none; }
}