/* CSS RESET & CUSTOM PROPERTIES */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: 'Pliant', sans-serif;
        }

        :root {
            --primary-blue: #4382DF;
            --forest-teal: #428475;
            --soft-sky: #AACCD6;
            --playful-pink: #FF97D0;
            --white: #FFFFFF;
            --warm-bg: #F8FAFC;
            --dark-text: #111111;
            --light-text: #4A5568;
            --subtle-border: rgba(67, 130, 223, 0.1);
        }

        body {
            background-color: var(--warm-bg);
            color: var(--dark-text);
            overflow-x: hidden;
            line-height: 1.7;
        }

        /* SCANNABILITY & HELPER CLASSES */
        .container {
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 2.5rem;
        }

        .btn {
            display: inline-block;
            padding: 0.9rem 2.2rem;
            border-radius: 50px;
            font-weight: 700;
            text-decoration: none;
            transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
            cursor: pointer;
            border: none;
            font-size: 0.95rem;
            text-align: center;
        }

        .btn-blue {
            background-color: var(--primary-blue);
            color: var(--white);
        }

        .btn-blue:hover {
            transform: translateY(-3px);
            box-shadow: 0 12px 24px rgba(67, 130, 223, 0.3);
        }

        .btn-outline {
            background-color: transparent;
            border: 2px solid var(--white);
            color: var(--white);
        }

        .btn-outline:hover {
            background-color: var(--white);
            color: var(--primary-blue);
            transform: translateY(-3px);
        }

        /* FLOATING NAVIGATION & MOBILE DIRECTORY */
        header {
            position: fixed;
            top: 20px;
            left: 50%;
            transform: translateX(-50%);
            width: 90%;
            height:80px;
            max-width: 1320px;
            background-color: rgba(255, 255, 255, 0.97);
            backdrop-filter: blur(10px);
            border-bottom: 1px solid var(--subtle-border);
            border-radius: 100px;
            padding: 0.75rem 2rem;
            display: flex;
            justify-content: space-between;
            align-items: center;
            z-index: 1000;
            box-shadow: 0 8px 30px rgba(0, 0, 0, 0.04);
        }

.logo{
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    text-decoration:none;
    transition:transform .3s ease;
}

.logo img{
    height:152px;
    width:auto;
    display:block;
    object-fit:contain;
}

