:root{
  --navy:#28547c;
  --teal:#4aa59a;
  --mint:#dff5ec;
  --sky:#dff2ff;
  --yellow:#ffd974;
  --pink:#ffdce8;
  --purple:#e8ddff;
  --ink:#38505e;
  --muted:#6d7f88;
  --white:#fff;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Nunito",sans-serif;color:var(--ink);background:#fffdf9;overflow-x:hidden}
a{text-decoration:none}

.kids-page{min-height:100vh;position:relative;overflow:hidden;background:
radial-gradient(circle at 8% 12%,rgba(255,217,116,.24),transparent 22%),
radial-gradient(circle at 93% 20%,rgba(232,221,255,.45),transparent 22%),
linear-gradient(180deg,#fffefa 0%,#f9fffd 100%)}

/* playful background shapes */
.kids-page:before,.kids-page:after{content:"";position:absolute;border-radius:50%;z-index:0;filter:blur(.2px)}
.kids-page:before{width:230px;height:230px;background:#dff2ff;left:-90px;top:240px;opacity:.65}
.kids-page:after{width:280px;height:280px;background:#ffe5b8;right:-120px;bottom:40px;opacity:.55}

.kids-hero{position:relative;z-index:2;padding:54px 24px 82px}
.kids-shell{max-width:1240px;margin:auto;display:grid;grid-template-columns:1.03fr .97fr;gap:62px;align-items:center}

.kids-copy{position:relative}
.kids-eyebrow{display:inline-flex;align-items:center;gap:9px;padding:8px 14px;border-radius:999px;background:var(--mint);color:#347e74;font-size:12px;font-weight:900;letter-spacing:.7px;text-transform:uppercase;margin-bottom:16px;box-shadow:0 8px 20px rgba(61,129,119,.08)}
.kids-eyebrow i{color:#f5aa3b}

.kids-copy h1{font-family:"Baloo 2",cursive;color:var(--navy);font-size:clamp(46px,5.6vw,76px);line-height:.98;letter-spacing:-1.4px;margin-bottom:18px;max-width:650px}
.kids-copy h1 span{color:var(--teal);position:relative;white-space:nowrap}
.kids-copy h1 span:after{content:"";position:absolute;left:3%;right:3%;height:10px;bottom:2px;background:var(--yellow);border-radius:50%;z-index:-1;opacity:.58;transform:rotate(-1deg)}

.kids-copy p{font-size:17px;line-height:1.82;color:var(--muted);max-width:610px;margin-bottom:24px}

.kids-benefits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0 0 28px;max-width:610px}
.kids-benefit{display:flex;align-items:center;gap:11px;padding:12px 14px;border:1px solid rgba(42,95,105,.08);background:rgba(255,255,255,.85);border-radius:18px;box-shadow:0 10px 24px rgba(47,81,92,.06)}
.kids-benefit .icon{width:38px;height:38px;border-radius:13px;display:flex;align-items:center;justify-content:center;flex:0 0 38px;font-size:15px}
.kids-benefit:nth-child(1) .icon{background:var(--pink);color:#c96582}
.kids-benefit:nth-child(2) .icon{background:var(--sky);color:#438bb5}
.kids-benefit:nth-child(3) .icon{background:var(--yellow);color:#9c7220}
.kids-benefit:nth-child(4) .icon{background:var(--purple);color:#725aa9}
.kids-benefit strong{display:block;font-size:13px;color:#3d5868;font-weight:900}
.kids-benefit span{display:block;font-size:11px;color:#89969c;margin-top:1px}

.kids-actions{display:flex;flex-wrap:wrap;gap:12px}
.kids-btn{min-height:52px;padding:0 22px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:900;font-size:13px;transition:.25s ease}
.kids-btn-primary{background:linear-gradient(135deg,#3f8f86,#345d91);color:#fff;box-shadow:0 14px 28px rgba(48,93,112,.18)}
.kids-btn-primary:hover{transform:translateY(-3px)}
.kids-btn-soft{background:#fff;border:1px solid rgba(55,101,112,.12);color:#3f7180}
.kids-btn-soft:hover{background:#f3fbf8;transform:translateY(-3px)}

/* right visual */
.kids-visual{position:relative;padding:32px 14px 18px}
.rainbow{position:absolute;right:0;top:-8px;width:128px;height:72px;border-radius:100px 100px 0 0;background:linear-gradient(to bottom,#ff8ea5 0 18%,#ffd26b 18% 36%,#93d7b6 36% 54%,#77bdea 54% 72%,#bca7ec 72% 90%,transparent 90%);opacity:.38;transform:rotate(8deg);z-index:0}
.star{position:absolute;color:#f7c955;font-size:26px;z-index:3;filter:drop-shadow(0 5px 8px rgba(211,164,45,.18))}
.star.one{left:-3px;top:28px;transform:rotate(-12deg)}
.star.two{right:14px;bottom:40px;font-size:19px;color:#8fc9bd}
.star.three{left:20px;bottom:8px;font-size:15px;color:#d4a8e9}

.photo-frame{position:relative;z-index:2;padding:12px;border-radius:34px;background:#fff;box-shadow:0 28px 70px rgba(47,80,97,.16);transform:rotate(1.2deg)}
.photo-frame:before{content:"";position:absolute;width:76px;height:26px;background:#ffd974;left:50%;top:-13px;transform:translateX(-50%) rotate(-2deg);border-radius:4px;opacity:.82}
.photo-frame img{width:100%;height:510px;object-fit:cover;display:block;border-radius:25px}

.float-card{position:absolute;z-index:4;background:#fff;border-radius:20px;box-shadow:0 18px 40px rgba(42,74,89,.15);padding:14px 16px;display:flex;align-items:center;gap:11px}
.float-card.left{left:-26px;bottom:74px}
.float-card.right{right:-18px;top:100px}
.float-card .bubble{width:42px;height:42px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:17px}
.float-card.left .bubble{background:var(--mint);color:#3d9185}
.float-card.right .bubble{background:var(--pink);color:#c96382}
.float-card strong{display:block;font-size:12px;font-weight:900;color:#3d5767}
.float-card span{display:block;font-size:10px;color:#8b989e;margin-top:1px;white-space:nowrap}

/* playful reassurance strip */
.kids-strip{position:relative;z-index:2;max-width:1180px;margin:-26px auto 0;padding:0 24px 70px}
.strip-card{background:#fff;border-radius:28px;padding:22px 25px;box-shadow:0 18px 45px rgba(46,80,92,.08);display:grid;grid-template-columns:repeat(3,1fr);gap:16px;border:1px solid rgba(49,104,111,.07)}
.strip-item{text-align:center;padding:8px 15px}
.strip-item i{font-size:22px;margin-bottom:8px}
.strip-item:nth-child(1) i{color:#4f9e91}.strip-item:nth-child(2) i{color:#e6ac35}.strip-item:nth-child(3) i{color:#9a78bf}
.strip-item strong{display:block;color:#35566a;font-family:"Baloo 2";font-size:17px}
.strip-item span{display:block;color:#85939a;font-size:12px;line-height:1.5;margin-top:2px}

@media(max-width:940px){
 .kids-hero{padding-top:42px}.kids-shell{grid-template-columns:1fr;gap:36px}.kids-copy{text-align:center}.kids-copy p,.kids-benefits{margin-left:auto;margin-right:auto}.kids-actions{justify-content:center}.kids-visual{max-width:700px;margin:auto;width:100%}.photo-frame img{height:440px}.float-card.left{left:8px}.float-card.right{right:8px}
}
@media(max-width:650px){
 .kids-hero{padding:32px 15px 58px}.kids-copy h1{font-size:48px}.kids-copy p{font-size:15px;line-height:1.72}.kids-benefits{grid-template-columns:1fr}.kids-actions{flex-direction:column}.kids-btn{width:100%}.photo-frame{padding:8px;border-radius:26px}.photo-frame img{height:335px;border-radius:20px}.float-card{position:relative;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;margin:12px 0 0;justify-content:center}.rainbow{width:90px;height:52px}.star{display:none}.strip-card{grid-template-columns:1fr}.kids-strip{padding:0 15px 48px}
}



/* =========================================================
   ADOLESCENT COUNSELING PAGE HIGHLIGHT UPDATE
   Add this AFTER your existing CSS
========================================================= */

/* Breadcrumb */
.page-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    font-size: 12px;
    font-weight: 800;
    color: #7a8b93;
}

.page-breadcrumb a {
    color: #4b8e86;
}

.page-breadcrumb i {
    font-size: 9px;
    color: #a6b1b6;
}


/* Highlight service name */
.page-identity {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    padding: 10px 16px;
    margin-bottom: 14px;

    border-radius: 16px;

    background:
        linear-gradient(
            135deg,
            #28547c,
            #4aa59a
        );

    color: #ffffff;

    font-size: 13px;
    font-weight: 900;
    letter-spacing: .45px;

    box-shadow:
        0 12px 26px
        rgba(40,84,124,.16);
}

.page-identity i {
    width: 28px;
    height: 28px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 10px;

    background:
        rgba(255,255,255,.16);

    color: #ffe39b;
}


/* Larger page title */
.kids-copy h1.page-title {
    font-size:
        clamp(
            52px,
            6vw,
            82px
        );

    line-height: .95;

    margin-bottom: 10px;
}


/* Subtitle directly below page title */
.kids-copy .hero-subtitle {
    max-width: 640px;

    margin-bottom: 18px;

    font-family:
        "Baloo 2",
        cursive;

    font-size:
        clamp(
            25px,
            2.6vw,
            36px
        );

    line-height: 1.12;

    color: var(--teal);

    font-weight: 700;
}


/* Mobile */
@media(max-width:700px) {

    .page-breadcrumb {
        justify-content: center;
        flex-wrap: wrap;
    }

    .page-identity {
        margin-left: auto;
        margin-right: auto;
    }

    .kids-copy h1.page-title {
        font-size: 52px;
    }

}

/* FULL PAGE BACKGROUND */

html,
body {
    min-height: 100%;
}

body {
    margin: 0;

    background:
        radial-gradient(
            circle at 10% 15%,
            rgba(255, 211, 105, 0.18),
            transparent 25%
        ),
        radial-gradient(
            circle at 90% 20%,
            rgba(75, 169, 153, 0.16),
            transparent 26%
        ),
        radial-gradient(
            circle at 15% 80%,
            rgba(105, 163, 215, 0.14),
            transparent 24%
        ),
        radial-gradient(
            circle at 90% 85%,
            rgba(255, 174, 188, 0.12),
            transparent 25%
        ),
        linear-gradient(
            135deg,
            #fffdf7 0%,
            #f4fbf8 40%,
            #f2f8fd 70%,
            #fff9f5 100%
        );

    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
}


