/* Heroic American backgrounds */

.has-patriot-bg > *:not(.patriot-bg):not(.distinction__bg) {
  position: relative;
  z-index: 1;
}

.patriot-bg {
  transform: scale(1.04);
  transition: opacity 1.1s cubic-bezier(0.16, 1, 0.3, 1), transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}

section.has-patriot-bg.in-view .patriot-bg {
  transform: scale(1);
}

.patriot-bg--flag-heroic {
  background:
    linear-gradient(100deg, rgba(5, 8, 10, 0.88) 0%, rgba(5, 8, 10, 0.42) 40%, rgba(5, 8, 10, 0.55) 100%),
    linear-gradient(180deg, rgba(0, 40, 104, 0.28), transparent 40%, rgba(191, 10, 48, 0.14)),
    url("assets/bg-flag-heroic.webp") 60% 45% / cover no-repeat;
  filter: contrast(1.08) saturate(1.18);
}

.patriot-bg--flag-deep {
  background:
    linear-gradient(180deg, rgba(5, 8, 10, 0.5), rgba(5, 8, 10, 0.78)),
    linear-gradient(90deg, rgba(0, 40, 104, 0.35), transparent 45%, rgba(191, 10, 48, 0.22)),
    url("assets/bg-flag-heroic.webp") center 40% / cover no-repeat;
  filter: contrast(1.12) saturate(1.22) brightness(0.88);
}

.patriot-bg--flag-soft-heroic {
  background:
    linear-gradient(90deg, rgba(5, 8, 10, 0.9) 0%, rgba(5, 8, 10, 0.5) 50%, rgba(5, 8, 10, 0.75) 100%),
    url("assets/bg-flag-heroic.webp") 85% 50% / cover no-repeat;
  filter: saturate(1.12) contrast(1.06);
}

.patriot-bg--eagle-heroic {
  background:
    linear-gradient(105deg, rgba(5, 8, 10, 0.82) 0%, rgba(5, 8, 10, 0.32) 48%, rgba(5, 8, 10, 0.58) 100%),
    radial-gradient(ellipse at 78% 40%, rgba(212, 175, 55, 0.14), transparent 50%),
    url("assets/bg-eagle-heroic.webp") 72% 38% / cover no-repeat;
  filter: contrast(1.06) saturate(1.08);
}

.patriot-bg--cta {
  background:
    linear-gradient(180deg, rgba(5, 8, 10, 0.68), rgba(5, 8, 10, 0.9)),
    radial-gradient(ellipse at 50% 28%, rgba(212, 175, 55, 0.16), transparent 55%),
    url("assets/bg-eagle-heroic.webp") center 32% / cover no-repeat;
}

.patriot-bg--distinction {
  mix-blend-mode: soft-light;
}

.distinction__inner {
  position: relative;
  z-index: 2;
}

.discover .patriot-bg--flag-heroic {
  background:
    linear-gradient(95deg, rgba(5, 8, 10, 0.92) 0%, rgba(5, 8, 10, 0.38) 44%, rgba(5, 8, 10, 0.48) 100%),
    linear-gradient(180deg, rgba(0, 40, 104, 0.38), transparent 36%, rgba(191, 10, 48, 0.2)),
    url("assets/bg-flag-heroic.webp") 68% 38% / cover no-repeat;
}

.history .patriot-bg--flag-heroic {
  background:
    linear-gradient(180deg, rgba(5, 8, 10, 0.68), rgba(5, 8, 10, 0.84)),
    linear-gradient(90deg, rgba(5, 8, 10, 0.6) 0%, transparent 42%),
    url("assets/bg-flag-heroic.webp") 72% 48% / cover no-repeat;
}

.protocol .patriot-bg--flag-deep {
  background:
    linear-gradient(180deg, rgba(5, 8, 10, 0.45), rgba(5, 8, 10, 0.8)),
    linear-gradient(115deg, rgba(0, 40, 104, 0.4), transparent 40%, rgba(191, 10, 48, 0.28)),
    url("assets/bg-flag-heroic.webp") center 35% / cover no-repeat;
}

section.has-patriot-bg.in-view .patriot-bg--flag-heroic {
  opacity: 0.5;
}

.discover.section.has-patriot-bg.in-view .patriot-bg--flag-heroic {
  opacity: 0.58;
}

section.has-patriot-bg.in-view .patriot-bg--flag-deep {
  opacity: 0.55;
}

section.has-patriot-bg.in-view .patriot-bg--flag-soft-heroic {
  opacity: 0.38;
}

section.has-patriot-bg.in-view .patriot-bg--eagle-heroic {
  opacity: 0.44;
}

section.has-patriot-bg.in-view .patriot-bg--cta {
  opacity: 0.42;
}

section.has-patriot-bg.in-view .patriot-bg--distinction {
  opacity: 0.38;
}

.patriot-bg--flag {
  background:
    linear-gradient(180deg, rgba(5, 8, 10, 0.5), rgba(5, 8, 10, 0.72)),
    url("assets/bg-flag-heroic.webp") center / cover no-repeat !important;
  mix-blend-mode: normal !important;
  filter: brightness(0.75) contrast(1.1) saturate(1.15) !important;
}

