.strategic-section {
  position: relative;
  z-index: 2;
  min-height: 100svh;
  display: grid;
  align-items: center;
  overflow: hidden;
  background: #00173D;
  color: #F8F5E8;
  padding: clamp(5rem, 9vw, 9rem) var(--safe-x);
}

.strategic-section__inner { width: min(100%, 1440px); margin: 0 auto; }
.strategic-section__header { margin-bottom: clamp(3rem, 7vw, 7rem); }
.strategic-section__eyebrow { margin: 0 0 1.25rem; color: rgba(248,245,232,.62); font-family: "Bray DIN", Arial, sans-serif; font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; }
.strategic-section h2 { margin: 0; color: #F8F5E8; font-family: "Josefin Sans", Arial, sans-serif; font-size: clamp(2.2rem, 5vw, 5.5rem); font-weight: 400; letter-spacing: -.065em; line-height: .92; text-transform: uppercase; }
.strategic-carousel__stage { position: relative; min-height: clamp(18rem, 34vw, 30rem); }
.strategic-slide { position: absolute; inset: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(2rem, 8vw, 10rem); opacity: 0; transform: translateX(26px); pointer-events: none; transition: opacity 700ms cubic-bezier(.22,1,.36,1), transform 700ms cubic-bezier(.22,1,.36,1); }
.strategic-slide.is-active { opacity: 1; transform: translateX(0); pointer-events: auto; }
.strategic-slide h3 { margin: 0; font-family: "Josefin Sans", Arial, sans-serif; font-size: clamp(3.5rem, 8vw, 9rem); font-weight: 400; letter-spacing: -.08em; line-height: .82; }
.strategic-slide:nth-child(1) h3 { color: #FFD700; }
.strategic-slide:nth-child(2) h3 { color: #72D8FF; }
.strategic-slide:nth-child(3) h3 { color: #FFFFFF; }
.strategic-slide:nth-child(4) h3 { color: #FF8E87; }
.strategic-slide p { max-width: 38rem; margin: 0; color: rgba(248,245,232,.9); font-family: "Bray Poppins", Arial, sans-serif; font-size: clamp(.95rem, 1.35vw, 1.35rem); letter-spacing: -.015em; line-height: 1.55; }
.strategic-carousel__divider { height: 1px; margin-top: clamp(2rem, 5vw, 4rem); background: rgba(248,245,232,.28); }
.strategic-carousel__controls { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: clamp(1rem, 2.5vw, 2.5rem); padding-top: 1.4rem; color: rgba(248,245,232,.8); }
.strategic-carousel__counter { font-family: "Bray DIN", Arial, sans-serif; font-size: .75rem; letter-spacing: .08em; white-space: nowrap; }
.strategic-carousel__progress { height: 1px; background: rgba(248,245,232,.25); }
.strategic-carousel__progress span { display: block; width: 25%; height: 100%; background: #F8F5E8; transition: width 700ms cubic-bezier(.22,1,.36,1); }
.strategic-carousel__button { display: grid; width: 2.6rem; height: 2.6rem; place-items: center; padding: 0; border: 1px solid rgba(248,245,232,.45); border-radius: 50%; background: transparent; color: #F8F5E8; cursor: pointer; font-size: 1.15rem; transition: background-color .2s ease, color .2s ease, border-color .2s ease; }
.strategic-carousel__button:hover, .strategic-carousel__button:focus-visible { border-color: #F8F5E8; background: #F8F5E8; color: #00173D; outline: none; }

@media (max-width: 700px) {
  .strategic-section { display: block; min-height: 0; padding-block: 5.5rem 6rem; }
  .strategic-section__header { margin-bottom: 4rem; }
  .strategic-section h2 { font-size: clamp(2.3rem, 10vw, 4rem); }
  .strategic-carousel__stage { min-height: 31rem; }
  .strategic-slide { grid-template-columns: 1fr; align-content: center; gap: 2rem; }
  .strategic-slide h3 { font-size: clamp(3.2rem, 16vw, 6rem); }
  .strategic-slide p { font-size: .9rem; }
  .strategic-carousel__controls { grid-template-columns: 1fr auto auto; gap: .8rem; }
  .strategic-carousel__progress { grid-column: 1 / -1; grid-row: 1; }
  .strategic-carousel__counter { grid-column: 1; grid-row: 2; }
}

@media (prefers-reduced-motion: reduce) {
  .strategic-slide, .strategic-carousel__progress span { transition: none; }
}