/*
Theme Name: NF Lite
Theme URI: https://www.noboprobhaat.org/
Author: Noboprobhaat Foundation
Description: Lightweight theme for noboprobhaat.org. Renders the existing hand-coded page designs directly, keeps the same look, loads much less.
Version: 1.0.0
Requires PHP: 7.4
Text Domain: nf-lite
*/
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&family=Playfair+Display:wght@700;800&family=Poppins:wght@400;700&display=swap');
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:'Open Sans',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#33405c;background:#fff;line-height:1.7;font-size:16px;-webkit-font-smoothing:antialiased}
/* same base typography the old theme (Astra) gave to builder content */
h1,h2,h3,h4,h5,h6{font-family:'Playfair Display',Georgia,serif;font-weight:800;color:#1b2740;margin:0 0 .6em}
h1{font-size:1.6667rem;line-height:1.4}h2{font-size:1.4rem;line-height:1.3}h3{font-size:1.2rem;line-height:1.3}
p{margin:0 0 1.2em}
img,video{max-width:100%;height:auto}
a{color:#2856A8}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link:focus{position:fixed;top:8px;left:8px;z-index:100000;width:auto;height:auto;clip:auto;background:#fff;color:#1b2740;padding:10px 16px;border-radius:6px;box-shadow:0 2px 10px rgba(0,0,0,.2)}
.nf-main{display:block;min-height:40vh}
.nf-container{width:94%;max-width:1100px;margin:0 auto;padding:48px 0}
.nf-entry h1{font-family:'Fraunces',Georgia,serif;color:#1b2740;font-size:clamp(28px,4vw,42px);line-height:1.15;margin:0 0 12px}
.nf-entry .nf-meta{color:#566179;font-size:14px;margin-bottom:24px}
.nf-entry .nf-thumb img{border-radius:14px;margin-bottom:24px}
.nf-pagetitle{background:#2856A8;color:#fff;padding:56px 0;text-align:center}
.nf-pagetitle h1{font-family:'Fraunces',Georgia,serif;margin:0;font-size:clamp(28px,4vw,44px);color:#fff}
.nf-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px}
.nf-card{border:1px solid #e6eaf2;border-radius:14px;overflow:hidden;background:#fff}
.nf-card a{text-decoration:none;color:inherit}
.nf-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.nf-card .in{padding:18px}
.nf-card h2{font-family:'Fraunces',Georgia,serif;font-size:19px;line-height:1.3;color:#1b2740;margin:0 0 6px}
.nf-pager{margin-top:32px;display:flex;gap:8px;flex-wrap:wrap}
.nf-pager .page-numbers{padding:8px 14px;border:1px solid #e6eaf2;border-radius:8px;text-decoration:none}
.nf-pager .current{background:#2856A8;color:#fff;border-color:#2856A8}
/* archives: same look as before (Astra blog grid) */
.nf-archive{max-width:none;margin:0;padding:60px 20px 64px}
.nf-archive-head{border-bottom:1px solid #ddd;margin-bottom:40px;padding-bottom:28px;text-align:center}
.nf-archive-head h1{font-family:'Poppins',sans-serif;font-size:28px;font-weight:600;color:#1d1d1b;margin:0;line-height:1.3}
.nf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media (max-width:921px){.nf-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:544px){.nf-grid{grid-template-columns:1fr}}
.nf-item{background:#fff;border-radius:8px;overflow:hidden;padding-bottom:14px}
.nf-item-img{display:block;line-height:0}
.nf-item-img img{width:100%;aspect-ratio:3/2;object-fit:cover}
.nf-item h2{margin:18px 18px 12px;font-family:'Poppins',sans-serif;font-size:16px;font-weight:500;line-height:1.35}
.nf-item h2 a{color:#1d1d1b;text-decoration:none}
.nf-item h2 a:hover{color:#2856A8}
.nf-more{display:inline-block;margin:4px 18px 4px;padding:7px 16px;border:1px solid #d85a30;border-radius:4px;font-size:12px;font-weight:500}
.nf-more a{color:#0066cc;text-decoration:none}
.nf-archive .nf-pager{justify-content:center}
/* logged-in admin bar should not cover the mobile menu */
.admin-bar .nfh-panel{top:46px}
@media (min-width:783px){.admin-bar .nfh-panel{top:32px}}
/* old theme (Astra) base sizes, so builder pages look identical */
html{font-size:187.5%}
body{font-size:30px}
@media (max-width:921px){body{font-size:16px}}
h1{font-size:50px;line-height:1.4em}h2{font-size:42px;line-height:1.3em}h3{font-size:36px;line-height:1.3em}
h4{font-size:25px;line-height:1.2em}h5{font-size:20px;line-height:1.2em}h6{font-size:15px;line-height:1.25em}
.nf-wrap{max-width:none;margin:0;padding:0}
/* wider content on the custom-coded pages (less empty space at the sides) */
main [id^="npf-"] .wrap{max-width:none!important;width:auto!important;margin-left:0!important;margin-right:0!important;padding-left:clamp(16px,3vw,40px)!important;padding-right:clamp(16px,3vw,40px)!important}
/* page title widget: same as before (small centred serif title, no background) */
.nf-ptitle{text-align:center;padding:10px 10px 0}
.nf-ptitle h1{font-family:'Playfair Display',Georgia,serif;font-size:20px;font-weight:800;line-height:24px;color:#0d0101;margin:0}
/* site background same as before */
body{background:#eeeeee}
.nf-ptitle{padding:24px 10px 24px}
/* rectangular logo */
.nfh .nfh-logo{border-radius:4px}
/* header outline: thin line on all four sides */
.nfh .nfh-bar{border:2px solid rgba(255,255,255,.45);border-radius:0}
@media (max-width:1024px){.nfh .nfh-bar{border-color:#2856A8}}
/* hero photos: keep the top (people's heads) in view */
#npf-home .hero .slide{background-position:center top!important}
/* password-protected pages: centred card */
.post-password-form{max-width:520px;margin:64px auto;padding:32px 28px;background:#fff;border:1px solid #e6eaf2;border-radius:12px;box-shadow:0 10px 30px rgba(20,35,80,.08);font-family:'Inter',sans-serif;font-size:16px;color:#33405c;text-align:center}
.post-password-form p{margin:0 0 16px}
.post-password-form label{display:flex;flex-direction:column;gap:8px;text-align:left;font-weight:600;color:#1b2740}
.post-password-form input[type=password]{height:46px;border:1px solid #d6dce8;border-radius:8px;padding:0 14px;font:inherit;font-weight:400}
.post-password-form input[type=password]:focus{outline:none;border-color:#2856A8;box-shadow:0 0 0 3px rgba(40,86,168,.15)}
.post-password-form input[type=submit]{margin-top:12px;width:100%;height:46px;border:0;border-radius:999px;background:#2856A8;color:#fff;font:inherit;font-weight:600;cursor:pointer}
.post-password-form input[type=submit]:hover{background:#1d4189}