.logo:hover{
    transform:scale(1.04);
}
        .nav-links {
            display: flex;
            gap: 2rem;
            list-style: none;
        }

        .nav-links a {
            text-decoration: none;
            color: var(--dark-text);
            font-weight: 600;
            font-size: 0.95rem;
            transition: color 0.3s;
            cursor: pointer;
        }

        .nav-links a:hover, .nav-links a.active {
            color: var(--primary-blue);
        }

        .hamburger {
            display: none;
            flex-direction: column;
            justify-content: space-between;
            width: 24px;
            height: 18px;
            background: transparent;
            border: none;
            cursor: pointer;
            z-index: 1010;
        }

        .hamburger span {
            width: 100%;
            height: 3px;
            background-color: var(--dark-text);
            border-radius: 2px;
            transition: all 0.3s ease;
        }

        /* MULTIPAGE CONTROLLER ROUTER */
        .page-view {
            display: none;
        }

        .page-view.active-view {
            display: block;
            animation: fadeIn 0.5s ease forwards;
        }

        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }

        /* GEOMETRIC TRANSITIONS */
        .wave-curve {
            position: relative;
            background: var(--primary-blue);
            height: 60px;
            width: 100%;
            margin-top: -1px;
        }

        .wave-curve svg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            fill: var(--white);
        }

        /* SECTION 01 — HERO STORYBOOK */
        .hero {
            height: 100vh;
            display: flex;
            background-color: var(--primary-blue);
            color: var(--white);
            position: relative;
            overflow: hidden;
        }

        .hero-left {
            flex: 1.1;
            display: flex;
            flex-direction: column;
            justify-content: center;
            padding-left: 6rem;
            padding-right: 2rem;
        }

        .hero-left h1 {
            font-size: 5.5rem;
            line-height: 1.1;
            font-weight: 900;
            margin-bottom: 1.5rem;
        }

        .hero-left p {
            font-size: 1.2rem;
            max-width: 480px;
            margin-bottom: 2.5rem;
            opacity: 0.9;
        }

        .hero-buttons {
            display: flex;
            gap: 1.5rem;
        }

        .hero-right {
            flex: 0.9;
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .collage {
            position: relative;
            width: 85%;
            height: 75%;
        }

        .collage-img {
            position: absolute;
            border-radius: 24px;
            box-shadow: 0 20px 40px rgba(0,0,0,0.15);
            object-fit: cover;
            transition: transform 0.4s ease;
        }

        .collage-img:hover {
            transform: scale(1.05) z-index: 10;
        }

        .img-run { width: 55%; height: 50%; top: 5%; left: 0; transform: rotate(-2deg); }
        .img-jump { width: 50%; height: 45%; top: 15%; right: 0; transform: rotate(3deg); }
        .img-dance { width: 48%; height: 42%; bottom: 5%; left: 10%; transform: rotate(1deg); }
        .img-play { width: 45%; height: 38%; bottom: 10%; right: 5%; transform: rotate(-3deg); }

        /* SECTION 02 — WHY MOVEMENT MATTERS */
        .why-movement {
            padding: 8rem 0;
            background-color: var(--white);
        }

        .editorial-row {
            display: grid;
            grid-template-columns: 1fr 2fr;
            gap: 4rem;
            margin-bottom: 6rem;
        }

        .editorial-row h2 {
            font-size: 1.2rem;
            color: var(--primary-blue);
            text-transform: uppercase;
            letter-spacing: 2px;
        }

        .editorial-row p {
            font-size: 2.2rem;
            line-height: 1.4;
            font-weight: 700;
        }

        .oversized-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 2rem;
        }

        .oversized-card {
            background: var(--warm-bg);
            border-radius: 32px;
            padding: 2rem;
            transition: all 0.4s ease;
        }

        .oversized-card:hover {
            transform: translateY(-10px);
            background: var(--white);
            box-shadow: 0 30px 60px rgba(0,0,0,0.05);
        }

        .card-frame {
            height: 180px;
            border-radius: 16px;
            margin-bottom: 1.5rem;
            overflow: hidden;
        }

        .card-frame img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .oversized-card h3 {
            font-size: 1.5rem;
            margin-bottom: 0.75rem;
        }

        .oversized-card p {
            color: var(--light-text);
            font-size: 0.95rem;
        }

        /* SECTION 03 — ACTIVITY EXPLORER */
        .activity-explorer {
            padding: 8rem 0;
            background-color: var(--soft-sky);
        }

        .section-title-center {
            font-size: 3.5rem;
            font-weight: 900;
            margin-bottom: 4rem;
            text-align: center;
        }

        .explorer-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 2.5rem;
        }

        .explorer-card {
            background: var(--white);
            border-radius: 24px;
            overflow: hidden;
            box-shadow: 0 15px 35px rgba(0,0,0,0.02);
            transition: transform 0.3s;
        }

        .explorer-card:hover {
            transform: translateY(-5px);
        }

        .explorer-card img {
            width: 100%;
            height: 240px;
            object-fit: cover;
        }

        .explorer-body {
            padding: 2rem;
        }

        .explorer-body h3 {
            font-size: 1.6rem;
            margin-bottom: 0.5rem;
        }

        .explorer-meta {
            color: var(--primary-blue);
            font-weight: 700;
            margin-top: 1rem;
            font-size: 0.9rem;
        }

        /* SECTION 04 — FULL IMAGE CHAPTER (PARALLAX EFFECT) */
        .parallax-chapter {
            height: 65vh;
            background: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)), url('https://i.pinimg.com/736x/77/36/8b/77368b27378fa333712d18b22c28835c.jpg') center/cover no-repeat fixed;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--white);
            text-align: center;
        }

        .parallax-chapter h2 {
            font-size: 4rem;
            font-weight: 900;
        }

        /* SECTION 05 — MOVEMENT JOURNEYS */
        .movement-journeys {
            padding: 8rem 0;
            background: var(--white);
        }

        .magazine-timeline {
            max-width: 900px;
            margin: 0 auto;
            position: relative;
        }

        .journey-stage {
            display: flex;
            margin-bottom: 4rem;
            position: relative;
        }

        .stage-num {
            font-size: 3.5rem;
            font-weight: 900;
            color: var(--soft-sky);
            width: 80px;
            flex-shrink: 0;
            line-height: 1;
        }

        .stage-content {
            background: var(--warm-bg);
            padding: 2.5rem;
            border-radius: 24px;
            width: 100%;
        }

        .stage-content h3 {
            font-size: 1.8rem;
            margin-bottom: 0.75rem;
        }

        /* SECTION 06 — FEATURED ACTIVITY WALL */
        .activity-wall {
            padding: 8rem 0;
            background-color: var(--playful-pink);
            color: var(--dark-text);
        }

        .asymmetrical-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 2rem;
        }

        .wall-item {
            background: var(--white);
            border-radius: 28px;
            overflow: hidden;
            padding: 1.5rem;
        }

        .wall-item img {
            width: 100%;
            height: 200px;
            object-fit: cover;
            border-radius: 16px;
            margin-bottom: 1.5rem;
        }

        .wall-item h3 {
            font-size: 1.4rem;
            margin-bottom: 0.5rem;
        }

        .w-large {
            grid-column: span 2;
        }

        /* SECTION 07 — PARENTS JOURNAL */
        .parents-journal {
            padding: 8rem 0;
            background: var(--white);
        }

        .journal-split {
            display: grid;
            grid-template-columns: 1.2fr 1fr;
            gap: 4rem;
        }

        .journal-main-card img {
            width: 100%;
            height: 380px;
            object-fit: cover;
            border-radius: 24px;
            margin-bottom: 1.5rem;
        }

        .journal-main-card h3 {
            font-size: 2rem;
            margin-bottom: 1rem;
        }

        .journal-list {
            display: flex;
            flex-direction: column;
            gap: 2rem;
        }

        .journal-item {
            display: flex;
            gap: 1.5rem;
            align-items: center;
        }

        .journal-item img {
            width: 120px;
            height: 120px;
            object-fit: cover;
            border-radius: 16px;
        }

        .journal-item h4 {
            font-size: 1.2rem;
            margin-bottom: 0.25rem;
        }

        /* SECTION 08 — SUCCESS STORIES */
        .success-stories {
            padding: 8rem 0;
            background-color: var(--forest-teal);
            color: var(--white);
        }

        .stories-container {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            align-items: center;
        }

        .stories-container img {
            width: 100%;
            height: 480px;
            object-fit: cover;
            border-radius: 32px;
        }

        .stories-text blockquote {
            font-size: 2rem;
            line-height: 1.4;
            font-style: italic;
            margin-bottom: 2rem;
        }

        /* SECTION 09 — ACTIVITY GALLERY */
        .activity-gallery {
            padding: 8rem 0;
            background: var(--white);
        }

        .masonry-layout {
            columns: 3 300px;
            column-gap: 2rem;
        }

        .masonry-brick {
            background: var(--warm-bg);
            margin-bottom: 2rem;
            break-inside: avoid;
            border-radius: 20px;
            overflow: hidden;
            padding: 1rem;
        }

        .masonry-brick img {
            width: 100%;
            border-radius: 12px;
            margin-bottom: 1rem;
        }

        /* SECTION 10 — FINAL CALL TO ACTION */
        .final-cta {
            padding: 10rem 0;
            background-color: var(--primary-blue);
            color: var(--white);
            text-align: center;
        }

        .final-cta h2 {
            font-size: 5rem;
            font-weight: 900;
            margin-bottom: 1.5rem;
        }

        .final-cta p {
            max-width: 600px;
            margin: 0 auto 3rem auto;
            font-size: 1.2rem;
        }

        /* INTERIOR PAGES COMMON STYLING */
        .interior-hero {
            padding: 12rem 0 6rem 0;
            background: var(--warm-bg);
            text-align: center;
        }

        .interior-hero h1 {
            font-size: 4.5rem;
            font-weight: 900;
            margin-bottom: 1rem;
        }

        .interior-hero p {
            font-size: 1.3rem;
            color: var(--light-text);
            max-width: 700px;
            margin: 0 auto;
        }

        .interior-body {
            padding: 6rem 0;
            background: var(--white);
        }

        .editorial-article-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
        }

        .article-card h2 {
            font-size: 2.2rem;
            margin: 1.5rem 0 1rem 0;
        }

        .article-card img {
            width: 100%;
            height: 320px;
            object-fit: cover;
            border-radius: 24px;
        }

        .meta-specs {
            background: var(--warm-bg);
            padding: 1rem 1.5rem;
            border-radius: 12px;
            margin-top: 1.5rem;
            font-size: 0.95rem;
        }

        /* CONTACT FORM STYLE */
        .contact-split {
            display: grid;
            grid-template-columns: 1fr 1fr;
            background: var(--white);
            border-radius: 32px;
            overflow: hidden;
            box-shadow: 0 30px 60px rgba(0,0,0,0.03);
        }

        .contact-split img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .contact-form-side {
            padding: 4rem;
        }

        .form-row {
            margin-bottom: 2rem;
        }

        .form-row label {
            display: block;
            font-weight: 700;
            margin-bottom: 0.5rem;
        }

        .form-row input, .form-row textarea {
            width: 100%;
            padding: 1rem 1.5rem;
            border: 2px solid #E2E8F0;
            border-radius: 14px;
            font-size: 1rem;
            outline: none;
            transition: border-color 0.3s;
        }

        .form-row input:focus, .form-row textarea:focus {
            border-color: var(--primary-blue);
        }

        /* LEGAL COMPLIANCE STYLING */
        .legal-wrapper {
            max-width: 800px;
            margin: 0 auto;
        }

        .legal-wrapper h2 {
            font-size: 1.8rem;
            margin: 2rem 0 1rem 0;
        }

        .legal-wrapper p {
            margin-bottom: 1.5rem;
            color: var(--light-text);
        }

        /* FOOTER BRAND ARCHITECTURE */
        footer {
            background-color: var(--forest-teal);
            color: var(--white);
            padding: 6rem 0 3rem 0;
        }

        .footer-grid {
            display: grid;
            grid-template-columns: 2fr repeat(3, 1fr) 2fr;
            gap: 4rem;
            border-bottom: 1px solid rgba(255,255,255,0.1);
            padding-bottom: 4rem;
            margin-bottom: 2.5rem;
        }

        .footer-brand h2 {
            font-size: 2rem;
            font-weight: 900;
            margin-bottom: 0.5rem;
        }

        .footer-links h4 {
            font-size: 1.1rem;
            margin-bottom: 1.5rem;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        .footer-links ul {
            list-style: none;
            display: flex;
            flex-direction: column;
            gap: 0.75rem;
        }

        .footer-links a {
            color: rgba(255,255,255,0.8);
            text-decoration: none;
            transition: color 0.3s;
            cursor: pointer;
        }

        .footer-links a:hover {
            color: var(--white);
        }

        .newsletter-box input {
            width: 100%;
            padding: 0.9rem 1.2rem;
            border-radius: 30px;
            border: none;
            outline: none;
            margin-bottom: 1rem;
        }

        .footer-bottom {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 0.95rem;
            color: rgba(255,255,255,0.6);
        }

        .footer-socials {
            display: flex;
            gap: 1.5rem;
        }

        .footer-socials a {
            color: var(--white);
            text-decoration: none;
        }

        /* RESPONSIVE SYSTEM AND MOBILE OVERRIDES */
        @media (max-width: 1100px) {
            .hero-left h1 { font-size: 4rem; }
            .oversized-grid { grid-template-columns: repeat(2, 1fr); }
            .explorer-grid { grid-template-columns: repeat(2, 1fr); }
            .asymmetrical-grid { grid-template-columns: repeat(2, 1fr); }
            .footer-grid { grid-template-columns: repeat(3, 1fr); }
        }

        @media (max-width: 768px) {
            header {
                padding: 0.75rem 1.5rem;
            }

            .nav-links {
                position: absolute;
                top: 100%;
                left: 0;
                right: 0;
                background: var(--white);
                flex-direction: column;
                align-items: center;
                padding: 2rem;
                box-shadow: 0 15px 30px rgba(0,0,0,0.1);
                border-radius: 24px;
                margin-top: 10px;
                display: none;
            }

            header.nav-active .nav-links {
                display: flex;
            }

            .hamburger {
                display: flex;
            }

            header.nav-active .hamburger span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
            header.nav-active .hamburger span:nth-child(2) { opacity: 0; }
            header.nav-active .hamburger span:nth-child(3) { transform: rotate(-45deg) translate(5px, -6px); }

            .hero { flex-direction: column; height: auto; }
            .hero-left { padding: 10rem 1.5rem 4rem 1.5rem; text-align: center; align-items: center; }
            .hero-right { height: 400px; }
            .editorial-row { grid-template-columns: 1fr; gap: 1rem; }
            .editorial-row p { font-size: 1.6rem; }
            .oversized-grid, .explorer-grid, .asymmetrical-grid, .journal-split, .stories-container, .editorial-article-grid, .contact-split { grid-template-columns: 1fr; }
            .w-large { grid-column: span 1; }
            .footer-grid { grid-template-columns: 1fr; gap: 2rem; }
            .footer-bottom { flex-direction: column; gap: 1.5rem; text-align: center; }
            .interior-hero h1 { font-size: 3rem; }
            .final-cta h2 { font-size: 3.2rem; }
            .contact-form-side { padding: 2rem; }
        }

        /* ===== ACTIVITIES PAGE ===== */

.interior-hero {
padding: 120px 0;
text-align: center;
position: relative;
overflow: hidden;
}

.interior-hero::before {
content: "";
position: absolute;
inset: 0;
background:
radial-gradient(circle at 20% 20%, rgba(255,255,255,.7), transparent 40%),
radial-gradient(circle at 80% 30%, rgba(170,204,214,.5), transparent 40%);
}

.interior-hero h1 {
font-size: clamp(3rem, 7vw, 5.5rem);
margin-bottom: 20px;
line-height: .95;
}

.interior-hero p {
max-width: 720px;
margin: auto;
font-size: 1.1rem;
opacity: .75;
}

/* SECTION HEADER */

.section-heading {
text-align: center;
max-width: 850px;
margin: 0 auto 80px;
}

.section-heading h2 {
font-size: 2.8rem;
margin-bottom: 15px;
}

.section-heading p {
line-height: 1.8;
opacity: .75;
}

/* ARTICLE GRID */

.editorial-article-grid {
display: grid;
grid-template-columns: repeat(auto-fit,minmax(320px,1fr));
gap: 32px;
margin-bottom: 120px;
}

/* CARD */

.article-card {
background: white;
border-radius: 32px;
overflow: hidden;
transition: .4s ease;
box-shadow: 0 15px 40px rgba(0,0,0,.08);
position: relative;
}

.article-card:hover {
transform: translateY(-10px);
box-shadow: 0 30px 60px rgba(0,0,0,.12);
}

.article-card img {
width: 100%;
height: 260px;
object-fit: cover;
}

.article-card h2 {
font-size: 1.6rem;
padding: 28px 28px 10px;
line-height: 1.2;
}

.article-card p {
padding: 0 28px;
line-height: 1.8;
opacity: .75;
}

.meta-specs {
margin: 24px 28px 28px;
padding: 12px 18px;
border-radius: 999px;
display: inline-block;
background: #f4f7fa;
font-size: .82rem;
letter-spacing: .08em;
text-transform: uppercase;
font-weight: 600;
}

/* FEATURE SECTION */

.editorial-feature {
margin: 120px 0;
padding: 80px;
border-radius: 40px;
background:
linear-gradient(
135deg,
rgba(170,204,214,.25),
rgba(255,151,208,.15)
);
}

.feature-copy {
max-width: 850px;
}

.feature-copy h2 {
font-size: 3rem;
margin-bottom: 25px;
}

.feature-copy p {
font-size: 1.05rem;
line-height: 1.9;
margin-bottom: 20px;
opacity: .8;
}

/* JOURNAL */

.activity-journal {
margin: 120px 0;
}

.activity-journal h2 {
text-align: center;
font-size: 3rem;
margin-bottom: 60px;
}

.journal-grid {
display: grid;
grid-template-columns: repeat(auto-fit,minmax(260px,1fr));
gap: 24px;
}

.journal-entry {
background: white;
padding: 40px;
border-radius: 28px;
box-shadow: 0 12px 30px rgba(0,0,0,.06);
transition: .3s;
}

.journal-entry:hover {
transform: translateY(-6px);
}

.journal-entry h3 {
font-size: 1.4rem;
margin-bottom: 15px;
}

.journal-entry p {
line-height: 1.8;
opacity: .75;
}

/* QUOTE */

.editorial-quote {
margin: 120px auto;
max-width: 950px;
text-align: center;
}

.editorial-quote blockquote {
font-size: clamp(2rem,4vw,3.8rem);
line-height: 1.3;
font-style: italic;
color: #428475;
position: relative;
}

.editorial-quote blockquote::before {
content: "❝";
display: block;
font-size: 5rem;
opacity: .2;
margin-bottom: 10px;
}

/* MOBILE */

@media (max-width:768px){


.interior-hero {
    padding: 90px 0;
}

.editorial-feature {
    padding: 40px 30px;
}

.feature-copy h2 {
    font-size: 2.2rem;
}

.activity-journal h2 {
    font-size: 2.2rem;
}

.editorial-quote blockquote {
    font-size: 1.8rem;
}


}
/* ==================================================
MOVEMENT GUIDES — PREMIUM EDITORIAL STYLING
================================================== */

.guide-container{
max-width:1100px;
margin:auto;
padding:100px 20px;
}

/* HERO */

.guides-hero{
position:relative;
overflow:hidden;
background:
radial-gradient(circle at 15% 20%, rgba(255,255,255,.7), transparent 40%),
radial-gradient(circle at 85% 25%, rgba(170,204,214,.5), transparent 40%),
linear-gradient(135deg,#ffd6ef 0%, #ffeef8 100%);
padding:140px 0;
text-align:center;
}

.guides-hero::before{
content:"";
position:absolute;
width:500px;
height:500px;
border-radius:50%;
background:rgba(255,255,255,.25);
top:-250px;
right:-150px;
}

.guide-label{
display:inline-flex;
align-items:center;
gap:10px;
padding:12px 22px;
background:white;
border-radius:999px;
font-size:.75rem;
letter-spacing:.18em;
text-transform:uppercase;
font-weight:700;
box-shadow:0 10px 25px rgba(0,0,0,.05);
margin-bottom:30px;
}

.guides-hero h1{
font-size:clamp(3.5rem,8vw,6.5rem);
line-height:.95;
margin-bottom:25px;
letter-spacing:-0.04em;
}

.guides-hero p{
max-width:800px;
margin:auto;
font-size:1.1rem;
line-height:1.9;
opacity:.75;
}

/* INTRO */

.guide-intro{
max-width:900px;
margin:0 auto 120px;
text-align:center;
}

.guide-intro h2{
font-size:3rem;
margin-bottom:25px;
}

.guide-intro p{
color:var(--light-text);
line-height:1.95;
margin-bottom:20px;
}

/* SECTIONS */

.guide-section{
margin-bottom:140px;
}

.guide-section-header{
margin-bottom:40px;
}

.guide-section-header span{
display:inline-block;
color:#4382DF;
text-transform:uppercase;
font-size:.78rem;
font-weight:700;
letter-spacing:.2em;
margin-bottom:15px;
}

.guide-section-header h2{
font-size:clamp(2.2rem,5vw,4rem);
line-height:1.05;
}

.guide-section > p{
max-width:900px;
color:var(--light-text);
line-height:1.95;
margin-bottom:50px;
}

/* NUMBERED STEPS */

.guide-step{
display:flex;
gap:35px;
align-items:flex-start;
background:white;
padding:35px;
border-radius:35px;
margin-bottom:25px;
box-shadow:
0 15px 35px rgba(0,0,0,.05),
0 3px 8px rgba(0,0,0,.03);
transition:.35s ease;
}

.guide-step:hover{
transform:translateY(-8px);
}

.guide-number{
width:80px;
height:80px;
flex-shrink:0;
border-radius:50%;
background:linear-gradient(135deg,#4382DF,#AACCD6);
color:white;
display:flex;
align-items:center;
justify-content:center;
font-size:1.3rem;
font-weight:700;
}

.guide-step h3{
font-size:1.5rem;
margin-bottom:12px;
}

.guide-step p{
color:var(--light-text);
line-height:1.85;
}

/* CARD GRID */

.guide-card-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:28px;
}

.mini-guide-card{
background:white;
border-radius:32px;
padding:35px;
box-shadow:
0 15px 40px rgba(0,0,0,.05),
0 4px 12px rgba(0,0,0,.03);
transition:.35s ease;
position:relative;
overflow:hidden;
}

.mini-guide-card::before{
content:"";
position:absolute;
width:120px;
height:120px;
border-radius:50%;
background:rgba(170,204,214,.18);
top:-60px;
right:-60px;
}

.mini-guide-card:hover{
transform:translateY(-10px);
}

.mini-guide-card h3{
font-size:1.35rem;
margin-bottom:15px;
}

.mini-guide-card p{
color:var(--light-text);
line-height:1.8;
}

/* QUOTE BLOCK */

.guide-quote{
margin:70px 0;
padding:70px;
text-align:center;
border-radius:40px;
background:
linear-gradient(
135deg,
rgba(67,130,223,.08),
rgba(255,151,208,.12)
);
font-size:clamp(2rem,4vw,3rem);
line-height:1.4;
color:#428475;
font-style:italic;
position:relative;
}

.guide-quote::before{
content:"❝";
position:absolute;
top:15px;
left:40px;
font-size:5rem;
opacity:.15;
}

/* CHECKLIST */

.guide-list{
display:grid;
gap:18px;
margin-top:40px;
}

.guide-list li{
list-style:none;
background:white;
padding:22px 28px;
border-radius:18px;
display:flex;
align-items:center;
gap:15px;
box-shadow:0 8px 20px rgba(0,0,0,.04);
}

.guide-list li::before{
content:"✓";
width:30px;
height:30px;
border-radius:50%;
background:#428475;
color:white;
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
font-weight:700;
}

/* ENDING QUOTE */

.guide-ending{
margin-top:140px;
padding-top:100px;
border-top:1px solid rgba(0,0,0,.08);
text-align:center;
}

.guide-ending blockquote{
max-width:900px;
margin:auto;
font-size:clamp(2rem,5vw,4rem);
line-height:1.35;
color:#428475;
font-style:italic;
}

/* DECORATIVE SPACING */

.guide-section:not(:last-child){
position:relative;
}

.guide-section:not(:last-child)::after{
content:"";
display:block;
width:80px;
height:2px;
background:#AACCD6;
margin:80px auto 0;
opacity:.5;
}

/* RESPONSIVE */

@media (max-width:900px){

.guides-hero{
    padding:110px 0;
}

.guide-step{
    flex-direction:column;
}

.guide-number{
    width:65px;
    height:65px;
    font-size:1rem;
}

.guide-quote{
    padding:40px 30px;
}

}

@media (max-width:768px){

.guide-container{
    padding:70px 20px;
}

.guides-hero h1{
    font-size:3rem;
}

.guide-intro h2,
.guide-section-header h2{
    font-size:2rem;
}

.guide-quote{
    font-size:1.6rem;
}

.guide-ending blockquote{
    font-size:1.8rem;
}

}


/* ==========================================
PARENTS JOURNAL — EDITORIAL MAGAZINE STYLE
========================================== */

.journal-hero{
position:relative;
overflow:hidden;
background:
radial-gradient(circle at 20% 20%, rgba(255,255,255,.7), transparent 35%),
radial-gradient(circle at 80% 30%, rgba(170,204,214,.35), transparent 40%),
linear-gradient(135deg,#f7fbff,#eef8ff);
padding:140px 0;
text-align:center;
}

.journal-hero::before{
content:"";
position:absolute;
width:500px;
height:500px;
border-radius:50%;
background:rgba(255,255,255,.25);
top:-250px;
right:-120px;
}

.journal-label{
display:inline-block;
padding:12px 22px;
background:white;
border-radius:999px;
font-size:.75rem;
font-weight:700;
letter-spacing:.18em;
text-transform:uppercase;
box-shadow:0 10px 25px rgba(0,0,0,.05);
margin-bottom:25px;
}

.journal-hero h1{
font-size:clamp(3.5rem,8vw,6rem);
line-height:.95;
margin-bottom:25px;
letter-spacing:-0.05em;
}

.journal-hero p{
max-width:760px;
margin:auto;
line-height:1.9;
opacity:.75;
font-size:1.08rem;
}

/* INTRO */

.journal-intro{
max-width:850px;
margin:0 auto 100px;
text-align:center;
}

.journal-intro h2{
font-size:3rem;
margin-bottom:20px;
}

.journal-intro p{
line-height:1.9;
color:var(--light-text);
}

/* ARTICLE GRID */

.editorial-article-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(340px,1fr));
gap:32px;
margin-bottom:120px;
}

.article-card{
background:white;
padding:40px;
border-radius:32px;
box-shadow:
0 15px 40px rgba(0,0,0,.05),
0 4px 12px rgba(0,0,0,.03);
transition:.35s ease;
position:relative;
overflow:hidden;
}

.article-card::before{
content:"";
position:absolute;
width:140px;
height:140px;
border-radius:50%;
background:rgba(170,204,214,.18);
top:-70px;
right:-70px;
}

.article-card:hover{
transform:translateY(-10px);
}

.article-category{
display:inline-block;
margin-bottom:20px;
color:#4382DF;
font-size:.75rem;
font-weight:700;
letter-spacing:.15em;
}

.article-card h2{
font-size:1.8rem;
line-height:1.2;
margin-bottom:18px;
}

.article-card p{
color:var(--light-text);
line-height:1.85;
margin-bottom:24px;
}

.article-card a{
color:#428475;
text-decoration:none;
font-weight:600;
}

/* FEATURED ESSAY */

.featured-journal-essay{
margin:120px 0;
padding:90px;
border-radius:40px;
background:
linear-gradient(
135deg,
rgba(67,130,223,.08),
rgba(255,151,208,.10)
);
}

.essay-content{
max-width:900px;
}

.essay-content span{
display:block;
color:#4382DF;
font-size:.8rem;
letter-spacing:.2em;
text-transform:uppercase;
font-weight:700;
margin-bottom:15px;
}

.essay-content h2{
font-size:clamp(2.5rem,5vw,4rem);
margin-bottom:25px;
line-height:1.05;
}

.essay-content p{
line-height:1.95;
color:var(--light-text);
margin-bottom:20px;
}

/* RESEARCH NOTES */

.research-notes{
margin:140px 0;
}

.research-notes h2{
text-align:center;
font-size:3rem;
margin-bottom:60px;
}

.research-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
gap:24px;
}

