/* Public pages (start page, sign-up, legal). Builds on app.css tokens. */
.site { --oak: color-mix(in srgb, var(--app-bg) 86%, var(--amber)); --label-paper: #f3ead9; --label-ink: #2a1d12; }
.site-footer { border-top: 1px solid var(--hairline); }

.hero { padding: clamp(2.5rem, 6vw, 5.5rem) 0 clamp(2rem, 5vw, 4rem); }
.hero-title { font-family: ui-serif, "New York", "Iowan Old Style", Georgia, serif; font-weight: 600; font-size: clamp(2.2rem, 5vw, 3.6rem); line-height: 1.08; letter-spacing: -.015em; margin-bottom: 1.25rem; }
.hero-lead { font-size: 1.15rem; line-height: 1.6; max-width: 34em; color: var(--bs-secondary-color); }

/* The one memorable element: a collection entry set like a bottle label */
.specimen { margin: 0 auto; max-width: 27rem; background: var(--label-paper); color: var(--label-ink); border-radius: 6px 6px 22px 22px;
  padding: 2rem 2rem 1.6rem; box-shadow: 0 30px 60px -30px rgba(0,0,0,.65), inset 0 0 0 1px rgba(42,29,18,.12), inset 0 0 0 7px var(--label-paper), inset 0 0 0 8px rgba(42,29,18,.35); }
.specimen-origin { font-size: .8rem; letter-spacing: .04em; color: #7a5a3a; text-align: center; }
.specimen-name { font-family: ui-serif, "New York", "Iowan Old Style", Georgia, serif; font-size: 2.4rem; font-weight: 600; text-align: center; line-height: 1.05; margin-top: .2rem; }
.specimen-age { text-align: center; font-family: ui-serif, "New York", Georgia, serif; font-style: italic; font-size: 1.15rem; color: #8a4b12; margin-bottom: 1.2rem; }
.specimen-facts { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem 1.2rem; margin: 0 0 1.2rem; padding: .9rem 0; border-top: 1px solid rgba(42,29,18,.25); border-bottom: 1px solid rgba(42,29,18,.25); }
.specimen-facts dt { font-weight: 500; font-size: .75rem; color: #7a5a3a; }
.specimen-facts dd { margin: 0; font-size: .95rem; }
.specimen-fill .small { color: #5c4430; }
.fill-track { height: .55rem; border-radius: 99px; background: rgba(42,29,18,.12); overflow: hidden; margin-top: .35rem; }
.fill-bar { height: 100%; width: var(--fill); border-radius: 99px; background: linear-gradient(90deg, #a85f12, #d9852a 60%, #ebc252); transform-origin: left; }
.specimen-note { margin: 1.2rem 0 0; font-family: ui-serif, "New York", Georgia, serif; font-size: 1.02rem; line-height: 1.55; }
.note-label { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-weight: 600; font-size: .8rem; color: #8a4b12; }
.note-points { display: block; margin-top: .4rem; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: .85rem; font-weight: 600; color: #8a4b12; }
.specimen figcaption { color: #7a5a3a !important; text-align: center; }
@media (prefers-reduced-motion: no-preference) {
  .js .fill-bar { transform: scaleX(0); }
  .js.ready .fill-bar { transform: scaleX(1); transition: transform 1.6s cubic-bezier(.22,.8,.2,1) .35s; }
}

.site-section { padding: clamp(2.5rem, 5vw, 4.5rem) 0; border-top: 1px solid var(--hairline); }
.section-title { font-family: ui-serif, "New York", "Iowan Old Style", Georgia, serif; font-weight: 600; font-size: clamp(1.6rem, 3vw, 2.2rem); margin-bottom: 1rem; }
.section-lead { max-width: 38em; line-height: 1.6; color: var(--bs-secondary-color); }

.feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: 2.2rem 2.5rem; margin-top: 1.5rem; }
.feature .bi { font-size: 1.35rem; color: var(--amber); }
.feature h3 { font-size: 1.05rem; font-weight: 600; margin: .6rem 0 .35rem; }
.feature p { margin: 0; line-height: 1.6; color: var(--bs-secondary-color); max-width: 32em; }

.plan-table-wrap { max-width: 52rem; margin-top: 1.5rem; overflow-x: auto; }
.plan-table { --bs-table-bg: transparent; table-layout: fixed; min-width: 34rem; }
.plan-table th[scope=row] { font-weight: 400; padding: .85rem .75rem .85rem 0; }
.plan-table thead th { font-weight: 600; border-bottom-width: 1px; }
.plan-table thead th + th { width: 10.5rem; }
.plan-table .plan-premium { background: color-mix(in srgb, var(--gold) 9%, transparent); }
.plan-table thead .plan-premium { color: var(--amber-strong); border-radius: .6rem .6rem 0 0; }
.plan-table .bi-check-lg { color: var(--amber); font-size: 1.15rem; }
.plan-price th, .plan-price td { border-bottom: 0; font-weight: 600 !important; }

.plain-list { padding-left: 1.1rem; line-height: 1.7; max-width: 34em; }
.plain-list li { margin-bottom: .35rem; }

/* Legal pages and forms */
.legal { max-width: 46rem; line-height: 1.65; }
.legal h1 { font-family: ui-serif, "New York", Georgia, serif; }
.legal h2 { font-size: 1.15rem; font-weight: 600; margin-top: 2rem; }
.fill-in { background: color-mix(in srgb, var(--gold) 25%, transparent); padding: 0 .3em; border-radius: .25em; }
.hp-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Shared wishlist (s.php) */
.wish-list { max-width: 48rem; }
.wish { padding: 1.1rem 0; border-top: 1px solid var(--hairline); }
.wish-name { font-family: ui-serif, "New York", "Iowan Old Style", Georgia, serif; font-size: 1.3rem; font-weight: 600; margin: 0; }
.wish-note { margin: .5rem 0 0; line-height: 1.55; max-width: 38em; }
.wish.is-reserved { opacity: .55; }
.wish details > summary { list-style: none; display: inline-block; }
.wish details > summary::-webkit-details-marker { display: none; }
.wish details[open] > summary { opacity: .6; }