/* Compound V home page: only what blocks cannot say. The sections are core blocks styled by theme.json, block style
   variations (Hero, Tile, Card, Arrow, Outline arrow, Rating, Mint, Deep) and block attributes (tools/build-home-specs.py).
   Here: the hero's phone art direction, the tiles' phone ratio and the review cards printed by [compound_v_reviews].
   Token variables only; raw values are limited to 0, hairlines, image focus points and motion transforms. */

/* ---------- hero (Hero cover) ---------- */
.wp-block-cover.is-style-hero { min-height: var(--wp--custom--layout--hero-min); }
/* the photo runs full width, the copy sits on the store's content edge */
/* (core sets width:auto on the inner container of a cover with a content position, with a stronger selector) */
.wp-block-cover.is-style-hero.has-custom-content-position[class*="is-position-"] .wp-block-cover__inner-container { width: 100%; max-width: var(--wp--custom--layout--wide); margin-inline: auto; }
.wp-block-cover.is-style-hero .cv-hero__picture { position: absolute; inset: 0; display: block; }
/* phones: copy on cream first, then a full-width photo window cropped around the pets (no scrim over faces) */
@media (max-width: 781px) {
	.wp-block-cover.is-style-hero { display: flex; flex-direction: column; align-items: stretch; min-height: 0; padding: 0 !important; background: var(--wp--preset--color--base); }
	.wp-block-cover.is-style-hero .wp-block-cover__background { display: none; }
	.wp-block-cover.is-style-hero .wp-block-cover__inner-container { order: 1; padding: var(--wp--preset--spacing--50) var(--wp--custom--layout--gutter-mobile); box-sizing: border-box; }
	.wp-block-cover.is-style-hero .cv-hero__picture { order: 2; position: relative; width: 100%; aspect-ratio: var(--wp--custom--image--split); }
	.wp-block-cover.is-style-hero img.wp-block-cover__image-background { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 74%; }
}

/* ---------- tiles (Tile cover) ---------- */
.wp-block-cover.is-style-tile { min-height: var(--wp--custom--layout--tile-min); }
/* phones: the 4:3 split ratio keeps both pets of the wide scene in frame */
@media (max-width: 599px) {
	.wp-block-cover.is-style-tile { min-height: 0; aspect-ratio: var(--wp--custom--image--split); }
	.wp-block-cover.is-style-tile img.wp-block-cover__image-background { object-position: 62% 50%; }
}