.research-card{
background:white;
padding:35px;
border-radius:28px;
box-shadow:0 12px 30px rgba(0,0,0,.05);
transition:.3s;
}

.research-card:hover{
transform:translateY(-8px);
}

.research-card h3{
margin-bottom:12px;
font-size:1.3rem;
}

.research-card p{
color:var(--light-text);
line-height:1.8;
}

/* QUOTE */

.journal-quotes{
margin:140px auto;
max-width:900px;
text-align:center;
}

.journal-quotes blockquote{
font-size:clamp(2rem,4vw,3.8rem);
line-height:1.35;
color:#428475;
font-style:italic;
position:relative;
}

.journal-quotes blockquote::before{
content:"❝";
display:block;
font-size:5rem;
opacity:.15;
margin-bottom:10px;
}

/* TOOLKIT */

.parent-toolkit{
margin:120px 0;
}

.parent-toolkit h2{
text-align:center;
font-size:3rem;
margin-bottom:60px;
}

.toolkit-list{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:22px;
}

.toolkit-item{
background:white;
padding:28px 30px;
border-radius:20px;
box-shadow:0 8px 20px rgba(0,0,0,.04);
transition:.3s;
cursor:pointer;
}

.toolkit-item:hover{
transform:translateY(-6px);
}

.toolkit-item h3{
font-size:1.1rem;
line-height:1.5;
}

