/* Smooth cross-fade between full page navigations (EN/TE toggle included)
   instead of the default hard reload flash. Native browser feature — a
   no-op with no fallback needed on browsers that don't support it yet. */
@view-transition{
  navigation: auto;
}
::view-transition-old(root),
::view-transition-new(root){
  animation-duration: 0.22s;
}
@media (prefers-reduced-motion: reduce){
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*){
    animation: none !important;
  }
}

:root{
  --bg:#F7F4EC; --surface:#FFFFFF; --surface-alt:#FBF8F1;
  --text:#221F1B; --text-secondary:#6E675A; --text-muted:#948C7C;
  --accent:#8B2A1F; --accent-hover:#6E2018; --accent-tint:#F4E7E3;
  --border:#E6E0D2; --border-strong:#D8D0BC;
  --correct:#3F6B4A; --correct-tint:#E7EFE7;
}
*{box-sizing:border-box;}
/* Telugu fallback fonts added directly to the base stacks (not just the
   .te whole-page variant) - Glossary mixes English and Telugu in the same
   paragraph/heading, so Telugu glyphs need to resolve to a proper Telugu
   face wherever they occur, not just inside a dedicated .te page wrapper. */
body{margin:0;background:var(--bg);color:var(--text);font-family:'Inter','Noto Sans Telugu',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4,h5{font-family:'Lora','Noto Serif Telugu',Georgia,serif;margin:0;color:var(--text);font-weight:600;}
a{color:var(--accent);text-decoration:none;}
a:hover{color:var(--accent-hover);}
.te,.te h1,.te h2,.te h3{font-family:'Noto Sans Telugu',sans-serif;}

/* Responsive show/hide utilities. These ONLY ever set display:none — never a
   "show" value — so they never clobber an element's own display type (flex,
   grid, etc.) the way a paired display:block/display:flex toggle would. */
@media (min-width: 860px){
  .mobile-only{display:none !important;}
}
@media (max-width: 859.98px){
  .desktop-only{display:none !important;}
}

/* Page frame: the mockups used a fixed 390px device frame; the real site
   needs to actually fit any phone, so this is fluid up to a phone-ish cap
   instead of a hard 390px width. Same visual result on a real phone. */
.page{max-width:480px;margin:0 auto;padding-bottom:76px;}

.row{display:flex;align-items:center;justify-content:space-between;}

.rowlink{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--border);text-decoration:none;color:inherit;}
.rowlink:last-child{border-bottom:none;}

/* Breadcrumb */
.breadcrumb{padding:0 20px 4px;font-size:12px;color:var(--text-muted);}
.breadcrumb a{color:inherit;}
.breadcrumb a:hover{color:var(--accent);}
.breadcrumb .current{color:var(--accent);font-weight:700;}

/* Cards */
.card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px;}

/* Reading page shell (Notes / Bare Act / Case Law) */
.read-breadcrumb{font-size:11.5px;color:var(--text-muted);}
.read-breadcrumb a,.hub-breadcrumb a,.case-breadcrumb a{color:inherit;}
.read-breadcrumb a:hover,.hub-breadcrumb a:hover,.case-breadcrumb a:hover{color:var(--accent);}
.read-breadcrumb .current,.hub-breadcrumb .current,.case-breadcrumb .current{color:var(--accent);font-weight:700;}
.read-title{font-size:25px;line-height:1.28;}
.read-meta{display:flex;align-items:center;gap:8px;margin-top:12px;padding-bottom:20px;border-bottom:1px solid var(--border);}
.read-meta div{font-size:12px;color:var(--text-muted);}
.read-meta .dot{width:3px;height:3px;border-radius:50%;background:var(--border-strong);flex:0 0 auto;}

.read-grid{padding:6px 20px 0;}

.read-toc-label{font-size:11px;font-weight:700;letter-spacing:0.5px;color:var(--text-muted);text-transform:uppercase;margin-bottom:10px;}
.toc-item{display:block;font-size:13.5px;color:var(--text-secondary);padding:7px 0 7px 12px;border-left:2px solid var(--border);text-decoration:none;}
.toc-item.active{border-left-color:var(--accent);color:var(--accent);font-weight:600;}

.read-related{padding:24px 0 30px;border-top:1px solid var(--border);margin-top:10px;}
.related-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:14px;display:block;text-decoration:none;color:inherit;margin-bottom:10px;}
.related-card:last-child{margin-bottom:0;}
.related-card .type{font-size:10px;font-weight:700;color:var(--text-muted);text-transform:uppercase;margin-bottom:5px;}
.related-card .title{font-size:13.5px;font-weight:600;line-height:1.4;color:var(--text);}

