/* The Local Website Kit (/website-kit). Uses the tokens in style.css. */
.kit-hero-in { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.kit-hero h1 { max-width: 14ch; }
.kit-buy { margin-top: 1.8rem; max-width: 560px; }
.kit-price { font-size: 1.05rem; }
.kit-price b { font-family: var(--display); font-weight: 400; font-size: 2.6rem; color: var(--amber-btn); letter-spacing: .01em; margin-right: .25em; vertical-align: -0.12em; }
.kit-actions { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; margin: .8rem 0 .9rem; }
.kit-cover { margin: 0; justify-self: center; width: min(100%, 360px); transform: rotate(2deg); }
.kit-cover img { width: 100%; height: auto; border-radius: 6px; box-shadow: 0 1px 0 var(--sand), 0 24px 48px -18px rgba(0, 82, 45, .45); }
@media (prefers-reduced-motion: reduce) { .kit-cover { transform: none; } }
@media (max-width: 860px) {
  .kit-hero-in { grid-template-columns: 1fr; }
  .kit-cover { width: min(70%, 300px); transform: none; }
}

.kit-files { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.kit-files .card { background: var(--white); }
.kit-files h3 { font-size: 1.35rem; }
.kit-meta { margin: .3rem 0 .7rem; font-size: .9rem; font-weight: 700; color: var(--amber-btn); }
@media (max-width: 700px) { .kit-files { grid-template-columns: 1fr; } }

.kit-pages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 2rem); }
.kit-pages figure { margin: 0; }
.kit-pages img { width: 100%; height: auto; border: 1px solid var(--sand); border-radius: 6px; background: var(--white); }
.kit-pages figcaption { margin-top: .6rem; font-size: .9rem; color: var(--forest-65); }
@media (max-width: 760px) { .kit-pages { grid-template-columns: 1fr; max-width: 420px; } }

.kit-fit .card { background: var(--white); }
.kit-fit h3 { font-size: 1.35rem; }
.kit-fit .ask { margin-top: .9rem; }
.kit-why { max-width: 820px; }
.kit-again { margin-top: 2.5rem; text-align: center; }
.kit-again .btn { margin: .6rem 0 .9rem; }