/* DIVIDERS */

.featured-journal-essay,
.research-notes,
.parent-toolkit{
position:relative;
}

.featured-journal-essay::after,
.research-notes::after{
content:"";
display:block;
width:80px;
height:2px;
background:#AACCD6;
margin:80px auto 0;
opacity:.5;
}

/* RESPONSIVE */

@media (max-width:900px){


.featured-journal-essay{
    padding:50px 35px;
}


}

@media (max-width:768px){


.journal-hero{
    padding:100px 0;
}

.journal-hero h1{
    font-size:3rem;
}

.journal-intro h2,
.research-notes h2,
.parent-toolkit h2{
    font-size:2rem;
}

.article-card{
    padding:30px;
}

.essay-content h2{
    font-size:2rem;
}

.journal-quotes blockquote{
    font-size:1.7rem;
}


}

/* ======================================
COMMUNITY STORIES PAGE
====================================== */

.stories-hero{
background:
radial-gradient(circle at 20% 20%, rgba(255,255,255,.12), transparent 35%),
linear-gradient(135deg,#428475,#2f5f55);
color:white;
padding:140px 0;
text-align:center;
}

.stories-label{
display:inline-block;
padding:12px 22px;
border-radius:999px;
background:rgba(255,255,255,.12);
backdrop-filter:blur(10px);
font-size:.75rem;
text-transform:uppercase;
letter-spacing:.15em;
margin-bottom:24px;
}

.stories-hero h1{
font-size:clamp(3rem,8vw,6rem);
margin-bottom:20px;
}

.stories-hero p{
max-width:750px;
margin:auto;
line-height:1.9;
opacity:.9;
}

.stories-introduction{
max-width:850px;
margin:0 auto 100px;
text-align:center;
}

.featured-story{
max-width:900px;
margin:0 auto 120px;
text-align:center;
}

.featured-story blockquote{
font-size:clamp(2rem,4vw,3.2rem);
line-height:1.4;
font-style:italic;
color:#428475;
}

.story-author{
display:block;
margin-top:30px;
color:var(--light-text);
font-weight:600;
}

.story-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
gap:30px;
margin-bottom:120px;
}

