/**
 * Slimetopia campaign landing page — page-scoped styles.
 * Loads ONLY on the /slimetopia page (see inc/enqueue.php, is_page('slimetopia')).
 * Everything is scoped under body.page-slimetopia so it can never leak site-wide.
 *
 * Base typography, colours and button styling are inherited from theme.json
 * (Fraunces headings, DM Sans body, Tangerine buttons, Cobalt links). This file
 * only adds the landing-specific layout, decorative treatment and imagery.
 *
 * Campaign images are painted as relative-path CSS backgrounds so the page is
 * portable across dev/prod (no absolute URLs frozen into post content).
 * @package einsteinz
 */

body.page-slimetopia{
  --sl-cobalt:#2F6BE0; --sl-cobalt-dark:#2353BE; --sl-cobalt-soft:#E4ECFB;
  --sl-tang:#FF8A3D; --sl-tang-dark:#E86F1F; --sl-tang-soft:#FFE5CF;
  --sl-sun:#FFC23D; --sl-sun-soft:#FFF0C8;
  --sl-ink:#172037; --sl-muted:#586079; --sl-paper:#F7F9FD; --sl-white:#fff;
  --sl-line:#E6E9F1; --sl-ink-soft:#AAB2C8;
  --sl-r-sm:12px; --sl-r-md:18px; --sl-r-lg:26px; --sl-pill:999px;
  --sl-wrap:1180px;
  --sl-shadow:0 10px 30px rgba(23,32,55,.08);
  --sl-shadow-lg:0 20px 50px rgba(23,32,55,.14);
  background:var(--sl-paper);
}
/* blank template main: strip the default content-width constraint */
body.page-slimetopia .slimetopia-main{ max-width:none; }
body.page-slimetopia .slimetopia > *{ margin-block:0; }
body.page-slimetopia{ scroll-behavior:smooth; }

.slimetopia{ overflow-x:hidden; color:var(--sl-ink); }
/* grid items: neutralise WP block-gap margins so only the grid gap spaces them */
.slimetopia .sl-steps > *,
.slimetopia .sl-tiles > *,
.slimetopia .sl-venues > *,
.slimetopia .sl-hero-grid > *{ margin:0; }
.slimetopia #dates{ scroll-margin-top:80px; }
.slimetopia *{ box-sizing:border-box; }
.slimetopia img{ max-width:100%; display:block; }

/* shared layout ------------------------------------------------------------ */
.slimetopia .sl-wrap{ width:100%; max-width:var(--sl-wrap); margin-inline:auto;
  padding-inline:clamp(20px,5vw,30px); }
.slimetopia .sl-section{ padding-block:clamp(56px,8vw,96px); position:relative; }
.slimetopia .sl-section.white{ background:var(--sl-white); }
.slimetopia .sl-eyebrow{ font-weight:700; font-size:13px; letter-spacing:.13em;
  text-transform:uppercase; color:var(--sl-cobalt); display:block; margin-bottom:8px; }
.slimetopia .sl-head{ text-align:center; margin-bottom:clamp(34px,5vw,54px); }
.slimetopia .sl-head h2{ margin:0; }
.slimetopia .sl-head .sl-lead{ max-width:60ch; margin:12px auto 0; color:var(--sl-muted);
  font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem); }

/* buttons: base comes from theme.json. Add secondary + full-width helpers. */
.slimetopia .wp-block-button.is-style-outline .wp-block-button__link,
.slimetopia .sl-btn-secondary .wp-block-button__link{
  background:var(--sl-white); color:var(--sl-cobalt-dark);
  box-shadow:inset 0 0 0 1.5px var(--sl-cobalt-soft); border:0; }
.slimetopia .wp-block-button.is-style-outline .wp-block-button__link:hover,
.slimetopia .sl-btn-secondary .wp-block-button__link:hover{
  background:var(--sl-cobalt-soft); color:var(--sl-cobalt-dark);
  box-shadow:inset 0 0 0 1.5px var(--sl-cobalt); }
.slimetopia .sl-btn-block .wp-block-button__link{ width:100%; text-align:center; }
.slimetopia .wp-block-button__link{ box-shadow:0 8px 20px rgba(255,138,61,.30);
  transition:transform .13s ease, background .15s ease, box-shadow .15s ease; }
.slimetopia .wp-block-button__link:hover{ transform:translateY(-2px); }

/* chips (trust row) -------------------------------------------------------- */
.slimetopia .sl-chips{ list-style:none; padding:0; margin:0; display:flex;
  flex-wrap:wrap; gap:9px; }
