:root{
  --maroon:#641820; --maroon-deep:#46060e; --maroon-soft:#7d2830;
  --gold:#c9973b; --gold-bright:#e6be5a; --gold-pale:#f0dca8;
  --leaf:#f8f1e0; --page:#efe5cd; --card:#faf4e6;
  --ink:#2b1c11; --ink-soft:#63503f; --rule:#d8c9a6;
  --serif:'Noto Serif Telugu',serif; --sans:'Noto Sans Telugu',sans-serif;
  --disp:'Ramaraja',serif;
  --reader-size:1.22rem;   /* elderly-friendly default; అ+/అ− adjusts 1.0–1.9 */
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--serif);background:var(--page);color:var(--ink);line-height:1.9;font-size:1.05rem}
.wrap{max-width:980px;margin:0 auto;padding:0 1.1rem}
.read-col{max-width:46rem;margin:0 auto;padding:0 1.1rem}
img{max-width:100%}
a{color:var(--maroon)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* ---------- signature zari (temple border) ---------- */
.zari{height:11px;background:
  conic-gradient(from -45deg at 50% 100%, var(--gold) 90deg, transparent 0)
  0 0/14px 100% repeat-x; background-color:var(--maroon-deep)}
.zari-flip{transform:scaleY(-1);background-color:var(--maroon-deep)}

/* ---------- top bar ---------- */
.topbar{position:sticky;top:0;z-index:50;background:var(--maroon);
  box-shadow:0 2px 10px rgba(70,6,14,.35)}
.bar-inner{display:flex;align-items:center;gap:1rem;padding:.6rem 1.1rem}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--gold-pale)}
.brand-mark{font-family:var(--disp);font-size:1.5rem;line-height:1;color:var(--maroon-deep);
  background:linear-gradient(160deg,var(--gold-bright),var(--gold));
  width:2.5rem;height:2.5rem;border-radius:50%;display:flex;align-items:center;
  justify-content:center;flex:none;padding-top:.2rem}
.brand-name{font-family:var(--disp);font-size:1.22rem;display:block;line-height:1.2;color:var(--gold-bright)}
.brand-sub{font-family:var(--sans);font-size:.7rem;opacity:.85;display:block}
.nav{margin-left:auto;display:flex;gap:.2rem}
.nav a{font-family:var(--sans);font-size:.95rem;color:var(--gold-pale);text-decoration:none;
  padding:.55rem .8rem;border-radius:5px}
.nav a.active,.nav a:hover{background:var(--maroon-deep);color:var(--gold-bright)}
.nav-toggle{display:none;margin-left:auto;background:none;border:1.5px solid var(--gold);
  color:var(--gold-pale);font-size:1.35rem;padding:.25rem .75rem;border-radius:6px;cursor:pointer}
@media(max-width:760px){
  .nav-toggle{display:block}
  .nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--maroon-deep);
    flex-direction:column;padding:.5rem;border-bottom:3px solid var(--gold)}
  .nav.open{display:flex}
  .nav a{padding:1rem 1.1rem;font-size:1.1rem}
  .brand-sub{display:none}
}

/* ---------- hero ---------- */
.hero{background:
  radial-gradient(ellipse 120% 90% at 50% -20%, var(--maroon-soft), var(--maroon) 55%, var(--maroon-deep));
  color:var(--gold-pale);text-align:center;padding:3rem 1rem 3.4rem}
