:root{--green:#163d35;--green2:#235a4b;--cream:#f6f4ec;--white:#fff;--ink:#18312b;--muted:#65776e;--gold:#d6a550;--line:#dce5dc;--shadow:0 18px 45px rgba(20,55,43,.09)}
    *{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.wrap{width:min(1160px,calc(100% - 40px));margin:auto}
    .top{background:var(--green);color:#eaf3e9;font-size:.82rem}.top .wrap{display:flex;justify-content:space-between;gap:14px;padding:8px 0}.top span:last-child{color:#cbdcd2}.nav-shell{background:var(--white);box-shadow:0 2px 18px rgba(18,56,41,.05);position:sticky;top:0;z-index:20}.nav{display:flex;align-items:center;justify-content:space-between;min-height:82px;gap:20px}.brand{display:flex;align-items:center;gap:12px;min-width:0}.mark{width:58px;height:58px;object-fit:contain;flex:none}.brand strong{display:block;font-size:1rem;line-height:1.1;letter-spacing:.01em}.brand small{display:block;color:var(--muted);font-size:.72rem;line-height:1.3;margin-top:4px}.links{display:flex;align-items:center;gap:28px;font-weight:650;font-size:.91rem}.links a:hover{color:var(--green2)}.links .nav-cta{background:var(--green);color:white;border-radius:8px;padding:11px 18px}.links .nav-cta:hover{background:var(--green2);color:white}.menu-button{display:none;background:none;border:1px solid var(--line);border-radius:9px;padding:8px 11px;color:var(--ink)}
    .hero{position:relative;overflow:hidden;background:var(--green);color:white}.hero:before,.hero:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.09);border-radius:50%;pointer-events:none}.hero:before{width:670px;height:670px;right:-120px;top:-300px}.hero:after{width:900px;height:900px;right:-180px;top:-380px}.hero-inner{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center;padding:96px 0 105px}.eyebrow{display:inline-flex;align-items:center;gap:10px;color:#f4ce87;text-transform:uppercase;letter-spacing:.18em;font-size:.76rem;font-weight:800}.eyebrow:before{content:"";width:29px;height:1px;background:currentColor}h1,h2,h3,p{margin-top:0}h1{font-family:Georgia,serif;font-size:clamp(2.55rem,5vw,4.5rem);line-height:1.1;letter-spacing:-.035em;margin:22px 0}h1 em{font-style:normal;color:#e7c47d}.hero p{font-size:1.09rem;color:#dbe9df;max-width:620px;margin-bottom:34px}.actions{display:flex;gap:13px;flex-wrap:wrap}.button{display:inline-flex;justify-content:center;align-items:center;min-height:47px;padding:10px 20px;border-radius:8px;font-weight:750;font-size:.93rem}.button.gold{background:var(--gold);color:#173c32}.button.outline{border:1px solid #759588;color:white}.button:hover{transform:translateY(-1px)}.hero-art{min-height:360px;position:relative;display:grid;place-items:center}.art-frame{width:min(100%,410px);aspect-ratio:1/1;border-radius:44% 44% 16px 16px;background:linear-gradient(160deg,#e9d6a3 0%,#c9b47e 45%,#a1baa6 100%);position:relative;overflow:hidden;box-shadow:0 27px 58px rgba(2,26,21,.23)}.sun{position:absolute;width:140px;height:140px;background:#f6e8b9;border-radius:50%;top:54px;right:65px;filter:blur(1px)}.hill{position:absolute;width:520px;height:260px;background:#668c77;bottom:-130px;left:-70px;border-radius:50%}.hill.two{background:#2c6657;bottom:-175px;left:90px}.school{position:absolute;width:235px;height:135px;background:#f6f3e7;bottom:70px;left:85px;box-shadow:inset 0 -15px #d9ddcc}.school:before{content:"";position:absolute;left:-18px;top:-50px;border-left:136px solid transparent;border-right:136px solid transparent;border-bottom:60px solid #814f3b}.school:after{content:"";position:absolute;width:39px;height:73px;background:#4e806d;left:98px;bottom:0;border-radius:20px 20px 0 0;box-shadow:-68px -20px 0 -7px #89a899,68px -20px 0 -7px #89a899}.art-tag{position:absolute;bottom:7px;right:-4px;background:white;color:var(--green);border-radius:11px;padding:13px 18px;box-shadow:var(--shadow);font-size:.82rem;font-weight:750;max-width:210px}.art-tag strong{display:block;font-family:Georgia,serif;font-size:1.2rem}.art-tag span{color:var(--muted);font-weight:500}
    section{scroll-margin-top:94px}.section{padding:84px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:30px}.kicker{font-size:.75rem;font-weight:850;letter-spacing:.18em;color:var(--green2);text-transform:uppercase}.section h2{font-family:Georgia,serif;font-size:clamp(2rem,3.3vw,3rem);line-height:1.15;letter-spacing:-.025em;margin:10px 0 0}.section-head p{max-width:450px;color:var(--muted);margin:0}.intro-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:stretch}.intro-card{background:white;border:1px solid var(--line);padding:38px;border-radius:16px;box-shadow:var(--shadow)}.intro-card p{font-size:1.06rem;color:#486258;margin:19px 0 24px}.text-link{color:var(--green2);font-weight:800;border-bottom:1px solid #a5b9a9;padding-bottom:4px}.values{background:#e9eee6;padding:38px;border-radius:16px;display:grid;align-content:center;gap:20px}.value{display:flex;gap:17px;align-items:start}.number{font-family:Georgia,serif;color:var(--green2);font-size:1.4rem;line-height:1}.value strong{display:block}.value span:last-child{color:var(--muted);font-size:.9rem}
    .units{background:#eaf0e9}.unit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.unit{background:white;padding:27px;border-radius:12px;border:1px solid #dbe7dc;min-height:190px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .2s,box-shadow .2s}.unit:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.unit .icon{width:38px;height:38px;border-radius:9px;background:#e6f0e6;color:var(--green2);display:grid;place-items:center;font-weight:800}.unit small{color:var(--muted);text-transform:uppercase;letter-spacing:.13em;font-weight:800}.unit h3{font-family:Georgia,serif;font-size:1.24rem;line-height:1.25;margin:7px 0 0}.unit .arrow{color:var(--green2);font-size:1.25rem;align-self:end}
    .app-hub{background:#f0f3e9}.app-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.app-card{background:white;border:1px solid var(--line);border-radius:13px;padding:25px;display:flex;flex-direction:column;min-height:215px}.app-card.featured{border-top:4px solid var(--gold)}.app-card .app-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:11px;background:#e6eee4;color:var(--green2);font-weight:850}.app-card h3{font-family:Georgia,serif;font-size:1.25rem;line-height:1.25;margin:15px 0 7px}.app-card p{color:var(--muted);font-size:.9rem;margin:0 0 20px}.app-card a,.app-card .soon{margin-top:auto;font-size:.89rem;font-weight:800}.app-card a{color:var(--green2)}.app-card a:hover{text-decoration:underline}.app-card .soon{color:#74877c}.app-note{color:var(--muted);font-size:.85rem;margin:18px 0 0}
    .stories{background:#fbfaf6}.story-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:18px}.story-feature{min-height:405px;background:linear-gradient(135deg,#315f4d,#183f35 68%);color:white;border-radius:18px;padding:38px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.story-feature:before{content:"";position:absolute;width:410px;height:410px;border:1px solid #ffffff25;border-radius:50%;right:-115px;bottom:-220px;box-shadow:0 0 0 55px #ffffff08,0 0 0 110px #ffffff06}.story-feature>*{position:relative}.story-label{font-size:.73rem;font-weight:850;letter-spacing:.16em;text-transform:uppercase;color:#e9c27c}.story-feature h3{font:normal clamp(2rem,3vw,3rem)/1.12 Georgia,serif;letter-spacing:-.025em;max-width:560px;margin:15px 0}.story-feature p{color:#d6e7da;max-width:470px;margin:0}.story-feature small{font-weight:700;color:#f4d899}.story-side{display:grid;gap:18px}.story-card{background:#e9eee2;border-radius:16px;padding:28px;min-height:193px;display:flex;flex-direction:column;justify-content:space-between}.story-card:last-child{background:#f1e7d4}.story-card .story-label{color:var(--green2)}.story-card h3{font:normal 1.45rem/1.22 Georgia,serif;margin:11px 0}.story-card p{font-size:.9rem;color:#62736a;margin:0}.story-topics{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}.story-topics span{border:1px solid #d6e1d5;border-radius:50px;padding:8px 14px;color:var(--green2);font-size:.81rem;font-weight:750;background:white}.daily-bridge{display:flex;align-items:center;justify-content:space-between;gap:26px;margin-top:25px;padding:26px 29px;border:1px solid #dfd5ba;background:#f4eedf;border-radius:14px}.daily-bridge h3{font:normal 1.55rem/1.2 Georgia,serif;margin:6px 0}.daily-bridge p{color:#64746b;font-size:.91rem;margin:0;max-width:620px}.daily-actions{display:flex;flex-wrap:wrap;gap:9px;flex:none}.daily-actions a{padding:10px 15px;border-radius:8px;font-size:.84rem;font-weight:800;background:white;border:1px solid #d7dfd2;color:var(--green2)}.daily-actions a:first-child{background:var(--green);border-color:var(--green);color:white}.daily-actions a:hover{text-decoration:underline}
    .daily-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:25px}.daily-grid .daily-bridge{margin-top:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;min-width:0}.daily-grid .daily-bridge.world{background:#eaf0ef;border-color:#d2e0dc}.daily-grid .daily-actions{margin-top:22px}.daily-grid .world .daily-actions a:first-child{background:#285b69;border-color:#285b69}
    @media(max-width:850px){.daily-grid{grid-template-columns:1fr}}
    .creative-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.creative-card.parent{background:#eef0f4;border-color:#dbe0e9}.creative-card.parent .kicker{color:#3a5970}@media(max-width:1050px){.creative-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.creative-card.parent{grid-column:1/-1}}@media(max-width:850px){.creative-grid{grid-template-columns:1fr}.creative-card.parent{grid-column:auto}}
    .intro-grid{grid-template-columns:.8fr 1.2fr;gap:24px;align-items:start}.intro-card p{font-family:Georgia,serif;font-size:clamp(1.25rem,2vw,1.65rem);line-height:1.48;color:var(--ink)}.mission-list{align-content:start;gap:14px}.mission-list ol{list-style:none;padding:0;margin:0;display:grid;gap:0}.mission-list li{display:flex;gap:17px;align-items:start;padding:17px 0;border-bottom:1px solid #d1dfd0}.mission-list li:last-child{border-bottom:0;padding-bottom:0}.mission-list li>span:last-child{font-size:.94rem;line-height:1.5;color:#405b4e}.mission-list .number{font-size:1.18rem;min-width:27px}
    .creative{background:#f3efe2}.creative-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.creative-card{background:#fff;border:1px solid #e4ddc8;border-radius:16px;padding:30px;min-height:245px;display:flex;flex-direction:column;justify-content:space-between}.creative-card.teacher{background:#e7eee5;border-color:#d7e2d4}.creative-card .kicker{color:#946e34}.creative-card.teacher .kicker{color:var(--green2)}.creative-card h3{font:normal 1.8rem/1.18 Georgia,serif;margin:10px 0}.creative-card p{color:#607269;margin:0}.creative-foot{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:25px}.creative-foot p{color:#607269;margin:0;max-width:670px}.creative-foot .button{background:var(--green);color:#fff;flex:none}@media(max-width:850px){.creative-grid{grid-template-columns:1fr}.creative-foot{align-items:start;flex-direction:column}}
    @media(max-width:850px){.intro-grid{grid-template-columns:1fr}}
    .contact{background:var(--green);color:white}.contact .section-head p{color:#cbded0}.contact-box{background:#285849;border:1px solid #568173;border-radius:16px;padding:30px;display:flex;justify-content:space-between;align-items:center;gap:25px}.contact-box p{color:#d4e4d9;margin:7px 0 0}.contact-pending{display:inline-block;background:#f4d492;color:var(--green);padding:11px 18px;border-radius:8px;font-weight:750}.contact-box .button{background:#f4d492;color:var(--green)}footer{background:#10332b;color:#bcd2c5;padding:26px 0;font-size:.83rem}footer .wrap{display:flex;justify-content:space-between;gap:18px}footer strong{color:white}
    @media(max-width:1050px){.menu-button{display:block}.links{display:none;position:absolute;top:82px;left:0;right:0;background:white;padding:16px 20px 25px;box-shadow:0 15px 25px #132c2a20;flex-direction:column;align-items:stretch;gap:0}.links.open{display:flex}.links a{padding:12px 3px}.links .nav-cta{text-align:center;margin-top:8px}}
    @media(max-width:850px){.hero-inner{grid-template-columns:1fr;padding:70px 0}.hero-art{min-height:300px}.art-frame{width:300px}.art-tag{right:calc(50% - 210px)}.intro-grid,.story-grid{grid-template-columns:1fr}.story-side{grid-template-columns:repeat(2,1fr)}.unit-grid,.app-grid{grid-template-columns:repeat(2,1fr)}.section-head{align-items:start;flex-direction:column}.daily-bridge{align-items:start;flex-direction:column}.daily-actions{flex:none}}
    @media(max-width:650px){.wrap{width:min(100% - 28px,1160px)}.top .wrap{justify-content:center}.top span:last-child{display:none}.nav{min-height:70px}.mark{width:48px;height:48px}.brand strong{font-size:.9rem}.brand small{font-size:.64rem}.menu-button{display:block}.links{display:none;position:absolute;top:70px;left:0;right:0;background:white;padding:16px 20px 25px;box-shadow:0 15px 25px #132c2a20;flex-direction:column;align-items:stretch;gap:0}.links.open{display:flex}.links a{padding:12px 3px}.links .nav-cta{text-align:center;margin-top:8px}.hero-inner{padding:58px 0 55px;gap:22px}h1{font-size:2.8rem}.hero p{font-size:1rem}.hero-art{min-height:250px}.art-frame{width:245px}.art-tag{right:calc(50% - 150px);bottom:0;padding:9px 12px}.art-tag strong{font-size:1rem}.section{padding:65px 0}.intro-card,.values,.story-feature,.story-card{padding:25px}.story-feature{min-height:380px}.story-side,.unit-grid,.app-grid{grid-template-columns:1fr}.contact-box{align-items:start;flex-direction:column}footer .wrap{flex-direction:column}}

.nav .links a[aria-current="page"]{color:var(--green2);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:7px}
.reading-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));gap:18px}
.reading-card{display:flex;flex-direction:column;min-width:0;padding:29px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 30px rgba(20,55,43,.04)}
.reading-card h3{font:normal clamp(1.55rem,2.4vw,2rem)/1.18 Georgia,serif;margin:15px 0 12px}
.reading-card h3 a:hover{text-decoration:underline;text-underline-offset:4px}
.reading-card p{color:var(--muted);font-size:.94rem;margin:0 0 20px}
.reading-author{color:#5d7566;font-size:.8rem;font-weight:700;margin-top:auto}
.reading-more{align-self:flex-start;color:var(--green2);font-size:.9rem;font-weight:800;text-decoration:underline;text-underline-offset:4px;margin-top:16px}
.reading-actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin-top:26px}
.reading-actions .button{background:var(--green);color:#fff}
@media(max-width:650px){.reading-card{padding:24px}.reading-actions{align-items:flex-start;flex-direction:column;gap:15px}}
.section-cta{margin-top:27px}.section-cta .button{background:var(--green);color:#fff}
.path-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.path-card{display:flex;flex-direction:column;justify-content:space-between;min-height:215px;padding:27px;background:#fff;border:1px solid var(--line);border-radius:14px}.path-card:nth-child(2){background:#e9eee6}.path-card:nth-child(3){background:#f1e9d8}.path-card h3{font:normal 1.65rem/1.18 Georgia,serif;margin:11px 0}.path-card p{color:var(--muted);font-size:.93rem;margin:0 0 24px}.path-card a{color:var(--green2);font-weight:800}.path-card a:hover,.text-link:hover{text-decoration:underline}
.home-vision{background:#e8eee6}.home-vision .wrap{display:grid;grid-template-columns:.6fr 1.4fr;align-items:center;gap:30px}.home-vision blockquote{font:normal clamp(1.4rem,2.5vw,2.25rem)/1.37 Georgia,serif;margin:0}.home-vision .text-link{grid-column:2;justify-self:start}.home-vision .kicker{align-self:start;padding-top:10px}
.subhero{background:var(--green);color:#fff;padding:66px 0 70px}.subhero h1{font-size:clamp(2.5rem,4.4vw,4.2rem);max-width:820px}.subhero p{max-width:710px;color:#dbe9df;font-size:1.06rem}.subhero .kicker{color:#eac781}
.page-intro{background:#fbfaf6}.page-intro p{max-width:750px;color:var(--muted)}.page-links{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}.page-links a{background:white;border:1px solid var(--line);border-radius:8px;padding:10px 15px;font-weight:750;color:var(--green2)}
.service-group{padding:32px 0;border-top:1px solid var(--line)}.service-group h2{font:normal clamp(1.8rem,3vw,2.5rem)/1.2 Georgia,serif;margin:8px 0}.service-group>p{color:var(--muted);max-width:720px}.service-group .app-grid{margin-top:22px}
.editor-note{border-left:4px solid var(--gold);padding:16px 20px;background:#f4eedf;color:#4a6152;border-radius:0 10px 10px 0;margin-top:25px}.editor-note p{margin:0}
@media(max-width:850px){.path-grid{grid-template-columns:1fr}.path-card{min-height:0}.home-vision .wrap{grid-template-columns:1fr;gap:17px}.home-vision .text-link{grid-column:1}}

/* Editorial illustrations: clearly labelled until official YPWI photography is available. */
.hero-art{margin:0;min-height:0;position:relative;display:block;align-self:center}
.hero-image{display:block;width:100%;height:480px;object-fit:cover;object-position:50% 50%;border-radius:160px 160px 18px 18px;box-shadow:0 27px 58px rgba(2,26,21,.25)}
.hero-caption{position:absolute;right:14px;bottom:14px;background:rgba(17,50,41,.91);color:#f5e5c6;border:1px solid rgba(255,255,255,.23);border-radius:7px;padding:7px 11px;font-size:.73rem;letter-spacing:.03em}
.story-feature{isolation:isolate;background:#173e35}
.story-feature:before{display:none}
.story-feature:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(9,40,31,.68) 0%,rgba(9,40,31,.2) 28%,rgba(9,40,31,.89) 70%,rgba(9,40,31,.96) 100%)}
.story-feature .story-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2}
.story-feature .visual-caption{position:absolute;right:24px;top:22px;color:#fff;background:rgba(13,45,34,.77);border:1px solid rgba(255,255,255,.28);border-radius:6px;padding:5px 9px;font-size:.7rem;font-weight:700;letter-spacing:.03em}
.story-feature .story-label{max-width:60%;line-height:1.5}
@media(max-width:850px){.hero-image{height:400px;max-width:550px;margin:auto}.hero-art{width:min(100%,550px);margin:auto}}
@media(max-width:650px){.hero-image{height:300px;border-radius:120px 120px 14px 14px}.hero-caption{font-size:.67rem}.story-feature .visual-caption{top:auto;bottom:18px;right:18px}.story-feature small{padding-right:112px}}
@media(max-width:650px){.hero-inner{display:flex;flex-direction:column;align-items:stretch;padding:25px 0 55px}.hero-art{order:-1;width:100%;margin:0 0 25px}.hero-image{height:230px;max-width:none;border-radius:13px;object-position:center 44%}.hero-caption{right:9px;bottom:9px}h1{font-size:clamp(2.35rem,9vw,2.8rem)}.hero p{margin-bottom:25px}}
@media(max-width:380px){.brand small{display:none}.menu-button{white-space:nowrap;min-width:78px}}
@media(max-width:650px){.brand small{display:none}.menu-button{white-space:nowrap;flex:none}}
.path-card a,.app-card a,.text-link{display:inline-flex;align-items:center;min-height:44px;align-self:flex-start}
.daily-actions a{display:inline-flex;align-items:center;min-height:44px}

/* Give imagery and headings room to carry the message. */
.path-card{min-height:185px}
.story-card{min-height:170px}
.stories .section-head{margin-bottom:35px}
.stories .section-head p:empty,.section-head p:empty{display:none}
@media(max-width:650px){.path-card{min-height:0}.story-card{min-height:165px}}

/* Featured entry to the competition hub. */
.competition-feature{background:#fbfaf6;padding:2px 0 72px;scroll-margin-top:94px}
.competition-panel{display:grid;grid-template-columns:1fr 1fr;min-height:370px;background:#163d35;color:white;border-radius:19px;overflow:hidden;box-shadow:0 18px 44px rgba(20,55,43,.11)}
.competition-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:44px 49px}.competition-copy .kicker{color:#eac781}.competition-copy h2{font:normal clamp(2.15rem,3.4vw,3.45rem)/1.1 Georgia,serif;letter-spacing:-.025em;margin:16px 0}.competition-copy p{color:#d7e8db;max-width:445px;margin:0 0 22px}.competition-copy .button{background:#e2b96e;color:#173d34}
.competition-visual{position:relative;margin:0;min-height:300px}.competition-visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:68% center}.competition-visual figcaption{position:absolute;right:12px;bottom:12px;background:#10372fdf;color:#f5e7c9;border-radius:6px;padding:6px 10px;font-size:.72rem}
@media(max-width:850px){.competition-panel{grid-template-columns:1fr}.competition-visual{min-height:260px;order:-1}.competition-copy{padding:32px}}
@media(max-width:650px){.competition-feature{padding:0 0 52px}.competition-visual{height:205px;min-height:0}.competition-copy{padding:27px}.competition-copy h2{font-size:2.25rem}.competition-copy p{font-size:.95rem}}

/* Home hierarchy: daily reading, editorial voices, then the featured competition. */
.home-daily{background:#edf2ea}.home-daily-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:28px}.home-daily-head h2{max-width:650px}.home-daily-head p{color:#587065;max-width:610px;margin:13px 0 0}.home-daily-head .text-link{flex:none}.home-daily-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.home-news-card{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;min-height:275px;padding:29px 32px;border-radius:16px;color:white;background:#1c5141;transition:transform .2s,box-shadow .2s}.home-news-card.dunia{background:#285365}.home-news-card:before,.home-news-card:after{content:"";position:absolute;border:1px solid #ffffff26;border-radius:50%;pointer-events:none}.home-news-card:before{width:280px;height:280px;right:-90px;top:-120px}.home-news-card:after{width:360px;height:360px;right:-130px;top:-160px}.home-news-card>*{position:relative}.home-news-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.home-news-label{font-size:.78rem;font-weight:850;letter-spacing:.15em;text-transform:uppercase;color:#f3d69a}.home-news-card strong{font:normal clamp(1.8rem,2.6vw,2.45rem)/1.17 Georgia,serif;max-width:440px;margin:24px 0}.home-news-action{font-size:.89rem;font-weight:800;border-bottom:1px solid #e2c582;padding-bottom:4px}.home-daily-note{color:#5e7467;font-size:.83rem;margin:17px 0 0}.home-story-actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin-top:27px}.home-story-actions .button{background:var(--green);color:#fff}.home-story-actions .text-link{color:var(--green2)}
@media(max-width:850px){.home-daily-head{align-items:start;flex-direction:column;gap:14px}.home-daily-grid{grid-template-columns:1fr}}
@media(max-width:650px){.home-daily{padding:56px 0}.home-daily-head h2{font-size:2.1rem}.home-news-card{min-height:222px;padding:25px}.home-news-card strong{font-size:1.85rem;margin:20px 0}.home-daily-note{line-height:1.5}.home-story-actions{align-items:flex-start;flex-direction:column;gap:8px}.stories .section-head{margin-bottom:25px}}
.story-grid h3 a{color:inherit;text-decoration:none}.story-grid h3 a:hover{text-decoration:underline}
.menu-writer-link{color:var(--green2);font-weight:800}.story-read-more{display:inline-flex;align-self:flex-start;align-items:center;margin-top:15px;font-size:.84rem;font-weight:800;text-decoration:underline;text-underline-offset:4px;color:#f4d899}.story-side .story-read-more{color:var(--green2)}.story-read-more:hover{text-decoration-thickness:2px}@media(max-width:1050px){.links .menu-writer-link{display:block;color:var(--green2);font-weight:800;border-top:1px solid var(--line);margin-top:6px;padding-top:16px}}
.network-home{background:#edf2e9;padding:54px 0}.network-home-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:34px;align-items:center}.network-home h2{font:normal clamp(1.9rem,3.2vw,2.8rem)/1.14 Georgia,serif;letter-spacing:-.025em;margin:8px 0 12px}.network-home p{max-width:680px;color:#526b5d;margin:0}.network-home-actions{display:flex;align-items:center;gap:15px;flex-wrap:wrap}.network-home-actions .button{background:var(--green);color:#fff;white-space:nowrap}.network-home-actions .text-link{white-space:nowrap}.network-subhero{background:linear-gradient(130deg,#eaf0e7,#f7f4e9)}.network-subhero h1{max-width:900px}.network-subhero p{max-width:730px}.network-directory.soft{background:#f0f3ed}.network-directory .section-head{margin-bottom:27px}.network-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.network-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.network-card{display:flex;flex-direction:column;align-items:flex-start;min-height:238px;padding:26px 27px;border:1px solid #dce5da;border-radius:16px;background:#fff;box-shadow:0 12px 32px rgba(20,55,43,.04);transition:transform .18s ease,box-shadow .18s ease}.network-card:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(20,55,43,.11)}.network-card-tag{font-size:.72rem;font-weight:850;letter-spacing:.15em;text-transform:uppercase;color:#a77935}.network-card h3{font:normal clamp(1.35rem,2vw,1.7rem)/1.2 Georgia,serif;margin:16px 0 9px}.network-card p{font-size:.93rem;color:#5f7569;margin:0 0 22px}.network-card-action{margin-top:auto;color:var(--green2);font-size:.86rem;font-weight:850;text-decoration:underline;text-underline-offset:4px}.network-prayer{background:#e7eee9;border-color:#ceded2}.network-hub{background:#183e35;color:#fff}.network-hub .kicker{color:#e8c987}.network-hub-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}.network-hub h2{font:normal clamp(1.8rem,3vw,2.5rem)/1.15 Georgia,serif;margin:8px 0 9px}.network-hub p{max-width:650px;color:#d8e7da;margin:0}.network-hub .button{flex:none}@media(max-width:850px){.network-home-inner{grid-template-columns:1fr}.network-hub-inner{align-items:flex-start;flex-direction:column}.network-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.network-home{padding:44px 0}.network-home-actions{align-items:stretch;flex-direction:column}.network-home-actions .button,.network-home-actions .text-link{justify-content:center;white-space:normal;text-align:center}.network-grid,.network-grid.two{grid-template-columns:1fr}.network-card{min-height:0;padding:24px}.network-directory .section-head{margin-bottom:20px}}
.network-subhero{color:var(--ink)}.network-subhero .kicker{color:var(--green2)}.network-subhero p{color:#526b5d}footer a{color:#e8c987;font-weight:750}
.home-social[hidden]{display:none}.home-social{background:#e9f2ed}.home-social .wrap{display:flex;justify-content:space-between;align-items:center;gap:25px}.home-social h2{font:normal clamp(2rem,3vw,3rem)/1.15 Georgia,serif;margin:12px 0}.home-social p{color:#587065;margin:0}.home-social-links{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}.home-social-links a{display:inline-flex;white-space:nowrap;text-decoration:none;font-weight:750;font-size:.87rem;color:#164a3e;border:1px solid #a8c7b8;border-radius:99px;padding:10px 15px;background:#fff}.home-social-links a:hover{background:#d9e9df}@media(max-width:750px){.home-social .wrap{display:block}.home-social-links{justify-content:flex-start;margin-top:24px}}
.story-feature-copy{display:flex;flex:1;flex-direction:column;justify-content:center;align-items:flex-start;padding:28px 0 24px}.story-feature-copy h3{margin:0 0 18px}.story-feature-copy p{line-height:1.65}.story-feature .story-credit{display:block;margin-top:19px;color:#e5d4a8;font-size:.8rem;line-height:1.45;font-weight:700}.story-feature-footer{width:100%;border-top:1px solid rgba(255,255,255,.3);min-height:45px;display:flex;align-items:flex-end}.story-feature-footer:empty{display:none}.story-feature-footer .story-read-more{margin:13px 0 0;padding:0;color:#f4d899}.story-feature .visual-caption{z-index:1}
@media(max-width:650px){.story-feature{min-height:490px}.story-feature h3{font-size:clamp(2.15rem,8.4vw,2.65rem);line-height:1.12}.story-feature p{font-size:.95rem}.story-feature-copy{padding:40px 0 28px}.story-feature .visual-caption{top:18px;bottom:auto;right:18px;font-size:.62rem}.story-feature .story-credit{padding-right:0;margin-top:16px}.story-feature-footer .story-read-more{font-size:.86rem}}
/* Jalur yang mudah ditemukan menuju keluarga besar Wahdah. */
@media(min-width:1051px){.nav .links{gap:16px}}
.links .family-nav-link{color:var(--green2);font-weight:800}
.links .family-nav-link:hover{text-decoration:underline;text-underline-offset:5px}
.hero-family-link{display:inline-flex;flex-direction:column;gap:2px;margin-top:27px;padding:11px 16px;border-left:3px solid #e7c47d;border-radius:0 8px 8px 0;background:rgba(255,255,255,.08);color:#fff;line-height:1.35}
.hero-family-link>span{font-size:.77rem;color:#e6d3ad;letter-spacing:.025em}
.hero-family-link strong{font-size:.91rem;font-weight:750;text-decoration:underline;text-decoration-color:#e7c47d;text-underline-offset:4px}
.hero-family-link:hover{background:rgba(255,255,255,.14)}
@media(max-width:1050px){.links .family-nav-link{border-top:1px solid var(--line);margin-top:6px;padding-top:16px}}
@media(max-width:650px){.hero-family-link{margin-top:22px;max-width:100%}}
/* Kartu kabar: judul dan tautan baca didahulukan, kredit gambar berada di sudut atas. */
.story-feature .visual-caption{top:16px;right:16px;bottom:auto;left:auto;border:0;background:rgba(12,41,32,.62);padding:4px 7px;font-size:.62rem;font-weight:600;letter-spacing:0;line-height:1.25}
.story-feature h3 a:hover{text-decoration:underline;text-decoration-color:#e7c47d;text-underline-offset:5px}
.story-feature-footer .story-read-more{font-size:.94rem;line-height:1.4}
@media(max-width:650px){.story-feature .visual-caption{top:16px;right:16px;bottom:auto;font-size:.59rem}.story-feature .story-label{max-width:57%}.story-feature-footer .story-read-more{font-size:.94rem}}
/* Empat pintu halaman lanjutan, tanpa menambah elemen pada sampul. */
.path-card:nth-child(4){background:#edf2e9;border-color:#dbe6da}
@media(min-width:1101px){.path-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:851px) and (max-width:1100px){.path-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Rujukan tambahan tetap ringkas pada halaman keluarga Wahdah. */
.network-quicklinks{display:flex;align-items:center;gap:9px 12px;flex-wrap:wrap;margin-top:20px;color:#526b5d;font-size:.85rem}
.network-quicklinks>span{font-weight:750;margin-right:2px}
.network-quicklinks a,.network-more-list a{display:inline-flex;align-items:center;min-height:38px;padding:7px 12px;border:1px solid #cddbd0;border-radius:9px;background:#fff;color:var(--green2);font-weight:750;text-decoration:none}
.network-quicklinks a:hover,.network-more-list a:hover{background:#e1ede4}
.network-more{margin-top:24px;border:1px solid #cfddd1;border-radius:13px;background:#fff;padding:0 18px}
.network-more summary{cursor:pointer;padding:16px 2px;color:var(--green2);font-weight:800}
.network-more summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.network-more-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:0 0 18px}
.network-more-list a{justify-content:space-between;min-width:0;overflow-wrap:anywhere}
@media(max-width:650px){.network-quicklinks{align-items:stretch}.network-quicklinks>span{width:100%}.network-more-list{grid-template-columns:1fr}.network-more{padding:0 14px}}
/* Unit pendidikan: kartu ringkas dengan identitas jenjang yang mudah dipindai. */
.school-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.school-card{--school-accent:#356b4f;--school-tint:#e8f1e9;display:flex;flex-direction:column;min-width:0;min-height:174px;padding:24px 25px 26px;border:1px solid #dbe7dc;border-top:3px solid var(--school-accent);border-radius:15px;background:#fff;box-shadow:0 10px 24px rgba(20,55,43,.04)}
.school-card:nth-child(2){--school-accent:#296b63;--school-tint:#e7f2ee}
.school-card:nth-child(3){--school-accent:#35627a;--school-tint:#e7eff4}
.school-card:nth-child(4){--school-accent:#916e38;--school-tint:#f4eddf}
.school-card:nth-child(5),.school-card:nth-child(6){--school-accent:#5b6d4d;--school-tint:#edf1e7}
.school-card-top{display:flex;align-items:center;gap:12px;min-width:0}
.school-level{display:inline-flex;align-items:center;justify-content:center;flex:none;min-height:39px;min-width:44px;padding:6px 10px;border-radius:9px;background:var(--school-tint);color:var(--school-accent);font-size:.9rem;font-weight:850;line-height:1}
.school-card-top small{color:#61736b;font-size:.7rem;font-weight:800;letter-spacing:.1em;line-height:1.35;text-transform:uppercase}
.school-card h3{font:normal clamp(1.35rem,2vw,1.68rem)/1.18 Georgia,serif;letter-spacing:-.025em;margin:22px 0 0;overflow-wrap:anywhere}
@media(max-width:900px){.school-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.school-grid{grid-template-columns:1fr;gap:12px}.school-card{min-height:0;padding:19px 21px 21px}.school-card h3{margin-top:15px;font-size:1.5rem}.school-card-top small{font-size:.68rem}}

/* Bacaan: gerak lembut dan jalur geser khusus layar sentuh. */
.reading-hero{position:relative;isolation:isolate;overflow:hidden;padding:0;background:radial-gradient(circle at 82% 24%,rgba(219,179,102,.2),transparent 36%),linear-gradient(132deg,#123b32,#205849)}
.reading-hero::before{content:"";position:absolute;z-index:-1;width:580px;height:580px;right:-190px;top:-250px;border:1px solid rgba(255,255,255,.19);border-radius:50%;box-shadow:0 0 0 55px rgba(255,255,255,.045),0 0 0 110px rgba(255,255,255,.03);pointer-events:none}
.reading-hero .wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.8fr);align-items:center;gap:clamp(25px,5vw,75px);padding:74px 0 78px}
.reading-hero-copy h1{max-width:700px;margin:18px 0 20px}
.reading-hero-copy p{max-width:570px;margin:0}
.reading-hero-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:29px}
.reading-hero-links a{display:inline-flex;align-items:center;min-height:42px;padding:8px 15px;border:1px solid rgba(255,255,255,.34);border-radius:30px;color:#f9eed8;font-size:.84rem;font-weight:800;transition:background .25s,transform .25s}
.reading-hero-links a:hover{background:rgba(255,255,255,.13);transform:translateY(-2px)}
.reading-hero-art{position:relative;min-width:0;margin:0;transform:rotate(1.5deg)}
.reading-hero-art img{display:block;width:100%;height:330px;object-fit:cover;object-position:60% center;border-radius:140px 140px 18px 18px;border:5px solid rgba(255,255,255,.7);box-shadow:0 28px 55px rgba(1,31,24,.28)}
.reading-hero-art figcaption{position:absolute;right:15px;bottom:14px;padding:5px 9px;background:rgba(11,45,34,.83);border-radius:6px;color:#fff;font-size:.67rem}
.reading-card{border-top:4px solid #d8ad5b;transition:transform .3s,box-shadow .3s}
.reading-card:nth-child(2){background:#edf3ea;border-top-color:#5b8b70}
.reading-card:nth-child(3){background:#f6efe2;border-top-color:#aa8351}
.reading-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(20,55,43,.12)}
#berita .daily-bridge{transition:transform .3s,box-shadow .3s}
#berita .daily-bridge:hover{transform:translateY(-4px);box-shadow:0 18px 38px rgba(20,55,43,.1)}
.mobile-swipe-hint{display:none}
.mobile-swipe-hint[hidden]{display:none}
.swipe-toolbar{display:none}
.swipe-toolbar[hidden]{display:none}
@media(max-width:850px){.reading-hero .wrap{grid-template-columns:minmax(0,1fr) minmax(0,.75fr);gap:25px}.reading-hero-art img{height:285px}}
@media(max-width:650px){
  .reading-hero .wrap{grid-template-columns:1fr;gap:28px;padding:51px 0 45px}
  .reading-hero-copy h1{font-size:clamp(2.35rem,10vw,3.1rem);line-height:1.09}
  .reading-hero-copy p{font-size:.98rem}
  .reading-hero-links{margin-top:22px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .reading-hero-links::-webkit-scrollbar{display:none}
  .reading-hero-links a{white-space:nowrap;flex:none}
  .reading-hero-art{width:min(100%,345px);justify-self:center;transform:rotate(1deg)}
  .reading-hero-art img{height:180px;border-radius:105px 105px 15px 15px;border-width:4px}
  .mobile-swipe-hint{display:block;margin:0 0 14px;color:#52775e;font-size:.79rem;font-weight:800;letter-spacing:.01em}
  .swipe-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:5px 0 13px}
  .swipe-toolbar .mobile-swipe-hint{max-width:205px;margin:0;line-height:1.4}
  .swipe-controls{display:flex;align-items:center;gap:6px;flex:none}
  .swipe-controls button{display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid #c7d9cb;border-radius:50%;background:#fff;color:var(--green2);font-size:1.65rem;line-height:1;cursor:pointer}
  .swipe-controls button:disabled{opacity:.35;cursor:default}
  .swipe-controls span{min-width:31px;text-align:center;color:#517060;font-size:.75rem;font-weight:800;white-space:nowrap}
  .reading-grid.can-swipe,.daily-grid{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc(100% - 48px);gap:14px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scroll-padding-inline:0 14px;-webkit-overflow-scrolling:touch;touch-action:auto;padding:0 28px 15px 0;scrollbar-width:none}
  .reading-grid.can-swipe::-webkit-scrollbar,.daily-grid::-webkit-scrollbar{display:none}
  .reading-grid.can-swipe>* , .daily-grid>*{scroll-snap-align:start;min-width:0}
  #berita .daily-grid{margin-top:0}
  .daily-grid .daily-bridge{min-height:365px;padding:23px}
  .daily-grid .daily-actions{display:grid;grid-template-columns:1fr;justify-items:start;align-items:stretch;width:100%}
  .daily-grid .daily-actions a{min-height:43px}
}
@media(prefers-reduced-motion:no-preference){
  .reading-hero-art{animation:reading-float 7s ease-in-out infinite alternate}
  .reading-hero::before{animation:reading-orbit 12s ease-in-out infinite alternate}
  .reading-reveal{opacity:0;transform:translateY(18px)}
  .reading-reveal.is-visible{opacity:1;transform:translateY(0);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
  @keyframes reading-float{from{transform:translateY(0) rotate(1.5deg)}to{transform:translateY(-9px) rotate(-.5deg)}}
  @keyframes reading-orbit{from{transform:translate(0,0)}to{transform:translate(-24px,18px)}}
}
@media(prefers-reduced-motion:reduce){.reading-hero-art,.reading-hero::before{animation:none}.reading-reveal{opacity:1;transform:none;transition:none}.reading-card,#berita .daily-bridge,.reading-hero-links a{transition:none}}

/* Beranda: dua deretan kartu bisa dijelajahi ke samping di HP. */
@media(max-width:650px){
  #berita-harian .home-daily-grid,#jelajahi .path-grid{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc(100% - 48px);gap:14px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scroll-padding-inline:0 14px;-webkit-overflow-scrolling:touch;touch-action:auto;padding:0 28px 8px 0;scrollbar-width:none}
  #berita-harian .home-daily-grid::-webkit-scrollbar,#jelajahi .path-grid::-webkit-scrollbar{display:none}
  #berita-harian .home-daily-grid>*,#jelajahi .path-grid>*{scroll-snap-align:start;min-width:0}
  #berita-harian .home-news-card{min-height:255px}
  #jelajahi .path-card{min-height:205px;padding:24px}
}

/* Bacaan YPWIK: susunan jurnal dengan artikel utama, arsip, dan rubrik. */
.blog-page{background:#f7f7f2}
.blog-masthead{background:#fff;border-bottom:1px solid #e2e8df}
.blog-masthead-inner{display:flex;align-items:end;justify-content:space-between;gap:32px;padding:52px 0 42px}
.blog-masthead h1{font-size:clamp(2.8rem,5.3vw,4.9rem);line-height:1.03;margin:12px 0 14px;color:var(--ink)}
.blog-title-dot{color:var(--gold)}
.blog-masthead p{max-width:680px;color:#5f7168;font-size:1.03rem;margin:0}
.blog-write-link{display:flex;flex-direction:column;align-items:flex-start;flex:none;min-width:187px;padding:13px 16px;border-left:3px solid var(--gold);background:#f4f1e8;color:#547066;font-size:.8rem}
.blog-write-link strong{color:var(--green2);font-size:.94rem}
.blog-write-link:hover strong{text-decoration:underline}
.blog-topics{display:flex;align-items:center;gap:30px;min-height:59px;overflow-x:auto;scrollbar-width:none;white-space:nowrap;border-bottom:1px solid #dfe6dd}
.blog-topics::-webkit-scrollbar{display:none}
.blog-topics a{display:inline-flex;align-items:center;min-height:59px;flex:none;color:#587063;font-size:.86rem;font-weight:750;border-bottom:2px solid transparent}
.blog-topics a:hover,.blog-topics a[aria-current]{color:var(--green);border-bottom-color:var(--gold)}
.blog-content{padding:47px 0 74px}
.blog-layout{display:grid;grid-template-columns:minmax(0,1.82fr) minmax(265px,.78fr);gap:clamp(27px,4vw,54px);align-items:start}
.blog-main,.blog-sidebar{min-width:0}
.blog-section-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:22px}
.blog-section-head h2{font:normal clamp(1.9rem,3vw,2.7rem)/1.13 Georgia,serif;letter-spacing:-.025em;margin:6px 0 0}
.blog-section-head>a{flex:none;color:var(--green2);font-size:.85rem;font-weight:800;text-decoration:underline;text-underline-offset:4px}
.blog-feature{overflow:hidden;background:#fff;border:1px solid #dde5dc;border-radius:17px;box-shadow:0 15px 34px rgba(20,55,43,.055)}
.blog-feature-image{position:relative;display:block;overflow:hidden;background:#d9e5d9}
.blog-feature-image img{display:block;width:100%;height:clamp(250px,30vw,365px);object-fit:cover;object-position:center 55%;transition:transform .35s ease}
.blog-feature-image:hover img{transform:scale(1.025)}
.blog-feature-image span{position:absolute;right:14px;bottom:13px;padding:5px 9px;border-radius:5px;background:rgba(16,48,38,.82);color:#fff;font-size:.68rem}
.blog-feature-copy{padding:30px 35px 34px}
.blog-category{display:inline-block;color:#9a733d;font-size:.72rem;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
.blog-feature h3{font:normal clamp(2rem,3.4vw,2.85rem)/1.12 Georgia,serif;letter-spacing:-.028em;margin:12px 0 13px}
.blog-feature h3 a:hover,.blog-post h4 a:hover{text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:4px}
.blog-feature-copy>p{max-width:660px;color:#61746b;font-size:1rem;line-height:1.65;margin:0 0 18px}
.blog-meta{color:#65786e;font-size:.81rem;font-weight:650}
.blog-read-more{display:inline-flex;gap:8px;align-items:center;margin-top:21px;color:var(--green2);font-size:.9rem;font-weight:850;border-bottom:1px solid #a6baab;padding-bottom:3px}
.blog-read-more:hover,.blog-archive-link:hover{text-decoration:underline}
.blog-more-posts{margin-top:34px}
.blog-more-posts[hidden]{display:none}
.blog-more-posts>h3{font:normal 1.75rem/1.2 Georgia,serif;margin:0 0 13px}
.blog-post-list{display:grid;gap:0;background:#fff;border:1px solid #dde5dc;border-radius:13px;padding:0 22px}
.blog-post{display:grid;grid-template-columns:145px minmax(0,1fr);gap:22px;align-items:center;padding:21px 0;border-bottom:1px solid #e4eae2}
.blog-post:last-child{border-bottom:0}
.blog-post-visual{display:grid;place-items:center;min-height:112px;overflow:hidden;border-radius:9px;background:linear-gradient(135deg,#e8efe5,#cedccf);color:#335b48;font:750 .85rem Georgia,serif;letter-spacing:.12em}
.blog-post-visual img{width:100%;height:112px;object-fit:cover}
.blog-post h4{font:normal 1.48rem/1.2 Georgia,serif;margin:5px 0 7px}
.blog-post p{color:#65766c;font-size:.88rem;line-height:1.5;margin:0 0 8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.blog-archive-link{display:inline-flex;align-items:center;gap:10px;margin-top:27px;color:var(--green2);font-size:.9rem;font-weight:850;border-bottom:1px solid #a6baab;padding-bottom:5px}
.blog-sidebar{display:grid;gap:20px;padding-top:9px}
.blog-side-panel,.blog-contribute{padding:26px 27px;border:1px solid #dce5d9;border-radius:14px;background:#fff}
.blog-sidebar h2{font:normal 1.62rem/1.18 Georgia,serif;letter-spacing:-.02em;margin:9px 0 20px}
.blog-rubric-links{display:grid}
.blog-rubric-links a{display:flex;align-items:center;justify-content:space-between;min-height:44px;gap:12px;border-top:1px solid #edf0ea;color:#294d3e;font-size:.9rem;font-weight:700}
.blog-rubric-links a span{color:#829c8c}
.blog-rubric-links a:hover{color:#9c6a25}
.blog-contribute{background:#e8efe7}
.blog-contribute p{color:#5c7466;font-size:.9rem;line-height:1.55;margin:-7px 0 17px}
.blog-contribute a{color:var(--green2);font-size:.88rem;font-weight:850;text-decoration:underline;text-underline-offset:4px}
.blog-daily{background:#ecf1e9}
.blog-daily .blog-section-head{margin-bottom:21px}
.blog-daily .blog-section-head p{color:#5f7466;margin:8px 0 0}
.blog-daily .daily-grid{margin-top:0}
.blog-daily .daily-bridge{border-radius:13px;background:#fff;border-color:#dce5d9}
.blog-daily .daily-grid .daily-bridge.world{background:#f1f5f3}
.blog-daily .daily-bridge h3{font-size:1.72rem}
.blog-daily-note{color:#61776a;font-size:.82rem;margin:14px 0 0}
@media(max-width:900px){.blog-layout{grid-template-columns:minmax(0,1fr) 260px;gap:24px}.blog-sidebar h2{font-size:1.46rem}.blog-side-panel,.blog-contribute{padding:21px}}
@media(max-width:720px){.blog-masthead-inner{align-items:start;flex-direction:column;gap:20px;padding:38px 0 28px}.blog-masthead h1{font-size:clamp(2.7rem,10vw,3.7rem)}.blog-masthead p{font-size:.95rem}.blog-write-link{min-width:0;width:100%;padding:10px 13px}.blog-topics{gap:24px;min-height:52px}.blog-topics a{min-height:52px}.blog-content{padding:34px 0 58px}.blog-layout{grid-template-columns:1fr;gap:32px}.blog-sidebar{grid-template-columns:repeat(2,minmax(0,1fr));padding-top:0}.blog-section-head h2{font-size:2.04rem}}
@media(max-width:550px){.blog-masthead h1{font-size:2.65rem}.blog-section-head{align-items:start}.blog-section-head h2{font-size:1.93rem}.blog-section-head>a{padding-top:11px}.blog-feature-image img{height:216px}.blog-feature-copy{padding:23px 22px 25px}.blog-feature h3{font-size:2rem}.blog-feature-copy>p{font-size:.93rem}.blog-sidebar{grid-template-columns:1fr;gap:15px}.blog-post{grid-template-columns:100px minmax(0,1fr);gap:14px;padding:16px 0}.blog-post-list{padding:0 15px}.blog-post-visual,.blog-post-visual img{height:91px;min-height:91px}.blog-post h4{font-size:1.22rem}.blog-post p{display:none}.blog-daily .daily-bridge h3{font-size:1.52rem}}
@media(prefers-reduced-motion:reduce){.blog-feature-image img{transition:none}}

/* Menu halaman publik: panel ringkas dan mudah dipindai pada HP/tablet. */
@media(max-width:1050px){
  .nav-shell .menu-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 14px;border:1px solid #cddbd0;border-radius:12px;background:#f7faf6;color:var(--green);font-size:.88rem;font-weight:800;line-height:1.2;white-space:nowrap;transition:background .18s,color .18s,border-color .18s}
  .nav-shell .menu-button[aria-expanded="true"]{background:var(--green);border-color:var(--green);color:#fff}
  .nav-shell .links{display:none;position:absolute;top:calc(100% + 8px);left:auto;right:14px;width:min(450px,calc(100vw - 28px));max-height:calc(100dvh - 105px);overflow-y:auto;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:8px;padding:14px;border:1px solid #dce6db;border-radius:18px;background:#fff;box-shadow:0 24px 55px rgba(10,39,30,.19);font-size:.9rem}
  .nav-shell .links.open{display:grid}
  .nav-shell .links a{display:flex;align-items:center;min-width:0;min-height:49px;margin:0;padding:10px 13px;border:1px solid #e3eae1;border-radius:11px;background:#f7faf6;color:var(--ink);line-height:1.25;text-decoration:none;transition:background .18s,border-color .18s,transform .18s}
  .nav-shell .links a:hover{background:#eaf2e9;border-color:#b8cdbd;color:var(--green2)}
  .nav-shell .nav .links a[aria-current="page"]{background:#e7f0e7;border-color:#a8c6ad;color:var(--green2);text-decoration:none;box-shadow:inset 3px 0 var(--gold)}
  .nav-shell .links .family-nav-link{grid-column:1/-1;justify-content:space-between;margin-top:4px;padding:10px 13px;border:1px solid #e5d9bd;background:#f8f3e8;color:var(--green2)}
  .nav-shell .links .family-nav-link::after{content:"→";font-size:1.15rem;line-height:1;color:#a77935}
  .nav-shell .links .menu-writer-link{grid-column:1/-1;justify-content:center;margin:0;padding:10px 13px;border:1px solid var(--green);background:var(--green);color:#fff;font-weight:800;text-align:center}
  .nav-shell .links .menu-writer-link:hover{background:var(--green2);border-color:var(--green2);color:#fff}
}
@media(max-width:380px){.nav-shell .links{gap:7px;padding:11px}.nav-shell .links a{font-size:.83rem;padding:9px 10px}}
@media(prefers-reduced-motion:no-preference){.nav-shell .links.open{animation:ypwi-menu-in .18s ease-out both}@keyframes ypwi-menu-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}}

/* Keluarga Wahdah: warna yang kaya dengan hierarki dan kontras yang tenang. */
.wahdah-page{background:#f7f5ed}
.wahdah-page .network-subhero{position:relative;isolation:isolate;overflow:hidden;padding:86px 0 91px;background:radial-gradient(circle at 85% 15%,rgba(215,168,84,.29),transparent 33%),linear-gradient(125deg,#103d35 3%,#176759 62%,#23536d 100%);color:#fff;border-bottom:5px solid #d7aa5d}
.wahdah-page .network-subhero::before{content:"";position:absolute;z-index:-1;width:560px;height:560px;right:-115px;top:-280px;border:1px solid rgba(255,255,255,.21);border-radius:50%;box-shadow:0 0 0 70px rgba(255,255,255,.045),0 0 0 145px rgba(255,255,255,.035);pointer-events:none}
.wahdah-page .network-subhero .wrap{position:relative}
.wahdah-page .network-subhero .kicker{display:inline-block;color:#f2d59b;border-left:3px solid #e4bb6b;padding-left:13px}
.wahdah-page .network-subhero h1{color:#fff;max-width:970px;margin:18px 0 22px}
.wahdah-page .network-hero-highlight{color:#f4d08d}
.wahdah-page .network-subhero p{color:#e2eee9;max-width:710px;font-size:1.08rem;line-height:1.7;margin:0}
.wahdah-page .network-directory{--wahdah-accent:#326d54;--wahdah-tint:#f4f9f2;background:#e9f1e7;border-bottom:1px solid rgba(34,72,54,.1);padding:72px 0}
.wahdah-page .network-education{--wahdah-accent:#326d54;--wahdah-tint:#f2f8ed;background:#eaf2e5}
.wahdah-page .network-dakwah{--wahdah-accent:#176b68;--wahdah-tint:#ecf8f5;background:#e2f0eb}
.wahdah-page .network-video{--wahdah-accent:#35678a;--wahdah-tint:#eef6fb;background:#e7eff5}
.wahdah-page .network-social{--wahdah-accent:#91621e;--wahdah-tint:#fff8e9;background:#f3e9d5}
.wahdah-page .network-regional{--wahdah-accent:#65558b;--wahdah-tint:#f5f1fa;background:#eae7f1}
.wahdah-page .network-directory .section-head{margin-bottom:29px}
.wahdah-page .network-directory .kicker{display:inline-flex;align-items:center;gap:10px;color:var(--wahdah-accent)}
.wahdah-page .network-directory .kicker::before{content:"";width:8px;height:8px;flex:none;border-radius:50%;background:var(--wahdah-accent)}
.wahdah-page .network-directory h2{color:#193b32}
.wahdah-page .network-directory .section-head p{color:#4e655c}
.wahdah-page .network-card{position:relative;isolation:isolate;overflow:hidden;border:1px solid rgba(41,82,63,.14);border-top:4px solid var(--wahdah-accent);background:linear-gradient(145deg,#fff 48%,var(--wahdah-tint) 100%);box-shadow:0 14px 34px rgba(25,66,52,.075);transition:transform .2s ease,box-shadow .2s ease}
.wahdah-page .network-card::before{content:"";position:absolute;z-index:-1;width:150px;height:150px;right:-72px;top:-77px;border-radius:50%;background:var(--wahdah-accent);opacity:.07;pointer-events:none}
.wahdah-page .network-card:hover{transform:translateY(-4px);box-shadow:0 20px 42px rgba(25,66,52,.14)}
.wahdah-page .network-card-tag{display:inline-flex;align-items:center;min-height:29px;padding:5px 10px;border-radius:999px;background:var(--wahdah-accent);color:#fff;font-size:.68rem;letter-spacing:.1em}
.wahdah-page .network-card h3{color:#173a32}
.wahdah-page .network-card-action{color:var(--wahdah-accent)}
.wahdah-page .network-prayer{background:linear-gradient(145deg,#fff 45%,#fff3d9 100%)}
.wahdah-page .network-quicklinks{color:#584e38}
.wahdah-page .network-quicklinks a{border-color:#d9c89d;background:#fffaf0;color:#755018}
.wahdah-page .network-quicklinks a:hover{background:#f9edce}
.wahdah-page .network-more{border-color:#cbc3df;background:#fcfaff}
.wahdah-page .network-more summary{color:#59477e}
.wahdah-page .network-more-list a{border-color:#d7cee6;background:#fff;color:#59477e}
.wahdah-page .network-more-list a:hover{background:#f0eaf8}
@media(max-width:650px){.wahdah-page .network-subhero{padding:55px 0 60px}.wahdah-page .network-subhero::before{width:370px;height:370px;right:-220px;top:-150px}.wahdah-page .network-subhero h1{font-size:clamp(2.2rem,9vw,3rem)}.wahdah-page .network-subhero p{font-size:.96rem;line-height:1.65}.wahdah-page .network-directory{padding:53px 0}.wahdah-page .network-directory .section-head{margin-bottom:21px}.wahdah-page .network-card{padding:23px}}
.wahdah-page footer .wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center}

/* Unit pendidikan: warna khas per jenjang dengan gerak yang tenang. */
.school-page{background:#f7f5ee}
.school-page .school-hero{position:relative;overflow:hidden;background:radial-gradient(circle at 82% 18%,#dceacb 0,transparent 29%),linear-gradient(120deg,#f7f0df 0%,#edf2e8 58%,#e3eee8 100%)}
.school-page .school-hero::before{content:"";position:absolute;right:-180px;top:-310px;width:610px;height:610px;border:1px solid rgba(35,90,75,.16);border-radius:50%;box-shadow:0 0 0 85px rgba(35,90,75,.035),0 0 0 170px rgba(35,90,75,.025);pointer-events:none}
.school-page .school-hero-inner{position:relative;display:grid;grid-template-columns:minmax(0,1.14fr) minmax(330px,.86fr);gap:65px;align-items:center;padding:80px 0 88px}
.school-page .school-hero .kicker{color:#386b52}
.school-page .school-hero h1{max-width:710px;color:#173e35;margin:19px 0 23px;font-size:clamp(3rem,5.4vw,5rem)}
.school-page .school-hero h1 em{font-style:normal;color:#ae7941}
.school-page .school-hero p{max-width:620px;color:#4d655a;font-size:1.08rem;line-height:1.75;margin:0 0 30px}
.school-page .school-hero-link{display:inline-flex;align-items:center;gap:17px;background:#174a3c;color:#fff;padding:13px 19px;border-radius:999px;font-weight:800;font-size:.91rem;box-shadow:0 12px 28px rgba(23,74,60,.16);transition:transform .2s ease,background .2s ease}
.school-page .school-hero-link:hover{background:#246b54;transform:translateY(-2px)}
.school-page .school-hero-link span{font-size:1.2rem;line-height:1}
.school-page .school-journey{position:relative;isolation:isolate;overflow:hidden;min-height:328px;display:flex;flex-direction:column;justify-content:space-between;padding:33px;border-radius:24px;color:#fff;background:linear-gradient(145deg,#174b3e 7%,#2b6957 70%,#426e6f 100%);box-shadow:0 25px 55px rgba(24,65,52,.2)}
.school-page .school-journey::before{content:"";position:absolute;z-index:-1;width:345px;height:345px;border:1px solid rgba(255,255,255,.22);border-radius:50%;right:-155px;top:-190px;box-shadow:0 0 0 54px rgba(255,255,255,.06),0 0 0 107px rgba(255,255,255,.035)}
.school-page .school-journey-label{font-size:.76rem;font-weight:850;letter-spacing:.18em;text-transform:uppercase;color:#f0d496}
.school-page .school-journey-stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;align-items:end;margin:24px 0}
.school-page .school-journey-stages span{display:grid;place-items:center;border-radius:12px 12px 8px 8px;min-height:70px;font:normal clamp(1.15rem,2vw,1.55rem)/1 Georgia,serif;background:#79aa79;color:#143d30;box-shadow:0 9px 20px rgba(4,34,25,.13)}
.school-page .school-journey-stages span:nth-child(2){min-height:85px;background:#86c2af}
.school-page .school-journey-stages span:nth-child(3){min-height:100px;background:#83b0c7}
.school-page .school-journey-stages span:nth-child(4){min-height:115px;background:#e6bd75}
.school-page .school-journey-branch{display:block;border-top:1px solid rgba(255,255,255,.3);padding-top:18px;color:#e6f0e7;font-size:.92rem}
.school-page .school-units{background:linear-gradient(180deg,#f7f5ee,#eff2e9);padding:83px 0 88px}
.school-page .school-section-head{margin-bottom:31px}
.school-page .school-section-head h2{font-size:clamp(2.35rem,4vw,3.5rem);color:#173e35}
.school-page .school-section-head p{max-width:390px;line-height:1.7}
.school-page .school-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.school-page .school-card{position:relative;isolation:isolate;overflow:hidden;min-height:292px;display:flex;flex-direction:column;justify-content:space-between;padding:28px 31px 29px;border:0;border-radius:22px;color:#fff;background:var(--school-gradient);box-shadow:0 17px 34px rgba(30,63,55,.15);transition:transform .24s ease,box-shadow .24s ease}
.school-page .school-card::before{content:"";position:absolute;z-index:-1;right:-94px;top:-195px;width:340px;height:340px;border:1px solid rgba(255,255,255,.27);border-radius:50%;box-shadow:0 0 0 50px rgba(255,255,255,.065),0 0 0 105px rgba(255,255,255,.035);transition:transform .35s ease}
.school-page .school-card::after{content:"";position:absolute;z-index:-1;right:23px;bottom:20px;width:100px;height:100px;border:1px solid rgba(255,255,255,.12);border-radius:50%;pointer-events:none}
.school-page .school-card:hover{transform:translateY(-5px);box-shadow:0 24px 44px rgba(30,63,55,.22)}
.school-page .school-card:hover::before{transform:translate(-12px,12px)}
.school-page .school-card-top{justify-content:space-between;align-items:flex-start;gap:15px}
.school-page .school-level{min-width:50px;min-height:42px;border:1px solid rgba(255,255,255,.35);border-radius:11px;background:rgba(255,255,255,.16);color:#fff;font-size:.92rem;backdrop-filter:blur(4px)}
.school-page .school-card-top small{max-width:190px;padding-top:10px;text-align:right;color:#f4f7ef;font-size:.66rem;letter-spacing:.14em;line-height:1.5}
.school-page .school-card-copy{position:relative;max-width:440px}
.school-page .school-card-number{color:#f8e5be;font-size:.69rem;font-weight:850;letter-spacing:.2em}
.school-page .school-card h3{color:#fff;font-size:clamp(1.65rem,2.65vw,2.25rem);line-height:1.14;margin:8px 0 10px;overflow-wrap:normal}
.school-page .school-card p{color:#edf6ee;font-size:.93rem;line-height:1.5;margin:0}
.school-page .school-tk{--school-gradient:linear-gradient(135deg,#29664d,#337658)}
.school-page .school-sd{--school-gradient:linear-gradient(135deg,#1b6b6d,#237b75)}
.school-page .school-smp{--school-gradient:linear-gradient(135deg,#315779,#416e8d)}
.school-page .school-sma{--school-gradient:linear-gradient(135deg,#875a2d,#93622f)}
.school-page .school-ptq-putra{--school-gradient:linear-gradient(135deg,#365f53,#4b6d5b)}
.school-page .school-ptq-putri{--school-gradient:linear-gradient(135deg,#634d69,#765e75)}
.school-page .school-next{display:flex;justify-content:center;align-items:center;gap:10px 20px;flex-wrap:wrap;margin-top:37px;text-align:center;color:#52695b;font-size:.95rem}
.school-page .school-next p{margin:0}
.school-page .school-next a{color:#1b5a48;font-weight:850;text-decoration:underline;text-underline-offset:5px}
.school-page footer .wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;text-align:center}
@media(max-width:900px){.school-page .school-hero-inner{grid-template-columns:minmax(0,1fr) minmax(260px,.8fr);gap:25px}.school-page .school-journey{min-height:282px;padding:25px}}
@media(max-width:700px){.school-page .school-hero-inner{grid-template-columns:1fr;gap:32px;padding:54px 0 58px}.school-page .school-hero h1{font-size:clamp(2.65rem,10vw,3.5rem)}.school-page .school-hero p{font-size:.98rem;line-height:1.66}.school-page .school-journey{min-height:218px;padding:23px}.school-page .school-journey-stages{margin:15px 0}.school-page .school-journey-stages span{min-height:45px}.school-page .school-journey-stages span:nth-child(2){min-height:54px}.school-page .school-journey-stages span:nth-child(3){min-height:63px}.school-page .school-journey-stages span:nth-child(4){min-height:72px}.school-page .school-units{padding:57px 0 64px}.school-page .school-grid{grid-template-columns:1fr;gap:14px}.school-page .school-card{min-height:238px;padding:22px 23px 23px}.school-page .school-card h3{font-size:clamp(1.7rem,7.5vw,2rem)}.school-page .school-section-head{margin-bottom:25px}.school-page .school-section-head h2{font-size:2.45rem}}
@media(prefers-reduced-motion:reduce){.school-page .school-card,.school-page .school-card::before,.school-page .school-hero-link{transition:none}}
.school-page .school-footer{position:relative;isolation:isolate;overflow:hidden;padding:58px 0 38px;background:radial-gradient(circle at 50% -90%,rgba(183,223,184,.17),transparent 60%),linear-gradient(135deg,#123b33,#20594e 68%,#315f61);color:#e3efe6}
.school-page .school-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,#78a67e 0 16.67%,#5ca59d 16.67% 33.34%,#6f94b0 33.34% 50.01%,#cc9b60 50.01% 66.68%,#7c9a80 66.68% 83.35%,#a889a5 83.35% 100%)}
.school-page .school-footer::after{content:"";position:absolute;z-index:-1;width:420px;height:420px;left:calc(50% - 210px);top:-320px;border:1px solid rgba(255,255,255,.15);border-radius:50%;box-shadow:0 0 0 60px rgba(255,255,255,.035),0 0 0 125px rgba(255,255,255,.02);pointer-events:none}
.school-page .school-footer .wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;text-align:center}
.school-page .school-footer-kicker{color:#f0d59b;font-size:.74rem;font-weight:850;letter-spacing:.2em;text-transform:uppercase}
.school-page .school-footer p{font:normal clamp(1.3rem,2.5vw,1.75rem)/1.3 Georgia,serif;color:#fff;margin:11px 0 23px}
.school-page .school-footer-bottom{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;width:min(100%,570px);border-top:1px solid rgba(255,255,255,.22);padding-top:18px;font-size:.84rem}
.school-page .school-footer-bottom>span{color:#c8ddd1}
.school-page .school-footer-bottom a{color:#f2d99d;font-weight:800;text-decoration:underline;text-underline-offset:4px}
@media(max-width:650px){.school-page .school-footer{padding:49px 0 31px}.school-page .school-footer-bottom{flex-direction:column;gap:10px}}

/* Unit sekolah: tiap kartu masuk dari bawah ketika muncul di layar. */
@media(prefers-reduced-motion:no-preference){
  html.school-reveal-ready .school-page .school-card.school-scroll-reveal{opacity:0;transform:translateY(34px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1)}
  html.school-reveal-ready .school-page .school-card.school-scroll-reveal.is-visible{opacity:1;transform:translateY(0)}
  html.school-reveal-ready .school-page .school-card.school-scroll-reveal.is-visible:hover{transform:translateY(-5px)}
}

/* Footer umum selalu berada di tengah pada HP, tablet, dan desktop. */
footer:not(.school-footer) > .wrap{
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  text-align:center;
}
.home-footer{background:#10332b;color:#cbdcd1;padding:27px 0;font-size:.84rem}
.home-footer>.wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center}
.home-footer .home-social-links{display:flex;justify-content:center;gap:6px;margin:0 0 5px}
.home-footer .home-social-links a{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:32px;padding:4px 10px;border:1px solid rgba(235,245,238,.25);border-radius:999px;background:rgba(255,255,255,.04);color:#fff;font-size:.68rem;font-weight:700;transition:background .2s ease}
.home-footer .home-social-links a:hover{background:rgba(255,255,255,.11)}
.home-footer .home-social-links a span{display:grid;place-items:center;width:15px;height:15px;border:1px solid rgba(235,245,238,.35);border-radius:50%;background:transparent;color:#fff;font-size:.62rem;font-weight:800}
.home-footer .home-social-links a:first-child span{background:transparent}
@media(min-width:651px){.home-footer>.wrap{width:min(1160px,calc(100% - 40px));margin-inline:auto;align-items:center;justify-content:center;text-align:center}.home-footer .home-social-links{width:100%;flex-wrap:wrap;align-items:center;justify-content:center;margin-inline:auto}.home-footer>.wrap>span{text-align:center}}
.school-page .school-card{min-height:318px}
.school-page .school-card-action{display:inline-flex;align-items:center;gap:9px;margin-top:19px;color:#fff;font-size:.81rem;font-weight:850;text-decoration:underline;text-underline-offset:4px}
.school-page .school-card-action span{font-size:1.1rem;line-height:1}
.school-page .school-card-stats{display:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:16px 0 0}
.school-page .school-card-stats:not([hidden]){display:grid}
.school-page .school-card-stats>div{min-width:0;padding:8px 9px;border:1px solid rgba(255,255,255,.2);border-radius:10px;background:rgba(255,255,255,.1)}
.school-page .school-card-stats dt{color:rgba(255,255,255,.78);font-size:.64rem;font-weight:750;line-height:1.2;letter-spacing:.035em}
.school-page .school-card-stats dd{margin:3px 0 0;color:#fff;font-size:1.06rem;font-weight:850;line-height:1.1;font-variant-numeric:tabular-nums}
.school-profile-page{--profile-from:var(--theme-dark,#10372f);--profile-to:var(--theme-primary,#16483d);--profile-accent:var(--theme-primary,#16483d);--profile-tint:color-mix(in srgb,var(--theme-soft,#e8efe9) 78%,var(--theme-page,#f6f4ec))}
.school-profile-page .school-profile-hero{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(125deg,var(--theme-dark,#10372f),var(--theme-primary,#16483d) 62%,var(--theme-secondary,#286354));color:#fff;padding:56px 0 76px}
.school-profile-page .school-profile-hero::before{content:"";position:absolute;z-index:-1;width:620px;height:620px;right:-140px;top:-350px;border:1px solid rgba(255,255,255,.22);border-radius:50%;box-shadow:0 0 0 75px rgba(255,255,255,.05),0 0 0 160px rgba(255,255,255,.035);pointer-events:none}
.school-profile-page .school-profile-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;gap:clamp(24px,4vw,64px)}
.school-profile-page .school-profile-hero-copy{min-width:0}
.school-profile-page .school-profile-hero-photo{position:relative;overflow:hidden;aspect-ratio:4/3;margin:0;border:6px solid rgba(255,255,255,.9);border-radius:25px;background:rgba(255,255,255,.12);box-shadow:0 23px 55px rgba(0,0,0,.24),0 2px 12px rgba(0,0,0,.12)}
.school-profile-page .school-profile-slideshow-stage{position:absolute;inset:0;overflow:hidden}
.school-profile-page .school-profile-photo-slide{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s ease}
.school-profile-page .school-profile-photo-slide.is-active{opacity:1}
.school-profile-page .school-profile-gallery-dots{position:absolute;z-index:2;left:50%;bottom:15px;display:flex;align-items:center;justify-content:center;gap:8px;transform:translateX(-50%);padding:7px 10px;border:1px solid rgba(255,255,255,.36);border-radius:999px;background:rgba(12,31,28,.52);backdrop-filter:blur(8px)}
.school-profile-page .school-profile-gallery-dots button{width:9px;height:9px;padding:0;border:1px solid #fff;border-radius:50%;background:rgba(255,255,255,.48);cursor:pointer;transition:transform .2s ease,background .2s ease}
.school-profile-page .school-profile-gallery-dots button.is-active{transform:scale(1.2);background:#fff}
.school-profile-page .school-profile-gallery-dots button:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.school-profile-page .school-profile-photo-slide,.school-profile-page .school-profile-gallery-dots button{transition:none}}
.school-profile-page .school-profile-photo-credit{position:absolute;right:14px;bottom:14px;z-index:1;margin:0;padding:7px 11px;border:1px solid rgba(255,255,255,.38);border-radius:999px;background:rgba(18,45,39,.74);box-shadow:0 5px 16px rgba(0,0,0,.16);backdrop-filter:blur(8px);font:700 .72rem/1.2 system-ui,sans-serif}
.school-profile-page .school-profile-photo-credit a{color:#fff;text-decoration:none}
.school-profile-page .school-profile-photo-credit a:hover{text-decoration:underline}
.school-profile-page .school-profile-photo-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;width:100%;height:100%;padding:30px;text-align:center;background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.07));color:#fff}
.school-profile-page .school-profile-photo-placeholder img{width:76px;height:76px;object-fit:contain;filter:drop-shadow(0 8px 12px rgba(0,0,0,.18))}
.school-profile-page .school-profile-photo-placeholder span{font-size:.73rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:#f5dfa9}
.school-profile-page .school-profile-photo-placeholder strong{max-width:24ch;font:normal clamp(1.35rem,2.2vw,2rem)/1.2 Georgia,serif}
.school-profile-page .school-profile-breadcrumb{display:flex;align-items:center;gap:10px;color:#e5efe7;font-size:.85rem;margin-bottom:53px}
.school-profile-page .school-profile-breadcrumb a{text-decoration:underline;text-underline-offset:4px}
.school-profile-page .school-profile-label{display:inline-block;padding:7px 12px;border:1px solid rgba(255,255,255,.34);border-radius:999px;color:#fff;font-size:.73rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase;background:rgba(255,255,255,.11)}
.school-profile-page .school-profile-hero h1{max-width:840px;color:#fff;font-size:clamp(2.8rem,5vw,4.65rem);margin:19px 0 20px}
.school-profile-page .school-profile-hero p{color:#edf5ee;font-size:1.12rem;margin:0}
.school-profile-page .school-profile-content{padding:72px 0;background:linear-gradient(180deg,var(--theme-page),color-mix(in srgb,var(--theme-soft) 72%,var(--theme-page)))}
.school-profile-page .school-profile-layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(300px,.88fr);gap:22px;align-items:stretch}
.school-profile-page .school-profile-facts,.school-profile-page .school-profile-vision{min-width:0;border-radius:20px;padding:37px 39px}
.school-profile-page .school-profile-facts{background:color-mix(in srgb,#fff 91%,var(--theme-page));box-shadow:0 16px 40px color-mix(in srgb,var(--theme-dark) 10%,transparent);border:1px solid var(--theme-line);color:var(--theme-ink)}
.school-profile-page .school-profile-facts .kicker{color:var(--profile-accent)}
.school-profile-page .school-profile-facts h2,.school-profile-page .school-profile-vision h2,.school-profile-page .school-profile-stories h2{font:normal clamp(1.9rem,3vw,2.55rem)/1.16 Georgia,serif;letter-spacing:-.025em;margin:11px 0 24px}
.school-profile-page .school-profile-facts dl{margin:0}
.school-profile-page .school-profile-facts dl>div{display:grid;grid-template-columns:155px minmax(0,1fr);gap:18px;border-top:1px solid var(--theme-line);padding:16px 0}
.school-profile-page .school-profile-facts dt{color:var(--theme-secondary);font-size:.83rem;font-weight:800}
.school-profile-page .school-profile-facts dd{margin:0;color:var(--theme-ink);font-size:.94rem;line-height:1.55}
.school-profile-page .school-profile-facts dd a,.school-profile-page .school-profile-source a{color:var(--profile-accent);font-weight:800;text-decoration:underline;text-underline-offset:4px}
.school-profile-page .school-profile-source{font-size:.8rem;color:var(--theme-muted);margin:19px 0 0}
.school-profile-page .school-profile-vision{display:flex;flex-direction:column;align-items:flex-start;background:linear-gradient(145deg,color-mix(in srgb,#fff 60%,var(--profile-tint)),var(--profile-tint));border:1px solid color-mix(in srgb,var(--theme-primary) 18%,var(--theme-line))}
.school-profile-page .school-profile-vision .kicker{color:var(--profile-accent)}
.school-profile-page .school-profile-vision h2{color:var(--theme-ink);margin-bottom:16px}
.school-profile-page .school-profile-vision p{color:var(--theme-muted);line-height:1.7;margin:0 0 26px}
.school-profile-page .school-profile-vision a{margin-top:auto;color:var(--profile-accent);font-size:.89rem;font-weight:850;text-decoration:underline;text-underline-offset:4px}
.school-profile-page .school-profile-stories{padding:62px 0;background:linear-gradient(180deg,var(--theme-soft),color-mix(in srgb,var(--theme-soft) 70%,var(--theme-page)))}
.school-profile-page .school-profile-stories .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:35px;align-items:center}
.school-profile-page .school-profile-stories h2{max-width:660px;color:var(--theme-ink);margin-bottom:12px}
.school-profile-page .school-profile-stories p{max-width:610px;margin:0;color:var(--theme-muted)}
.school-profile-page .school-profile-actions{display:flex;flex-direction:column;align-items:stretch;gap:10px}
.school-profile-page .school-profile-actions a{min-width:175px;text-align:center;padding:11px 17px;border:1px solid var(--theme-primary);border-radius:9px;background:var(--theme-primary);color:#fff;font-size:.84rem;font-weight:850}
.school-profile-page .school-profile-actions a:last-child{background:var(--theme-page);color:var(--theme-primary)}
.school-profile-page .school-profile-actions a:hover{transform:translateY(-2px)}
.school-profile-page .school-profile-return{padding:28px 0 37px}
.school-profile-page .school-profile-return a{color:var(--theme-primary);font-weight:800;text-decoration:underline;text-underline-offset:4px}
@media(max-width:850px){.school-profile-page .school-profile-layout{grid-template-columns:1fr}.school-profile-page .school-profile-stories .wrap{grid-template-columns:1fr}.school-profile-page .school-profile-actions{flex-direction:row;flex-wrap:wrap}}
@media(max-width:850px){.school-profile-page .school-profile-hero-grid{grid-template-columns:1fr}.school-profile-page .school-profile-hero-photo{width:min(100%,600px);margin-inline:auto}}
@media(max-width:700px){.school-page .school-card{min-height:320px}.school-profile-page .school-profile-hero{padding:35px 0 57px}.school-profile-page .school-profile-breadcrumb{margin-bottom:42px}.school-profile-page .school-profile-hero h1{max-width:none;font-size:clamp(1.2rem,5.8vw,1.95rem);white-space:nowrap;letter-spacing:-.045em}.school-profile-page .school-profile-hero p{font-size:1rem}.school-profile-page .school-profile-content{padding:42px 0}.school-profile-page .school-profile-facts,.school-profile-page .school-profile-vision{padding:26px 23px}.school-profile-page .school-profile-facts dl>div{grid-template-columns:1fr;gap:3px;padding:12px 0}.school-profile-page .school-profile-stories{padding:45px 0}.school-profile-page .school-profile-actions{flex-direction:column}.school-profile-page .school-profile-actions a{width:100%}}

/* Jalur utama dari konten ke sekolah dan layanan. */
.hero-quick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 18px}
.hero-quick a{display:flex;flex-direction:column;justify-content:center;gap:5px;min-height:94px;padding:15px;border:1px solid rgba(255,255,255,.35);border-radius:12px;background:rgba(255,255,255,.09);color:#fff;transition:background .2s,transform .2s}
.hero-quick a:hover{background:rgba(255,255,255,.18);transform:translateY(-2px)}
.hero-quick span{color:#f2d69a;font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.hero-quick strong{font-size:.9rem;line-height:1.3}
.hero-quick .quick-mobile{display:none}
.home-page .hero-quick .quick-mobile-category{color:#e6af5a;font-size:inherit;font-weight:800;letter-spacing:0;text-transform:none}
@media(max-width:650px){.hero-quick .quick-desktop-label,.hero-quick .quick-desktop{display:none}.hero-quick .quick-mobile{display:block}}
.hero .actions{margin-top:8px}
.blog-topic-hint{display:none}
.blog-service-bridge{margin:22px 0;padding:19px 21px;border:1px solid #dce5d9;border-radius:14px;background:#f3f0e7}
.blog-service-bridge h2{font:normal 1.6rem/1.2 Georgia,serif;margin:9px 0}
.blog-service-bridge p{color:#3e5b4c;font-size:.87rem;line-height:1.5;margin:6px 0 13px}
.blog-service-bridge>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.blog-service-bridge a{display:flex;justify-content:space-between;gap:7px;align-items:center;min-height:44px;padding:9px 12px;border:1px solid #cad6c7;border-radius:8px;background:#fff;color:var(--green2);font-size:.85rem;font-weight:800}
.blog-service-bridge a:hover{text-decoration:underline}
.school-profile-cta{display:flex;flex-wrap:wrap;align-items:center;gap:11px;margin-top:24px}
.school-profile-cta .button{min-height:48px}
.school-contact-pending{display:inline-flex;align-items:center;min-height:48px;padding:9px 14px;border:1px solid color-mix(in srgb,#fff 48%,var(--theme-primary));border-radius:8px;background:color-mix(in srgb,#fff 9%,transparent);color:#fff;font:700 .84rem Arial,sans-serif;cursor:not-allowed}
.home-daily-note,.blog-daily-note,.mobile-swipe-hint,.blog-feature-copy>p,.blog-post p,.app-card p{color:#3d5b4c}
.blog-topics a{color:#3d5b4c}
.blog-category{color:#79572b}
.blog-meta,.story-card p,.app-note,.service-group>p{color:#4b6255}
.path-card p,.blog-contribute p,.blog-daily .blog-section-head p,.daily-bridge p{color:#435d4d}
.story-card .story-credit{display:block;margin-top:13px;color:#435b4c;font-size:.79rem;line-height:1.5}
.story-card .story-read-more{min-height:44px;align-items:center}
.story-card h3 a:hover{text-decoration:underline;text-underline-offset:4px}
.story-feature[hidden],.story-card[hidden]{display:none}
@media(max-width:850px){.hero-quick{grid-template-columns:1fr 1fr}}
@media(max-width:650px){
  .hero-inner{padding-top:18px}.hero-art{order:0;width:100%;margin:18px 0 0}.hero-image{height:180px}
  .hero h1{font-size:clamp(2.15rem,8vw,2.7rem);margin:15px 0}.hero p{margin-bottom:18px}
  .hero-quick{grid-template-columns:1fr;gap:8px;margin-bottom:11px}
  .hero-quick a{min-height:60px;padding:9px 13px;gap:1px}
  .hero-quick strong{font-size:.94rem}
  .hero .actions .button{min-height:44px}
  .blog-topic-wrap{position:relative;border-bottom:1px solid #dfe6dd}
  .blog-topic-wrap::after{content:"";position:absolute;right:0;bottom:0;width:30px;height:52px;background:linear-gradient(90deg,transparent,#f7f7f2);pointer-events:none}
  .blog-topic-hint{display:block;padding-top:12px;margin-bottom:0;color:#315645;font-size:.77rem;font-weight:800}
  .blog-topics{width:100%;padding-inline:14px 35px;border-bottom:0;gap:15px}
  .blog-topics a{min-height:44px;padding:0 12px;border:1px solid #c6d7c9;border-radius:999px;background:#fff}
  .blog-topics a[aria-current]{border-color:var(--green2);background:#e9f0e8}
  .blog-service-bridge{padding:17px 15px}.blog-service-bridge a{font-size:.81rem;padding:9px 10px}
  .service-intro{padding:21px 0 23px}.service-intro h1{font-size:2rem;margin:8px 0}.service-intro p{margin-bottom:0;font-size:.92rem}
  .app-hub{padding-top:17px}.app-hub .service-group:first-child{padding-top:14px}
  .app-hub .service-group:first-child>p{display:none}.app-hub .service-group:first-child .app-grid{margin-top:16px}
  .school-profile-cta{flex-direction:column;align-items:stretch}
  .school-profile-cta .button,.school-contact-pending{width:100%;justify-content:center;text-align:center}
}

/* Galeri foto kegiatan dari unggahan resmi yayasan. */
.gallery-jump{display:inline-flex;align-items:center;min-height:44px;margin-top:5px;color:#f3d595;font-weight:800;text-decoration:underline;text-underline-offset:5px}
.social-gallery{background:#ecf2e9}
.social-gallery .section-head p{color:#405c4f}
.social-gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.social-gallery-card{min-width:0;margin:0;background:#fff;border:1px solid #d9e4d8;border-radius:15px;overflow:hidden;box-shadow:0 12px 30px rgba(20,55,43,.045)}
.social-gallery-image{display:block;overflow:hidden;background:#dce6da}
.social-gallery-image img{display:block;width:100%;height:245px;object-fit:cover;transition:transform .25s ease}
.social-gallery-image:hover img{transform:scale(1.025)}
.social-gallery-card figcaption{display:flex;flex-direction:column;gap:2px;padding:16px 18px 18px}
.social-gallery-card strong{font-size:1rem;line-height:1.35;color:var(--ink)}
.social-gallery-card span{color:#536b5b;font-size:.84rem}
.social-gallery-card .social-gallery-source{align-self:flex-start;margin-top:8px;padding:4px 9px;border:1px solid #dce5da;border-radius:999px;background:#f2f6ef;color:#315b4d;font-size:.72rem;font-weight:800;letter-spacing:.035em;line-height:1.2}
.social-gallery-card .social-gallery-source.is-instagram{border-color:#ead7df;background:#fbf3f6;color:#8b4968}
.social-gallery-card .social-gallery-source.is-facebook{border-color:#d5e1ea;background:#f1f6fa;color:#315c78}
.social-gallery-card figcaption a{align-self:flex-start;display:inline-flex;align-items:center;min-height:44px;margin-top:7px;color:var(--green2);font-size:.82rem;font-weight:800;text-decoration:underline;text-underline-offset:3px}
.social-gallery-more{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}
.social-gallery-more a{display:inline-flex;align-items:center;min-height:44px;padding:9px 14px;background:#fff;border:1px solid #cadacb;border-radius:9px;color:var(--green2);font-size:.84rem;font-weight:800}
@media(max-width:850px){.social-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.social-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.social-gallery-image img{height:185px}.social-gallery-card figcaption{padding:12px 12px 14px}.social-gallery-card strong{font-size:.91rem}.social-gallery-card span{font-size:.76rem}.social-gallery-card figcaption a{font-size:.72rem;line-height:1.2}.social-gallery-more{flex-direction:column}.social-gallery-more a{justify-content:center}}
@media(max-width:370px){.social-gallery-grid{grid-template-columns:1fr}.social-gallery-image img{height:235px}}
@media(prefers-reduced-motion:reduce){.social-gallery-image img{transition:none}}

/* Beranda: pusatkan navigasi kartu Jelajahi YPWI pada HP. */
@media(max-width:650px){
  #home-path-toolbar{justify-content:center;margin:8px 0 16px}
  #home-path-toolbar .swipe-controls{gap:15px}
  #home-path-toolbar .swipe-controls button{width:46px;height:46px}
  #home-path-toolbar .swipe-controls span{min-width:46px;color:var(--green);font-size:1rem;line-height:1.2}
}

/* Foto galeri hanya dipakai saat kegiatannya sesuai dengan tujuan kartu. */
#jelajahi .path-card{
  color:#fff;
  background-color:#173d32;
  background-size:cover;
  background-position:center;
  border-color:rgba(22,64,49,.36);
  box-shadow:0 10px 24px rgba(18,53,40,.13);
  overflow:hidden;
}
#jelajahi .path-card:nth-child(1){background-image:linear-gradient(180deg,rgba(7,39,30,.48),rgba(7,39,30,.91))}
#jelajahi .path-card:nth-child(2){background-image:linear-gradient(180deg,rgba(7,39,30,.78),rgba(7,39,30,.94)),url('media/galeri/ig-teman-bercerita.webp');background-position:center 48%}
#jelajahi .path-card:nth-child(3){background-image:radial-gradient(circle at 86% 12%,rgba(220,190,123,.18),transparent 42%),linear-gradient(145deg,#28596a,#163f4a)}
#jelajahi .path-card:nth-child(4){background-image:radial-gradient(circle at 85% 12%,rgba(232,192,123,.2),transparent 44%),linear-gradient(145deg,#42614c,#173d32)}
#jelajahi .path-card .kicker{color:#f2d39a}
#jelajahi .path-card h3{color:#fff;text-shadow:0 1px 7px rgba(0,0,0,.22)}
#jelajahi .path-card p{color:#e9f2e9}
#jelajahi .path-card a{color:#fff;text-decoration:underline;text-underline-offset:4px}
#jelajahi .path-card a:focus-visible{outline:2px solid #f2d39a;outline-offset:4px}

/* The original editorial illustration stays in the hero. Activity photos follow the articles. */
.home-activities{padding:36px 0 42px;background:#f0f4ed;border-top:1px solid #e1e9dd}
.home-activities-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:17px}
.home-activities-head .kicker{display:block;margin-bottom:4px}
.home-activities-head h2{font:normal clamp(1.55rem,2.7vw,2.1rem)/1.15 Georgia,serif;margin:0;color:var(--green)}
.home-activities-head .text-link{white-space:nowrap;font-size:.88rem}
.home-activities-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.home-activity-card{min-width:0;margin:0;overflow:hidden;background:#fff;border:1px solid #d9e3d7;border-radius:13px;box-shadow:0 7px 20px rgba(13,49,38,.045)}
.home-activity-image{display:block;overflow:hidden;background:#e8eee6}
.home-activity-image img{display:block;width:100%;height:145px;object-fit:cover}
.home-activity-card.is-poster .home-activity-image img{object-fit:contain;background:#f6f7f2}
.home-activity-card figcaption{padding:10px 13px 12px;color:#284a3a;font-size:.86rem;font-weight:700;line-height:1.3}
.home-activity-image:focus-visible{outline:3px solid var(--gold);outline-offset:-3px}
@media(max-width:650px){
  .home-activities{padding:29px 0 33px}
  .home-activities-head{align-items:start;gap:8px;margin-bottom:13px}
  .home-activities-head h2{font-size:1.55rem}
  .home-activities-head .text-link{font-size:.75rem;white-space:normal;text-align:right}
  .home-activities-grid{grid-auto-flow:column;grid-auto-columns:min(73vw,260px);grid-template-columns:none;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding-bottom:4px}
  .home-activity-card{scroll-snap-align:start}
  .home-activity-image img{height:135px}
}

/* Beranda HP: foto masuk layar pertama tanpa mengecilkan area ketuk tautan. */
@media(max-width:650px){
  #beranda .hero-inner{padding-top:8px;gap:4px}
  #beranda h1{font-size:clamp(2rem,7.6vw,2.5rem);line-height:1.08;margin:10px 0}
  #beranda p{font-size:.94rem;line-height:1.45;margin-bottom:11px}
  #beranda .hero-quick{gap:5px;margin-bottom:6px}
  #beranda .hero-quick a{min-height:48px;padding:5px 11px;gap:0}
  #beranda .hero-quick strong{font-size:.9rem}
  #beranda .actions{margin-top:4px}
  #beranda .hero-art{margin:3px 0 0}
}
@media(max-width:380px){
  #beranda h1{font-size:1.95rem}
}

/* Layanan: pintu keluarga jelas, kartu ringkas, dan navigasi langsung per kelompok. */
.service-intro{position:relative;overflow:hidden;padding:49px 0 52px;background:radial-gradient(circle at 86% 10%,rgba(217,184,115,.16),transparent 31%),linear-gradient(118deg,#153c32,#205242)}
.service-intro::after{content:"";position:absolute;width:390px;height:390px;right:-65px;top:-245px;border:1px solid rgba(255,255,255,.15);border-radius:50%;pointer-events:none}
.service-intro .wrap{position:relative;z-index:1}
.service-intro h1{font-size:clamp(2.5rem,4vw,3.6rem);margin:11px 0 13px}
.service-intro p{margin:0;color:#e2eee5;max-width:670px}
.service-jump{display:flex;flex-wrap:wrap;gap:9px;margin-top:23px}
.service-jump a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 15px;border:1px solid rgba(255,255,255,.34);border-radius:999px;color:#fff;background:rgba(255,255,255,.08);font-size:.86rem;font-weight:750}
.service-jump a:hover{background:rgba(255,255,255,.18)}
.app-hub{padding:32px 0 55px;background:linear-gradient(180deg,#f5f6ee,#eef3e9)}
.app-hub .service-group{padding:37px 0;border-color:#d9e4d6}
.app-hub .service-group:first-child{padding-top:0;border-top:0}
.app-hub .service-group h2{margin:5px 0 6px}
.app-hub .service-group>p{margin:0}
.app-hub .service-group .app-grid{margin-top:19px;gap:14px}
#umum .app-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.app-hub .app-card{min-height:216px;padding:23px;border:1px solid #dce5d9;border-radius:17px;box-shadow:0 9px 25px rgba(24,65,48,.06);transition:transform .18s ease,box-shadow .18s ease}
.app-hub .app-card:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(24,65,48,.10)}
.app-hub .app-card.featured{border-top:3px solid var(--gold)}
.app-hub .app-card .app-icon{width:39px;height:39px;border-radius:50%;background:#e8f0e7;color:#285844;font-size:.72rem;letter-spacing:.05em}
.app-hub .app-card h3{margin:16px 0 7px;color:var(--ink);font:750 1.25rem/1.25 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:-.02em}
.app-hub .app-card p{color:#405b4c;line-height:1.5}
.app-hub .app-card a{display:flex;justify-content:space-between;align-self:stretch;min-height:44px;padding-top:12px;border-top:1px solid #dfe8dc;color:var(--green2);font-size:.9rem;text-decoration:none}
.app-hub .app-card a:hover{text-decoration:underline;text-underline-offset:4px}
#keluarga .app-card:nth-child(2){background:#fffcf5}
#keluarga .app-card:nth-child(3){background:#f0f6ee}
@media(min-width:651px) and (max-width:759px){#keluarga .app-card:first-child{grid-column:1/-1}}
@media(min-width:760px) and (max-width:850px){#keluarga .app-grid{grid-template-columns:repeat(3,minmax(0,1fr))}#keluarga .app-card{padding:20px}}
@media(max-width:650px){
  .service-intro{padding:24px 0 28px}
  .service-intro h1{font-size:2.13rem;margin:6px 0 9px}
  .service-intro p{font-size:.9rem;line-height:1.45}
  .service-jump{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:16px}
  .service-jump a{min-height:39px;padding:7px 5px;font-size:.74rem;text-align:center}
  .app-hub{padding:18px 0 36px}
  .app-hub .service-group,.app-hub .service-group:first-child{padding:22px 0}
  .app-hub .service-group:first-child{padding-top:0}
  .app-hub .service-group h2{font-size:1.75rem}
  .app-hub .service-group .app-grid{margin-top:15px;gap:10px}
  #umum .app-grid{grid-template-columns:1fr}
  .app-hub .app-card{display:grid;grid-template-columns:36px minmax(0,1fr);gap:0 12px;min-height:0;padding:16px 17px}
  .app-hub .app-card .app-icon{grid-column:1;grid-row:1 / span 2;width:36px;height:36px}
  .app-hub .app-card>div{grid-column:2;grid-row:1}
  .app-hub .app-card h3{font-size:1.09rem;margin:1px 0 5px}
  .app-hub .app-card p{font-size:.82rem;margin:0 0 5px}
  .app-hub .app-card a{grid-column:2;grid-row:2;align-items:center;min-height:42px;margin:0;padding:0;border-top:0;font-size:.84rem}
}
@media(prefers-reduced-motion:reduce){.app-hub .app-card{transition:none}}

/* Laptop scale: slightly tighter reading and heading sizes across public pages. */
@media(min-width:1001px){
  html{font-size:15px}
  .section{padding-block:70px}
  .section h2{font-size:clamp(1.9rem,2.75vw,2.55rem)}
  .subhero h1,.blog-masthead h1,.school-page .school-hero h1,.school-profile-page .school-profile-hero h1,.wahdah-page .network-subhero h1,.contest-head h1{font-size:clamp(2.65rem,4.1vw,3.8rem)}
  .school-page .school-section-head h2{font-size:clamp(2.1rem,3.1vw,2.85rem)}
  .school-page .school-card h3{font-size:clamp(1.4rem,2vw,1.8rem)}
}
@media(min-width:1001px){
  .reading-hero-copy h1,.service-intro h1{font-size:clamp(2.5rem,4vw,3.6rem)}
}

/* Separate the member portal entry from the public website navigation. */
.nav-shell .links .portal-door-link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-width:112px;padding:7px 12px;border:1px solid #c8d8ca;border-radius:12px;background:#edf4ee;color:#17483b;line-height:1.15;text-align:center}
.nav-shell .links .portal-door-link span{font-size:.82rem;font-weight:850}
.nav-shell .links .portal-door-link small{margin-top:3px;color:#63766a;font-size:.64rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.nav-shell .links .portal-door-link:hover{background:#dfece1;border-color:#99b8a0;color:#143d33}
@media(max-width:1050px){
 .nav-shell .links .portal-door-link{grid-column:1/-1;flex-direction:row;gap:8px;min-height:48px;margin-top:3px}
 .nav-shell .links .portal-door-link small{margin:0}
}

/* Keep the portal doorway visible beside the public-site menu at every width. */
.nav-shell .nav .portal-entry-door{display:inline-flex;align-items:center;justify-content:center;flex:none;min-height:42px;padding:8px 14px;border:1px solid #b8cdbd;border-radius:12px;background:#edf4ee;color:#17483b;font-size:.83rem;font-weight:850;white-space:nowrap}
.nav-shell .nav .portal-entry-door:hover{background:#dfece1;border-color:#99b8a0}
@media(max-width:1050px){.nav-shell .nav .portal-entry-door{min-height:44px}}
@media(max-width:650px){.nav-shell .nav{gap:8px}.nav-shell .nav .portal-entry-door{min-height:42px;padding:7px 10px;font-size:.78rem}}
@media(max-width:1050px){.nav-shell .nav{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:8px}.nav-shell .nav .brand{grid-column:1;grid-row:1;min-width:0}.nav-shell .nav .portal-entry-door{grid-column:2;grid-row:1;justify-self:center;white-space:nowrap}.nav-shell .nav .menu-button{grid-column:3;grid-row:1;justify-self:end}}
@media(max-width:650px){.nav-shell .nav{grid-template-rows:70px}}