.slimetopia .sl-chips li{ font-size:.875rem; font-weight:600; color:var(--sl-ink);
  background:var(--sl-cobalt-soft); padding:7px 14px; border-radius:var(--sl-pill); }
.slimetopia .sl-chips li:nth-child(3n+2){ background:var(--sl-tang-soft); }
.slimetopia .sl-chips li:nth-child(3n+3){ background:var(--sl-sun-soft); }

/* header ------------------------------------------------------------------- */
.slimetopia .sl-topbar{ position:sticky; top:0; z-index:50; background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--sl-line); }
.slimetopia .sl-topbar-in{ max-width:var(--sl-wrap); margin-inline:auto;
  padding:12px clamp(20px,5vw,30px); display:flex; align-items:center;
  justify-content:space-between; gap:16px; }
.slimetopia .sl-lockup{ display:flex; align-items:center; gap:14px; }
.slimetopia .sl-logo-ez{ width:54px; height:66px;
  background:url(../images/logo.png) center/contain no-repeat; }
.slimetopia .sl-logo-x{ color:var(--sl-muted); font-family:Fraunces,serif; font-size:1.05rem; }
.slimetopia .sl-logo-slime{ width:96px; height:38px;
  background:url(../images/slimetopia/logo_slime.png) left center/contain no-repeat; }
.slimetopia .sl-topbar .sl-book{ display:inline-flex; align-items:center; gap:.4em;
  background:var(--sl-tang); color:var(--sl-white); font-weight:600; text-decoration:none;
  padding:.7rem 1.3rem; border-radius:var(--sl-pill); box-shadow:0 8px 20px rgba(255,138,61,.3); }
.slimetopia .sl-topbar .sl-book:hover{ background:var(--sl-tang-dark); }

/* hero --------------------------------------------------------------------- */
.slimetopia .sl-hero{ padding-top:clamp(36px,6vw,64px); padding-bottom:clamp(60px,8vw,110px);
  position:relative; }
.slimetopia .sl-hero-grid{ display:grid; grid-template-columns:1.05fr .95fr;
  gap:clamp(28px,5vw,64px); align-items:center; }
.slimetopia .sl-hero h1{ margin:0; }
.slimetopia .sl-hero .sl-hl{ color:var(--sl-cobalt-dark); position:relative; white-space:nowrap;
  background:linear-gradient(var(--sl-tang),var(--sl-tang)) left bottom/100% .12em no-repeat; }
.slimetopia .sl-hero .sl-lead-emph{ margin:22px 0 0; font-family:Fraunces,serif; font-weight:600;
  font-style:italic; color:var(--sl-ink); font-size:clamp(1.2rem,1rem + .6vw,1.42rem); }
.slimetopia .sl-hero .sl-lead{ margin:6px 0 0; color:var(--sl-muted);
  font-size:clamp(1.05rem,1rem + .4vw,1.2rem); max-width:46ch; }
.slimetopia .sl-hero .wp-block-buttons{ margin-top:28px; }
.slimetopia .sl-hero .sl-chips{ margin-top:26px; }
.slimetopia .sl-cobrand{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-bottom:20px; }
.slimetopia .sl-hero-logo{ height:72px; width:auto; display:block; }
.slimetopia .sl-ig{ display:inline-flex; align-items:center; gap:6px; font-weight:600;
  font-size:.9rem; color:var(--sl-cobalt-dark); text-decoration:none; }
.slimetopia .sl-ig:hover{ color:var(--sl-tang-dark); }
.slimetopia .sl-ig svg{ flex:none; }

.slimetopia .sl-hero-media{ justify-self:center; position:relative; }
.slimetopia .sl-frame{ background:var(--sl-white); padding:12px; border-radius:var(--sl-r-lg);
  box-shadow:var(--sl-shadow-lg); transform:rotate(-2.2deg); position:relative; }
