@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&display=swap');
:root{--green:#657e68;--green-dark:#3d5c43;--sage:#e9efe8;--cream:#fbf8f2;--ink:#27332a;--muted:#6b756d;--border:#e3e7df;--white:#fff;--gold:#c49a55;--pink:#f6e8e8;--blue:#e9eff8;--shadow:0 10px 30px rgba(34,54,37,.07)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:"Cairo",Tahoma,Arial,sans-serif;line-height:1.75}a{color:var(--green-dark);text-decoration:none}a:hover{text-decoration:underline}.site-header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px max(5%,calc((100% - 1160px)/2));background:rgba(255,255,255,.93);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:5;backdrop-filter:blur(10px)}.brand{display:flex;align-items:center;gap:12px;color:var(--ink)}.brand:hover{text-decoration:none}.brand-mark{display:grid;place-items:center;width:48px;height:48px;border-radius:16px;background:var(--green);color:white;font-weight:800;font-size:25px}.brand strong{display:block;font-size:17px}.brand small{display:block;font-size:11px;color:var(--muted)}.top-nav{display:flex;align-items:center;gap:20px;font-size:14px}.nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--green);color:#fff;padding:10px 18px;border:0;border-radius:12px;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer}.nav-cta:hover,.btn:hover{background:var(--green-dark);color:#fff;text-decoration:none}.btn.secondary{background:#edf1eb;color:var(--green-dark)}.btn.danger{background:#a84b4b}.container{max-width:1160px;margin:0 auto;padding:28px 22px 56px}.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:center;padding:36px 0 48px}.eyebrow{display:inline-block;color:var(--green-dark);background:var(--sage);border-radius:99px;padding:5px 13px;font-size:12px;font-weight:700}.hero h1{font-size:clamp(32px,4.6vw,54px);line-height:1.25;margin:18px 0}.hero p{font-size:17px;color:var(--muted);max-width:650px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.hero-art{background:linear-gradient(145deg,#e5eee4,#f8eadd);border-radius:34px;min-height:320px;display:grid;place-items:center;padding:24px;position:relative;overflow:hidden}.hero-art .sun{width:205px;height:205px;border-radius:50%;background:#f6dcae;display:grid;place-items:center;font-size:100px;box-shadow:0 18px 40px #8c9c8030}.floating-note{position:absolute;background:#fff;padding:12px 16px;border-radius:16px;box-shadow:var(--shadow);font-size:13px}.note-one{top:25px;right:20px}.note-two{bottom:25px;left:20px}.section-title{margin:10px 0 22px}.section-title h2{font-size:27px;margin:0}.section-title p{color:var(--muted);margin:4px 0}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card{background:#fff;border:1px solid var(--border);border-radius:20px;padding:22px;box-shadow:var(--shadow)}.stage-icon{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;font-size:25px;margin-bottom:12px;background:var(--sage)}.card h3{margin:4px 0 8px;font-size:18px}.card p{color:var(--muted);font-size:13px;margin:0 0 10px}.tag{display:inline-block;background:#f3eee2;color:#806b3d;border-radius:30px;padding:4px 10px;font-size:11px}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:36px}.feature{padding:20px;background:#fff;border-radius:18px;border:1px solid var(--border)}.feature .icon{font-size:25px}.feature h3{margin:5px 0}.feature p{margin:0;color:var(--muted);font-size:13px}.banner{background:var(--green-dark);color:#fff;border-radius:24px;padding:28px 30px;margin-top:38px;display:flex;align-items:center;justify-content:space-between;gap:20px}.banner p{color:#e4ece2;margin:4px 0}.banner .btn{background:#fff;color:var(--green-dark);white-space:nowrap}.site-footer{border-top:1px solid var(--border);background:#fff}.footer-inner{max-width:1160px;margin:auto;padding:26px 22px;display:flex;justify-content:space-between;gap:20px}.footer-inner p,.footer-note{font-size:12px;color:var(--muted);margin:3px 0}.page-heading{margin:4px 0 24px}.page-heading h1{margin:0;font-size:30px}.page-heading p{margin:5px 0;color:var(--muted)}.auth-wrap{max-width:500px;margin:30px auto}.auth-card{background:#fff;border:1px solid var(--border);border-radius:24px;padding:30px;box-shadow:var(--shadow)}.auth-card h1{margin:0 0 6px}.auth-card>p{color:var(--muted);margin-top:0}.form-group{margin:16px 0}.form-group label{display:block;font-size:13px;font-weight:700;margin-bottom:6px}.form-control,select,textarea{width:100%;padding:12px 13px;border:1px solid #d8dfd5;border-radius:11px;background:#fff;font:inherit;font-size:14px;color:var(--ink)}textarea{min-height:130px;resize:vertical}.form-control:focus,select:focus,textarea:focus{outline:2px solid #b8cbb9;border-color:var(--green)}.form-help{font-size:12px;color:var(--muted)}.alert{padding:12px 15px;border-radius:12px;margin:14px 0;font-size:13px;background:#f8eaea;color:#8b3e3e}.alert.success{background:#e8f4e8;color:#315b37}.dashboard-welcome{background:linear-gradient(120deg,#e8efe5,#f7eadb);border-radius:24px;padding:26px 28px;margin-bottom:22px}.dashboard-welcome h1{margin:4px 0;font-size:28px}.dashboard-welcome p{margin:0;color:#59685a}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0}.stat{background:#fff;border:1px solid var(--border);border-radius:16px;padding:17px}.stat strong{font-size:25px;display:block}.stat span{font-size:12px;color:var(--muted)}.content-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.content-card{background:#fff;border:1px solid var(--border);border-radius:18px;padding:20px}.content-card .type{font-size:12px;color:var(--green-dark);font-weight:700}.content-card h3{margin:4px 0 8px}.content-card p{font-size:14px;color:#58645a;white-space:pre-wrap}.content-meta{font-size:11px;color:var(--muted)}.progress-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--border);border-radius:16px}table{width:100%;border-collapse:collapse;min-width:650px}th,td{padding:12px 14px;text-align:right;border-bottom:1px solid var(--border);font-size:13px}th{background:#f3f6f1;color:#485a4b}tr:last-child td{border-bottom:0}.admin-nav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}.admin-nav a{padding:8px 13px;background:#eaf0e8;border-radius:10px;font-size:13px;font-weight:700}.inline-form{display:inline}.empty-state{text-align:center;background:#fff;border:1px dashed #cbd6c9;border-radius:18px;padding:35px;color:var(--muted)}.empty-state strong{display:block;color:var(--ink);font-size:18px}.muted{color:var(--muted)}.split{display:grid;grid-template-columns:1fr 1fr;gap:20px}.content-body{white-space:pre-wrap;line-height:2}.small{font-size:12px}.pill{border-radius:30px;padding:3px 9px;font-size:11px;background:#edf2ec;color:#365b3b}.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
@media(max-width:850px){.grid{grid-template-columns:repeat(2,1fr)}.hero{grid-template-columns:1fr}.hero-art{min-height:250px}.features{grid-template-columns:1fr 1fr}.top-nav{gap:10px}.top-nav>a:not(.nav-cta){display:none}.content-grid{grid-template-columns:1fr}}
@media(max-width:560px){.site-header{padding:12px 15px}.brand-mark{width:40px;height:40px}.brand strong{font-size:14px}.container{padding:20px 15px 38px}.hero{padding:20px 0 32px}.hero p{font-size:15px}.grid,.features,.stats,.split{grid-template-columns:1fr}.card{padding:18px}.banner,.footer-inner{flex-direction:column;align-items:flex-start}.auth-card{padding:22px}.dashboard-welcome{padding:21px}.dashboard-welcome h1{font-size:23px}}


/* Homepage icon of Saint Moses */
.hero-art.hero-saint{padding:0;min-height:0;aspect-ratio:4/5;background:#f7ead4;border:1px solid var(--border)}
.hero-saint-image{display:block;width:100%;height:100%;max-height:540px;object-fit:cover;object-position:center 34%;border-radius:34px}
.hero-saint .floating-note{max-width:calc(100% - 28px);text-align:center;line-height:1.5}
@media(max-width:760px){.hero-art.hero-saint{max-height:440px}.hero-saint-image{max-height:440px}.hero-saint .note-two{font-size:11px}}


/* General Secretariat for Church Education logo on homepage */
.secretariat-logo-wrap{display:flex;align-items:center;gap:12px;margin:12px 0 18px;max-width:330px}
.secretariat-logo{width:78px;height:78px;object-fit:contain;border-radius:10px;background:#fff;border:1px solid var(--border);padding:3px}
.secretariat-logo-wrap span{font-weight:800;color:var(--primary);font-size:14px;line-height:1.5}
@media(max-width:760px){.secretariat-logo-wrap{gap:8px;margin:8px 0 12px}.secretariat-logo{width:60px;height:60px}.secretariat-logo-wrap span{font-size:12px}}