.story-card{
background:white;
padding:35px;
border-radius:30px;
box-shadow:0 15px 40px rgba(0,0,0,.05);
transition:.35s;
}

.story-card:hover{
transform:translateY(-8px);
}

.story-meta{
color:#4382DF;
font-size:.8rem;
letter-spacing:.1em;
text-transform:uppercase;
margin-bottom:15px;
}

.story-card h3{
margin-bottom:15px;
font-size:1.5rem;
}

.story-card p{
line-height:1.8;
color:var(--light-text);
}

.milestone-section{
margin:120px 0;
}

.milestone-section h2{
text-align:center;
font-size:3rem;
margin-bottom:60px;
}

.milestone-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:25px;
}

.milestone-card{
background:white;
padding:35px;
border-radius:28px;
box-shadow:0 12px 30px rgba(0,0,0,.05);
}

.milestone-card span{
font-size:2rem;
font-weight:700;
color:#4382DF;
}

.community-quote{
max-width:900px;
margin:140px auto;
text-align:center;
}

.community-quote blockquote{
font-size:clamp(2rem,4vw,3.8rem);
line-height:1.4;
color:#428475;
font-style:italic;
}

.community-wall{
margin-top:120px;
}

.community-wall h2{
text-align:center;
margin-bottom:60px;
font-size:3rem;
}

