/* Dalal & Co. — the Journal.
   Same tokens, same rhythm, same nav/footer as the hand-written pages; the
   only new shapes are the index list and the article prose column.
   Edit here, not in a generated page. */
*{margin:0;padding:0;box-sizing:border-box}
:root{--ink:#22201C;--paper:#F4F0E8;--brass:#9C7C3C;--muted:#857D6E;--hair:#DAD2C2}
html,body{background:var(--paper);color:var(--ink);font-family:Inter,-apple-system,"Segoe UI",system-ui,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}
.serif{font-family:"Bodoni Moda","Didot",Georgia,"Times New Roman",serif}
.wrap{max-width:900px;margin:0 auto;padding:0 48px}
.amp,.co{color:var(--brass)}
nav{display:flex;justify-content:space-between;align-items:baseline;padding:40px 0 0}
nav .mark{font-size:20px;letter-spacing:.02em}
nav .links{display:flex;gap:24px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
nav .links a{color:var(--muted);text-decoration:none}
nav .links .cta{color:var(--ink);border-bottom:1px solid var(--brass);padding-bottom:2px}
.back{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--brass);text-decoration:none;display:inline-block;margin-top:44px}
.eyebrow{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--brass);margin-bottom:26px}

/* ---------- index ---------- */
header.jhero{padding:70px 0 60px}
header.jhero h1{font-size:52px;font-weight:400;letter-spacing:-.01em;line-height:1.12;max-width:720px}
header.jhero .sub{font-size:19px;color:#4a463d;max-width:560px;margin-top:26px;font-weight:300}
.jyear{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--ink);padding-bottom:10px;margin:56px 0 0}
.jlist{list-style:none}
.jlist li{border-bottom:1px solid var(--hair)}
.jlist a{display:grid;grid-template-columns:110px 1fr;gap:24px;align-items:baseline;padding:24px 0;text-decoration:none;color:inherit}
.jlist a:hover .jt{color:var(--brass)}
.jlist .jd{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.jlist .jt{font-size:21px;font-weight:400;line-height:1.35;transition:color .2s}
.jlist .jx{font-size:14px;color:var(--muted);margin-top:7px;line-height:1.6}
.jcount{padding:70px 0 0;font-size:12px;color:var(--muted);letter-spacing:.04em;font-style:italic}

/* ---------- article ---------- */
.jmeta{display:flex;justify-content:space-between;border-bottom:1px solid var(--ink);padding:24px 0 10px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
article.jart{max-width:680px;margin:0 auto;padding:44px 0 40px}
article.jart h1{font-size:44px;font-weight:400;letter-spacing:-.01em;line-height:1.14;padding-bottom:30px;border-bottom:1px solid var(--hair)}
.prose{padding-top:38px}
.prose p{font-size:17px;line-height:1.9;color:#332f28;margin-bottom:26px}
.prose h2{font-family:"Bodoni Moda","Didot",Georgia,serif;font-size:29px;font-weight:400;line-height:1.25;margin:54px 0 20px}
.prose h3{font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;margin:44px 0 14px;color:var(--ink)}
.prose ul,.prose ol{margin:0 0 26px 0;padding-left:0;list-style:none}
.prose ol{counter-reset:jo}
.prose li{font-size:17px;line-height:1.85;color:#332f28;margin-bottom:12px;padding-left:26px;position:relative}
.prose ul li:before{content:"—";color:var(--brass);position:absolute;left:0}
.prose ol li:before{counter-increment:jo;content:counter(jo)".";color:var(--brass);position:absolute;left:0;font-size:14px}
.prose a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--brass)}
.prose a:hover{color:var(--brass)}
.prose strong{font-weight:600}
.prose em{font-style:italic}
.prose blockquote{font-family:"Bodoni Moda","Didot",Georgia,serif;font-size:21px;line-height:1.7;color:#2b2822;padding-left:30px;border-left:1px solid var(--brass);font-weight:300;margin:36px 0}
.prose blockquote p{font-size:inherit;line-height:inherit;font-family:inherit;margin-bottom:14px}
.prose table{width:100%;border-collapse:collapse;margin:32px 0;font-size:15px}
.prose th{text-align:left;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);font-weight:600;border-bottom:1px solid var(--ink);padding:0 14px 10px 0}
.prose td{padding:14px 14px 14px 0;border-bottom:1px solid var(--hair);color:#3a3730;vertical-align:top}
.prose figure{margin:34px 0}
.prose img{max-width:100%;height:auto;display:block}
.prose figcaption{font-size:12px;color:var(--muted);font-style:italic;margin-top:10px}
.jfoot{max-width:680px;margin:0 auto;border-top:1px solid var(--hair);padding:34px 0 0;display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap}
.jfoot a{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--brass);text-decoration:none}
.cta-block{text-align:center;padding:100px 0}
.cta-block h2{font-size:30px;font-weight:400;margin-bottom:10px}
.cta-block p{color:var(--muted);margin-bottom:30px}
.btn{display:inline-block;border:1px solid var(--brass);padding:16px 34px;color:var(--ink);text-transform:uppercase;letter-spacing:.14em;font-size:12px;text-decoration:none}
footer{border-top:1px solid var(--hair);padding:34px 0 70px;display:flex;justify-content:space-between;align-items:baseline;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
footer .fnav{display:flex;flex-wrap:wrap;gap:6px 13px;justify-content:flex-end;max-width:none;text-align:right;letter-spacing:.09em}
footer .fnav a{color:var(--muted);text-decoration:none}
footer .fnav a:hover{color:var(--brass)}
@media(max-width:640px){footer{flex-direction:column;gap:20px}footer .fnav{justify-content:flex-start;text-align:left}}
@media(max-width:680px){
  .wrap{padding:0 22px}
  nav{flex-direction:column;gap:14px;align-items:flex-start!important}
  nav .mark{white-space:nowrap}
  nav .links{flex-wrap:wrap;gap:12px 16px;font-size:10px!important;letter-spacing:.1em!important;justify-content:flex-start}
  h1{font-size:33px!important;line-height:1.15!important;letter-spacing:0!important;max-width:100%!important}
  .jmeta{flex-direction:column;gap:6px;letter-spacing:.12em;align-items:flex-start}
  .jlist a{grid-template-columns:1fr;gap:8px}
  .jlist .jd{order:-1}
  .prose table,.prose td,.prose th{font-size:13px}
}