:root {
  color-scheme: light dark;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  min-height: 100vh;
  background:
    radial-gradient(circle at top left, rgba(255, 105, 199, 0.38), transparent 34rem),
    radial-gradient(circle at 80% 10%, rgba(169, 0, 230, 0.28), transparent 30rem),
    radial-gradient(circle at bottom right, rgba(246, 179, 60, 0.32), transparent 32rem),
    var(--wp--preset--color--background);
}

.wp-site-blocks { min-height: 100vh; display: flex; flex-direction: column; }
.site-main { flex: 1; }
.e24-shell { width: min(100% - 2rem, 1120px); margin-inline: auto; }

.e24-header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-block: 1rem; }
.e24-brand { display: inline-flex; align-items: center; gap: .55rem; font-weight: 950; letter-spacing: -0.055em; font-size: clamp(1.35rem, 3vw, 2.1rem); text-decoration: none; color: var(--wp--preset--color--foreground); }
.e24-brand span span { color: var(--wp--preset--color--accent); letter-spacing: -0.03em; }
.e24-mini-mark { display: inline-grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 999px; background: var(--wp--preset--color--primary); color: #050005; border: .25rem solid #050005; font-size: 1.35rem; line-height: 1; box-shadow: 0 .55rem 1.4rem rgba(169, 0, 230, .28); }

.e24-socials, .e24-button-grid { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.e24-socials a, .e24-platform-button a { text-decoration: none; }
.e24-socials a { display: inline-flex; align-items: center; justify-content: center; min-height: 2.6rem; padding: .55rem .95rem; border: 2px solid #050005; border-radius: 999px; background: color-mix(in srgb, var(--wp--preset--color--card), transparent 10%); color: var(--wp--preset--color--foreground); font-weight: 850; line-height: 1; box-shadow: .22rem .22rem 0 #050005; transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease; }
.e24-socials a:hover { transform: translate(-1px, -1px); background: var(--wp--preset--color--accent); box-shadow: .32rem .32rem 0 #050005; }

.e24-hero { padding: clamp(2.5rem, 7vw, 6.25rem) 0 clamp(2rem, 6vw, 4rem); text-align: center; }
.e24-hero-mark { width: clamp(8rem, 22vw, 14rem); height: clamp(8rem, 22vw, 14rem); margin: 0 auto 1.4rem; border-radius: 999px; display: grid; place-items: center; background: var(--wp--preset--color--primary); border: clamp(.7rem, 1.8vw, 1.15rem) solid #050005; box-shadow: 0 1.3rem 0 rgba(5,0,5,.96), 0 2rem 4.5rem rgba(169,0,230,.28); }
.e24-hero-mark span { color: #050005; font-size: clamp(5rem, 15vw, 10rem); line-height: .8; transform: translateY(-.06em); }
.e24-kicker { display: inline-flex; justify-content: center; align-items: center; gap: .45rem; margin: 0 0 1.25rem; padding: .4rem .9rem; border: 2px solid #050005; border-radius: 999px; color: #050005; background: linear-gradient(90deg, var(--wp--preset--color--accent), var(--wp--preset--color--secondary)); font-weight: 950; font-size: .9rem; box-shadow: .25rem .25rem 0 #050005; }
.e24-title { margin: 0; font-size: var(--wp--preset--font-size--x-large); line-height: .9; letter-spacing: -0.085em; text-wrap: balance; }
.e24-title strong { color: var(--wp--preset--color--primary); text-shadow: .035em .035em 0 #050005; }
.e24-lede { max-width: 700px; margin: 1.25rem auto 0; color: var(--wp--preset--color--muted); font-size: clamp(1.08rem, 2vw, 1.35rem); }
.e24-button-grid { justify-content: center; margin: 2.5rem auto 0; max-width: 900px; }
.e24-platform-button a { display: inline-flex; align-items: center; justify-content: center; min-width: min(100%, 15rem); min-height: 4.35rem; padding: 1rem 1.3rem; border-radius: 1.25rem; border: 2px solid #050005; background: var(--wp--preset--color--card); color: var(--wp--preset--color--foreground); font-size: 1.05rem; font-weight: 950; box-shadow: .35rem .35rem 0 #050005; transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease; }
.e24-platform-button a:hover { transform: translate(-2px, -2px); background: color-mix(in srgb, var(--wp--preset--color--secondary), white 72%); box-shadow: .52rem .52rem 0 #050005; }
.e24-primary a { background: linear-gradient(135deg, var(--wp--preset--color--primary), var(--wp--preset--color--secondary) 55%, var(--wp--preset--color--accent)); color: #050005; }
.e24-primary a:hover { background: linear-gradient(135deg, var(--wp--preset--color--accent), var(--wp--preset--color--secondary) 50%, var(--wp--preset--color--primary)); }
.e24-section-card { margin: 0 auto clamp(2rem, 6vw, 5rem); padding: clamp(1.5rem, 4vw, 2.5rem); border: 2px solid #050005; border-radius: 1.5rem; background: color-mix(in srgb, var(--wp--preset--color--card), transparent 5%); box-shadow: .55rem .55rem 0 #050005; }
.e24-section-card h2 { letter-spacing: -0.045em; }
.e24-footer { padding: 2rem 0; color: var(--wp--preset--color--muted); text-align: center; font-size: .95rem; }

@media (max-width: 720px) {
  .e24-header { flex-direction: column; align-items: stretch; }
  .e24-brand { justify-content: center; }
  .e24-socials, .e24-button-grid { display: grid; grid-template-columns: 1fr 1fr; }
  .e24-socials a, .e24-platform-button a { width: 100%; }
}
@media (max-width: 420px) { .e24-socials, .e24-button-grid { grid-template-columns: 1fr; } }

@media (prefers-color-scheme: dark) {
  body {
    --wp--preset--color--background: #09000d;
    --wp--preset--color--foreground: #fff6fd;
    --wp--preset--color--muted: #dbc6e2;
    --wp--preset--color--card: #18051f;
    --wp--preset--color--border: #4a1659;
    --wp--preset--color--primary: #c000ff;
    --wp--preset--color--secondary: #ff78d2;
    --wp--preset--color--accent: #ffc04d;
    background:
      radial-gradient(circle at top left, rgba(255, 105, 199, .32), transparent 34rem),
      radial-gradient(circle at 80% 10%, rgba(192, 0, 255, .38), transparent 30rem),
      radial-gradient(circle at bottom right, rgba(246, 179, 60, .22), transparent 32rem),
      var(--wp--preset--color--background);
  }
  .e24-socials a, .e24-platform-button a, .e24-section-card { box-shadow: .35rem .35rem 0 #000; }
  .e24-socials a:hover, .e24-platform-button a:hover { box-shadow: .52rem .52rem 0 #000; }
  .e24-kicker, .e24-mini-mark, .e24-hero-mark { border-color: #000; }
  .e24-title strong { text-shadow: .035em .035em 0 #000; }
}