.wall-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:25px;
}

.wall-card{
background:white;
padding:30px;
border-radius:24px;
box-shadow:0 10px 25px rgba(0,0,0,.05);
}

.wall-card p{
line-height:1.8;
color:var(--light-text);
font-style:italic;
}


/* =====================================
LEARNING PHILOSOPHY PAGE
===================================== */

.philosophy-hero{
background:
radial-gradient(circle at 20% 20%, rgba(255,255,255,.7), transparent 35%),
linear-gradient(135deg,#f7fbff,#eef8ff);
padding:140px 0;
text-align:center;
}

.philosophy-label{
display:inline-block;
padding:12px 22px;
background:white;
border-radius:999px;
font-size:.75rem;
font-weight:700;
letter-spacing:.18em;
text-transform:uppercase;
margin-bottom:24px;
}

.philosophy-intro{
max-width:900px;
margin:0 auto 120px;
text-align:center;
}

.philosophy-intro h2{
font-size:3rem;
margin-bottom:25px;
}

.philosophy-intro p{
line-height:1.9;
color:var(--light-text);
margin-bottom:20px;
}

.section-header{
text-align:center;
margin-bottom:60px;
}

.section-header span{
color:#4382DF;
letter-spacing:.18em;
text-transform:uppercase;
font-size:.8rem;
}

.section-header h2{
font-size:3rem;
margin-top:15px;
}

.belief-grid,
.pillar-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:30px;
}

