/* JOVYA School Network section. Uses the tokens and components from dh.css; nothing here changes existing styles. */
.jn{background:var(--cream)}
.jn h3{font-size:1.3rem}
.jn h4{font:600 1.05rem/1.3 var(--font-head);margin:0 0 4px}
.jn .jn-h{margin:56px 0 18px}
.jn .jn-sub{margin:28px 0 12px}
.jn-fine{font-size:.95rem;color:#3b4456;margin-top:16px}

/* the one requirement */
.jn-must{background:var(--purple);color:#fff;border-radius:20px;padding:clamp(22px,4vw,36px);margin:0 0 28px}
.jn-must h3{color:#fff;margin-bottom:10px}
.jn-must p{max-width:70ch}
.jn-must p:last-child{margin-bottom:0}
.jn-must strong{color:var(--gold)}

/* how the three parts fit */
.jn-trio{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.jn-trio li{background:var(--white);border:2px solid var(--grey);border-top:6px solid var(--gold);border-radius:12px;padding:20px}
.jn-trio h3{font-size:1.1rem}
.jn-trio p{margin:0;color:#3b4456}
@media(max-width:820px){.jn-trio{grid-template-columns:1fr}}

/* chain: join -> presence -> reporting -> communication -> compete */
.jn-chain{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;counter-reset:jn}
.jn-chain li{position:relative;background:var(--white);border:2px solid var(--purple);border-radius:12px;padding:16px 14px;counter-increment:jn}
.jn-chain li:last-child{background:var(--gold-soft);border-color:var(--gold)}
.jn-chain strong{display:block;font:600 .98rem/1.3 var(--font-head);margin-bottom:6px}
.jn-chain span{display:block;font-size:.9rem;color:#3b4456;line-height:1.45}
.jn-chain li:not(:last-child)::after{content:"";position:absolute;right:-12px;top:50%;width:10px;height:10px;border-top:3px solid var(--purple);border-right:3px solid var(--purple);transform:translateY(-50%) rotate(45deg)}
@media(max-width:1000px){
  .jn-chain{grid-template-columns:1fr;gap:20px}
  .jn-chain li:not(:last-child)::after{right:auto;left:50%;top:auto;bottom:-15px;transform:translateX(-50%) rotate(135deg)}
}

/* content blocks */
.jn-block{background:var(--white);border:1px solid var(--grey);border-radius:16px;padding:clamp(20px,3.5vw,32px);margin-top:28px}
.jn-block h3{margin-bottom:10px}
.jn-block>p:last-child{margin-bottom:0}
.jn-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:28px}
.jn-cols .jn-block{margin-top:0}
@media(max-width:900px){.jn-cols{grid-template-columns:1fr}.jn-cols .jn-block+.jn-block{margin-top:0}}

.jn-tick{list-style:none;margin:0 0 16px;padding:0}
.jn-tick li{position:relative;padding:0 0 10px 30px}
.jn-tick li::before{content:"";position:absolute;left:3px;top:.4em;width:12px;height:7px;border-left:3px solid var(--purple);border-bottom:3px solid var(--purple);transform:rotate(-45deg)}
.jn-two{display:grid;grid-template-columns:1fr 1fr;gap:0 32px}
@media(max-width:700px){.jn-two{grid-template-columns:1fr}}

/* results: the most prominent block */
.jn-results{border:3px solid var(--purple);background:var(--white);border-radius:22px;padding:clamp(22px,4vw,40px);margin-top:36px}
.jn-results>h3{font-size:clamp(1.4rem,3.4vw,1.8rem)}
.jn-results .steps{margin-top:24px}
.jn-results .steps h4{margin:2px 0 4px}

/* wider environment */
.jn-pills{list-style:none;margin:16px 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.jn-pills li{background:var(--cream);border:2px solid var(--purple);color:var(--purple);font-weight:600;border-radius:999px;padding:8px 16px;font-size:.95rem}

/* honest note */
.jn-note{background:var(--gold-soft);border-left:5px solid var(--gold);border-radius:0 12px 12px 0;padding:16px 20px;margin:28px 0 0;max-width:none}

/* price recap */
.jn-price{background:var(--white);border:2px solid var(--purple);border-radius:20px;padding:clamp(20px,4vw,34px);margin-top:36px}
.jn-price-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:18px 0 6px}
.jn-price-grid>div{background:var(--cream);border-radius:12px;padding:18px 20px}
.jn-price-grid p{margin:0 0 6px}
.jn-amt{font:700 2rem/1.1 var(--font-head);color:var(--purple)}
@media(max-width:700px){.jn-price-grid{grid-template-columns:1fr}}

/* FAQ */
.jn-faq{max-width:820px}
.jn-faq details{background:var(--white);border:1px solid var(--grey);border-radius:12px;margin-bottom:10px}
.jn-faq summary{cursor:pointer;font:600 1rem/1.4 var(--font-head);padding:16px 48px 16px 18px;position:relative;list-style:none}
.jn-faq summary::-webkit-details-marker{display:none}
.jn-faq summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:1.5rem;color:var(--purple)}
.jn-faq details[open] summary::after{content:"–"}
.jn-faq details p{margin:0;padding:0 18px 16px}
.jn-cta{margin-top:36px}