/* =========================================================================
   JO'S LIQUOR — CONTENT PAGES (prose, forms, contact, FAQ)
   Loaded on pages. The page-default Bricks template wraps post content in
   .jos-prose; legal/about/faq/contact pages just hold HTML.
   ========================================================================= */

.jos-prose { max-width: 820px; }
.jos-prose, .jos-prose p, .jos-prose li, .jos-prose a, .jos-prose h1, .jos-prose h2, .jos-prose h3 { overflow-wrap: anywhere; }
.jos-prose.jos-prose--wide { max-width: 1100px; }
.jos-prose > h1,
.jos-page-title {
	font-size: clamp(2.4rem, 1.4rem + 4vw, 4.5rem); margin-bottom: .6em; color: var(--c-gold);
}
.jos-prose h2 {
	font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem); margin: 2rem 0 .6em; color: var(--c-gold);
}
.jos-prose h3 { font-size: 1.2rem; margin: 1.4rem 0 .4em; color: var(--c-gold); }
.jos-prose p, .jos-prose li { color: var(--c-cream); line-height: 1.75; }
.jos-prose p { margin: 0 0 1em; }
.jos-prose a { color: var(--c-gold); text-decoration: underline; text-underline-offset: 3px; }
.jos-prose ul, .jos-prose ol { margin: 0 0 1.2em; padding-left: 1.3em; }
.jos-prose li { margin-bottom: .5em; }
.jos-prose strong { color: var(--c-gold); }
.jos-prose em { color: var(--c-gold-soft); font-style: italic; }
.jos-prose hr { border: 0; border-top: 1px solid rgba(250,174,51,.2); margin: 2.5rem 0; }
.jos-prose .jos-lead { font-size: var(--fs-lead); color: var(--c-gold); }

/* ---------- FAQ (native details/summary) ---------- */
.jos-faq { max-width: 820px; }
.jos-faq details {
	background: var(--c-brown); border: 1px solid rgba(250,174,51,.14);
	border-radius: var(--r-card); padding: 0 1.3rem; margin-bottom: .75rem;
	transition: border-color var(--dur) var(--ease);
}
.jos-faq details[open] { border-color: rgba(250,174,51,.4); }
.jos-faq summary {
	cursor: pointer; list-style: none; padding: 1.1rem 0;
	font-weight: 600; color: var(--c-gold); font-size: 1.05rem;
	display: flex; justify-content: space-between; align-items: center; gap: 1rem;
}
.jos-faq summary::-webkit-details-marker { display: none; }
.jos-faq summary::after { content: "+"; font-size: 1.4rem; line-height: 1; color: var(--c-gold); transition: transform var(--dur) var(--ease); }
.jos-faq details[open] summary::after { transform: rotate(45deg); }
.jos-faq details > p { color: var(--c-cream); padding-bottom: 1.2rem; margin: 0; line-height: 1.7; }

/* ---------- Forms ---------- */
.jos-form { max-width: 560px; }
.jos-form__row { margin-bottom: 1rem; }
.jos-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1rem; }
.jos-form label { display: flex; flex-direction: column; gap: .4rem; font-weight: 600; letter-spacing: .03em; color: var(--c-gold); font-size: .85rem; text-transform: uppercase; }
.jos-form input,
.jos-form textarea {
	min-width: 0; width: 100%; font-family: var(--font-body); font-size: 1rem; font-weight: 500;
	background: var(--c-brown); color: var(--c-gold); border: 2px solid rgba(250,174,51,.3);
	border-radius: var(--r-sm); padding: .85em 1.1em;
}
.jos-form input:focus, .jos-form textarea:focus { border-color: var(--c-gold); outline: none; }
.jos-form input::placeholder, .jos-form textarea::placeholder { color: rgba(246,232,210,.5); }
.jos-form button[type="submit"] { margin-top: .5rem; }
.jos-form .jos-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; } /* honeypot */
.jos-form__status { margin-top: .8rem; font-weight: 600; min-height: 1.2em; }
.jos-form__status.is-success { color: var(--c-gold-soft); }
.jos-form__status.is-error { color: #ff9bb6; }
.jos-form__status.is-pending { opacity: .8; }

/* ---------- Contact layout ---------- */
.jos-contact { display: grid; grid-template-columns: 1fr 1.2fr; gap: var(--s-6); align-items: start; }
.jos-contact__info p { color: var(--c-cream); line-height: 1.7; margin: 0 0 1rem; }
.jos-contact__info strong { color: var(--c-gold); text-transform: uppercase; letter-spacing: .08em; font-size: .8rem; }
.jos-contact__info a { color: var(--c-gold); }
.jos-contact__map { margin-top: var(--s-5); }
.jos-contact__map iframe { display: block; width: 100%; filter: saturate(.9); }

@media (max-width: 900px) {
	.jos-contact { grid-template-columns: 1fr; }
	.jos-form__grid { grid-template-columns: 1fr; }
}