.belief-card,
.pillar-card{
background:white;
padding:35px;
border-radius:30px;
box-shadow:0 12px 30px rgba(0,0,0,.05);
}

.belief-number{
color:#4382DF;
font-size:2rem;
font-weight:700;
margin-bottom:15px;
}

.philosophy-feature{
margin:140px 0;
padding:90px;
border-radius:40px;
background:linear-gradient(
135deg,
rgba(67,130,223,.08),
rgba(255,151,208,.12)
);
}

.feature-content h2{
font-size:3rem;
margin:15px 0 25px;
}

.philosophy-timeline{
max-width:900px;
margin:140px auto;
}

.timeline-item{
display:flex;
gap:25px;
margin-bottom:30px;
background:white;
padding:30px;
border-radius:25px;
}

.timeline-item span{
width:60px;
height:60px;
border-radius:50%;
background:#4382DF;
color:white;
display:flex;
align-items:center;
justify-content:center;
}

.philosophy-quote{
max-width:900px;
margin:140px auto;
text-align:center;
}

.philosophy-quote blockquote{
font-size:clamp(2rem,4vw,3.8rem);
color:#428475;
line-height:1.4;
font-style:italic;
}

.values-list{
display:grid;
gap:18px;
max-width:900px;
margin:auto;
}

