.walju-landing {
  --landing-accent: var(--walju-coral);
  --landing-soft: var(--walju-paper);
  background: var(--walju-cream);
}

.walju-landing--instagram { --landing-accent: #e99072; --landing-soft: #f2e5dc; }
.walju-landing--twitch { --landing-accent: #a98bd7; --landing-soft: #e9e2f0; }
.walju-landing--youtube { --landing-accent: #ff6b62; --landing-soft: #f3e4df; }
.walju-landing--music { --landing-accent: #e0b354; --landing-soft: #f2e6c8; }

.walju-landing .walju-header { position: absolute; }

.walju-landing-header__context {
  margin-left: auto;
  padding: 7px 10px;
  border: 1px solid rgba(248, 246, 239, .34);
  border-radius: 999px;
  color: var(--walju-cream);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.walju-landing-header__link {
  color: var(--walju-cream);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid rgba(248, 246, 239, .55);
  padding-bottom: 3px;
}

.walju-landing-hero {
  min-height: 690px;
  padding: 142px 0 88px;
  background: var(--walju-ink);
  color: var(--walju-cream);
  overflow: hidden;
}

.walju-landing-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
  align-items: center;
  gap: clamp(48px, 8vw, 112px);
}

.walju-landing-hero__eyebrow {
  margin: 0 0 22px;
  color: var(--landing-accent);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.walju-landing-hero h1 {
  max-width: 760px;
  margin: 0;
  font-size: clamp(54px, 7.5vw, 106px);
  font-weight: 750;
  line-height: .91;
  letter-spacing: -.075em;
}

.walju-landing-hero h1 em {
  color: var(--landing-accent);
  font-family: var(--walju-serif);
  font-weight: 400;
}

.walju-landing-hero__intro {
  max-width: 590px;
  margin: 29px 0 32px;
  color: #d7e5d4;
  font-size: 17px;
  line-height: 1.65;
}

.walju-landing .walju-button { background: var(--landing-accent); border-color: var(--landing-accent); }

.walju-landing-hero__card {
  position: relative;
  min-height: 430px;
  padding: 22px;
  background: var(--landing-soft);
  color: var(--walju-ink);
  box-shadow: 14px 14px 0 var(--landing-accent);
  transform: rotate(1.5deg);
}

.walju-landing-hero__card img {
  width: 100%;
  height: 315px;
  display: block;
  object-fit: cover;
  filter: saturate(.9);
}

.walju-landing--instagram .walju-landing-hero__card img { object-position: center 20%; }
.walju-landing--youtube .walju-landing-hero__card img { object-position: center 30%; }

.walju-landing-hero__card p {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin: 19px 0 0;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.walju-landing-links { padding: clamp(74px, 10vw, 120px) 0; background: var(--landing-soft); }

.walju-landing-heading {
  display: grid;
  grid-template-columns: 20% minmax(0, 1fr);
  gap: 7%;
  align-items: start;
  margin-bottom: 48px;
}

.walju-landing-heading h2 {
  max-width: 790px;
  margin: 0;
  font-size: clamp(43px, 5.8vw, 80px);
  line-height: .94;
  letter-spacing: -.07em;
}

.walju-landing-heading h2 em { font-family: var(--walju-serif); font-weight: 400; }

.walju-landing-link-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--walju-line);
  border-left: 1px solid var(--walju-line);
}

.walju-landing-link {
  min-height: 165px;
  padding: 25px;
  border-right: 1px solid var(--walju-line);
  border-bottom: 1px solid var(--walju-line);
  display: grid;
  grid-template-columns: 28px 1fr 24px;
  grid-template-rows: auto 1fr;
  gap: 15px;
  text-decoration: none;
  transition: background var(--walju-transition), color var(--walju-transition), transform var(--walju-transition);
}

.walju-landing-link:hover { background: var(--walju-ink); color: var(--walju-cream); transform: translateY(-3px); }
.walju-landing-link img { width: 23px; height: 23px; }
.walju-landing-link:hover img { filter: brightness(0) invert(1); }
.walju-landing-link strong { font-size: 23px; letter-spacing: -.045em; }
.walju-landing-link > span { font-size: 22px; text-align: right; }
.walju-landing-link small { grid-column: 2 / -1; max-width: 390px; color: #4a685c; font-size: 13px; line-height: 1.55; }
.walju-landing-link:hover small { color: #d7e5d4; }

.walju-landing-feature { padding: clamp(74px, 10vw, 120px) 0; }
.walju-landing-feature__grid { display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: clamp(40px, 7vw, 92px); }
.walju-landing-feature h2 { margin: 28px 0 22px; font-size: clamp(45px, 5.8vw, 78px); line-height: .93; letter-spacing: -.07em; }
.walju-landing-feature h2 em { font-family: var(--walju-serif); font-weight: 400; }
.walju-landing-feature__copy > p:not(.walju-section-label) { max-width: 440px; margin: 0 0 28px; line-height: 1.7; }
.walju-landing-feature__visual { display: block; position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--walju-ink); box-shadow: 12px 12px 0 var(--landing-accent); }
.walju-landing-feature__visual img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform 450ms ease, opacity var(--walju-transition); }
.walju-landing-feature__visual:hover img { transform: scale(1.025); opacity: .87; }
.walju-landing-feature__visual span { position: absolute; right: 18px; bottom: 18px; padding: 9px 12px; background: var(--landing-accent); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }

.walju-landing--youtube .walju-landing-feature__visual { aspect-ratio: 16 / 9; }
.walju-landing--youtube .walju-landing-feature__visual img { object-fit: cover; }

.walju-landing-footer-note { font-size: 11px; color: #c2d9c3; }

/* Embedded playlist players (music landing page). */
.walju-music-hero__player { border-radius: 12px; overflow: hidden; box-shadow: 14px 14px 0 var(--landing-accent); transform: rotate(1.5deg); }
.walju-music-hero__player iframe { display: block; border: 0; }

.walju-music-feature { padding: clamp(56px, 7vw, 84px) 0; background: var(--landing-soft); }
.walju-landing--music .walju-landing-links { padding: clamp(56px, 7vw, 84px) 0; }
.walju-music-feature__grid { display: grid; grid-template-columns: .78fr 1.22fr; align-items: center; gap: clamp(40px, 7vw, 92px); }
.walju-music-feature h2 { margin: 28px 0 22px; font-size: clamp(45px, 5.8vw, 78px); line-height: .93; letter-spacing: -.07em; }
.walju-music-feature h2 em { font-family: var(--walju-serif); font-weight: 400; }
.walju-music-feature__copy > p:not(.walju-section-label) { max-width: 440px; margin: 0 0 28px; line-height: 1.7; }
.walju-music-feature__frame { border-radius: 12px; overflow: hidden; box-shadow: 12px 12px 0 var(--landing-accent); }
.walju-music-feature__frame iframe { display: block; border: 0; }

.walju-music-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.walju-music-card { padding: 22px; background: var(--walju-cream); box-shadow: 8px 8px 0 var(--walju-line); }
.walju-music-card h3 { margin: 0 0 14px; font-size: 20px; letter-spacing: -.04em; }
.walju-music-card iframe { display: block; border: 0; border-radius: 12px; }

.walju-music-follow { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 34px; }

/* Sabrina Carpenter — palette shared by the music-page section and the dedicated page. */
.walju-sabrina,
.walju-landing--sabrina {
  --sabrina-pink: #f2a3c7;
  --sabrina-pink-deep: #b83a70;
  --sabrina-blue: #dfeaf7;
  --sabrina-ink: #2b1f2b;
}

.walju-sabrina {
  padding-bottom: clamp(56px, 7vw, 84px);
  background: var(--sabrina-blue);
  color: var(--sabrina-ink);
}
.walju-sabrina__marquee { overflow: hidden; margin-bottom: clamp(40px, 5vw, 64px); padding: 12px 0; background: var(--sabrina-pink); }
.walju-sabrina__marquee-track { display: flex; width: max-content; animation: walju-sabrina-scroll 30s linear infinite; }
/* Spacing lives in the item margin, not a flex gap, so the duplicated half tiles seamlessly at -50%. */
.walju-sabrina__marquee-track span { margin-right: 20px; font-size: 12px; font-weight: 750; letter-spacing: .16em; text-transform: uppercase; white-space: nowrap; color: var(--sabrina-ink); }
@keyframes walju-sabrina-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.walju-sabrina__grid { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: clamp(36px, 6vw, 78px); }
.walju-sabrina .walju-section-label { color: var(--sabrina-pink-deep); }
.walju-sabrina h2 { margin: 24px 0 20px; font-size: clamp(44px, 5.6vw, 76px); line-height: .93; letter-spacing: -.07em; }
.walju-sabrina h2 em { color: var(--sabrina-pink-deep); font-family: var(--walju-serif); font-weight: 400; }
.walju-sabrina__copy > p:not(.walju-section-label) { max-width: 430px; margin: 0 0 26px; line-height: 1.7; }
.walju-sabrina .walju-text-link { color: var(--sabrina-pink-deep); }
.walju-sabrina__frame { border-radius: 12px; overflow: hidden; box-shadow: 12px 12px 0 var(--sabrina-pink); }
.walju-sabrina__frame iframe { display: block; border: 0; }

@media (prefers-reduced-motion: reduce) {
  .walju-sabrina__marquee-track { animation: none; }
}

/* Dedicated Sabrina Carpenter page — swaps the landing palette to pink on plum. */
.walju-landing--sabrina { --landing-accent: var(--sabrina-pink); --landing-soft: var(--sabrina-blue); }
.walju-landing--sabrina .walju-landing-hero,
.walju-landing--sabrina .walju-footer { background: var(--sabrina-ink); }
.walju-landing--sabrina .walju-landing-hero__intro { color: #e3d3de; }
.walju-landing--sabrina .walju-landing-footer-note { color: #d9c7d4; }
.walju-landing--sabrina .walju-button { color: var(--sabrina-ink); }
/* Standalone strip here, so the next section's own padding provides the spacing. */
.walju-landing--sabrina .walju-sabrina__marquee { margin-bottom: 0; }
.walju-landing--sabrina .walju-landing-links { padding: clamp(56px, 7vw, 84px) 0; color: var(--sabrina-ink); }
.walju-landing--sabrina .walju-section-label,
.walju-landing--sabrina .walju-landing-heading h2 em { color: var(--sabrina-pink-deep); }
.walju-sabrina-note p { max-width: 620px; margin: 0 0 26px; line-height: 1.7; }

@media (max-width: 760px) {
  .walju-landing-header__context { display: none; }
  .walju-landing-header__link { margin-left: auto; }
  .walju-landing-hero { min-height: 0; padding: 108px 0 78px; }
  .walju-landing-hero__grid,
  .walju-landing-heading,
  .walju-landing-feature__grid { display: block; }
  .walju-landing-hero h1 { font-size: clamp(52px, 15vw, 72px); }
  .walju-landing-hero__intro { font-size: 16px; }
  .walju-landing-hero__card { min-height: 0; margin: 58px 7px 12px 0; padding: 15px; box-shadow: 9px 9px 0 var(--landing-accent); }
  .walju-landing-hero__card img { height: min(75vw, 360px); }
  .walju-landing-heading .walju-section-label { margin-bottom: 38px; }
  .walju-landing-heading h2 { font-size: clamp(43px, 12vw, 62px); }
  .walju-landing-link-grid { grid-template-columns: 1fr; }
  .walju-landing-link { min-height: 145px; padding: 21px; }
  .walju-landing-feature__visual { margin-top: 44px; box-shadow: 8px 8px 0 var(--landing-accent); }
  .walju-music-hero__player { box-shadow: 9px 9px 0 var(--landing-accent); }
  .walju-music-feature__grid { display: block; }
  .walju-music-feature__frame { margin-top: 42px; box-shadow: 8px 8px 0 var(--landing-accent); }
  .walju-music-grid { grid-template-columns: 1fr; }
  .walju-sabrina__grid { display: block; }
  .walju-sabrina__frame { margin-top: 38px; box-shadow: 8px 8px 0 var(--sabrina-pink); }
}