.patriot-bg--flag-soft {
  background:
    url("assets/bg-flag-heroic.webp") left center / 85% auto no-repeat !important;
  filter: brightness(0.6) saturate(1.05) !important;
}

.patriot-bg--eagle {
  background:
    radial-gradient(ellipse 50% 60% at 88% 50%, rgba(212, 175, 55, 0.1), transparent 60%),
    url("assets/eagle.svg") 92% 45% / min(42vw, 340px) auto no-repeat,
    url("assets/bg-eagle-heroic.webp") right center / cover no-repeat !important;
}

.patriot-bg--eagle-right {
  background:
    url("assets/eagle.svg") 94% 30% / min(28vw, 220px) auto no-repeat,
    url("assets/bg-eagle-heroic.webp") 100% 40% / cover no-repeat !important;
}

.patriot-bg--eagles {
  background:
    url("assets/eagle.svg") 8% 70% / min(24vw, 180px) auto no-repeat,
    url("assets/eagle.svg") 92% 25% / min(30vw, 240px) auto no-repeat,
    url("assets/bg-eagle-heroic.webp") center / cover no-repeat !important;
}

section.has-patriot-bg.in-view .patriot-bg--flag {
  opacity: 0.4 !important;
}

@keyframes patriotDriftHeroic {
  0%, 100% { transform: scale(1) translate3d(0, 0, 0); }
  50% { transform: scale(1.035) translate3d(-1.2%, 0.6%, 0); }
}

section.has-patriot-bg.in-view .patriot-bg--eagle-heroic,
section.has-patriot-bg.in-view .patriot-bg--flag-heroic,
section.has-patriot-bg.in-view .patriot-bg--flag-deep {
  animation: patriotDriftHeroic 22s ease-in-out infinite;
}

@media (max-width: 640px) {
  .discover.section.has-patriot-bg.in-view .patriot-bg--flag-heroic,
  section.has-patriot-bg.in-view .patriot-bg--flag-heroic {
    opacity: 0.36;
  }
  section.has-patriot-bg.in-view .patriot-bg--eagle-heroic,
  section.has-patriot-bg.in-view .patriot-bg--cta {
    opacity: 0.28;
  }
}

@media (prefers-reduced-motion: reduce) {
  .patriot-bg--flag-heroic,
  .patriot-bg--eagle-heroic,
  .patriot-bg--flag-deep {
    animation: none !important;
  }
}

/* Tick 2: stronger American depth on later pages */
.roadmap .patriot-bg--eagle-heroic {
  background:
    linear-gradient(110deg, rgba(5, 8, 10, 0.88) 0%, rgba(5, 8, 10, 0.28) 50%, rgba(5, 8, 10, 0.62) 100%),
    radial-gradient(ellipse at 75% 35%, rgba(212, 175, 55, 0.18), transparent 48%),
    url("assets/bg-eagle-heroic.webp") 78% 30% / cover no-repeat;
}

.cta .patriot-bg--cta {
  background:
    linear-gradient(180deg, rgba(5, 8, 10, 0.48), rgba(5, 8, 10, 0.9)),
    linear-gradient(90deg, rgba(0, 40, 104, 0.28), transparent 40%, rgba(191, 10, 48, 0.2)),
    radial-gradient(ellipse at 50% 30%, rgba(212, 175, 55, 0.18), transparent 55%),
    url("assets/bg-eagle-heroic.webp") center 22% / cover no-repeat;
  filter: contrast(1.1) saturate(1.12) brightness(0.94);
}

.cta.section.has-patriot-bg.in-view .patriot-bg--cta {
  opacity: 0.58;
}

/* Oil industry backgrounds */
.patriot-bg--oil-rigs {
  background:
    linear-gradient(105deg, rgba(5, 8, 10, 0.88) 0%, rgba(5, 8, 10, 0.38) 48%, rgba(5, 8, 10, 0.72) 100%),
    linear-gradient(180deg, rgba(5, 8, 10, 0.35) 0%, transparent 40%, rgba(5, 8, 10, 0.55) 100%),
    radial-gradient(ellipse at 70% 55%, rgba(212, 175, 55, 0.12), transparent 55%),
    url("assets/bg-oil-rigs.webp") 65% 45% / cover no-repeat;
  filter: contrast(1.06) saturate(1.08) brightness(0.92);
}

.patriot-bg--oil-barrels {
  background:
    linear-gradient(100deg, rgba(5, 8, 10, 0.9) 0%, rgba(5, 8, 10, 0.42) 50%, rgba(5, 8, 10, 0.78) 100%),
    linear-gradient(180deg, rgba(0, 40, 104, 0.18), transparent 45%, rgba(191, 10, 48, 0.1)),
    url("assets/bg-oil-barrels.webp") 70% 48% / cover no-repeat;
  filter: contrast(1.08) saturate(1.05) brightness(0.9);
}

section.has-patriot-bg.in-view .patriot-bg--oil-rigs {
  opacity: 0.52;
}

