:root{
  --cream:#faf6ea;
  --ink:#22301f;
  --green-deep:#1b3a2b;
  --green:#2f5a3f;
  --gold:#c9a227;
  --gold-soft:#e3c766;
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --cream:#faf6ea; --ink:#22301f; }
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; scroll-padding-top: env(safe-area-inset-top, 0px);}
body{ background:var(--cream); color:var(--ink); font-family:'Inter',sans-serif; line-height:1.6; }
h1,h2,h3{font-family:'Playfair Display',serif;}
.script{font-family:'Dancing Script',cursive;}
a{color:inherit;}

header{ background:var(--green-deep) url("daisy-pattern.svg") center top / 280px 320px repeat; }
.hero-img{ display:block; margin:0 auto; width:auto; max-width:100%; height:auto; max-height:100vh; max-height:100dvh; }

nav{
  background:var(--green-deep);
  display:flex; justify-content:center; gap:1.4rem; flex-wrap:wrap;
  padding:0.9rem 1rem;
  font-size:0.88rem;
}
nav a{ color:#ffffff; text-decoration:none; border-bottom:1px solid transparent; padding-bottom:2px; }
nav a:hover, nav a:focus-visible{ color:var(--gold-soft); border-color:var(--gold-soft); }

main{max-width:760px; margin:0 auto; padding:0 1.5rem;}

section.block{padding:3rem 0 2.6rem; border-bottom:1px solid rgba(27,58,43,0.12);}
section.block:last-of-type{border-bottom:none;}
section.block h2{ font-size:1.5rem; color:var(--green-deep); margin-bottom:0.3rem; }
section.block .kicker{ color:var(--gold); font-size:0.85rem; margin-bottom:1.3rem; display:block; }

section.block > p{max-width:62ch; margin-bottom:1rem;}

.card-front{ display:block; width:100%; max-width:420px; height:auto; margin:1.4rem auto 0; filter:drop-shadow(0 6px 10px rgba(27,58,43,0.18)); }

.counter-wrap{
  text-align:center;
  background:var(--green-deep);
  color:var(--cream);
  border-radius:8px;
  padding:2.4rem 1.5rem;
}
.counter-num{
  font-family:'Playfair Display',serif;
  font-size:clamp(3rem, 12vw, 4.5rem);
  color:var(--gold-soft);
  font-weight:700;
  line-height:1;
}
.counter-wrap p{ margin-top:0.6rem; font-size:1rem; color:#ffffff; }

.log-group{ margin-bottom:1.6rem; }
.log-group h3{ font-size:1.1rem; color:var(--green-deep); margin-bottom:0.6rem; }
.log-group h3 .state-count{ color:var(--gold); font-size:0.85rem; font-weight:400; font-family:'Inter',sans-serif; }
.log-entry{
  background:#fff;
  border-left:3px solid var(--gold);
  border-radius:3px;
  padding:0.85rem 1.1rem;
  margin-bottom:0.6rem;
}
.log-entry .city{ font-weight:600; color:var(--green-deep); font-size:0.95rem; }
.log-entry .desc{ font-size:0.9rem; color:#454f42; margin-top:0.15rem; }
.log-entry .date{ font-size:0.78rem; color:#8a8570; margin-top:0.3rem; }

.empty-state{
  background:#fff;
  border:1px dashed rgba(27,58,43,0.3);
  border-radius:6px;
  padding:1.6rem;
  text-align:center;
  color:#5c6656;
  font-style:italic;
}

.step{
  display:flex;
  gap:0.9rem;
  background:#fff;
  border:1px solid rgba(27,58,43,0.14);
  border-radius:5px;
  padding:0.9rem 1.1rem;
  margin-bottom:0.7rem;
}
.step .verse{
  font-weight:600;
  color:var(--gold);
  white-space:nowrap;
  font-size:0.88rem;
  min-width:96px;
}
.step p{ font-size:0.92rem; color:#3c4238; }

.prayer-box{
  background:var(--green-deep);
  color:var(--cream);
  border-radius:8px;
  padding:1.8rem 1.6rem;
  margin-top:1.6rem;
}
.prayer-box h3{ color:var(--gold-soft); font-size:1.05rem; margin-bottom:0.7rem; }
.prayer-box p{ font-size:0.95rem; line-height:1.8; font-style:italic; color:#ffffff; }

.block h2::before{ content:""; display:inline-block; width:1.4em; height:1.4em; margin-right:0.45em; vertical-align:-0.3em; background:url("daisy.svg") center / contain no-repeat; }

nav a[aria-current="page"]{ color:var(--gold-soft); border-color:var(--gold-soft); }

.page-header{ padding:2.4rem 1rem; text-align:center; }
.page-header a{
  display:inline-block; text-decoration:none;
  background:var(--cream); color:var(--green-deep);
  border:2px solid var(--gold); border-radius:10px;
  padding:0.9rem 1.8rem;
  box-shadow:0 6px 18px rgba(0,0,0,0.25);
}
.page-header .site-name{ font-family:'Playfair Display',serif; font-weight:700; font-size:clamp(1.5rem, 5vw, 2.1rem); display:block; line-height:1.2; }
.page-header .tagline{ font-family:'Dancing Script',cursive; color:var(--gold); font-size:1.1rem; display:block; }

.explore{ display:grid; grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)); gap:0.8rem; }
.explore a{
  display:block; text-decoration:none;
  background:#fff; border:1px solid rgba(27,58,43,0.14); border-left:3px solid var(--gold);
  border-radius:5px; padding:0.9rem 1.1rem;
}
.explore a strong{ display:block; font-family:'Playfair Display',serif; color:var(--green-deep); font-size:1.05rem; }
.explore a span{ font-size:0.88rem; color:#5c6656; }
.explore a:hover, .explore a:focus-visible{ border-color:var(--gold); background:#fffdf5; }

footer{ text-align:center; padding:2.2rem 1.5rem 2.6rem; color:var(--green-deep); font-size:0.85rem; opacity:0.75; }
footer .contact{ margin-top:0.5rem; display:flex; justify-content:center; flex-wrap:wrap; gap:0.4rem 1.2rem; }

@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} }

.idea-group{ margin-top:2rem; }
.idea-group h3{ font-size:1.15rem; color:var(--green-deep); margin-bottom:0.7rem; display:flex; align-items:center; gap:0.6rem; flex-wrap:wrap; }
.idea-tag{ font-family:'Inter',sans-serif; font-size:0.72rem; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; color:var(--green); background:#e6efe3; border-radius:999px; padding:0.15rem 0.6rem; }
.ideas{ list-style:none; display:grid; gap:0.55rem; }
.ideas li{
  background:#fff; border:1px solid rgba(27,58,43,0.12); border-radius:5px;
  padding:0.75rem 1rem 0.75rem 2.6rem; font-size:0.95rem; color:#3c4238;
  background-image:url("daisy.svg"); background-repeat:no-repeat; background-size:1.1rem; background-position:0.9rem 0.85rem;
}
.idea-share{ margin-top:2.4rem; background:var(--green-deep); color:#fff; border-radius:8px; padding:1.6rem; }
.idea-share h3{ color:var(--gold-soft); font-size:1.1rem; margin-bottom:0.5rem; }
.idea-share p{ font-size:0.95rem; }
.idea-share a{ color:var(--gold-soft); }

.about .callout{
  font-family:'Playfair Display',serif; font-size:1.35rem; font-weight:600; font-style:italic;
  color:var(--green-deep); border-left:3px solid var(--gold); padding:0.2rem 0 0.2rem 1rem; margin:1.6rem 0;
}
.about-closing{ margin-top:2.4rem; background:var(--green-deep); color:#fff; border-radius:8px; padding:2rem 1.6rem; text-align:center; }
.about-closing .motto{ font-family:'Playfair Display',serif; font-size:1.2rem; color:var(--gold-soft); margin-bottom:0.9rem; }
.about-closing .invite{ font-family:'Dancing Script',cursive; font-size:1.35rem; display:flex; align-items:center; justify-content:center; gap:0.5rem; flex-wrap:wrap; }
.about-closing .signoff{ margin-top:1rem; font-size:0.95rem; opacity:0.85; }

.about-photo{ margin:1.4rem 0 1.8rem; }
.about-photo img{
  display:block; width:100%; max-width:520px; height:auto; margin:0 auto;
  border-radius:10px; border:3px solid var(--gold-soft);
  box-shadow:0 8px 22px rgba(27,58,43,0.18);
}
.about-photo figcaption{ text-align:center; margin-top:0.7rem; font-family:'Dancing Script',cursive; font-size:1.3rem; color:var(--green-deep); }

.log-photo{ margin:0.8rem 0 0.4rem; }
.log-photo img{ display:block; width:100%; max-width:420px; height:auto; border-radius:8px; border:2px solid var(--gold-soft); }
.log-photo figcaption{ font-family:'Dancing Script',cursive; font-size:1.15rem; color:var(--green-deep); margin-top:0.3rem; }
.log-video{ margin-top:0.8rem; }
.log-video .label{ display:block; font-size:0.82rem; font-weight:600; color:var(--green-deep); margin-bottom:0.3rem; }
.log-video .hint{ font-weight:400; color:#8a8570; }
.log-video video{ display:block; width:100%; max-width:420px; height:auto; border-radius:8px; background:#000; }
.log-link{ display:inline-block; margin-top:0.6rem; font-size:0.85rem; color:var(--green); font-weight:500; }

.song{ background:#fff; border-radius:8px; border-top:3px solid var(--gold); padding:1.3rem 1.2rem 1.4rem; margin-top:1.6rem; box-shadow:0 4px 14px rgba(27,58,43,0.08); }
.song h3{ font-size:1.25rem; color:var(--green-deep); }
.song .song-meta{ font-size:0.8rem; color:#8a8570; margin:0.2rem 0 1rem; }
.song video{ display:block; width:100%; max-width:480px; height:auto; margin:0 auto 1.2rem; border-radius:8px; background:#000; }
.song .lyrics p{ margin-bottom:1rem; font-size:0.98rem; line-height:1.75; }
.song .lyrics .tag{ font-family:'Dancing Script',cursive; font-size:1.35rem; color:var(--green-deep); line-height:1.4; }
.song .song-credit{ font-size:0.78rem; color:#8a8570; margin-top:0.4rem; }
.song .song-credit a{ color:var(--green); }
.btn-songs{ display:inline-block; background:var(--green-deep); color:#fff; text-decoration:none; font-weight:600; font-size:0.9rem; padding:0.6rem 1.1rem; border-radius:999px; }
.btn-songs:hover, .btn-songs:focus-visible{ background:var(--green); }
.log-video video[height="1464"], .song video[height="1464"]{ max-width:300px; }
