@font-face { font-family: "Cormorant"; src: url("../fonts/CormorantGaramond-Bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Cormorant"; src: url("../fonts/CormorantGaramond-Medium.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Cormorant"; src: url("../fonts/CormorantGaramond-SemiBoldItalic.woff2") format("woff2"); font-weight: 600; font-style: italic; font-display: swap; }
@font-face { font-family: "EBGaramond"; src: url("../fonts/EBGaramond-Regular.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "EBGaramond"; src: url("../fonts/EBGaramond-Italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "EBGaramond"; src: url("../fonts/EBGaramond-SemiBold.woff2") format("woff2"); font-weight: 600; font-display: swap; }

:root{
  --ink:#7D3552;
  --ink-soft:#C97B94;
  --gold:#C7A248;
  --cream:#FBF8F1;
  --cream-deep:#F0E8D4;
  --muted:#8a7078;
  --max-w:720px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:"EBGaramond",Georgia,serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:"Cormorant",Georgia,serif;font-weight:700;margin:0;}
a{color:inherit;}
button{font-family:inherit;cursor:pointer;}

/* ---------- top bar ---------- */
.topbar{
  position:sticky; top:0; z-index:20;
  display:flex; align-items:center; justify-content:space-between;
  padding:0.7em 1.1em;
  background:rgba(251,248,241,0.94);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--cream-deep);
}
.topbar .brand{font-family:"Cormorant";font-weight:700;font-size:1.15em;letter-spacing:.02em;}
.topbar nav{display:flex; gap:.6em;}
.topbar button{
  background:none; border:1px solid var(--gold); color:var(--ink);
  border-radius:999px; padding:.35em .9em; font-size:.85em;
}
.topbar button:hover{background:var(--gold); color:var(--cream);}

/* ---------- landing / cover screen ---------- */
#view-home{max-width:var(--max-w); margin:0 auto; padding:2em 1.2em 4em; text-align:center;}
#view-home img.cover{
  width:min(280px,60vw); border-radius:6px; box-shadow:0 18px 40px -18px rgba(125,53,82,.55);
  margin:1.2em auto 1.6em;
}
#view-home h1{font-size:2em; letter-spacing:.02em; margin-bottom:.25em;}
#view-home .subtitle{font-style:italic; color:var(--ink-soft); font-size:1.15em; margin-bottom:.3em;}
#view-home .byline{font-size:.95em; color:var(--muted); margin-bottom:1.8em;}
.cta-row{display:flex; gap:.8em; justify-content:center; flex-wrap:wrap; margin-bottom:2.6em;}
.btn{
  display:inline-block; font-family:"Cormorant"; font-weight:700; font-size:1.05em;
  padding:.6em 1.5em; border-radius:999px; text-decoration:none;
  border:1px solid var(--ink);
}
.btn.primary{background:var(--ink); color:var(--cream);}
.btn.primary:hover{background:#642940;}
.btn.ghost{background:none; color:var(--ink);}
.btn.ghost:hover{background:var(--cream-deep);}

.month-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:.7em; text-align:left;}
.month-card{
  border-radius:10px; padding:.9em 1em; color:var(--cream);
  display:flex; flex-direction:column; gap:.15em; text-decoration:none;
  transition:transform .15s ease;
}
.month-card:hover{transform:translateY(-2px);}
.month-card .m-name{font-family:"Cormorant"; font-weight:700; font-size:1.15em;}
.month-card .m-theme{font-family:"Cormorant"; font-style:italic; font-weight:600; font-size:.85em; opacity:.92;}

/* ---------- reading view ---------- */
#view-day{max-width:var(--max-w); margin:0 auto; padding:1.6em 1.2em 5em;}
.day-meta{font-size:.8em; letter-spacing:.08em; text-transform:uppercase; margin-bottom:.3em;}
.day-label{font-family:"Cormorant"; font-weight:500; font-size:1.05em; margin-bottom:.6em; opacity:.85;}
.day-rule{height:2px; background:currentColor; opacity:.5; margin-bottom:1.1em; border:none;}
.day-title{font-size:1.9em; margin-bottom:.55em; line-height:1.15;}
.day-ref{font-family:"EBGaramond"; font-weight:600; font-size:.9em; letter-spacing:.03em; margin-bottom:.35em;}
.day-verse{font-family:"Cormorant"; font-style:italic; font-weight:600; font-size:1.28em; line-height:1.5; margin:0 0 1.3em .1em;}
.day-reflection{font-size:1.04em; margin-bottom:1.6em;}
.day-prayer{
  font-style:italic; font-size:.98em; border:1px solid; border-radius:8px;
  padding:.9em 1.1em; margin-bottom:2.2em;
}

.day-nav{display:flex; justify-content:space-between; align-items:center; gap:.8em; margin-top:1.5em;}
.day-nav button{
  background:none; border:1px solid var(--gold); border-radius:999px;
  padding:.5em 1.1em; font-size:.9em; color:var(--ink);
}
.day-nav button:disabled{opacity:.3; cursor:default;}
.day-nav button:not(:disabled):hover{background:var(--gold); color:var(--cream);}
.day-progress{font-size:.8em; color:var(--muted); text-align:center;}

/* ---------- month/TOC view ---------- */
#view-months{max-width:var(--max-w); margin:0 auto; padding:1.6em 1.2em 4em;}
#view-months h1{font-size:1.6em; margin-bottom:1em;}

footer.site-footer{
  text-align:center; font-size:.8em; color:var(--muted);
  padding:2em 1em 3em;
}

.hidden{display:none !important;}

@media (max-width:480px){
  .day-title{font-size:1.55em;}
  .day-verse{font-size:1.14em;}
}