.slimetopia .sl-frame .sl-photo{ width:min(360px,76vw); height:clamp(360px,50vh,460px);
  border-radius:16px; background:#d9f2f0 url(../images/slimetopia/hero.jpg) center/cover no-repeat; }
.slimetopia .sl-sticker{ position:absolute; z-index:3; font-family:Fraunces,serif; font-weight:600;
  font-size:.95rem; background:var(--sl-sun); color:var(--sl-ink); padding:10px 16px;
  border-radius:16px; box-shadow:var(--sl-shadow); transform:rotate(-6deg); white-space:nowrap; }
.slimetopia .sl-sticker.a{ top:-18px; left:-20px; }
.slimetopia .sl-sticker.b{ bottom:-16px; right:-14px; background:var(--sl-tang);
  color:var(--sl-white); transform:rotate(6deg); }

/* curved divider at foot of hero */
.slimetopia .sl-hero::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:70px;
  background:var(--sl-white);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 70' preserveAspectRatio='none'%3E%3Cpath d='M0,70 L0,34 C360,72 1080,72 1440,34 L1440,70 Z' fill='%23000'/%3E%3C/svg%3E") bottom/100% 100% no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 70' preserveAspectRatio='none'%3E%3Cpath d='M0,70 L0,34 C360,72 1080,72 1440,34 L1440,70 Z' fill='%23000'/%3E%3C/svg%3E") bottom/100% 100% no-repeat; }

/* the hour: 3 step cards --------------------------------------------------- */
.slimetopia .sl-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:start; }
.slimetopia .sl-step{ background:var(--sl-white); border:1px solid var(--sl-line);
  border-radius:var(--sl-r-lg); padding:28px 26px 30px; box-shadow:var(--sl-shadow);
  position:relative; transition:transform .16s ease, box-shadow .16s ease; }
.slimetopia .sl-step.s1{ transform:rotate(-1.2deg); }
.slimetopia .sl-step.s3{ transform:rotate(1.2deg); }
.slimetopia .sl-step.s2{ transform:translateY(-16px); border-color:var(--sl-tang-soft);
  box-shadow:var(--sl-shadow-lg); }
.slimetopia .sl-step:hover{ transform:rotate(0) translateY(-6px); box-shadow:var(--sl-shadow-lg); }
.slimetopia .sl-disc{ width:64px; height:64px; border-radius:var(--sl-r-md); display:grid;
  place-items:center; font-size:1.95rem; margin:0 0 16px; background:var(--sl-cobalt-soft); }
.slimetopia .sl-step.s2 .sl-disc{ background:var(--sl-tang-soft); }
.slimetopia .sl-step.s3 .sl-disc{ background:var(--sl-sun-soft); }
.slimetopia .sl-step h3{ margin:0 0 6px; }
.slimetopia .sl-step p{ margin:0; color:var(--sl-muted); font-size:.98rem; }
.slimetopia .sl-time{ position:absolute; top:24px; right:24px; font-weight:700; font-size:.8rem;
  color:var(--sl-cobalt-dark); background:var(--sl-cobalt-soft); padding:5px 12px;
  border-radius:var(--sl-pill); }
.slimetopia .sl-step.s2 .sl-time{ color:var(--sl-tang-dark); background:var(--sl-tang-soft); }