.hero .eyebrow{font-family:var(--sans);font-size:.85rem;letter-spacing:.25em;color:var(--gold)}
.hero h1{font-family:var(--disp);font-weight:400;font-size:clamp(2rem,6vw,3.2rem);
  color:#fff;margin:.6rem 0 .4rem;line-height:1.25}
.hero .sub{font-size:1.08rem;max-width:38rem;margin:0 auto 1.6rem;opacity:.94}
.cta-row{display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap}
.btn{font-family:var(--sans);text-decoration:none;padding:.85rem 1.5rem;border-radius:8px;
  font-size:1.02rem;display:inline-block}
.btn-gold{background:linear-gradient(160deg,var(--gold-bright),var(--gold));color:var(--maroon-deep);font-weight:700}
.btn-line{border:1.5px solid var(--gold);color:var(--gold-pale)}
.btn-dark{color:var(--maroon);border-color:var(--maroon)}
.btn-gold:hover{filter:brightness(1.06)} .btn-line:hover{background:rgba(230,190,90,.12)}

/* ---------- sections ---------- */
.section{padding:2.4rem 0}
.sec-head{text-align:center;margin-bottom:1.5rem}
.sec-head h2{font-family:var(--disp);font-weight:400;font-size:1.9rem;color:var(--maroon)}
.sec-head .rule{width:70px;height:3px;margin:.5rem auto 0;
  background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.sec-head p{color:var(--ink-soft);font-size:.98rem;font-family:var(--sans)}
.kicker{font-family:var(--sans);font-size:.74rem;letter-spacing:.13em;color:var(--gold);
  text-transform:uppercase;font-weight:700}

.cards{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{background:var(--card);border:1px solid var(--rule);border-radius:11px;
  padding:1.35rem 1.35rem 1.25rem;position:relative;overflow:hidden;
  box-shadow:0 1px 4px rgba(43,28,17,.08);display:flex;flex-direction:column}
.card::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;
  background:linear-gradient(90deg,var(--maroon),var(--gold))}
.card h3{font-family:var(--disp);font-weight:400;font-size:1.4rem;color:var(--maroon);margin:.35rem 0 .3rem}
.card p{font-size:.97rem;color:var(--ink-soft);flex:1}
.card .card-author{flex:0;font-family:var(--sans);font-size:.88rem;color:var(--ink);margin-bottom:.35rem}
.card .go{font-family:var(--sans);font-size:.95rem;font-weight:700;margin-top:.95rem;text-decoration:none;
  padding:.4rem 0}
.card .go::after{content:" →"}
.dim{color:var(--ink-soft);font-weight:400}

.feature{background:var(--maroon);color:var(--gold-pale);border-radius:12px;
  padding:1.8rem 1.6rem;display:flex;gap:1.4rem;align-items:center;flex-wrap:wrap;
  border:1px solid var(--maroon-deep);box-shadow:0 4px 18px rgba(70,6,14,.25)}
.feature .om{font-family:var(--disp);font-size:3.4rem;color:var(--gold-bright);flex:none;line-height:1}
.feature h3{font-family:var(--disp);font-weight:400;font-size:1.75rem;color:#fff}
.feature .feat-author{font-family:var(--sans);font-size:.92rem;color:var(--gold-bright);margin:.15rem 0 .3rem}
.feature p{font-size:.98rem;opacity:.92;margin:.2rem 0 1rem;max-width:38rem}
.feature>div{flex:1;min-width:250px}

.chip-row{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center}
.book-chip{font-family:var(--sans);text-decoration:none;background:var(--card);color:var(--maroon);
  border:1.5px solid var(--rule);border-radius:99px;padding:.7rem 1.25rem;font-size:1rem}
.book-chip:hover{border-color:var(--gold);background:var(--gold-pale)}

/* ---------- page heads ---------- */
.page-head{background:var(--maroon);color:var(--gold-pale);text-align:center;padding:2rem 1rem}
.page-head h1{font-family:var(--disp);font-weight:400;font-size:clamp(1.7rem,5vw,2.5rem);color:#fff}
.page-head p{font-size:.98rem;opacity:.92;max-width:44rem;margin:.4rem auto 0}
.page-head .book-sub{color:var(--gold-bright);font-size:1.02rem}
.page-head .byline{font-family:var(--sans);color:var(--gold-bright);font-size:.95rem}
.crumb-line{font-family:var(--sans);font-size:.85rem;opacity:.85}

/* ---------- TOC ---------- */
.toc-grid{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.toc-item{display:flex;gap:.9rem;align-items:center;background:var(--card);
  border:1px solid var(--rule);border-radius:10px;padding:.95rem 1rem;text-decoration:none;color:var(--ink)}
.toc-item:hover{border-color:var(--gold);box-shadow:0 2px 8px rgba(43,28,17,.12)}
.toc-bija{font-family:var(--sans);font-weight:700;flex:none;min-width:2.7rem;height:2.7rem;border-radius:50%;
  background:var(--maroon);color:var(--gold-bright);display:flex;align-items:center;
  justify-content:center;font-size:1.05rem;padding:0 .3rem}
.toc-item b{font-family:var(--sans);font-size:.98rem;display:block;line-height:1.45}
.toc-item small{color:var(--ink-soft);font-family:var(--sans);font-size:.8rem}

.resume-band{margin:0 0 1.4rem;background:var(--gold-pale);border:1.5px solid var(--gold);
  border-radius:10px;padding:1rem 1.2rem;display:none;font-family:var(--sans);font-size:1.02rem;
  box-shadow:0 2px 8px rgba(43,28,17,.1);line-height:1.7}
.resume-band b{color:var(--maroon)}
.resume-band a{font-weight:700;white-space:nowrap}

/* ---------- reader (elderly-first) ---------- */
.reader-head{background:var(--maroon);color:var(--gold-pale);padding:1.4rem 1rem;text-align:center}
.reader-head .crumb{font-family:var(--sans);font-size:.85rem}
.reader-head .crumb a{color:var(--gold-bright);text-decoration:none}
.reader-head h1{font-family:var(--disp);font-weight:400;font-size:clamp(1.5rem,4.5vw,2.1rem);color:#fff;margin:.3rem 0 .1rem}
.reader-head .range{font-family:var(--sans);font-size:.88rem;opacity:.9}
.sheet,.article-body{background:var(--leaf);border:1px solid var(--rule);border-radius:12px;
  padding:clamp(1.3rem,4vw,2.6rem);margin:1.6rem 0;box-shadow:0 2px 12px rgba(43,28,17,.09)}
.article-flow p{font-size:var(--reader-size);line-height:1.95;margin-bottom:1.15rem;text-align:start}
.article-flow h1,.article-flow h2,.article-flow h3{font-family:var(--disp);font-weight:400;
  color:var(--maroon);margin:1.6rem 0 .7rem;line-height:1.5;font-size:calc(var(--reader-size)*1.3)}
.article-flow strong{color:var(--maroon)}
.article-flow table{border-collapse:collapse;margin:1rem auto;font-size:calc(var(--reader-size)*.88);max-width:100%;overflow-x:auto;display:block}
.article-flow td,.article-flow th{border:1px solid var(--rule);padding:.45rem .7rem}
.pager{display:flex;gap:.8rem;justify-content:space-between;margin:1.6rem 0 2.6rem;flex-wrap:wrap}
.pager a{font-family:var(--sans);text-decoration:none;background:var(--maroon);color:var(--gold-pale);
  padding:.85rem 1.25rem;border-radius:9px;font-size:1rem;line-height:1.4}
.pager a:hover{background:var(--maroon-deep)}
.pager .toc-link{background:transparent;color:var(--maroon);border:1.5px solid var(--maroon)}
.font-ctl{position:fixed;right:.9rem;bottom:.9rem;z-index:40;display:flex;flex-direction:column;gap:.5rem}
.font-ctl button{width:3.2rem;height:3.2rem;border-radius:50%;border:none;cursor:pointer;
  background:var(--maroon);color:var(--gold-bright);font-family:var(--sans);font-size:1.15rem;
  font-weight:700;box-shadow:0 3px 10px rgba(70,6,14,.4)}
.font-ctl button:hover,.font-ctl button:active{background:var(--maroon-deep);transform:scale(1.04)}

/* ---------- essay list ---------- */
.collection-block{margin-bottom:2.6rem}
.essay-list{max-width:46rem;margin:0 auto;background:var(--card);border:1px solid var(--rule);border-radius:11px;overflow:hidden}
.essay-row{display:flex;gap:1rem;align-items:center;padding:1rem 1.2rem;text-decoration:none;
  color:var(--ink);border-bottom:1px solid var(--rule)}
.essay-row:last-child{border-bottom:none}
.essay-row:hover{background:var(--gold-pale)}
.essay-num{font-family:var(--sans);font-weight:700;color:var(--gold);flex:none;min-width:2rem;text-align:center;font-size:.95rem}
.essay-t{font-size:1.08rem;line-height:1.6}

/* ---------- audio / about / footer ---------- */
.spotify-box{margin:1.6rem 0}
.spotify-box iframe{border-radius:12px;width:100%;border:0}
.audio-note{background:var(--card);border:1px solid var(--rule);border-radius:10px;
  padding:1.05rem 1.25rem;font-size:.98rem;color:var(--ink-soft);font-family:var(--sans);line-height:1.8}
.about-card{background:var(--leaf);border:1px solid var(--rule);border-radius:12px;
  padding:clamp(1.3rem,4vw,2.4rem);margin:1.6rem 0;max-width:46rem;margin-left:auto;margin-right:auto}
.about-card p{margin-bottom:1.05rem;font-size:1.1rem;line-height:1.95}
.about-card .pub{font-family:var(--sans);color:var(--ink-soft);font-size:.95rem}
.footer{background:var(--maroon);color:var(--gold-pale);margin-top:2rem}
.foot-inner{text-align:center;padding:1.8rem 1rem 2rem;font-family:var(--sans);font-size:.88rem;line-height:2}
.foot-om{font-family:var(--serif);color:var(--gold-bright);font-size:.98rem}
.foot-links a{color:var(--gold-pale)}
@media print{.topbar,.footer,.font-ctl,.pager{display:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}