:root {
    --purple: #46227a;
    --purple-deep: #301a54;
    --sky: #00b7f3;
    --leaf: #4f9d3f;
    --leaf-dark: #3f7f32;
    --oat: #f6f1e6;
    --oat-deep: #ede4d1;
    --cream: #fffdf8;
    --ink: #2a2823;
    --ink-soft: #55524a;
    --font-head: "Baloo 2", "Trebuchet MS", sans-serif;
    --font-script: "Caveat", cursive;
    --font-body: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  }

  @import url("https://fonts.googleapis.com/css2?family=Baloo+2:wght@600;700;800&amp;family=Caveat:wght@600;700&amp;family=Nunito+Sans:wght@400;600;700;800&amp;display=swap");

  .shpp-page * { box-sizing: border-box; }

  .shpp-page {
    font-family: var(--font-body);
    color: var(--ink);
    background: var(--cream);
    line-height: 1.6;
  }

  .shpp-page img { max-width: 100%; display: block; }

  .shpp-page h1,
  .shpp-page h2 {
    font-family: var(--font-head);
    color: var(--purple);
    margin: 0 0 0.5em;
  }

  .shpp-page section {
    padding: 4.5rem 1.5rem;
  }

  .shpp-page .shpp-inner {
    max-width: 1080px;
    margin: 0 auto;
  }

  /* ---------- Masthead ---------- */
  .shpp-masthead {
    background: var(--cream);
    text-align: center;
    padding: 1.25rem 1.5rem;
  }

  .shpp-masthead img {
    display: inline-block;
    max-height: 100px;
    width: auto;
    border-radius: 14px;
  }

  /* ---------- 1. Hero ---------- */
  .shpp-hero {
    position: relative;
    min-height: 92vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2rem 1.5rem;
    background-image:
      linear-gradient(rgba(37, 19, 65, 0.74), rgba(37, 19, 65, 0.74)),
      url("https://seymourheights.wpenginepowered.com/wp-content/uploads/2014/05/Home-page-slider-kids-in-bushes.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  .shpp-hero-content {
    max-width: 720px;
    color: #fff;
  }

  .shpp-hero h1 {
    color: #fff;
    font-size: clamp(2.2rem, 5vw, 3.6rem);
    font-weight: 600;
    line-height: 1.15;
    text-shadow: 0 2px 12px rgba(0,0,0,0.25);
  }

  .shpp-hero p {
    font-size: clamp(1.05rem, 2vw, 1.3rem);
    font-weight: 400;
    color: #f6f1e6;
    max-width: 560px;
    margin: 0 auto;
    text-shadow: 0 1px 8px rgba(0,0,0,0.45);
  }

  /* ---------- Section shared styles ---------- */
  .shpp-program {
    background: var(--oat);
  }

  .shpp-participation {
    background: var(--cream);
  }

  .shpp-section-head {
    text-align: center;
    max-width: 700px;
    margin: 0 auto 2.75rem;
  }

  .shpp-section-head h2 {
    font-size: clamp(1.8rem, 3.5vw, 2.5rem);
    font-weight: 600;
  }

  .shpp-section-head p {
    font-size: 1.1rem;
    color: var(--ink-soft);
  }

  /* ---------- Photo galleries ---------- */
  .shpp-gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
  }

  .shpp-gallery figure {
    margin: 0;
    overflow: hidden;
    border-radius: 10px;
    aspect-ratio: 4 / 3;
    background: var(--oat-deep);
  }

  .shpp-gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
  }

  .shpp-gallery figure:hover img {
    transform: scale(1.05);
  }

  /* ---------- Pull quote ---------- */
  .shpp-quote {
    max-width: 620px;
    margin: 2.75rem auto 0;
    text-align: center;
    font-family: var(--font-script);
    font-weight: 700;
    font-size: 1.6rem;
    color: var(--purple);
    line-height: 1.4;
  }

  .shpp-quote cite {
    display: block;
    margin-top: 0.6rem;
    font-family: var(--font-body);
    font-style: normal;
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--ink-soft);
  }

  /* ---------- 4. Waitlist ---------- */
  .shpp-waitlist {
    background: var(--purple);
    color: #fff;
    text-align: center;
  }

  .shpp-waitlist h2 {
    color: #fff;
    font-size: clamp(1.8rem, 3.5vw, 2.5rem);
  }

  .shpp-waitlist p {
    color: #e6def2;
    max-width: 520px;
    margin: 0 auto 2rem;
    font-size: 1.05rem;
  }

  .shpp-btn {
    display: inline-block;
    background: var(--leaf);
    color: #fff;
    font-family: var(--font-body);
    font-weight: 800;
    font-size: 1.1rem;
    text-decoration: none;
    padding: 1rem 2.5rem;
    border-radius: 999px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.25);
    transition: transform 0.15s ease, background 0.15s ease;
  }

  .shpp-btn:hover {
    background: var(--leaf-dark);
    transform: translateY(-2px);
  }

  /* ---------- 5. Instagram / community gallery ---------- */
  .shpp-instagram {
    background: var(--oat);
    text-align: center;
  }

  .shpp-instagram h2 {
    font-size: clamp(1.6rem, 3vw, 2.2rem);
  }

  .shpp-instagram p {
    color: var(--ink-soft);
    margin-bottom: 2rem;
  }

  .shpp-instagram a.shpp-ig-link {
    color: var(--sky);
    font-weight: 700;
    text-decoration: underline;
  }

  /* ---------- Footer ---------- */
  .shpp-footer {
    background: var(--purple-deep);
    color: #d6c9ea;
    text-align: center;
    padding: 2rem 1.5rem;
    font-size: 0.9rem;
  }

  /* ---------- Responsive ---------- */
  @media (max-width: 800px) {
    .shpp-gallery {
      grid-template-columns: repeat(2, 1fr);
    }
  }

  @media (max-width: 520px) {
    .shpp-page section { padding: 3rem 1.25rem; }
    .shpp-gallery { grid-template-columns: 1fr 1fr; gap: 0.75rem; }
    .shpp-hero { min-height: 80vh; }
  }
  
  /* ---------- Landing page: hide site header/nav on this page only ---------- */
  body.page-id-1162 #main {
      display: none !important;
  }

/* ---------- Landing page: full-bleed, no boxed container ---------- */
body.page-id-1162 #main-area .container,
body.page-id-1162 #content_area {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}