/* why families: 4 tiles ---------------------------------------------------- */
.slimetopia .sl-tiles{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.slimetopia .sl-tile{ text-align:center; background:var(--sl-white); border:1px solid var(--sl-line);
  border-radius:var(--sl-r-lg); padding:28px 18px; box-shadow:var(--sl-shadow); }
.slimetopia .sl-tile .sl-ic{ width:56px; height:56px; border-radius:var(--sl-r-md); display:grid;
  place-items:center; margin:0 auto 12px; font-size:1.7rem; background:var(--sl-cobalt-soft); }
.slimetopia .sl-tile:nth-child(2) .sl-ic{ background:var(--sl-tang-soft); }
.slimetopia .sl-tile:nth-child(3) .sl-ic{ background:var(--sl-sun-soft); }
.slimetopia .sl-tile h3{ margin:0; font-size:1.18rem; }
.slimetopia .sl-support{ text-align:center; margin:30px auto 0; max-width:64ch;
  color:var(--sl-muted); font-size:1.05rem; }
.slimetopia .sl-support strong{ color:var(--sl-ink); }

/* pick your day: 3 venue cards --------------------------------------------- */
.slimetopia .sl-venues{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:stretch; }
.slimetopia .sl-venue{ background:var(--sl-white); border:1px solid var(--sl-line);
  border-radius:var(--sl-r-lg); padding:28px 26px; box-shadow:var(--sl-shadow);
  display:flex; flex-direction:column; gap:14px; height:100%;
  transition:transform .16s ease, box-shadow .16s ease; }
.slimetopia .sl-venue:nth-child(2){ transform:translateY(-14px); }
.slimetopia .sl-venue:hover{ transform:translateY(-6px); box-shadow:var(--sl-shadow-lg); }
.slimetopia .sl-daybadge{ align-self:flex-start; font-weight:700; font-size:.82rem;
  letter-spacing:.02em; color:var(--sl-white); background:var(--sl-cobalt); padding:6px 14px;
  border-radius:var(--sl-pill); margin:0; }
.slimetopia .sl-venue h3{ margin:0; font-size:1.75rem; }
.slimetopia .sl-sessions{ list-style:none; padding:0; margin:0; display:flex;
  flex-direction:column; gap:9px; }
.slimetopia .sl-sessions li{ display:flex; align-items:center; gap:10px; font-weight:600;
  color:var(--sl-ink); font-size:.96rem; background:var(--sl-paper); border:1px solid var(--sl-line);
  border-radius:var(--sl-r-sm); padding:11px 14px; font-variant-numeric:tabular-nums; }
.slimetopia .sl-sessions li::before{ content:""; width:9px; height:9px; border-radius:50%;
  background:var(--sl-tang); flex:none; }
.slimetopia .sl-sessions li:nth-child(2)::before{ background:var(--sl-cobalt); }
.slimetopia .sl-venue .wp-block-buttons{ margin-top:auto; }
.slimetopia .sl-venue .sl-note{ text-align:center; color:var(--sl-muted); font-size:.78rem; margin:0; }

/* pricing ------------------------------------------------------------------ */
.slimetopia .sl-price{ display:grid; grid-template-columns:.92fr 1.08fr; gap:0;
  background:var(--sl-white); border:1px solid var(--sl-line); border-radius:var(--sl-r-lg);
  overflow:hidden; box-shadow:var(--sl-shadow); }
.slimetopia .sl-price-main{ background:linear-gradient(160deg,var(--sl-tang-soft),var(--sl-sun-soft));
  padding:clamp(30px,4vw,44px); position:relative; display:flex; flex-direction:column; justify-content:center; }
.slimetopia .sl-price-main .sl-price-fig{ font-family:Fraunces,serif; font-weight:600; line-height:1;
  margin:0; color:var(--sl-ink); font-size:clamp(3.4rem,7vw,4.6rem); }
.slimetopia .sl-price-main .sl-price-unit{ font-family:Fraunces,serif; font-size:1.2rem;
  color:var(--sl-muted); margin:2px 0 0; }
.slimetopia .sl-price-main p{ margin:12px 0 0; color:var(--sl-muted); max-width:34ch; }
.slimetopia .sl-price-main .sl-price-unit + p{ margin-top:12px; }
.slimetopia .sl-price-main .sl-sticker{ position:absolute; top:18px; right:18px; }
.slimetopia .sl-price-side{ padding:clamp(28px,4vw,42px); }
.slimetopia .sl-price-side h4{ font-family:'DM Sans',sans-serif; font-weight:700; font-size:.82rem;
  letter-spacing:.1em; text-transform:uppercase; color:var(--sl-muted); margin:0 0 14px; }
.slimetopia .sl-price-side h4 + h4{ margin-top:24px; }
.slimetopia .sl-incl{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:12px; }
.slimetopia .sl-incl li{ display:flex; gap:11px; align-items:flex-start; color:var(--sl-ink); font-size:1rem; }
.slimetopia .sl-incl li::before{ content:"✓"; color:var(--sl-tang); font-weight:800; flex:none; }
.slimetopia .sl-addon{ display:flex; justify-content:space-between; align-items:center; gap:12px;
  background:var(--sl-paper); border:1px solid var(--sl-line); border-radius:var(--sl-r-md);
  padding:14px 18px; }
.slimetopia .sl-addon .amt{ font-family:Fraunces,serif; font-weight:600; color:var(--sl-tang-dark);
  font-size:1.1rem; }

/* gallery (scrapbook) ------------------------------------------------------ */
.slimetopia .sl-gallery{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.slimetopia .sl-gallery figure{ margin:0; background:var(--sl-white); padding:10px;
  border-radius:var(--sl-r-md); box-shadow:var(--sl-shadow); position:relative; }
.slimetopia .sl-gallery figure:nth-child(1){ transform:rotate(-2.5deg); }
.slimetopia .sl-gallery figure:nth-child(2){ transform:rotate(2deg); }
.slimetopia .sl-gallery figure:nth-child(3){ transform:rotate(-1.5deg); }
.slimetopia .sl-gallery figure:nth-child(4){ transform:rotate(2.5deg); }
.slimetopia .sl-gallery .sl-shot{ width:100%; aspect-ratio:3/4; border-radius:10px;
  background-size:cover; background-position:center; }
.slimetopia .sl-gallery .sl-shot.teal{ background-image:url(../images/slimetopia/hero.jpg); }
.slimetopia .sl-gallery .sl-shot.pink{ background-image:url(../images/slimetopia/pink.jpg); }
.slimetopia .sl-gallery .sl-shot.drum{ background-image:url(../images/slimetopia/djembe.jpg); }
.slimetopia .sl-gallery .sl-shot.charm{ background-image:url(../images/slimetopia/charm.jpg); }
.slimetopia .sl-tape{ position:absolute; top:-10px; left:50%; width:80px; height:22px;
  transform:translateX(-50%) rotate(-3deg); background:rgba(255,138,61,.42); border-radius:3px; }
.slimetopia .sl-gallery figure:nth-child(even) .sl-tape{ background:rgba(47,107,224,.34);
  transform:translateX(-50%) rotate(3deg); }

/* faq ---------------------------------------------------------------------- */
.slimetopia .sl-faq{ max-width:820px; margin-inline:auto; }
.slimetopia .sl-faq .wp-block-details{ background:var(--sl-white); border:1px solid var(--sl-line);
  border-radius:var(--sl-r-md); padding:2px 22px; box-shadow:var(--sl-shadow); margin-bottom:12px; }
.slimetopia .sl-faq .wp-block-details[open]{ border-color:var(--sl-cobalt-soft); }
.slimetopia .sl-faq summary{ cursor:pointer; padding:18px 0; font-family:Fraunces,serif;
  font-weight:600; font-size:1.12rem; color:var(--sl-ink); list-style:none; }
.slimetopia .sl-faq summary::-webkit-details-marker{ display:none; }
.slimetopia .sl-faq summary::marker{ content:""; }
.slimetopia .sl-faq .wp-block-details p{ color:var(--sl-muted); padding:0 0 20px; margin:0; }

/* final band --------------------------------------------------------------- */
.slimetopia .sl-band{ background:var(--sl-ink); border-radius:var(--sl-r-lg);
  padding:clamp(44px,7vw,74px) clamp(24px,5vw,60px); text-align:center; }
.slimetopia .sl-band h2{ margin:0; color:var(--sl-white); }
.slimetopia .sl-band p.sub{ margin:14px auto 0; color:var(--sl-ink-soft); max-width:52ch; font-size:1.1rem; }
.slimetopia .sl-band .wp-block-buttons{ margin-top:30px; justify-content:center; }
.slimetopia .sl-band .sl-fine{ margin:16px 0 0; color:var(--sl-sun); font-weight:600; font-size:.9rem; }

/* footer ------------------------------------------------------------------- */
.slimetopia .sl-footer{ background:var(--sl-ink); color:var(--sl-ink-soft);
  padding-block:clamp(40px,6vw,60px); }
.slimetopia .sl-foot-grid{ display:flex; flex-wrap:wrap; gap:28px 48px;
  justify-content:space-between; align-items:flex-start; }
.slimetopia .sl-foot-brand{ max-width:320px; }
.slimetopia .sl-foot-lockup{ display:flex; align-items:center; gap:12px; }
.slimetopia .sl-chip{ background:var(--sl-white); border-radius:14px; padding:8px; }
.slimetopia .sl-chip .sl-logo-ez{ width:44px; height:54px; }
.slimetopia .sl-foot-lockup .sl-logo-slime{ width:100px; height:40px; }
.slimetopia .sl-foot-brand p{ margin:14px 0 0; font-size:.92rem; }
.slimetopia .sl-foot-brand p strong{ color:var(--sl-white); }
.slimetopia .sl-foot-tag{ font-family:Fraunces,serif; font-weight:600; font-style:italic;
  color:var(--sl-sun); font-size:1.05rem; }
.slimetopia .sl-foot-col h4{ font-family:Fraunces,serif; color:var(--sl-white); font-size:1rem; margin:0 0 12px; }
.slimetopia .sl-foot-col a, .slimetopia .sl-foot-col p{ color:var(--sl-ink-soft); font-size:.9rem;
  text-decoration:none; display:block; margin:0 0 7px; }
.slimetopia .sl-foot-col a:hover{ color:var(--sl-tang); }
.slimetopia .sl-foot-legal{ margin-top:28px; padding-top:20px;
  border-top:1px solid rgba(255,255,255,.12); font-size:.8rem; color:#7f88a3; }

/* motion ------------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .slimetopia *{ transition:none !important; animation:none !important; }
}

/* responsive --------------------------------------------------------------- */
@media (max-width:900px){
  .slimetopia .sl-hero-grid{ grid-template-columns:1fr; }
  .slimetopia .sl-hero-media{ order:-1; }
  .slimetopia .sl-steps,
  .slimetopia .sl-venues{ grid-template-columns:1fr; }
  .slimetopia .sl-step.s2,
  .slimetopia .sl-venue:nth-child(2){ transform:none; }
  .slimetopia .sl-tiles{ grid-template-columns:repeat(2,1fr); }
  .slimetopia .sl-price{ grid-template-columns:1fr; }
  .slimetopia .sl-gallery{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:520px){
  .slimetopia .sl-logo-slime{ width:80px; }
}