.campaign { --campaign-gold: #ffdc77; padding-bottom: 86px; }
.campaign-banner { background: #071426; color: #e9f0ff; border-bottom: 1px solid #a4bbf02b; }
.campaign-banner > div { min-height: 42px; display: flex; justify-content: center; align-items: center; gap: 2rem; padding-block: .5rem; }
.campaign-banner p { font-size: .64rem; font-weight: 800; letter-spacing: .12em; }
.campaign-spark { color: var(--campaign-gold); font-size: 1rem; margin-right: .4rem; }
.campaign-banner a { color: #fff; font-size: .76rem; text-decoration: none; }
.campaign-banner a strong { color: var(--campaign-gold); }
.reading-progress { position: fixed; inset: 0 0 auto; height: 3px; z-index: 15; pointer-events: none; }
.reading-progress span { display: block; height: 100%; background: #ffdc77; transform: scaleX(0); transform-origin: left; }
.campaign .sale-hero { position: relative; isolation: isolate; overflow: hidden; background: linear-gradient(115deg, #071426, #142e64 65%, #1e457d); }
.campaign .sale-hero::before { content: ""; position: absolute; z-index: -1; width: min(70vw, 850px); height: 850px; right: -240px; top: -340px; border-radius: 50%; background: radial-gradient(circle, #3d7cd84a, #39d48315 45%, transparent 68%); pointer-events: none; animation: ambient-drift 14s ease-in-out 2 alternate; }
.campaign .sale-hero::after { content: ""; position: absolute; z-index: -1; inset: 0; background-image: linear-gradient(#ffffff04 1px, transparent 1px), linear-gradient(90deg, #ffffff04 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(90deg, transparent, #000); pointer-events: none; }
.campaign .sale-tag { border-color: #75a2e34d; }
.campaign .sale-pitch h1 em { color: #6ce4a0; text-shadow: 0 4px 30px #35c4781a; }
.campaign .purchase-card { border: 1px solid #8daee766; box-shadow: 0 25px 80px #030b254d, 0 0 0 5px #b3d1ff0a; }
.campaign .sale-button { position: relative; overflow: hidden; background: linear-gradient(115deg, #08713a, #15994e); border: 1px solid #40b970; box-shadow: 0 6px 0 #074d2a, 0 13px 27px #0f6c3826; transition: transform .2s, box-shadow .2s, background .2s; }
.campaign .sale-button::before { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 25%, #ffffff20 48%, transparent 72%); transform: translateX(-120%); pointer-events: none; }
.campaign .sale-button:hover::before { transform: translateX(120%); transition: transform .65s ease; }
.campaign .sale-button:hover { transform: translateY(-3px); box-shadow: 0 8px 0 #074d2a, 0 18px 35px #0f6c3833; }
.campaign .sale-button:active { transform: translateY(2px); box-shadow: 0 2px 0 #074d2a; }
.campaign .sale-button span { transition: transform .2s; }
.campaign .sale-button:hover span { transform: translateX(3px); }
.bundle-pill { display: inline-block; padding: .45rem .65rem; background: #e9f6ed; border: 1px solid #c1e2cc; border-radius: 4px; color: #166238; font-size: .64rem; letter-spacing: .05em; font-weight: 800; }
.demo-banner { text-align: center; padding: .75rem 1rem; color: #ffdc77; font-size: .65rem; line-height: 1.5; letter-spacing: .07em; font-weight: 800; }
.offer-demo .sale-hero-grid { align-items: start; }
.offer-demo .sale-pitch { padding-top: 2rem; }
.offer-demo .course-cover img { aspect-ratio: 2.1; object-fit: cover; }
.offer-demo .purchase-body { padding: 1.25rem 1.6rem; }
.discount-reference { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: .7rem; margin: .5rem 0 .8rem; }
.discount-reference > span { color: #6b7383; font-size: 1.02rem; }
.discount-reference s { text-decoration-thickness: 2px; text-decoration-color: #a33b35; }
.discount-reference > strong { color: #fff; background: #c43731; border-radius: 4px; padding: .35rem .5rem; font-size: .71rem; letter-spacing: .03em; }
.campaign .large-price { font-size: 5rem; }
.price-support { font-size: .72rem; line-height: 1.5; color: #55637b; margin: -.1rem 0 1.15rem; }
.campaign-value { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; padding-block: 4.5rem; }
.campaign-value h2 em { color: #138341; font-style: normal; }
.campaign-value h2 + p { color: #667185; margin-top: 1rem; max-width: 46ch; }
.value-items { background: #f5f8fd; padding: 1.2rem 1.6rem; border: 1px solid #dce6f2; border-radius: 10px; }
.value-items > div { display: flex; align-items: center; gap: 1rem; padding: .95rem 0; border-bottom: 1px solid #dce6f2; }
.value-items > div > span { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 50%; background: #e2edff; color: #204a88; font-size: .75rem; font-weight: 800; }
.value-items strong, .value-items small { display: block; }
.value-items strong { font-size: .95rem; }
.value-items small { color: #60718b; margin-top: .2rem; font-size: .81rem; }
.value-included { margin-top: 1rem; color: #12703b; font-size: .85rem; font-weight: 800; }
.campaign .audience-grid article, .campaign .path-group, .campaign .story-photo { transition: transform .25s ease, box-shadow .25s ease; }
@media (hover: hover) { .campaign .audience-grid article:hover { transform: translateY(-5px); box-shadow: 0 15px 35px #13244912; } }
.campaign-offer { position: relative; }
.campaign-offer::before { content: ""; position: absolute; z-index: -1; inset: 10% -4% 6%; background: radial-gradient(ellipse at 75% 50%, #dcebea88, transparent 70%); pointer-events: none; }
.campaign .final-price-card { border: 1px solid #9ac9b0; border-top: 5px solid #138341; box-shadow: 0 22px 60px #173b2c17; }
.campaign .final-price-card .large-price { font-size: 5.5rem; }
.floating-offer[hidden] { display: none; }
.floating-offer { position: fixed; inset: auto 0 0; z-index: 10; background: #071426f5; color: #fff; border-top: 1px solid #91b7ee44; box-shadow: 0 -8px 28px #0714261f; backdrop-filter: blur(12px); }
.floating-offer > div { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 82px; padding-block: .7rem; }
.floating-offer > div > div { display: flex; gap: 1.4rem; align-items: center; }
.floating-offer p strong, .floating-offer p span { display: block; }
.floating-offer p strong { font-size: 1rem; }
.floating-offer p span { color: #bbcae3; font-size: .7rem; margin-top: .1rem; }
.floating-offer > div > div p strong { color: #ffdc77; font-size: 1.35rem; line-height: 1.2; }
.floating-offer .sale-button { min-height: 45px; padding: .7rem 1.1rem; font-size: .75rem; box-shadow: 0 3px 0 #074d2a; }
.campaign .motion-ready { opacity: 0; transform: translateY(20px); transition: opacity .65s ease, transform .65s ease; }
.campaign .motion-ready.is-visible { opacity: 1; transform: none; }
@keyframes ambient-drift { from { transform: translate3d(0,0,0); } to { transform: translate3d(-90px,70px,0); } }
@media (max-width: 720px) {
  .offer-demo .sale-pitch { padding-top: 0; }
  .campaign-banner > div { gap: .2rem; flex-direction: column; padding-block: .6rem; }
  .campaign-banner p { font-size: .57rem; }
  .campaign-banner a { font-size: .7rem; }
  .campaign-value { grid-template-columns: 1fr; gap: 1.8rem; padding-block: 3.5rem; }
  .floating-offer > div > p { display: none; }
  .floating-offer > div > div { width: 100%; justify-content: space-between; gap: .6rem; }
  .floating-offer > div { min-height: 78px; }
  .campaign .large-price { font-size: 4.6rem; }
  .campaign .final-price-card .large-price { font-size: 5rem; }
}
@media (prefers-reduced-motion: reduce) {
  .campaign *, .campaign *::before, .campaign *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .campaign .motion-ready { opacity: 1; transform: none; }
}
