/*
 * Homepage sections: photo hero, founders note, 1925 vineyard band.
 * Loaded on the front page only, after site.css.
 * Cream text sits on a darkened photo; the scrims keep it at AA or better.
 */

/* ---------- hero: full-bleed vineyard photo ---------- */
.jwc-home-hero {
	position: relative; display: grid; align-items: end; isolation: isolate;
	min-height: min(88vh, 820px); border-bottom: 0; color: var(--jwc-cream);
}
.jwc-home-hero__img {
	position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%;
	object-fit: cover; object-position: 60% 50%;
}
.jwc-home-hero::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background:
		linear-gradient(90deg, rgba(20, 16, 12, .78) 0%, rgba(20, 16, 12, .5) 42%, rgba(20, 16, 12, 0) 72%),
		linear-gradient(0deg, rgba(20, 16, 12, .7) 0%, rgba(20, 16, 12, 0) 55%);
}
.jwc-home-hero__copy { display: grid; gap: 20px; justify-items: start; padding-block: 120px 72px; }
.jwc-home-hero__copy > * { max-width: 34rem; }
.jwc-home-hero .jwc-eyebrow { margin: 0; color: rgba(255, 251, 237, .82); }
.jwc-home-hero h1 { font-size: clamp(2.6rem, 5.4vw, 4.6rem); line-height: 1.02; color: var(--jwc-cream); text-wrap: balance; }
.jwc-home-hero .jwc-lead { color: rgba(255, 251, 237, .9); }
/* live hours line (text filled in by site.js) */
.jwc-hours-line {
	display: flex; align-items: baseline; gap: 10px; max-width: 40rem !important;
	font-size: .95rem; font-weight: 500; color: var(--jwc-cream);
}
.jwc-hours-line__dot {
	flex: none; width: 9px; height: 9px; border-radius: 50%;
	background: #B9AE96; transform: translateY(-1px);
}
.jwc-hours-line.is-open .jwc-hours-line__dot {
	background: #7FD08E; box-shadow: 0 0 0 0 rgba(127, 208, 142, .6); animation: jwc-pulse 2.4s ease-out infinite;
}
@keyframes jwc-pulse { to { box-shadow: 0 0 0 9px rgba(127, 208, 142, 0); } }
@media (prefers-reduced-motion: reduce) { .jwc-hours-line.is-open .jwc-hours-line__dot { animation: none; } }
.jwc-btn--ghost-light { background: transparent; color: var(--jwc-cream); border-color: var(--jwc-cream); }
.jwc-btn--ghost-light:hover { background: var(--jwc-cream); border-color: var(--jwc-cream); color: var(--jwc-ink); }

/* ---------- seasonal band (wp-admin → Seasons) ---------- */
.jwc-season { background: var(--jwc-paper); border-bottom: 1px solid var(--jwc-rule); }
.jwc-season__grid {
	display: grid; grid-template-columns: 220px minmax(0, 1fr) auto; gap: 20px 36px; align-items: center;
	padding-block: 28px;
}
.jwc-season__img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.jwc-season__copy { display: grid; gap: 8px; }
.jwc-season__copy .jwc-eyebrow { margin: 0; color: var(--jwc-wine); }
.jwc-season__copy h2 { font-size: clamp(1.5rem, 2.6vw, 2.1rem); line-height: 1.15; text-wrap: balance; }
.jwc-season__copy p:not(.jwc-eyebrow) { color: var(--jwc-stone); max-width: 56ch; }
.jwc-season__grid > :only-child, .jwc-season__copy:first-child { grid-column: 1 / 3; } /* no photo */

/* ---------- "What do you drink?" ---------- */
.jwc-taste__head {
	display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 16px 32px; margin-bottom: 20px;
}
.jwc-taste__head h2 { font-size: clamp(1.9rem, 3.4vw, 2.75rem); }
.jwc-taste__picks { display: flex; flex-wrap: wrap; gap: 8px; }
.jwc-taste__pick {
	min-height: 44px; padding: 0 20px; border: 1.5px solid var(--jwc-rule); border-radius: 999px;
	background: transparent; color: var(--jwc-ink); font: 500 .95rem/1 var(--jwc-body); cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}
.jwc-taste__pick:hover { border-color: var(--jwc-ink); }
.jwc-taste__pick[aria-pressed="true"] { background: var(--jwc-wine); border-color: var(--jwc-wine); color: var(--jwc-cream); }
.jwc-taste__pick:focus-visible { outline: 2px solid var(--jwc-ink); outline-offset: 2px; }
.jwc-taste__pick[hidden] { display: none; }
.jwc-taste__line { margin-bottom: 28px; color: var(--jwc-stone); }
.jwc-taste__line a { color: var(--jwc-wine); white-space: nowrap; }
/* one shelf of four; the full list is a click away */
.jwc-taste__panel .c7-product-collection__product-list > :nth-child(n+5) { display: none; }

/* club tiers: the two that fit the answer, plus a way to see them all */
.jwc-tiers--picked .jwc-tier[hidden] { display: none; }
.jwc-tiers--picked .jwc-tier:nth-child(n) { border-left: 0; border-top: 0; padding-left: 0; padding-right: 28px; }
/* site.js orders the visible pair best-fit first and marks the second one */
.jwc-tiers--picked .jwc-tier.is-second { border-left: 1px solid var(--jwc-rule); padding-left: 28px; }
.jwc-tiers__more {
	order: 9; display: grid; gap: 14px; align-content: center; padding: 28px 0 24px 28px; border-left: 1px solid var(--jwc-rule);
}
.jwc-tiers__for { font: 500 1.4rem/1.25 var(--jwc-display); }
.jwc-tiers__more p:not(.jwc-tiers__for) { color: var(--jwc-stone); font-size: .95rem; }
.jwc-tiers__more .jwc-btn { justify-self: start; }

