/* Scoped copy of motion.css (original design). Generated for the WordPress template. */
@font-face {
  font-family: "Lexend";
  src: url("../assets/fonts/lexend-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

/* Layout remains usable even when motion is disabled or JavaScript is unavailable. */
body.shengang-landing #smooth-content { overflow: clip; }
html.motion-enabled { scroll-behavior: auto; }
/* A native hash/focus scroll must not create a second scroll offset inside Smoother. */
html.motion-enabled body.shengang-landing #smooth-wrapper { overflow: clip !important; }
body.shengang-landing .hero {
  position: relative;
  isolation: isolate;
  height: clamp(640px, 56.25vw, 1080px);
  padding: 0;
  overflow: hidden;
  background: #a8dffb;
}
body.shengang-landing .hero-backdrop { position: absolute; inset: 0; z-index: -1; }
body.shengang-landing .hero-background { width: 100%; height: 100%; object-fit: cover; object-position: center; }
body.shengang-landing .hero-copy { position: absolute; top: 21%; left: 4.5%; width: 43%; max-width: 825px; z-index: 2; }
body.shengang-landing .candidate-intro { display: flex; align-items: center; gap: clamp(22px, 2.5vw, 48px); }
body.shengang-landing .candidate-role {
  position: relative;
  padding: .4em .75em;
  border-radius: .45em;
  background: #ff8b27;
  color: white;
  font-weight: 800;
  font-size: clamp(20px, 1.85vw, 36px);
  letter-spacing: .07em;
  line-height: 1.55;
  transform: rotate(-11deg);
  white-space: nowrap;
}
body.shengang-landing .candidate-role::after {
  content: "";
  position: absolute;
  right: 12%;
  top: 95%;
  width: 1em;
  height: 1.2em;
  background: #ff8b27;
  clip-path: polygon(0 0, 75% 0, 72% 45%, 100% 100%, 40% 73%);
}
body.shengang-landing .candidate-wordmark {
  padding-left: 0;
  font-size: clamp(32px, 3.1vw, 57px);
  font-weight: 900;
  letter-spacing: .035em;
  line-height: 1.25;
  white-space: nowrap;
}
body.shengang-landing .hero-title-art { width: 96%; margin: clamp(34px, 3.2vw, 62px) 0 0 6%; }
body.shengang-landing .hero-tagline {
  width: max-content;
  max-width: 100%;
  margin: 28px 0 0 17%;
  padding: .3em 1.8em;
  background: linear-gradient(90deg, #69bd3e00, #69bd3e 20%, #69bd3e 78%, #69bd3e00);
  color: white;
  font-size: clamp(16px, 1.5vw, 28px);
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.6;
  border-radius: 3px;
  transform: rotate(-5deg);
}
body.shengang-landing .hero-figure {
  position: absolute;
  height: 83%;
  width: auto;
  aspect-ratio: 750 / 890;
  right: 8%;
  bottom: 0;
  z-index: 1;
}
body.shengang-landing .hero-figure img { width: 100%; height: 100%; object-fit: contain; object-position: bottom; }
body.shengang-landing .hero-marquee {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 18px;
  overflow: hidden;
  color: #ffffffa8;
  font-family: "Lexend", sans-serif;
  font-weight: 500;
  font-size: clamp(65px, 8.4vw, 161px);
  line-height: 1.25;
  letter-spacing: -.035em;
  user-select: none;
}
body.shengang-landing .hero-marquee-track { display: flex; width: max-content; }
body.shengang-landing .marquee-group { display: flex; flex-shrink: 0; align-items: center; white-space: nowrap; }
body.shengang-landing .marquee-separator { width: 1.3em; }
/* GSAP animates this highlight independently from the heading. */
body.shengang-landing .section-heading h2 span { background: none; position: relative; isolation: isolate; }
body.shengang-landing .section-heading h2 span::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  top: 66%;
  bottom: 3%;
  background: var(--yellow);
  transform: scaleX(var(--highlight-progress, 1));
  transform-origin: left;
}
html.motion-enabled body.shengang-landing .issue-card,
html.motion-enabled body.shengang-landing .social-link,
html.motion-enabled body.shengang-landing .news-card img { transition-property: box-shadow, background-color, color; }
html.motion-enabled body.shengang-landing .issue-card:hover,
html.motion-enabled body.shengang-landing .social-link:hover { transform: none; }
html.motion-enabled body.shengang-landing .news-card:hover img { transform: none; }
html.motion-enabled body.shengang-landing .policy-card { transition-property: background-color, box-shadow; }

body.shengang-landing .question-mark { object-fit: contain; background: none; border-radius: 0; transform: none; }
body.shengang-landing .social-icon { object-fit: contain; }
body.shengang-landing .journey-path {
  position: absolute;
  z-index: 2;
  left: 0;
  top: calc(100% - clamp(145px, 13.55vw, 260px));
  width: 100%;
  max-width: none;
  height: auto;
  pointer-events: none;
  overflow: visible;
}
body.shengang-landing .policy-watermark {
  position: absolute;
  top: 220px;
  left: -4%;
  white-space: nowrap;
  font: 600 clamp(100px, 14.5vw, 278px)/1.2 "Lexend", sans-serif;
  letter-spacing: -.05em;
  color: transparent;
  -webkit-text-stroke: 1px #d4e6f380;
  pointer-events: none;
}
body.shengang-landing .motion-shard {
  position: absolute;
  z-index: 1;
  width: clamp(150px, 18vw, 340px);
  height: clamp(45px, 6vw, 110px);
  pointer-events: none;
  filter: blur(6px);
}
body.shengang-landing .motion-shard::before { content: ""; display: block; width: 100%; height: 100%; clip-path: polygon(0 45%, 100% 0, 80% 100%); }
body.shengang-landing .shard-green::before { background: linear-gradient(110deg, #288de000 5%, #b7e736 54%, #289edf); }
body.shengang-landing .shard-coral::before { background: linear-gradient(110deg, #fa684200 5%, #fa6842 55%, #ffa43a); }
body.shengang-landing .challenges .motion-shard { right: -8%; top: 32%; transform: rotate(-25deg); }
body.shengang-landing .issues .motion-shard { right: -6%; bottom: -12px; transform: rotate(35deg); }
body.shengang-landing .policies .motion-shard { left: -10%; top: 37%; transform: rotate(-30deg); }

@media (min-width: 1921px) {
  body.shengang-landing .hero-copy { left: max(4.5%, calc((100% - 1748px) / 2)); }
  body.shengang-landing .hero-figure { right: max(8%, calc((100% - 1613px) / 2)); }
}
@media (max-width: 1200px) and (min-width: 701px) {
  body.shengang-landing .hero-copy { top: 24%; left: 5%; width: 45%; }
  body.shengang-landing .candidate-intro { gap: 20px; }
  body.shengang-landing .candidate-role { font-size: clamp(14px, 1.65vw, 20px); }
  body.shengang-landing .candidate-wordmark { font-size: 29px; padding-left: 0; }
  body.shengang-landing .hero-title-art { margin-top: 36px; }
  body.shengang-landing .hero-tagline { font-size: 15px; padding-inline: 1em; margin-left: 8%; }
  body.shengang-landing .hero-figure { height: 77%; right: 2%; }
}
@media (max-width: 700px) {
  body.shengang-landing .hero { height: 790px; }
  body.shengang-landing .hero-background { object-position: 42% center; }
  body.shengang-landing .hero-copy { top: 122px; left: 7%; width: 86%; max-width: 460px; }
  body.shengang-landing .candidate-intro { gap: 18px; }
  body.shengang-landing .candidate-role { font-size: 14px; letter-spacing: .02em; }
  body.shengang-landing .candidate-wordmark { font-size: 27px; padding-left: 0; }
  body.shengang-landing .hero-title-art { width: 90%; margin: 40px 0 0 0; }
  body.shengang-landing .hero-tagline { margin: 22px 0 0 2%; font-size: 14px; padding: .3em 1.2em; letter-spacing: .02em; }
  body.shengang-landing .hero-figure { height: 47%; right: 0; bottom: 0; }
  body.shengang-landing .hero-marquee { font-size: 56px; bottom: 18px; }
  body.shengang-landing .action { overflow: visible; padding-bottom: 100px; }
  body.shengang-landing .journey-path { width: 150%; left: -25%; top: calc(100% - 95px); }
  body.shengang-landing .policy-watermark { top: 290px; font-size: 100px; }
  body.shengang-landing .motion-shard { filter: blur(4px); opacity: .7; }
}
@media (max-width: 380px) {
  body.shengang-landing .hero { height: 725px; }
  body.shengang-landing .candidate-role { font-size: 12px; }
  body.shengang-landing .candidate-wordmark { font-size: 24px; padding-left: 0; }
  body.shengang-landing .candidate-intro { gap: 13px; }
  body.shengang-landing .hero-tagline { font-size: 12px; }
  body.shengang-landing .hero-figure { height: 45%; right: -5%; }
  body.shengang-landing .hero-marquee { font-size: 46px; }
}
@media (prefers-reduced-motion: reduce) {
  body.shengang-landing .hero-marquee { font-size: clamp(20px, 3vw, 46px); padding: 0 7%; bottom: 22px; }
  body.shengang-landing .hero-marquee-track { width: auto; }
  body.shengang-landing .marquee-group { white-space: normal; line-height: 1.4; }
  body.shengang-landing .marquee-group + .marquee-group, body.shengang-landing .marquee-separator { display: none; }
}