/* ---------- customer reviews: cards printed by the [compound_v_reviews] shortcode ---------- */
.cv-review-cards { display: grid; gap: var(--wp--preset--spacing--40); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 782px) { .cv-review-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cv-review-card { display: grid; grid-template-rows: auto 1fr auto; gap: var(--wp--preset--spacing--30); margin: 0; padding: var(--wp--preset--spacing--50); border-radius: var(--wp--custom--radius--card); background: var(--wp--preset--color--surface); border: var(--wp--custom--border--hairline) solid var(--wp--preset--color--accent-6); box-shadow: var(--wp--preset--shadow--sm); }
.cv-review-card__stars { position: relative; display: block; width: calc(var(--wp--custom--icon--sm) * 5); height: var(--wp--custom--icon--sm); background: var(--wp--preset--color--accent-6); -webkit-mask: var(--wp--custom--icon-url--star-fill) left center / var(--wp--custom--icon--sm) var(--wp--custom--icon--sm) repeat-x; mask: var(--wp--custom--icon-url--star-fill) left center / var(--wp--custom--icon--sm) var(--wp--custom--icon--sm) repeat-x; }
.cv-review-card__stars > span { position: absolute; inset: 0 auto 0 0; width: calc(var(--cv-rating) / 5 * 100%); background: var(--wp--preset--color--star); }
.cv-review-card__text { margin: 0; padding: 0; border: 0; font-size: var(--wp--preset--font-size--large); font-weight: var(--wp--custom--font-weight--medium); line-height: var(--wp--custom--line-height--snug); color: var(--wp--preset--color--contrast); }
.cv-review-card__text p { margin: 0; }
.cv-review-card__who { display: flex; align-items: center; gap: var(--wp--preset--spacing--30); padding-top: var(--wp--preset--spacing--30); border-top: var(--wp--custom--border--hairline) solid var(--wp--preset--color--accent-6); }
.cv-review-card__who > span:last-child { display: grid; font-size: var(--wp--preset--font-size--small); }
.cv-review-card__who a { color: var(--wp--preset--color--accent-4); text-decoration: none; }
.cv-review-card__who a:hover { color: var(--wp--preset--color--link); text-decoration: underline; }
.cv-review-card .cv-avatar { display: grid; place-items: center; width: var(--wp--custom--icon--xl); height: var(--wp--custom--icon--xl); border-radius: var(--wp--custom--radius--badge); background: var(--wp--preset--color--soft); font-weight: var(--wp--custom--font-weight--black); }

@media (prefers-reduced-motion: reduce) {
	.wp-block-cover.is-style-tile img.wp-block-cover__image-background { transition: none; }
	.wp-block-cover.is-style-tile:hover img.wp-block-cover__image-background { transform: none; }
}

/* ================= Compound V home (phase 6): art direction the blocks cannot express ================= */
/* hero: lot stamp sized to its text */
.cv-hero--cv .cv-stamp { display: inline-block; width: fit-content; margin: 0; }
/* hero: vials stacked in one cell, cross-fading over a soft blue glow; the COA card overlaps the corner */
.cv-vials { position: relative; display: grid; place-items: center; height: var(--wp--custom--layout--hero-media); }
.cv-vials::before { content: ""; position: absolute; inset: 10%; background: var(--wp--custom--glow--vial); filter: blur(var(--wp--custom--blur--glow)); }
.cv-vials > .cv-vial { grid-area: 1 / 1; position: relative; margin: 0 !important; opacity: 0; animation: cv-vial-fade calc(var(--wp--custom--glow--crossfade) * 4) infinite; }
.cv-vials > .cv-vial img { height: calc(var(--wp--custom--layout--hero-media) * 0.8); width: auto; max-width: 100%; object-fit: contain; filter: var(--wp--custom--glow--vial-shadow); }
.cv-vials > .cv-vial:nth-of-type(2) { animation-delay: var(--wp--custom--glow--crossfade); }
.cv-vials > .cv-vial:nth-of-type(3) { animation-delay: calc(var(--wp--custom--glow--crossfade) * 2); }
.cv-vials > .cv-vial:nth-of-type(4) { animation-delay: calc(var(--wp--custom--glow--crossfade) * 3); }
@keyframes cv-vial-fade { 0% { opacity: 0; } 5%, 25% { opacity: 1; } 30%, 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .cv-vials > .cv-vial { animation: none; } .cv-vials > .cv-vial:first-of-type { opacity: 1; } }
.editor-styles-wrapper .cv-vials > .cv-vial { animation: none; } .editor-styles-wrapper .cv-vials > .cv-vial:first-of-type { opacity: 1; }
.cv-vials > .cv-coa { position: absolute; right: 0; bottom: 8%; z-index: 1; margin: 0 !important; }
.cv-vials > .cv-coa p { margin: 0; }
.cv-vials > .cv-coa { opacity: 0; animation: cv-vial-fade calc(var(--wp--custom--glow--crossfade) * 4) infinite; } /* one card per vial, in step with it */
.cv-vials > .cv-coa:nth-of-type(2) { animation-delay: var(--wp--custom--glow--crossfade); }
.cv-vials > .cv-coa:nth-of-type(3) { animation-delay: calc(var(--wp--custom--glow--crossfade) * 2); }
.cv-vials > .cv-coa:nth-of-type(4) { animation-delay: calc(var(--wp--custom--glow--crossfade) * 3); }
@media (prefers-reduced-motion: reduce) { .cv-vials > .cv-coa { animation: none; } .cv-vials > .cv-coa:first-of-type { opacity: 1; } }
.editor-styles-wrapper .cv-vials > .cv-coa { animation: none; } .editor-styles-wrapper .cv-vials > .cv-coa:first-of-type { opacity: 1; }
@media (max-width: 781px) { .cv-vials > .cv-coa { right: var(--wp--preset--spacing--20); bottom: 0; } }
/* hero check chips: list items as small framed chips */
.cv-checks { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--20); padding: 0; margin: 0; list-style: none; }
.cv-checks li::marker { content: none; }
.cv-checks li::before { content: ""; display: inline-block; width: var(--wp--custom--icon--xs); height: var(--wp--custom--icon--xs); margin-right: var(--wp--preset--spacing--20); background: var(--wp--preset--color--success); -webkit-mask: var(--wp--custom--icon-url--check) center / contain no-repeat; mask: var(--wp--custom--icon-url--check) center / contain no-repeat; vertical-align: -0.15em; }
.cv-checks li { padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30); border: var(--wp--custom--border--hairline) solid var(--wp--preset--color--accent-6); border-radius: var(--wp--custom--radius--chip); background: var(--wp--preset--color--surface); }
/* text-link buttons (secondary actions) */
.cv-textlink .wp-block-button__link { background: transparent !important; border: 0 !important; color: var(--wp--preset--color--contrast) !important; padding-inline: 0 !important; box-shadow: none !important; }
.cv-textlink .wp-block-button__link:hover { color: var(--wp--preset--color--accent-1) !important; }
/* reviews: one scrolling row of quote cards */
.cv-marquee { overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: var(--wp--preset--spacing--20); }
.cv-marquee > .cv-quote { flex: 0 0 min(80%, var(--wp--custom--layout--form-card)); scroll-snap-align: start; }
.cv-quote p { margin: 0; }
/* quality tiles: a check mark before each title */
.cv-check::before { content: ""; display: inline-block; width: var(--wp--custom--icon--xs); height: var(--wp--custom--icon--xs); margin-right: var(--wp--preset--spacing--20); background: var(--wp--preset--color--accent-1); -webkit-mask: var(--wp--custom--icon-url--check) center / contain no-repeat; mask: var(--wp--custom--icon-url--check) center / contain no-repeat; vertical-align: -0.1em; }