/* ---------- founders note ---------- */
.jwc-founders { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 32px; align-items: center; }
.jwc-founders__photos { grid-column: 1 / 8; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); align-items: start; }
.jwc-founders__photos figure { margin: 0; }
.jwc-founders__photos img { display: block; width: 100%; height: auto; }
.jwc-founders__photos figcaption { margin-top: 8px; font-size: .85rem; color: var(--jwc-stone); }
.jwc-founders__jeremy { grid-column: 1 / 4; grid-row: 1; position: relative; z-index: 1; margin-top: 64px !important; }
.jwc-founders__jeremy img { aspect-ratio: 3 / 4; object-fit: cover; box-shadow: 0 0 0 8px var(--jwc-paper); }
.jwc-founders__choral { grid-column: 3 / 8; grid-row: 1; }
.jwc-founders__choral img { aspect-ratio: 4 / 3; object-fit: cover; object-position: 70% 50%; }
/* keep clear of the overlapping portrait (it covers 2 of this photo's 5 columns) */
.jwc-founders__choral figcaption { padding-left: 42%; text-align: right; }
.jwc-founders__note { grid-column: 9 / 13; display: grid; gap: 16px; }
.jwc-founders__note .jwc-eyebrow { margin: 0; }
.jwc-founders__note h2 { font-size: clamp(1.9rem, 3.2vw, 2.6rem); }
.jwc-founders__note p:not(.jwc-eyebrow):not(.jwc-founders__sign) { color: var(--jwc-stone); }
.jwc-founders__note a { color: var(--jwc-wine); }
.jwc-founders__sign { font: italic 500 1.6rem/1.2 var(--jwc-display); color: var(--jwc-wine); }
/* signature, then the 40 Thousand Hours seal with its link on a row of their own */
.jwc-founders__signoff { display: grid; gap: 16px; justify-items: start; }
.jwc-founders__seal { flex: none; width: 76px; height: auto; transition: transform .5s ease; }
.jwc-founders__seal-link { display: flex; align-items: center; gap: 14px; font-size: .95rem; line-height: 1.35; color: var(--jwc-wine); }
.jwc-founders__seal-link:hover .jwc-founders__seal { transform: rotate(180deg); } /* a hint of the flip */

/* ---------- 1925: full-bleed old vine ---------- */
.jwc-1925 {
	position: relative; display: grid; align-items: end; isolation: isolate;
	min-height: min(90vh, 860px); color: var(--jwc-cream);
}
.jwc-1925__img {
	position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%;
	object-fit: cover; object-position: 70% 60%;
}
.jwc-1925::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background:
		linear-gradient(0deg, rgba(20, 16, 12, .85) 0%, rgba(20, 16, 12, .35) 45%, rgba(20, 16, 12, 0) 70%),
		linear-gradient(90deg, rgba(20, 16, 12, .6) 0%, rgba(20, 16, 12, 0) 60%);
}
.jwc-1925__copy { display: grid; gap: 16px; justify-items: start; padding-block: 160px 72px; }
.jwc-1925__copy > * { max-width: 36rem; }
.jwc-1925__year {
	max-width: none; margin-bottom: 4px;
	font: 500 clamp(6rem, 19vw, 15rem)/.9 var(--jwc-display); letter-spacing: -.02em;
	color: var(--jwc-cream); font-variant-numeric: lining-nums;
}
.jwc-1925 h2 { font-size: clamp(1.6rem, 2.8vw, 2.2rem); color: var(--jwc-cream); text-wrap: balance; }
.jwc-1925 p:not(.jwc-1925__year) { color: rgba(255, 251, 237, .9); }

/* ---------- tablet: two cards side by side, "compare" underneath ---------- */
@media (max-width: 1060px) {
	.jwc-tiers--picked .jwc-tiers__more { grid-column: 1 / -1; padding-left: 0; border-left: 0; border-top: 1px solid var(--jwc-rule); }
}

/* ---------- phone ---------- */
@media (max-width: 680px) {
	.jwc-home-hero { min-height: 640px; }
	.jwc-home-hero__img { object-position: 72% 50%; }
	.jwc-home-hero::before { background: linear-gradient(0deg, rgba(20, 16, 12, .88) 0%, rgba(20, 16, 12, .55) 50%, rgba(20, 16, 12, .15) 100%); }
	.jwc-home-hero__copy { padding-block: 200px 40px; }
	.jwc-season__grid { grid-template-columns: 1fr; padding-block: 0 28px; }
	.jwc-season__img { margin-inline: calc(-1 * var(--jwc-gutter)); width: calc(100% + 2 * var(--jwc-gutter)); max-width: none; aspect-ratio: 16 / 9; }
	.jwc-season__copy:first-child { grid-column: auto; }
	.jwc-season__btn { justify-self: start; }
	.jwc-taste__head { margin-bottom: 16px; }
	.jwc-taste__pick { padding: 0 16px; }
	.jwc-tiers--picked .jwc-tier:nth-child(n) { padding-inline: 0; border-left: 0; }
	.jwc-tiers--picked .jwc-tier.is-second { padding-left: 0; border-left: 0; border-top: 1px solid var(--jwc-rule); }
	.jwc-tiers__more { padding-left: 0; border-left: 0; border-top: 1px solid var(--jwc-rule); }
	.jwc-founders__photos, .jwc-founders__note { grid-column: 1 / -1; }
	.jwc-founders__jeremy { margin-top: 40px !important; }
	.jwc-1925 { min-height: 620px; }
	.jwc-1925__copy { padding-block: 180px 48px; }
}