section.has-patriot-bg.in-view .patriot-bg--oil-barrels {
  opacity: 0.5;
}

.system .patriot-bg--oil-rigs {
  background:
    linear-gradient(105deg, rgba(5, 8, 10, 0.9) 0%, rgba(5, 8, 10, 0.32) 52%, rgba(5, 8, 10, 0.7) 100%),
    radial-gradient(ellipse at 78% 40%, rgba(212, 175, 55, 0.14), transparent 48%),
    url("assets/bg-oil-rigs.webp") 75% 40% / cover no-repeat;
}

.flow .patriot-bg--oil-rigs {
  background:
    linear-gradient(100deg, rgba(5, 8, 10, 0.88) 0%, rgba(5, 8, 10, 0.36) 50%, rgba(5, 8, 10, 0.75) 100%),
    url("assets/bg-oil-rigs.webp") 80% 50% / cover no-repeat;
}

.story .patriot-bg--oil-rigs {
  background:
    linear-gradient(100deg, rgba(5, 8, 10, 0.92) 0%, rgba(5, 8, 10, 0.4) 50%, rgba(5, 8, 10, 0.72) 100%),
    url("assets/bg-oil-rigs.webp") 78% 42% / cover no-repeat;
}

.roadmap .patriot-bg--oil-rigs {
  background:
    linear-gradient(110deg, rgba(5, 8, 10, 0.9) 0%, rgba(5, 8, 10, 0.3) 52%, rgba(5, 8, 10, 0.68) 100%),
    radial-gradient(ellipse at 75% 35%, rgba(212, 175, 55, 0.14), transparent 48%),
    url("assets/bg-oil-rigs.webp") 72% 35% / cover no-repeat;
}

.window .patriot-bg--oil-barrels {
  background:
    linear-gradient(90deg, rgba(5, 8, 10, 0.92) 0%, rgba(5, 8, 10, 0.48) 55%, rgba(5, 8, 10, 0.8) 100%),
    url("assets/bg-oil-barrels.webp") 88% 50% / cover no-repeat;
}

.why .patriot-bg--oil-barrels {
  background:
    linear-gradient(180deg, rgba(5, 8, 10, 0.78), rgba(5, 8, 10, 0.86)),
    url("assets/bg-oil-barrels.webp") center 45% / cover no-repeat;
}

.token .patriot-bg--oil-barrels {
  background:
    linear-gradient(95deg, rgba(5, 8, 10, 0.92) 0%, rgba(5, 8, 10, 0.4) 55%, rgba(5, 8, 10, 0.75) 100%),
    url("assets/bg-oil-barrels.webp") 85% 48% / cover no-repeat;
}

.protocol .patriot-bg--eagle-heroic {
  background:
    linear-gradient(180deg, rgba(5, 8, 10, 0.52), rgba(5, 8, 10, 0.82)),
    linear-gradient(115deg, rgba(0, 40, 104, 0.32), transparent 42%, rgba(191, 10, 48, 0.18)),
    radial-gradient(ellipse at 72% 38%, rgba(212, 175, 55, 0.16), transparent 50%),
    url("assets/bg-eagle-heroic.webp") 70% 32% / cover no-repeat;
  filter: contrast(1.08) saturate(1.1) brightness(0.92);
}

.protocol.has-patriot-bg.in-view .patriot-bg--eagle-heroic {
  opacity: 0.55;
}

.protocol .patriot-bg--oil-barrels {
  background:
    linear-gradient(180deg, rgba(5, 8, 10, 0.55), rgba(5, 8, 10, 0.82)),
    linear-gradient(115deg, rgba(0, 40, 104, 0.28), transparent 40%, rgba(191, 10, 48, 0.16)),
    url("assets/bg-oil-barrels.webp") center 40% / cover no-repeat;
}

.window.has-patriot-bg.in-view .patriot-bg--oil-barrels {
  opacity: 0.36;
}

.system.has-patriot-bg.in-view .patriot-bg--oil-rigs,
.story.has-patriot-bg.in-view .patriot-bg--oil-rigs,
.roadmap.has-patriot-bg.in-view .patriot-bg--oil-rigs,
.flow.has-patriot-bg.in-view .patriot-bg--oil-rigs {
  opacity: 0.48;
}

.why.has-patriot-bg.in-view .patriot-bg--oil-barrels,
.token.has-patriot-bg.in-view .patriot-bg--oil-barrels,
.protocol.has-patriot-bg.in-view .patriot-bg--oil-barrels {
  opacity: 0.46;
}

section.has-patriot-bg.in-view .patriot-bg--oil-rigs,
section.has-patriot-bg.in-view .patriot-bg--oil-barrels {
  animation: patriotDriftHeroic 22s ease-in-out infinite;
}

@media (max-width: 640px) {
  section.has-patriot-bg.in-view .patriot-bg--oil-rigs,
  section.has-patriot-bg.in-view .patriot-bg--oil-barrels {
    opacity: 0.32;
  }
}

@media (prefers-reduced-motion: reduce) {
  .patriot-bg--oil-rigs,
  .patriot-bg--oil-barrels {
    animation: none !important;
  }
}