/* Prose (reading pages) */
.prose{padding:22px 0 0;}
.prose p{font-size:16.5px;font-weight:500;line-height:1.72;color:#423D34;margin:0 0 18px;text-align:justify;text-justify:inter-word;-webkit-hyphens:auto;hyphens:auto;}
.prose h2{font-size:19px;font-weight:700;margin:34px 0 12px;color:#7A1E14;}
/* Case-law pages only (scoped, not global .prose) - long, sub-headed
   sections (Facts, Arguments Contended, etc.) and plain lists (Issues
   Raised, Exam-Important Points) that Notes pages don't otherwise use. */
.case-prose h3{font-size:16px;font-weight:700;margin:20px 0 8px;color:#423D34;}
.case-prose ol,.case-prose ul{margin:0 0 18px;padding-left:22px;}
.case-prose ol li,.case-prose ul li{font-size:16.5px;font-weight:500;line-height:1.72;color:#423D34;text-align:justify;margin-bottom:10px;}
.case-prose ol li:last-child,.case-prose ul li:last-child{margin-bottom:0;}
.prose table{width:100%;border-collapse:collapse;font-size:13.5px;margin:0 0 18px;border:1px solid var(--border-strong);}
.prose th{text-align:left;font-family:'Inter',sans-serif;font-weight:700;font-size:12px;color:var(--text);background:var(--surface-alt);padding:10px 12px;border-bottom:1px solid var(--border-strong);border-right:1px solid var(--border-strong);}
.prose th:last-child{border-right:none;}
.prose td{padding:11px 12px;border-bottom:1px solid var(--border);border-right:1px solid var(--border);color:#423D34;font-weight:500;line-height:1.45;}
.prose td:last-child{border-right:none;}
.prose tr:last-child td{border-bottom:none;}

.callout{margin:26px 0 0;background:var(--surface-alt);border:1px solid var(--border);border-radius:12px;padding:18px 18px 20px;}
.callout .label{font-size:11px;font-weight:700;letter-spacing:0.5px;color:var(--accent);text-transform:uppercase;margin-bottom:9px;}
.callout p{font-size:14px;font-weight:500;line-height:1.6;color:#423D34;text-align:justify;text-justify:inter-word;-webkit-hyphens:auto;hyphens:auto;margin:0;}
.callout ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
.callout li{display:flex;gap:9px;font-size:14px;font-weight:500;line-height:1.55;color:#423D34;text-align:justify;}
.callout li::before{content:"\2022";color:var(--accent);flex:0 0 auto;}
.callout + .callout{margin-top:16px;}

/* In-prose highlighted boxes: a worked case illustration or a statutory/example
   snippet embedded mid-note, distinct from the top-level Must/Should Know callouts. */
.timeline{margin:28px 0 24px;}
.timeline-title{font-size:17px;font-weight:700;font-family:'Lora',Georgia,serif;margin:0 0 14px;}
.timeline-track{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch;}
.timeline-step{flex:1 1 200px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:14px 16px;}
.timeline-step .year{font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--accent);margin-bottom:6px;}
.timeline-step .desc{font-size:13.5px;color:var(--text);line-height:1.5;}
.timeline-arrow{flex:0 0 auto;align-self:center;color:var(--accent);font-size:18px;padding:0 2px;}
@media (max-width:520px){.timeline-arrow{display:none;}}

/* A row of equal-width boxes calling out several parallel items mid-note
   (e.g. "the 3 elements of a tort") - no arrows, unlike .timeline. */
.elements-grid{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0;}
.elements-grid-item{flex:1 1 220px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:14px 16px;}
.elements-grid-label{font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--accent);margin-bottom:6px;}
.elements-grid-desc{font-size:14px;color:var(--text);line-height:1.55;}

.case-box{margin:20px 0;background:var(--surface-alt);border:1px solid var(--border);border-radius:12px;padding:16px 18px;}
.case-box p{font-size:14px;font-weight:500;line-height:1.6;color:#423D34;text-align:justify;margin:0 0 8px;}
.case-box p:last-child{margin-bottom:0;}
.case-box ul{margin:0;padding-left:20px;font-size:14px;font-weight:500;line-height:1.6;color:#423D34;}
.case-box ul li{margin-bottom:6px;}
.case-box ul li:last-child{margin-bottom:0;}

/* Glossary term pages: bilingual-on-one-page (EN paragraph immediately
   followed by a Telugu paragraph), unlike Notes/Case Law which use separate
   EN/TE pages. block-label is a plain small-caps section caption; example-box
   and mixup-box are quote-style callouts with a solid vs. dashed accent rail,
   distinct from .case-box's fully-bordered look used in Notes case summaries. */
.block-label{font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--accent);margin:26px 0 10px;}
.prose .block-label:first-child{margin-top:0;}
.example-box,.mixup-box{padding:16px 18px;margin:0 0 16px;}
.example-box{border-left:3px solid var(--accent);background:var(--surface-alt);}
.mixup-box{border:1px solid var(--border);border-left:3px dashed var(--accent);background:var(--surface);}
.example-box p,.mixup-box p{font-size:16px;font-weight:500;line-height:1.65;color:#423D34;text-align:justify;margin:0 0 10px;}
.example-box p:last-child,.mixup-box p:last-child{margin-bottom:0;}
/* Same size/weight/line-height as the English paragraph next to it (inherited
   from .prose p / .example-box p / .mixup-box p) - only the font-family and a
   muted color change, so Telugu reads with the same weight and readability
   as the Notes pages' own Telugu, not shrunk down as a lesser afterthought. */
.prose p.te-para{font-family:'Noto Sans Telugu','Inter',sans-serif;color:var(--text-secondary);}
.prose .example-box p.te-para,.prose .mixup-box p.te-para{font-family:'Noto Sans Telugu','Inter',sans-serif;color:#6b6357;}
.related-terms{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px;}

.revision{margin:30px 0 40px;border-top:1px solid var(--border);padding-top:20px;}
.revision .label{font-size:11px;font-weight:700;letter-spacing:0.5px;color:var(--accent);text-transform:uppercase;margin-bottom:12px;}
.revision ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.revision li{display:flex;gap:10px;font-size:14px;font-weight:500;line-height:1.5;color:#423D34;}
.revision li::before{content:"\2022";color:var(--accent);}

.prevnext{display:flex;justify-content:space-between;align-items:center;padding:18px 0 30px;border-top:1px solid var(--border);}
.prevnext .dir{font-size:11px;color:var(--text-muted);}
.prevnext .label{font-size:13px;font-weight:600;}
.prevnext .next .label{color:var(--accent);}
.prevnext .next{text-align:right;}

/* Header */
.site-header{background:var(--bg);position:sticky;top:0;z-index:20;}
.brand{display:flex;align-items:center;gap:8px;font-family:'Lora',Georgia,serif;font-weight:700;letter-spacing:-0.2px;}
.brand .accent{color:var(--accent);}
.lang-toggle{display:flex;align-items:center;background:var(--surface);border:1px solid var(--border-strong);border-radius:20px;padding:3px;}
.lang-toggle span,.lang-toggle a{padding:5px 11px;border-radius:16px;font-size:12px;font-weight:600;color:var(--text-secondary);}
.lang-toggle span.active,.lang-toggle a.active{background:var(--accent);color:#fff;}
.lang-toggle.sm{border-radius:16px;}
.lang-toggle.sm span,.lang-toggle.sm a{padding:4px 9px;border-radius:13px;font-size:11px;}
.lang-toggle.desktop{border-radius:18px;}
.lang-toggle.desktop span,.lang-toggle.desktop a{padding:5px 12px;border-radius:15px;font-size:12.5px;}

/* Reading progress top bar */
.read-topbar{position:sticky;top:0;z-index:5;background:var(--bg);}
.progress-track{height:3px;background:var(--border);}
.progress-fill{height:3px;width:34%;background:var(--accent);}
.read-topbar .row{padding:14px 20px 10px;}
.read-topbar .right{display:flex;align-items:center;gap:14px;}

/* Footer */
.site-footer{border-top:1px solid var(--border);padding:28px 20px 24px;margin-top:40px;display:flex;flex-direction:column;gap:16px;align-items:flex-start;}
.site-footer .copy{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--text-muted);}
.site-footer .links{display:flex;flex-wrap:wrap;gap:8px 18px;}
.site-footer .links a{font-size:13px;color:var(--text-secondary);}
.site-footer .links a:hover{color:var(--accent);}

.desktop-footer{border-top:1px solid var(--border);padding:44px 80px;display:flex;align-items:center;justify-content:space-between;}
.desktop-footer .copy{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--text-muted);}
.desktop-footer .links{display:flex;gap:28px;}
.desktop-footer .links a{font-size:13px;color:var(--text-secondary);}
.desktop-footer .links a:hover{color:var(--accent);}

/* Bottom tab bar — real position:fixed at the viewport bottom (the mockup
   files show it in normal flow only because they're side-by-side preview
   cards; that is not carried into the real site). */
.bottom-nav{position:fixed;left:0;right:0;bottom:0;max-width:480px;margin:0 auto;background:var(--surface);border-top:1px solid var(--border);display:flex;padding:10px 8px 14px;}
.bottom-nav .tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--text-muted);text-decoration:none;}
.bottom-nav .tab.active{color:var(--accent);}
.bottom-nav .tab span{font-size:10.5px;font-weight:600;}

/* Quick access grid (homepage) */
.quick-grid{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:10px;padding:0 20px 24px;}
.quick-grid .item{display:flex;flex-direction:column;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px 6px 13px;text-decoration:none;color:inherit;}
.quick-grid .item:hover{border-color:var(--accent);}
.quick-grid .item:hover span{color:var(--accent);}
.quick-grid .item span{font-size:12px;font-weight:600;text-align:center;}
.quick-grid .icon-circle{width:38px;height:38px;border-radius:50%;background:var(--accent-tint);display:flex;align-items:center;justify-content:center;}

/* Continue-reading card ("Pick up where you left off") — hidden until JS
   finds a saved entry in localStorage; see continue-reading.js. */
.continue-card{display:none;text-decoration:none;color:inherit;}
.continue-card.show{display:flex;align-items:center;gap:14px;margin:16px 20px 0;background:var(--accent-tint);border-radius:14px;padding:16px 18px;}
.continue-card .icon-circle{width:44px;height:44px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.continue-card .title{font-family:'Lora',Georgia,serif;font-weight:600;font-size:14.5px;}
.continue-card .subtitle{font-size:12px;color:var(--text-secondary);margin-top:2px;}

/* Search bar */
.search-bar{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--border-strong);border-radius:14px;padding:15px 18px;box-shadow:0 2px 6px rgba(34,31,27,0.05);margin:16px 20px 18px;text-decoration:none;color:inherit;}
.search-bar:focus-within{border-color:var(--accent);box-shadow:0 2px 8px rgba(139,42,31,0.1);}
.search-bar svg{flex:0 0 auto;}
.search-bar span{color:var(--text-muted);font-size:16px;}
.search-bar input{border:none;background:transparent;outline:none;flex:1;min-width:0;font-size:16px;color:var(--text);font-family:'Inter',sans-serif;}
.search-bar input::placeholder{color:var(--text-muted);}

/* Search results page */
.search-topbar{display:flex;align-items:center;gap:12px;padding:18px 20px 0;}
.search-desktop-topbar{padding:20px 80px;border-bottom:1px solid var(--border);}
.search-body{padding:16px 20px 30px;}
.search-head-row{display:flex;align-items:center;justify-content:space-between;}
.search-chips{display:flex;gap:8px;overflow-x:auto;}
.chip{font-size:12px;font-weight:600;padding:7px 13px;border-radius:16px;border:1px solid var(--border-strong);color:var(--text-secondary);flex:0 0 auto;cursor:pointer;background:var(--surface);white-space:nowrap;}
.chip.active{background:var(--accent);color:#fff;border-color:var(--accent);}
.search-count{padding:0 0 10px;font-size:13.5px;color:var(--text-muted);margin-top:10px;}
.search-results .rowlink{padding:15px 0;}
.search-results .rowlink .t{font-size:14.5px;font-weight:600;}
.search-results .rowlink .m{font-size:11.5px;color:var(--text-muted);margin-top:4px;}
.search-empty{padding:30px 0;text-align:center;color:var(--text-muted);font-size:13.5px;}

/* Pills (year/semester selectors) */
.pill{padding:9px 16px;border-radius:10px;font-size:13.5px;font-weight:600;text-align:center;cursor:pointer;}
.pill.active{background:var(--accent);color:#fff;}
.pill.inactive{background:var(--surface);border:1px solid var(--border-strong);color:var(--text-secondary);}
.pill-sm{padding:7px 15px;border-radius:16px;font-size:12.5px;font-weight:600;}
.pill-sm.active{background:var(--accent);color:#fff;}
.pill-sm.inactive{border:1px solid var(--border-strong);color:var(--text-secondary);}

/* Featured Subjects (homepage) */
.section-head{display:flex;align-items:baseline;justify-content:space-between;padding:0 20px 12px;}
.section-head h2{font-size:17px;}
.section-head .see-all{font-size:13px;color:var(--accent);font-weight:600;}
.subject-grid{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:12px;padding:0 20px 26px;}
.subject-grid .card{padding:16px;text-decoration:none;color:inherit;display:block;}
.subject-grid .title{font-family:'Lora',Georgia,serif;font-weight:600;font-size:15px;}
.subject-grid .meta{font-size:11.5px;color:var(--text-muted);margin-top:6px;}

/* Latest Additions (homepage) */
.latest-list{padding:0 20px 8px;}
.latest-list h2{font-size:17px;padding-bottom:6px;}
.latest-list .rowlink{padding:14px 0;}
.latest-list .rowlink .t{font-size:14px;font-weight:600;color:var(--text);}
.latest-list .rowlink .m{font-size:11.5px;color:var(--text-muted);margin-top:3px;}
.latest-list .rowlink svg{width:15px;height:15px;flex:0 0 auto;}

/* Subject hub */
.hub-topbar{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 12px;position:sticky;top:0;z-index:20;background:var(--bg);}
.hub-header-mobile{padding:16px 20px 20px;border-bottom:1px solid var(--border);}
.hub-breadcrumb{font-size:11.5px;color:var(--text-muted);margin-bottom:8px;}
.hub-title{font-size:24px;line-height:1.3;}
.hub-tagline{font-size:13px;color:var(--text-secondary);margin-top:8px;}
.hub-stats{display:flex;flex-wrap:wrap;gap:20px;margin-top:16px;}
.hub-stats .stat{text-align:left;}
.hub-stats .stat .num{font-family:'Lora',Georgia,serif;font-weight:600;font-size:21px;color:var(--text);display:block;}
.hub-stats .stat .lbl{font-size:13px;color:var(--text-muted);}

.hub-tabs{display:flex;gap:10px;padding:22px 20px 0;overflow-x:auto;}
.hub-tabs .tab{font-size:13px;font-weight:600;padding:9px 16px;border-radius:18px;color:var(--text-secondary);white-space:nowrap;background:var(--surface);border:1px solid var(--border-strong);font-family:'Inter',sans-serif;cursor:pointer;}
.hub-tabs .tab.active{color:#fff;background:var(--accent);border-color:var(--accent);}

/* Unit navigation: a persistent sidebar on desktop, a horizontal pill bar
   on mobile (see .hub-body below); both drive the same .unit-panel set via
   subject-hub-units.js, so unit filtering works identically across tabs. */
.unit-pillbar{display:flex;gap:8px;overflow-x:auto;padding:16px 20px 4px;}
.unit-pillbar .pill{flex:0 0 auto;font-size:12.5px;font-weight:600;padding:8px 14px;border-radius:16px;color:var(--text-muted);border:1px solid var(--border-strong);background:var(--surface);white-space:nowrap;}
.unit-pillbar .pill.active{background:var(--accent);color:#fff;border-color:var(--accent);}
.unit-pillbar .pill[disabled]{opacity:0.45;}

.unit-sidebar{padding:24px 0 0;}
.unit-sidebar-label{font-size:13px;font-weight:700;letter-spacing:0.5px;color:var(--text-muted);text-transform:uppercase;margin-bottom:14px;}
.unit-link{display:block;padding:11px 0 11px 14px;border-left:2px solid var(--border);font-size:15.5px;color:var(--text-secondary);cursor:pointer;line-height:1.4;}
.unit-link.active{border-left-color:var(--accent);color:var(--accent);font-weight:600;}
.unit-link[aria-disabled="true"]{color:var(--text-muted);opacity:0.55;cursor:not-allowed;}
.unit-link .count{display:block;font-size:12.5px;color:var(--text-muted);font-weight:400;margin-top:3px;}
.unit-link.active .count{color:var(--accent);opacity:0.75;}

.hub-units{padding:18px 20px 8px;}
.unit-panel{display:none;}
.unit-panel.active{display:block;}
/* Rows carry their own "Unit N" tag in the meta line instead of a big
   section header - keeps a flat, scannable list in the "All units" view. */
.hub-units[data-view="all"] .empty-state{display:none;}
.hub-units .rowlink{padding:14px 0;}
.hub-row .t{font-size:14.5px;font-weight:600;}
.hub-row .m{font-size:11.5px;color:var(--text-muted);margin-top:3px;}
/* Each unit's rows live in their own .unit-panel, so a unit with exactly one
   item (Important Questions, often Bare Acts) has that row as both first and
   last child - the generic .rowlink:last-child rule was stripping its border
   entirely, making single-item units look separator-less next to multi-item
   ones. Rows in this list always keep their border, matching the live site. */
.hub-tabpanels .hub-row:last-child{border-bottom:1px solid var(--border);}
.hub-row.disabled{display:flex;align-items:center;justify-content:space-between;padding:14px 0;opacity:0.55;}

/* Content-type tab panels: Notes / Case Laws / MCQs / Important Qs / Bare
   Acts each get their own panel; only the active one is shown. The unit
   sidebar/pillbar filters every panel's .unit-panel set at once, so the
   chosen unit stays selected when switching tabs. */
.hub-tabpanel{display:none;}
.hub-tabpanel.active{display:block;}

/* Case Laws tab: secondary All/Landmark/Ordinary filter, same pill language
   as the unit pillbar. Hidden unless the Case Laws tab is active. */
.case-filter-row{display:none;gap:8px;padding:14px 20px 0;}
.case-filter-row.active{display:flex;}
.case-filter-row .pill{font-size:12.5px;font-weight:600;padding:8px 14px;border-radius:16px;color:var(--text-muted);border:1px solid var(--border-strong);background:var(--surface);white-space:nowrap;}
.case-filter-row .pill.active{background:var(--accent);color:#fff;border-color:var(--accent);}
.hub-row[data-landmark].filtered-out{display:none;}

.case-landmark-tag{display:inline-block;font-size:9.5px;font-weight:700;letter-spacing:0.3px;text-transform:uppercase;color:var(--accent);background:var(--accent-tint);border-radius:8px;padding:1px 6px;margin-left:6px;vertical-align:middle;}

/* Course page (3-Year LL.B.) */
.course-header{padding:16px 20px 0;}
.course-subjects{padding:20px 20px 8px;display:flex;flex-direction:column;gap:12px;}
.course-subject{display:flex;align-items:center;justify-content:space-between;padding:16px;text-decoration:none;color:inherit;}
.course-subject .title{font-family:'Lora',Georgia,serif;font-weight:600;font-size:15.5px;}
.course-subject .meta{font-size:11.5px;color:var(--text-muted);margin-top:5px;}

.year-tabs{display:flex;gap:8px;padding:18px 20px 0;}
.yeartab{font-size:13px;font-weight:600;padding:9px 16px;border-radius:18px;color:var(--text-muted);border:1px solid var(--border-strong);}
.yeartab.active{background:var(--accent);color:#fff;border-color:var(--accent);}

/* MCQ practice page - a regular content page (breadcrumb, Save/Share/Print,
   title) wrapping a self-contained practice card, not a standalone modal. */
.mcq-shell{padding:14px 20px 40px;}
.mcq-shell .action-row{padding-left:0;padding-right:0;}
.mcq-breadcrumb{padding:0;font-size:11.5px;}
.mcq-type-chip{display:inline-block;font-size:11px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;color:var(--accent);background:var(--accent-tint);border-radius:14px;padding:6px 13px;margin:14px 0 14px;}
.mcq-eyebrow{font-size:12px;color:var(--text-muted);margin-top:18px;}
.mcq-title{font-size:20px;line-height:1.3;margin:4px 0 20px;}

.mcq-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:20px;box-shadow:0 2px 10px rgba(34,31,27,0.05);}
.mcq-card-meta{display:flex;align-items:center;justify-content:space-between;margin:14px 0 18px;}
.mcq-counter{font-size:12px;color:var(--text-muted);}
.mcq-score{font-size:12px;color:var(--text-muted);}
.mcq-progress-track{height:4px;background:var(--border);border-radius:2px;overflow:hidden;}
.mcq-progress-fill{height:4px;background:var(--accent);width:0%;transition:width .2s;}

.mcq-question{font-size:18px;line-height:1.4;font-weight:600;margin:0;}

.mcq-options{padding-top:20px;display:flex;flex-direction:column;gap:12px;}
.mcq-option{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--border-strong);border-radius:10px;padding:15px 16px;cursor:pointer;}
.mcq-option-bullet{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--border-strong);flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--text-secondary);}
.mcq-option-text{font-size:14.5px;}
.mcq-option.correct{background:var(--correct-tint);border:1.5px solid var(--correct);}
.mcq-option.correct .mcq-option-bullet{background:var(--correct);border-color:var(--correct);}
.mcq-option.correct .mcq-option-text{font-weight:600;color:var(--correct);}
.mcq-option.incorrect{opacity:0.6;}

/* Grid-rows collapse trick: the box's true height is unknown in advance
   (explanations vary in length), so a smooth reveal can't just animate a
   fixed max-height. Animating the grid row from 0fr to 1fr expands to
   exactly the content's natural height, so the page grows in step with an
   animation instead of the content just appearing and shoving the footer
   down in one frame. */
.mcq-explain{display:grid;grid-template-rows:0fr;opacity:0;margin-top:0;transition:grid-template-rows 0.3s ease, opacity 0.25s ease, margin-top 0.3s ease;}
.mcq-explain.visible{grid-template-rows:1fr;opacity:1;margin-top:22px;}
.mcq-explain-box{overflow:hidden;background:var(--surface-alt);border:1px solid var(--border);border-radius:12px;padding:16px 17px;}
.mcq-explain-label{font-size:11px;font-weight:700;letter-spacing:0.4px;color:var(--correct);text-transform:uppercase;margin-bottom:7px;}
.mcq-explain.wrong .mcq-explain-label{color:var(--accent);}
.mcq-explain-body{font-size:13.5px;line-height:1.6;color:#3A362F;}

.mcq-next-wrap{padding:20px 0 30px;}
.mcq-next{width:100%;background:var(--accent);color:#fff;text-align:center;border-radius:10px;padding:15px;font-size:14.5px;font-weight:600;border:none;cursor:pointer;font-family:'Inter',sans-serif;}
.mcq-next:disabled{opacity:0.5;cursor:not-allowed;}

/* Glossary */
.glossary-topbar{position:sticky;top:0;z-index:5;background:var(--bg);display:flex;align-items:center;justify-content:space-between;padding:14px 20px 12px;border-bottom:1px solid var(--border);}
.glossary-topbar-title{font-family:'Lora',Georgia,serif;font-weight:600;font-size:15px;}
.glossary-subtitle{padding:14px 20px 0;font-size:11.5px;color:var(--text-muted);}
.glossary-head{padding:36px 80px 0;}
.glossary-breadcrumb{font-size:12px;color:var(--text-muted);}
.glossary-h1{font-size:28px;margin-top:10px;}

.glossary-grid{padding:0;}
.glossary-az{display:none;}
.az-item{display:block;font-size:12.5px;color:var(--text-muted);padding:4px 0;text-decoration:none;}
.az-item.active{color:var(--accent);font-weight:700;}

.letter-head{font-family:'Lora',Georgia,serif;font-size:14px;font-weight:700;color:var(--accent);padding:18px 20px 8px;position:sticky;top:56px;background:var(--bg);z-index:4;}
.term{padding:14px 20px;border-bottom:1px solid var(--border);}
.term-title{font-family:'Lora',Georgia,serif;font-weight:600;font-size:15px;}
.term-body{font-size:13.5px;color:#3A362F;line-height:1.55;margin-top:5px;}

/* Simple sticky topbar: back + lang toggle + bookmark (Bare Act, Case Law) */
.simple-topbar{position:sticky;top:0;z-index:5;background:var(--bg);display:flex;align-items:center;justify-content:space-between;padding:14px 20px 12px;border-bottom:1px solid var(--border);}

/* Shared "reference page" chrome: Bare Act and Important Question pages
   both use this - a small uppercase type tag, a two-column layout (content
   + a right-hand "On This Page" list, not a left TOC like Notes), and the
   related rail runs full-width below the content instead of sticking down
   the side. */
.act-label-wrap{padding:22px 20px 0;}
.act-label{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:0.5px;color:var(--accent);text-transform:uppercase;background:var(--accent-tint);border-radius:6px;padding:4px 10px;margin-bottom:14px;}
.act-tagline{color:var(--text-secondary);}

.ref-grid{padding:0 20px;}
.ref-related{padding:24px 20px 30px;border-top:1px solid var(--border);margin-top:10px;}

.act-clause{margin:12px 0;background:var(--surface-alt);border-left:3px solid var(--accent);border-radius:0 8px 8px 0;padding:14px 16px;}
.act-clause-label{font-size:11px;font-weight:700;letter-spacing:0.4px;color:var(--accent);text-transform:uppercase;margin-bottom:6px;}
.act-clause p{margin:0 0 8px;color:#3A362F;}
.act-clause p:last-child{margin-bottom:0;}
.act-cited-in{margin:-4px 0 18px;}
.act-disclaimer{font-size:12px;font-style:italic;color:var(--text-muted);margin-top:28px;padding-top:16px;border-top:1px solid var(--border);}

/* A rounded pill/badge with plain muted text - used for "Cited in" under a
   Bare Act clause. Not a visible link style; it's a citation tag. */
.topic-pill{display:inline-block;font-size:12px;font-weight:600;color:var(--text-secondary);background:var(--surface);border:1px solid var(--border-strong);border-radius:16px;padding:6px 13px;margin:0 6px 10px 0;}
a.topic-pill:hover{color:var(--accent);border-color:var(--accent);}

/* Same pill shape, but the text itself reads as a link (brown, underlined) -
   used for the topic links under an Important Question. */
.impq-pill{display:inline-block;font-size:12px;font-weight:600;color:var(--accent);text-decoration:underline;background:var(--surface);border:1px solid var(--border-strong);border-radius:16px;padding:6px 13px;margin:0 6px 10px 0;}
a.impq-pill:hover{color:var(--accent-hover);border-color:var(--accent-hover);}

/* Save / Share / Print action row - shared by Bare Act, Case Law, and
   Important Question pages */
.action-row{display:flex;gap:8px;padding:14px 20px 0;}
.action-btn{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--text-secondary);background:var(--surface);border:1px solid var(--border-strong);border-radius:16px;padding:7px 14px;cursor:pointer;font-family:'Inter',sans-serif;}
.action-btn.active{color:var(--accent);border-color:var(--accent);background:var(--accent-tint);}
@media print{
  .site-header,.bottom-nav,.action-row,.read-toc,.ref-toc,.read-related,.ref-related,.prevnext,footer,.back-to-top{display:none !important;}
}

/* Mobile-only spacing + collapsible "On This Page" (desktop unchanged) */
@media (max-width: 859.98px){
  /* One shared gap between the sticky header and the first content row;
     the first rows' own top padding is zeroed so it is not doubled. */
  .site-header{margin-bottom:14px;}
  .action-row{padding-top:0;}
  .hub-header-mobile{padding-top:0;}
  .read-title,.case-title{margin-top:10px;}
  .prose h2[id],.prose h3[id]{scroll-margin-top:72px;}
}
.toc-m{margin:16px 0;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface);}
.toc-m-btn{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:44px;padding:10px 14px;background:none;border:none;font:600 13.5px 'Inter','Noto Sans Telugu',sans-serif;color:var(--text);cursor:pointer;text-align:left;}
.toc-m-chev{transition:transform .2s ease;}
.toc-m.open .toc-m-chev{transform:rotate(180deg);}
.toc-m-list{border-top:1px solid var(--border);padding:4px 0;}
.toc-m-list[hidden]{display:none;}
.toc-m-link{display:flex;align-items:center;min-height:44px;padding:8px 14px;font-size:14.5px;color:var(--text);line-height:1.4;}
.toc-m-link:visited{color:var(--text);}
.toc-m-link:hover,.toc-m-link:focus-visible{color:var(--accent);}
.te .toc-m-link{font-size:16px;line-height:1.5;}
@media (prefers-reduced-motion: reduce){.toc-m-chev{transition:none;}}
@media print{.toc-m{display:none !important;}}

/* Important Question list */
.impq-body{counter-reset:impq;}
.impq-list{list-style:none;margin:0;padding:0;}
.impq-list li{counter-increment:impq;position:relative;padding:14px 0 14px 30px;border-bottom:1px solid var(--border);}
.impq-list li::before{content:counter(impq) ".";position:absolute;left:0;top:14px;font-weight:700;color:var(--text-muted);}
.impq-q{font-size:15.5px;font-weight:600;line-height:1.5;color:var(--text);}
.impq-q .aside{font-weight:400;color:var(--text-muted);font-size:13.5px;}
.impq-links{margin-top:10px;}

.impq-related-item{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--border);text-decoration:none;color:inherit;}
.impq-related-item:last-child{border-bottom:none;}
.impq-related-item .title{font-size:14px;font-weight:600;line-height:1.4;color:var(--text);}
.impq-related-item .arrow{font-size:16px;color:var(--text-muted);flex-shrink:0;}
.impq-related-item:hover .title{color:var(--accent);}

/* Case Law */
.case-breadcrumb{font-size:11.5px;color:var(--text-muted);margin-bottom:8px;}
.case-grid{padding:18px 20px 0;}
.case-title{font-size:21px;line-height:1.32;}
.case-citation{font-size:12.5px;color:var(--text-secondary);margin-top:6px;}
.landmark-badge{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:0.3px;text-transform:uppercase;color:var(--accent);background:var(--accent-tint);border-radius:10px;padding:2px 8px;vertical-align:middle;}
/* Meta table (Court/Bench/Year/Cited in) - matches the plain bordered-table
   format used on the reference site, not a decorative box. Every <th> is
   white-space:nowrap so the label column never wraps mid-word, regardless
   of how long the Bench/Cited-in value column runs. */
.case-meta{width:100%;border-collapse:collapse;font-size:13px;margin:18px 0 0;border:1px solid var(--border-strong);}
.case-meta th{white-space:nowrap;text-align:left;font-family:'Inter',sans-serif;font-weight:700;font-size:11.5px;color:var(--text);background:var(--surface-alt);padding:10px 12px;border-bottom:1px solid var(--border-strong);border-right:1px solid var(--border-strong);width:1%;}
.case-meta tr:last-child th,.case-meta tr:last-child td{border-bottom:none;}
.case-meta td{padding:10px 12px;color:#423D34;font-weight:500;line-height:1.55;border-bottom:1px solid var(--border);}

.case-main{padding-top:26px;padding-bottom:8px;}
.case-block{margin-bottom:26px;}
.case-block .block-label{font-size:11px;font-weight:700;letter-spacing:0.5px;color:var(--accent);text-transform:uppercase;margin-bottom:8px;}
.case-block .block-body{font-size:15px;line-height:1.68;color:#3A362F;text-align:justify;}
.case-block .block-body p{margin:0 0 12px;}
.case-block .block-body p:last-child{margin-bottom:0;}
.block-list{margin:0;padding-left:20px;font-size:15px;line-height:1.68;color:#3A362F;}
.block-list li{margin-bottom:10px;padding-left:4px;}
.block-list li:last-child{margin-bottom:0;}
.case-block-held{background:var(--surface-alt);border:1px solid var(--border);border-radius:12px;padding:18px;}
.case-block-held .block-label{margin-bottom:9px;}

/* Desktop nav links in the header */
.desktop-nav{display:flex;gap:30px;font-size:14px;font-weight:500;}
.desktop-nav a{color:var(--text-secondary);}
.desktop-nav a:hover{color:var(--accent);}
.desktop-nav a.active{color:var(--accent);font-weight:600;}

.hero{display:flex;flex-direction:column;align-items:center;padding:60px 80px 44px;text-align:center;}
.hero h1{font-size:32px;line-height:1.3;}
.hero .sub{font-size:15px;color:var(--text-secondary);margin-top:12px;}
.hero .search-bar{width:600px;margin:28px 0 0;box-shadow:none;}
.hero .search-bar span{font-size:15.5px;}

/* ===== Desktop / wide-screen layout ===== */
@media (min-width: 860px){
  .page{max-width:1440px;padding-bottom:0;}

  .bottom-nav{display:none;}

  .breadcrumb,.quick-grid,.read-topbar .row{padding-left:80px;padding-right:80px;}

  .quick-grid{grid-template-columns:repeat(5, minmax(0, 1fr));gap:16px;padding-bottom:56px;}
  .quick-grid .item{padding:22px 8px;gap:10px;}
  .quick-grid .item span{font-size:13px;}

  .continue-card-wrap{display:flex;justify-content:center;padding:0 80px;}
  .continue-card-wrap:has(.continue-card.show){padding-top:18px;}
  .continue-card-wrap ~ .hero{padding-top:36px;}
  .continue-card.show{width:600px;margin:0;padding:16px 22px;}
  .continue-card .icon-circle{width:40px;height:40px;}

  .section-head{padding:0 0 18px;}
  .section-head h2{font-size:20px;}

  .home-split{display:grid;grid-template-columns:1.15fr 0.85fr;gap:56px;align-items:start;padding:0 80px 70px;}

  .subject-grid{padding:0;gap:14px;}
  .subject-grid .card{padding:20px;}
  .subject-grid .title{font-size:17px;}
  .subject-grid .meta{font-size:12px;margin-top:8px;}

  .latest-list{padding:0;}
  .latest-list h2{font-size:20px;margin-bottom:8px;padding-bottom:0;}
  .latest-list .rowlink{padding:16px 0;}
  .latest-list .rowlink .t{font-size:14.5px;}
  .latest-list .rowlink .m{font-size:12px;margin-top:4px;}
  .latest-list .rowlink svg{width:16px;height:16px;}

  /* Reading page: TOC | main content | Related, three-column grid.
     The mockup's 200/700/1fr columns only hold together at exactly 1440px;
     minmax() keeps the related rail from being crushed at narrower desktop
     widths instead of copying those as fixed pixel tracks. */
  .read-breadcrumb{padding:8px 80px 0;margin-top:22px;font-size:12px;}
  /* The generic .breadcrumb (nav-page.njk) never got a desktop treatment
     before - every other breadcrumb variant on the site clears the sticky
     header by 22px; this one sat flush against it. */
  .breadcrumb{padding:8px 80px 0;margin-top:22px;font-size:12px;}
  .read-grid{display:grid;grid-template-columns:minmax(160px,200px) minmax(0,700px) minmax(240px,1fr);gap:56px;padding:14px 80px 80px;align-items:start;}
  .read-toc{position:sticky;top:24px;padding-top:6px;}
  .read-related{position:sticky;top:24px;padding-top:6px;border-top:none;margin-top:0;}

  .read-title{font-size:32px;max-width:680px;}
  .read-meta{margin-top:14px;padding-bottom:24px;}
  .read-meta div{font-size:12.5px;}

  /* Bare Act / Important Question: content column + a narrow "On This
     Page" list on the RIGHT (not a left TOC like Notes), with the related
     rail running full-width below rather than sticking down a third
     column. */
  .action-row{padding:14px 80px 0;}
  .act-label-wrap{padding:22px 80px 0;}
  .ref-grid{display:grid;grid-template-columns:minmax(0,700px) minmax(200px,260px);gap:56px;padding:14px 80px 40px;align-items:start;}
  .ref-toc{position:sticky;top:24px;padding-top:6px;}
  .ref-related{padding:24px 80px 60px;max-width:1080px;}
  .impq-q{font-size:16px;}

  /* Subject hub */
  .hub-breadcrumb-desktop{padding:40px 80px 0;margin-bottom:0;}
  .hub-header-desktop{padding:10px 80px 28px;border-bottom:1px solid var(--border);}
  .hub-header-desktop .hub-title{font-size:32px;}
  .hub-header-desktop .hub-tagline{margin-top:10px;font-size:14px;max-width:600px;}
  .hub-header-desktop .hub-stats{margin-top:18px;gap:28px;}

  .case-filter-row.active{padding:0 0 16px;}

  /* Unit sidebar + content, side by side; collapses to the mobile pill bar
     below 860px via .unit-sidebar's own mobile-only/desktop-only wrapper. */
  .hub-body{display:grid;grid-template-columns:220px 1fr;gap:32px;padding:24px 80px 70px;max-width:1080px;align-items:start;}
  /* A border on the sidebar itself, not a line spanning the whole grid -
     it ends where the unit list ends, like a short separator, not a rule
     running the full length of a much taller content column. */
  .unit-sidebar{position:sticky;top:24px;padding:0 20px 4px 0;border-right:1px solid var(--border);}
  /* Right-hand column: tabs sit above the item list, next to the sidebar -
     not spanning the full page width above both columns. */
  .hub-content{min-width:0;}
  .hub-tabs{gap:10px;padding:0 0 18px;}
  .hub-units{padding:0;}
  .hub-row .t{font-size:15px;}
  .hub-row .m{font-size:12px;margin-top:4px;}

  /* Course page (3-Year LL.B.) */
  .course-header{padding:44px 80px 0;}
  .course-header .hub-title{font-size:32px;}
  .course-header .hub-tagline{margin-top:10px;font-size:14.5px;}

  .year-tabs{gap:10px;padding:26px 80px 0;}
  .yeartab{font-size:14px;padding:11px 22px;border-radius:20px;}

  .course-subjects{padding:34px 80px 80px;display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:18px;}
  .course-subject{padding:20px;}
  .course-subject .title{font-size:17px;}
  .course-subject .meta{font-size:12px;margin-top:6px;}

  /* MCQ practice page */
  /* Breadcrumb/chip/actions/title span the full padded content width, same
     as every other reading page's header - only the quiz card itself gets
     a readable cap, left-anchored, not floated as a centered island. */
  /* Same centered single-column pattern already used for /search/ and the
     type-listing pages (.search-body{max-width:800px;margin:0 auto}) -
     breadcrumb, actions, title and the quiz card all share one column, so
     they line up at the same left edge instead of the card floating in a
     separately-constrained box. */
  .mcq-shell{max-width:800px;margin:0 auto;padding:20px 24px 80px;}
  .mcq-breadcrumb{font-size:12px;padding:0;margin-top:0;}
  .mcq-title{font-size:26px;margin:6px 0 24px;max-width:760px;}
  .mcq-card{padding:32px;}
  .mcq-progress-track{height:5px;}
  .mcq-progress-fill{height:5px;}
  .mcq-question{font-size:22px;line-height:1.45;}
  .mcq-options{padding-top:24px;gap:14px;}
  .mcq-option{padding:18px 20px;gap:14px;}
  .mcq-option-bullet{width:28px;height:28px;font-size:13px;}
  .mcq-option-text{font-size:16px;}
  .mcq-explain.visible{margin-top:28px;}
  .mcq-explain-box{padding:20px 22px;}
  .mcq-explain-body{font-size:14.5px;line-height:1.65;}
  .mcq-next-wrap{display:flex;justify-content:flex-end;padding:30px 0 100px;}
  .mcq-next{width:auto;padding:14px 32px;font-size:15px;}

  /* Glossary */
  .glossary-grid{display:grid;grid-template-columns:120px 1fr;gap:56px;padding:26px 80px 80px;align-items:start;}
  .glossary-az{display:flex;flex-direction:column;position:sticky;top:24px;}
  .letter-head{position:static;padding:20px 0 8px;}
  .letter-head:first-child{padding-top:0;}
  .term{padding:16px 0;border-bottom:1px solid var(--border);max-width:680px;}
  .term-title{font-size:16px;}
  .term-body{font-size:14px;line-height:1.6;margin-top:6px;}


  /* Case Law */
  .case-breadcrumb{padding:8px 80px 0;margin-top:22px;font-size:12px;margin-bottom:0;}
  .case-grid{display:grid;grid-template-columns:minmax(0,700px) minmax(240px,1fr);gap:56px;padding:14px 80px 80px;align-items:start;}
  .case-title{font-size:30px;}
  .case-citation{font-size:13.5px;margin-top:8px;}
  .case-meta{max-width:680px;font-size:14px;margin-top:22px;}
  .case-meta th{font-size:12px;padding:11px 16px;}
  .case-meta td{padding:11px 16px;}
  .case-main{padding-top:32px;}
  .case-block{max-width:680px;margin-bottom:28px;}
  .case-block .block-body{font-size:16px;line-height:1.72;}
  .block-list{font-size:16px;line-height:1.72;max-width:680px;}
  .case-block-held{padding:22px;}

  /* Search results page */
  .search-body{max-width:800px;margin:0 auto;padding:36px 0 100px;}
  .search-chips{gap:10px;}
  .chip{font-size:13px;padding:8px 16px;}
  .search-count{padding:0 0 12px;margin-top:12px;font-size:14px;}
  .search-results{margin-top:20px;}
  .search-results .rowlink{padding:18px 0;}
  .search-results .rowlink .t{font-size:16px;}
  .search-results .rowlink .m{font-size:12.5px;margin-top:5px;}

  .prose{padding-top:26px;}
  .prose p{font-size:17px;line-height:1.78;margin:0 0 20px;max-width:680px;}
  .prose h2{font-size:21px;margin:38px 0 14px;}
  .case-prose h3{font-size:17px;}
  .case-prose ol,.case-prose ul{max-width:680px;}
  .case-prose ol li,.case-prose ul li{font-size:17px;line-height:1.78;}
  .prose table{max-width:680px;font-size:14px;}
  .prose th{padding:10px 12px;font-size:12.5px;}
  .prose td{padding:12px;}

  .callout{max-width:680px;padding:20px 22px;}
  .callout .label{margin-bottom:9px;}
  .callout p{font-size:14.5px;line-height:1.65;}
  .callout li{font-size:14.5px;line-height:1.6;}

  .revision{max-width:680px;margin:20px 0 0;padding-top:22px;}
  .revision .label{margin-bottom:14px;}
  .revision li{font-size:14.5px;line-height:1.55;}

  .prevnext{max-width:680px;padding:26px 0 0;margin-top:22px;}

  /* Nav/subject-hub pages: their sections already carry 20px padding each,
     so 60px here brings the total to 80px, matching the header */
  .page-body{max-width:900px;margin:0 auto;padding-left:60px;padding-right:60px;box-sizing:border-box;}
  .resource-grid{grid-template-columns:repeat(3, minmax(0, 1fr)) !important;}
}

/* Back to top button - fixed, appears after scrolling, above the mobile
   bottom-nav bar so it never overlaps those tabs */
.back-to-top{position:fixed;right:16px;bottom:80px;width:44px;height:44px;border-radius:50%;background:var(--accent);color:#fff;border:none;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 12px rgba(0,0,0,.2);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s ease,transform .2s ease,visibility .2s;z-index:15;cursor:pointer;padding:0;}
.back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0);}
.back-to-top:hover{background:var(--accent-hover);}
@media (min-width: 860px){
  .back-to-top{bottom:32px;right:40px;width:46px;height:46px;}
}

/* Telugu reading-content sizing - Noto Sans Telugu reads visually smaller
   than Inter/Lora at the same pixel size, so Telugu Notes pages (.te,
   applied only in notes.njk) get a size bump on top of the English
   baseline above. English sizes are untouched. */
.te .read-title{font-size:27px;}
.te .prose p{font-size:18.5px;line-height:1.75;}
.te .prose h2{font-size:21px;}
.te .case-meta{font-size:14.5px;}
.te .case-meta th{font-size:12.5px;}
.te .case-prose h3{font-size:17.5px;}
.te .case-prose ol li,.te .case-prose ul li{font-size:18.5px;line-height:1.75;}
.te .prose table{font-size:15px;}
.te .prose th{font-size:13.5px;}
.te .callout p,.te .callout li{font-size:16px;}
.te .case-box p,.te .example-box p,.te .case-box ul,.te .example-box ul{font-size:16px;}
.te .elements-grid-desc{font-size:16px;}
.te .revision li{font-size:16.5px;}
.te .toc-item{font-size:15px;}
.te .related-card .title{font-size:15px;}

@media (min-width: 860px){
  .te .read-title{font-size:34px;}
  .te .prose p{font-size:19px;line-height:1.8;}
  .te .prose h2{font-size:23px;}
  .te .prose table{font-size:15.5px;}
  .te .callout p,.te .callout li{font-size:16.5px;}
  .te .case-box p,.te .example-box p,.te .case-box ul,.te .example-box ul{font-size:16.5px;}
  .te .elements-grid-desc{font-size:16.5px;}
  .te .revision li{font-size:17px;}
}

/* Saved for later page */
.saved-header{display:flex;align-items:center;gap:14px;padding:20px 20px 4px;}
.saved-header-icon{width:44px;height:44px;background:var(--accent);border-radius:50%;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.saved-header-title{font-size:20px;line-height:1.2;}
.saved-header-count{font-size:12.5px;color:var(--text-muted);margin-top:4px;}

.saved-list{display:flex;flex-direction:column;gap:10px;padding:18px 20px 30px;}
.saved-card{display:flex;align-items:center;gap:14px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:12px 14px;}
.saved-card-icon{width:38px;height:38px;border-radius:10px;background:var(--accent-tint);display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.saved-card-body{flex:1;min-width:0;text-decoration:none;}
.saved-card-body .t{font-size:14.5px;font-weight:600;color:var(--text);line-height:1.35;}
.saved-card-body .m{font-size:12px;color:var(--text-muted);margin-top:3px;}
.saved-remove{flex:0 0 auto;width:30px;height:30px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);background:none;border:1px solid var(--border-strong);border-radius:50%;padding:0;cursor:pointer;}
.saved-remove:hover{color:var(--accent);border-color:var(--accent);}

.saved-empty{padding:50px 24px;text-align:center;}
.saved-empty-icon{width:52px;height:52px;background:var(--accent-tint);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 18px;}
.saved-empty p{font-size:14px;color:var(--text-secondary);line-height:1.6;max-width:340px;margin:0 auto 20px;}
.saved-browse-btn{display:inline-block;font-size:13.5px;font-weight:600;color:#fff;background:var(--accent);border-radius:20px;padding:11px 22px;}
.saved-browse-btn:hover{background:var(--accent-hover);color:#fff;}

@media (min-width: 860px){
  .saved-header{padding:8px 80px 0;}
  .saved-header-title{font-size:24px;}
  .saved-list{max-width:720px;margin:0 auto;padding:20px 80px 60px;}
  .saved-empty{padding:70px 24px;}
}

/* Dedicated type-listing pages (Notes/Case Laws/Bare Acts/MCQs/Important
   Questions/Glossary) - flat, searchable list of every item of one content
   type across all subjects, no subject/semester navigation repeated.
   Matches the live site: just the search box, straight into results - no
   page title or count line duplicating what the active nav item already
   says. */
/* Glossary-only hero + chip row above the shared type-listing search/body -
   the other 5 type-listing pages (Notes/Case Laws/MCQs/Bare Acts/Important
   Qs) never include this markup, so these rules stay inert for them. */
.type-listing-hero{text-align:center;padding:28px 20px 0;}
.type-listing-eyebrow{font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--accent);margin-bottom:8px;}
.type-listing-hero h1{font-size:26px;line-height:1.3;}
.type-listing-sub{font-size:14px;color:var(--text-secondary);margin:10px auto 0;max-width:440px;line-height:1.5;}
.type-listing-chips{margin:0 20px 8px;flex-wrap:wrap;overflow-x:visible;}
.type-listing-section-head{margin:20px 20px 4px;}
.type-listing-section-head h2{font-size:19px;}

.type-listing-search{margin:20px 20px 8px;}
.type-listing-body{padding:0 20px 40px;}
.type-listing-more{display:block;width:calc(100% - 40px);margin:18px 20px 0;padding:12px;border-radius:10px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text-secondary);font-weight:600;font-size:13.5px;font-family:'Inter',sans-serif;cursor:pointer;}
.type-listing-more:hover{color:var(--accent);border-color:var(--accent);}

/* Article-style result rows - tag, linked title, real content snippet.
   Shared by the type-listing pages above and the main /search/ page.
   No trailing arrow/date: we don't fabricate publish dates for content
   that was never actually dated, unlike the live Blogger site's posts. */
.article-list{display:flex;flex-direction:column;}
.article-row{padding:16px 0;border-bottom:1px solid var(--border);}
.article-row:last-child{border-bottom:none;}
.article-tag{font-size:11px;color:var(--accent);font-weight:700;letter-spacing:0.05em;text-transform:uppercase;margin-bottom:4px;}
.article-row h4{font-size:15px;font-weight:600;margin:0 0 4px;line-height:1.35;}
.article-row h4 a{color:var(--text);}
.article-row h4 a:hover{color:var(--accent);}
.article-row p{font-size:13.5px;color:var(--text-muted);margin:0;line-height:1.55;}

/* Larger, more prominent search box for pages where search IS the page
   (main Search, and every type-listing page) - the homepage/header search
   stay at the standard .search-bar size since they're secondary there. */
.search-bar-lg{padding:17px 20px;border-radius:16px;}
.search-bar-lg input{font-size:16.5px;}
.search-clear{flex:0 0 auto;width:26px;height:26px;border-radius:50%;border:none;background:var(--surface-alt);color:var(--text-muted);font-size:16px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.search-clear:hover{background:var(--border);color:var(--text);}

@media (min-width: 860px){
  .type-listing-hero{padding:48px 80px 0;}
  .type-listing-hero h1{font-size:36px;}
  .type-listing-sub{font-size:15.5px;max-width:520px;}
  .type-listing-chips{max-width:960px;margin:0 auto 16px;padding:0 80px;}
  .type-listing-section-head{max-width:960px;margin:28px auto 8px;padding:0 80px;}
  .type-listing-section-head h2{font-size:22px;}
  .type-listing-search{max-width:800px;margin:28px auto 8px;padding-left:80px;padding-right:80px;box-sizing:content-box;}
  .type-listing-body{max-width:960px;margin:0 auto;padding:0 80px 60px;}
  .type-listing-more{max-width:960px;margin:18px auto 0;width:100%;}
  .article-row h4{font-size:16px;}
  .article-row p{font-size:14px;max-width:720px;}
}

/* Desktop header search: icon toggles an inline dropdown form instead of
   navigating away immediately - typing + Enter submits a GET to /search/. */
.header-search{position:relative;flex-shrink:0;}
.header-search-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;border:1px solid var(--border-strong);background:var(--surface);color:var(--text-secondary);cursor:pointer;padding:0;}
.header-search-btn:hover{border-color:var(--accent);color:var(--accent);}
.header-search-form{display:none;position:absolute;top:calc(100% + 10px);right:0;background:var(--surface);border:1px solid var(--border-strong);border-radius:12px;padding:8px;box-shadow:0 8px 24px rgba(34,31,27,0.12);z-index:60;}
.header-search.open .header-search-form{display:block;}
.header-search-form input{width:280px;max-width:60vw;border:1px solid var(--border);border-radius:8px;padding:10px 12px;font-size:15px;font-family:'Inter',sans-serif;color:var(--text);outline:none;}
.header-search-form input:focus{border-color:var(--accent);}

/* Mobile hamburger menu: a plain button toggling a slide-down nav-links
   panel - the bottom-nav already handles Home/Browse/Search/Saved, so this
   is only for the section pages (Notes, Case Laws, etc.) that live in the
   desktop nav but had no mobile entry point at all before. */
.menu-toggle{background:none;border:none;padding:0;display:flex;cursor:pointer;color:inherit;}
.mobile-nav-panel{display:none;flex-direction:column;padding:4px 20px 12px;}
.mobile-nav-panel.open{display:flex;}
.mobile-nav-panel a{padding:13px 0;font-size:15px;font-weight:600;color:var(--text-secondary);border-bottom:1px solid var(--border);text-decoration:none;}
.mobile-nav-panel a:last-child{border-bottom:none;}
.mobile-nav-panel a.active{color:var(--accent);}

/* ---- Mobile header, menu drawer, subject-hub tabs/unit sheet, search chips ---- */
html.nav-open{overflow:hidden;}
.m-head{display:flex;align-items:center;gap:6px;height:56px;padding:0 8px 0 12px;border-bottom:1px solid var(--border);}
.m-head-btn{display:flex;align-items:center;justify-content:center;width:44px;height:44px;flex:0 0 44px;background:none;border:none;padding:0;cursor:pointer;color:inherit;}
.m-head-back{margin-left:-8px;}
.m-head-brand{text-decoration:none;font-size:20px;min-height:44px;min-width:0;}
.m-head-brand svg{flex:0 0 auto;}
.m-head-right{display:flex;align-items:center;gap:4px;margin-left:auto;}
.m-head .lang-toggle a,.m-head .lang-toggle span{position:relative;}
.m-head .lang-toggle a::after{content:"";position:absolute;inset:-8px -3px;}
@media (max-width:359.98px){.m-head-word{display:none;}}

.nav-backdrop{position:fixed;inset:0;background:rgba(34,31,27,.5);opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s;z-index:100;}
.nav-backdrop.open{opacity:1;visibility:visible;}
.nav-drawer{position:fixed;top:0;right:0;bottom:0;width:80%;max-width:320px;background:var(--bg);box-shadow:-8px 0 24px rgba(34,31,27,.18);transform:translateX(100%);visibility:hidden;transition:transform .25s ease,visibility .25s;z-index:101;display:flex;flex-direction:column;overflow-y:auto;}
.nav-drawer.open{transform:none;visibility:visible;}
.nav-drawer-head{display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 8px 0 20px;border-bottom:1px solid var(--border);flex:0 0 auto;}
.nav-drawer-links{display:flex;flex-direction:column;padding:8px 20px 24px;}
.nav-drawer-links a{display:flex;align-items:center;min-height:48px;font-size:16px;font-weight:600;color:var(--text-secondary);border-bottom:1px solid var(--border);text-decoration:none;}
.nav-drawer-links a:last-child{border-bottom:none;}
.nav-drawer-links a.active{color:var(--accent);}
@media (min-width:860px){.nav-drawer,.nav-backdrop{display:none !important;}}
@media (prefers-reduced-motion:reduce){.nav-backdrop,.nav-drawer,.sheet-backdrop,.unit-sheet{transition:none !important;}}

/* Subject hub (mobile): stat tiles are the content-type tabs */
.hub-stat-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin-top:16px;}
.hub-stat-tabs .stat{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:56px;padding:6px 2px;border-radius:10px;border:1px solid var(--border-strong);background:var(--surface);font-family:'Inter',sans-serif;cursor:pointer;color:var(--text-secondary);}
.hub-stat-tabs .stat .num{font-family:'Lora',Georgia,serif;font-weight:600;font-size:19px;color:var(--text);line-height:1.2;}
.hub-stat-tabs .stat .lbl{font-size:11px;font-weight:600;color:var(--text-muted);white-space:nowrap;}
.hub-stat-tabs .stat.active{background:var(--accent);border-color:var(--accent);}
.hub-stat-tabs .stat.active .num,.hub-stat-tabs .stat.active .lbl{color:#fff;}
.unit-picker{padding:14px 20px 0;}
.unit-picker-btn{display:flex;align-items:center;gap:6px;width:100%;min-height:44px;padding:0 16px;border-radius:10px;border:1px solid var(--border-strong);background:var(--surface);font-family:'Inter',sans-serif;font-size:14px;font-weight:600;color:var(--text);cursor:pointer;}
.sheet-backdrop{position:fixed;inset:0;background:rgba(34,31,27,.5);opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s;z-index:100;}
.sheet-backdrop.open{opacity:1;visibility:visible;}
.unit-sheet{position:fixed;left:0;right:0;bottom:0;max-height:75vh;background:var(--bg);border-radius:16px 16px 0 0;box-shadow:0 -8px 24px rgba(34,31,27,.18);transform:translateY(100%);visibility:hidden;transition:transform .25s ease,visibility .25s;z-index:101;display:flex;flex-direction:column;}
.unit-sheet.open{transform:none;visibility:visible;}
.unit-sheet-head{padding:16px 20px 8px;font-family:'Lora',Georgia,serif;font-weight:600;font-size:16px;}
.unit-sheet-list{overflow-y:auto;padding:0 12px 20px;display:flex;flex-direction:column;}
.sheet-opt{display:flex;align-items:center;min-height:48px;padding:0 10px;text-align:left;background:none;border:none;border-bottom:1px solid var(--border);font-family:'Inter',sans-serif;font-size:14.5px;font-weight:600;color:var(--text-secondary);cursor:pointer;}
.sheet-opt.active{color:var(--accent);}
.sheet-opt[disabled]{opacity:.45;cursor:default;}
@media (min-width:860px){.unit-sheet,.sheet-backdrop{display:none !important;}}
@media (max-width:859.98px){.hub-tabs{display:none;}}

/* Search page (mobile): chips wrap instead of scrolling; search box on its own row */
.search-topbar{padding:12px 20px 0;}
@media (max-width:859.98px){
  .search-chips{flex-wrap:wrap;overflow-x:visible;}
  .search-chips .chip{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;}
}
.unit-picker-btn span[aria-hidden]{margin-left:auto;}

/* Brand emblem + print watermark */
.brand-mark{display:block;flex:0 0 auto;width:30px;height:30px;}
.print-watermark{display:none;}
@media print{
  .print-watermark{display:block;position:fixed;top:50%;left:50%;width:70%;max-width:600px;transform:translate(-50%,-50%);opacity:.12;z-index:-1;pointer-events:none;-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  html,body{background:transparent !important;}
}

/* About / Contact / Privacy / Disclaimer / Terms / 404: centred reading column */
.info-page{max-width:760px;margin:0 auto;padding:20px 20px 40px;}
.info-page h1{font-size:24px;margin:0 0 6px;}
.info-page .prose{padding:8px 0 0;}
.info-page .prose p,.info-page .prose li{font-size:16.5px;line-height:1.75;color:#423D34;text-align:left;-webkit-hyphens:none;hyphens:none;max-width:none;}
.info-page .prose p{margin:0 0 16px;}
.info-page .prose ul,.info-page .prose ol{margin:0 0 20px;padding:0 0 0 22px;}
.info-page .prose li{margin:0 0 12px;padding-left:2px;}
.info-page .prose h2{margin:32px 0 12px;}
@media (min-width:860px){
  .info-page{padding:28px 20px 64px;}
  .info-page h1{font-size:30px;margin-bottom:10px;}
  .info-page .prose p,.info-page .prose li{font-size:17px;line-height:1.8;}
}

/* Mobile: tables and chips must fit the screen (no sideways scrolling) */
@media (max-width:640px){
  .prose table,.case-meta{table-layout:auto;max-width:100%;}
  .prose th,.prose td,.case-meta th,.case-meta td{white-space:normal !important;overflow-wrap:anywhere;padding:8px 9px;font-size:12.5px;line-height:1.45;}
  .te .prose th,.te .prose td,.te .case-meta th,.te .case-meta td{font-size:13.5px;}
  .prose th,.case-meta th{overflow-wrap:normal;word-break:normal;}
  .case-meta th{white-space:nowrap !important;}
}
.related-terms .chip,.prose .chip{white-space:normal;max-width:100%;line-height:1.35;}
.prose,.prose p,.prose li,.callout,.act-clause{overflow-wrap:anywhere;}
.read-main{min-width:0;}
.footer-mark{display:block;flex:0 0 auto;width:22px;height:22px;}
.hub-stat-hint{font-size:12.5px;font-weight:600;color:var(--text-muted);margin-top:14px;}
.hub-stat-hint + .hub-stat-tabs{margin-top:8px;}

/* Inline links in article text: solid underline so they read as links */
.prose a:not(.chip){text-decoration:underline;text-underline-offset:2px;}