.values-list li{
list-style:none;
background:white;
padding:22px 28px;
border-radius:18px;
box-shadow:0 8px 20px rgba(0,0,0,.04);
}


.newsletter-box{
display:flex;
flex-direction:column;
gap:16px;
}

.newsletter-box h4{
margin-bottom:6px;
}

.newsletter-description{
font-size:.9rem;
line-height:1.7;
opacity:.75;
}

.newsletter-box form{
display:flex;
flex-direction:column;
gap:10px;
}

.newsletter-box input{
width:100%;
padding:14px 16px;
border:none;
border-radius:14px;
background:rgba(255,255,255,.08);
color:inherit;
font-family:inherit;
font-size:.95rem;
outline:none;
}

.newsletter-box input::placeholder{
opacity:.6;
}

.newsletter-btn{
width:100%;
padding:.85rem;
}

.newsletter-divider{
position:relative;
text-align:center;
margin:8px 0;
}

.newsletter-divider::before{
content:"";
position:absolute;
left:0;
top:50%;
width:100%;
height:1px;
background:rgba(255,255,255,.15);
}

.newsletter-divider span{
position:relative;
background:var(--footer-bg, #111);
padding:0 12px;
font-size:.8rem;
opacity:.6;
}

.newsletter-unsubscribe-btn{
width:100%;
padding:.85rem;
background:transparent;
border:1px solid rgba(255,255,255,.2);
color:inherit;
}

.newsletter-unsubscribe-btn:hover{
background:rgba(255,255,255,.06);
}

.newsletter-note{
font-size:.75rem;
opacity:.55;
line-height:1.5;
}