/* The New Beginnings · "Book" design (homepage + articles) */
:root{--paper:#F4EDE1;--paper2:#EFE6D7;--ink:#1C1A17;--rust:#C2410C;--mute:#6f685e;--line:#1C1A17}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:Inter,system-ui,sans-serif;font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.f{font-family:Fraunces,Georgia,serif}
/* header */
.bar{position:sticky;top:0;z-index:40;background:var(--paper);display:flex;justify-content:space-between;align-items:center;gap:20px;padding:14px 48px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.brand img{width:34px;height:34px}
.bar nav{display:flex;align-items:center;gap:26px;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.bar nav a:hover,.bar nav a.on{color:var(--rust)}
.bar .bk{background:var(--ink);color:var(--paper)!important;padding:9px 18px;border-radius:30px}
.menu{display:none;background:none;border:1.5px solid var(--ink);border-radius:30px;padding:7px 14px;font:700 12px Inter;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.sheet{display:none}
/* cover */
.cover{display:grid;grid-template-columns:1.35fr .65fr;min-height:calc(100vh - 63px);border-bottom:1px solid var(--line)}
.cover .l{padding:7vh 48px 48px;border-right:1px solid var(--line);display:flex;flex-direction:column}
.ch{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--rust)}
.cover h1{font-family:Fraunces,serif;font-weight:300;font-size:clamp(3.2rem,8.4vw,8rem);line-height:.92;letter-spacing:-.035em;margin-top:22px}
.cover h1 .old{position:relative;color:#a39b8e;display:inline-block}
.cover h1 .old::after{content:"";position:absolute;left:-2%;top:54%;height:.07em;background:var(--rust);width:0;animation:strike .9s .6s cubic-bezier(.6,.1,.3,1) forwards}
@keyframes strike{to{width:104%}}
.cover h1 .new{display:block;opacity:0;transform:translateY(18px);animation:rise .9s 1.4s ease forwards}
.cover h1 i{color:var(--rust);font-style:italic}
@keyframes rise{to{opacity:1;transform:none}}
.cover .sub{max-width:540px;margin-top:auto;padding-top:40px;font-size:1.1rem;color:#3b3731}
.cover .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.cover .r{display:grid;grid-template-rows:1fr auto}
.cover .photo{background:url(img/preethi.webp) center 25%/cover;filter:grayscale(1) contrast(1.05);min-height:320px}
.toc{padding:20px 28px 26px}
.toc .t{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);margin-bottom:6px}
.toc a{display:flex;justify-content:space-between;align-items:baseline;padding:11px 0;border-bottom:1px dotted var(--line);font-size:14px}
.toc a b{font-family:Fraunces,serif;font-weight:400;font-size:1.2rem}
.toc a:hover b{color:var(--rust)}
/* chapters */
.chapter{display:grid;grid-template-columns:220px 1fr;border-bottom:1px solid var(--line)}
.chapter .side{padding:48px;border-right:1px solid var(--line)}
.chapter .side .num{font-family:Fraunces,serif;font-size:5rem;font-weight:300;line-height:1;color:var(--rust)}
.chapter .side .nm{font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;margin-top:10px}
.chapter .body{padding:64px 48px 72px;max-width:960px}
.chapter h2,.ph-h1{font-family:Fraunces,serif;font-weight:300;font-size:clamp(2.2rem,4.6vw,3.8rem);line-height:1.05;letter-spacing:-.02em}
.chapter h2 i,.ph-h1 i{color:var(--rust)}
.plain{font-size:1.12rem;color:#3b3731;max-width:62ch;margin-top:18px}
.sub-h{font-family:Fraunces,serif;font-style:italic;font-weight:300;font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.15;margin-top:48px;color:var(--rust)}
.signs{display:grid;grid-template-columns:1fr 1fr;margin-top:24px;border-top:1px solid var(--line)}
.signs div{padding:16px 18px 16px 0;border-bottom:1px solid var(--line);font-family:Fraunces,serif;font-size:1.2rem}
.signs div::before{content:"✓ ";color:var(--rust)}
.cols{display:grid;margin-top:30px;border-top:1px solid var(--line)}
.cols.c3{grid-template-columns:repeat(3,1fr)}.cols.c4{grid-template-columns:repeat(4,1fr)}
.cols>*{padding:22px 20px 24px 0;display:flex;flex-direction:column}
.cols>*+*{padding-left:20px;border-left:1px solid var(--line)}
.cols b.n{font-family:Fraunces,serif;color:var(--rust);font-size:2.4rem;font-weight:300;line-height:1}
.cols h3{font-family:Fraunces,serif;font-weight:400;font-size:1.9rem;margin:6px 0 2px}
.cols h4{font-family:Fraunces,serif;font-weight:400;font-size:1.35rem;margin-bottom:6px}
.cols p,.cols li{color:#4a453e;font-size:.97rem}
.cols ul{margin:12px 0 0 18px;flex:1}
.for{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.go{margin-top:18px;font-weight:600;border-bottom:1.5px solid var(--ink);align-self:flex-start}
a.path:hover .go{color:var(--rust);border-color:var(--rust)}
a.path:hover h3{color:var(--rust)}
.rn{font-family:Fraunces,serif;color:var(--rust);font-size:1.1rem}
/* articles list */
.alist{margin-top:30px;border-top:1px solid var(--line)}
.art{display:grid;grid-template-columns:130px 1fr auto;gap:24px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--line)}
.art time{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.art h3{font-family:Fraunces,serif;font-weight:400;font-size:1.55rem;line-height:1.2}
.art p{color:#4a453e;margin-top:6px;font-size:.98rem}
.art .rd{font-weight:600;white-space:nowrap;border-bottom:1.5px solid var(--ink)}
a.art:hover h3,a.art:hover .rd{color:var(--rust);border-color:var(--rust)}
.empty{padding:26px 0;color:var(--mute);border-bottom:1px solid var(--line)}
/* quotes */
.qgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:30px;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.qcard{padding:28px 24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:14px}
.qcard blockquote{font-family:Fraunces,serif;font-weight:300;font-size:1.3rem;line-height:1.45}
.qcard blockquote::before{content:"“";display:block;font-size:3rem;line-height:.6;color:var(--rust)}
.qcard img{border-radius:6px}
.qcard .qm{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin-top:auto}
.qcard .qm a{color:#1f8f4e;letter-spacing:0;text-transform:none;font-size:14px}
.today-q{margin-top:30px;padding:34px 34px 30px;background:var(--ink);color:var(--paper)}
.today-q blockquote{font-family:Fraunces,serif;font-weight:300;font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.3}
.today-q .qm{margin-top:18px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:#F59E6B}
.today-q .qm a{color:#7ee2a5;text-transform:none;letter-spacing:0;font-size:15px}
/* author */
.author{display:grid;grid-template-columns:260px 1fr;gap:40px;margin-top:36px;align-items:start}
.author .ph{aspect-ratio:3/4;background:url(img/preethi.webp) center 20%/cover;filter:grayscale(1)}
.facts{display:grid;grid-template-columns:1fr 1fr;margin-top:26px;border-top:1px solid var(--line)}
.facts div{padding:14px 0;border-bottom:1px solid var(--line)}
.facts b{font-family:Fraunces,serif;font-weight:400;font-size:1.6rem;display:block}
.facts span{font-size:14px;color:var(--mute)}
.orgs{margin-top:22px;font-size:.92rem;color:var(--mute)}
.lnk{display:inline-block;margin-top:22px;font-weight:600;border-bottom:1.5px solid var(--ink)}
.lnk:hover{color:var(--rust);border-color:var(--rust)}
/* end + buttons */
.end{background:var(--ink);color:var(--paper);text-align:center;padding:110px 24px 120px}
.end .ch{color:#F59E6B}
.end h2{font-family:Fraunces,serif;font-weight:300;font-size:clamp(2.4rem,6vw,5rem);line-height:1.02;margin-top:18px}
.end h2 i{color:#F59E6B}
.end p{opacity:.75;margin-top:18px}
.btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:34px}
.btn{display:inline-block;padding:14px 26px;border-radius:40px;font-weight:600;border:1.5px solid currentColor;font-size:15px}
.btn.fill{background:var(--rust);border-color:var(--rust);color:#fff}
.btn.dark{background:var(--ink);border-color:var(--ink);color:var(--paper)}
/* footer */
.foot{background:var(--paper2);border-top:1px solid var(--line);padding:56px 48px 30px;font-size:15px}
.foot .g{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px}
.foot h5{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;margin-bottom:12px;color:var(--mute)}
.foot li{list-style:none;margin:6px 0}
.foot a:hover{color:var(--rust)}
.foot .bt{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:40px;padding-top:18px;border-top:1px solid var(--line);font-size:13px;color:var(--mute)}
.wa-float{position:fixed;right:18px;bottom:18px;z-index:30;width:56px;height:56px;border-radius:50%;background:#25D366;display:grid;place-items:center;box-shadow:0 12px 30px -10px rgba(0,0,0,.5)}
/* quote pop-up */
.qpop{position:fixed;left:18px;bottom:18px;z-index:60;width:min(380px,calc(100vw - 36px));background:var(--paper);border:1px solid var(--line);box-shadow:8px 8px 0 var(--ink);padding:22px 22px 18px;transform:translateY(140%);transition:transform .7s cubic-bezier(.2,.9,.3,1)}
.qpop.show{transform:none}
.qpop .x{position:absolute;top:8px;right:10px;background:none;border:0;font-size:22px;cursor:pointer;color:var(--mute);line-height:1;padding:4px}
.qpop .ch{font-size:11px}
.qpop blockquote{font-family:Fraunces,serif;font-weight:300;font-size:1.3rem;line-height:1.4;margin-top:10px}
.qpop .qm{display:flex;justify-content:space-between;align-items:center;margin-top:14px;font-size:14px}
.qpop .qm a{font-weight:600;border-bottom:1.5px solid var(--ink)}
.qpop .qm a.wa{color:#1f8f4e;border-color:#1f8f4e}
/* page hero (articles) */
.phero{padding:70px 48px 40px;border-bottom:1px solid var(--line)}
.tabs{display:flex;gap:10px;margin-top:26px;flex-wrap:wrap}
.tabs a{border:1.5px solid var(--ink);border-radius:30px;padding:8px 18px;font-weight:600;font-size:14px}
.tabs a:hover{background:var(--ink);color:var(--paper)}
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s,transform .8s}.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}.cover h1 .new{animation:none;opacity:1;transform:none}.cover h1 .old::after{animation:none;width:104%}}
@media (max-width:980px){.foot .g{grid-template-columns:1fr 1fr}.cols.c4{grid-template-columns:1fr 1fr}.cols.c4>*:nth-child(3){padding-left:0;border-left:0}}
@media (max-width:860px){
 .bar{padding:12px 16px}.bar nav{display:none}.menu{display:block}
 .sheet{display:block;position:fixed;inset:57px 0 auto 0;z-index:39;background:var(--paper);border-bottom:1px solid var(--line);padding:8px 16px 20px;transform:translateY(-120%);transition:transform .35s}
 .sheet.open{transform:none}
 .sheet a{display:block;padding:14px 0;border-bottom:1px dotted var(--line);font-family:Fraunces,serif;font-size:1.3rem}
 .sheet .btn{display:block;text-align:center;margin-top:16px;font-family:Inter;font-size:15px}
 .cover{grid-template-columns:1fr;min-height:0}.cover .l{padding:34px 16px 28px;border-right:0}
 .cover .photo{min-height:380px}.toc{padding:16px 16px 22px}
 .chapter{grid-template-columns:1fr}.chapter .side{padding:28px 16px 0;border-right:0;display:flex;align-items:baseline;gap:14px}
 .chapter .side .num{font-size:3rem}.chapter .body{padding:16px 16px 56px}
 .signs,.cols.c3,.cols.c4,.qgrid{grid-template-columns:1fr}
 .cols>*{padding:18px 0!important;border-left:0!important;border-bottom:1px solid var(--line)}
 .art{grid-template-columns:1fr;gap:6px}
 .author{grid-template-columns:1fr}.author .ph{max-width:240px}
 .phero{padding:40px 16px 30px}.foot{padding:44px 16px 90px}.foot .g{grid-template-columns:1fr}
 .end{padding:80px 16px 90px}
 .qpop{left:12px;bottom:12px;padding:16px 16px 14px;width:calc(100vw - 96px)}.qpop blockquote{font-size:1.05rem}
}