/* Shared hero hierarchy. Scoped to the home hero; existing family typography and assets remain. */
.sales-site .sales-hero.hero-system { padding-block:clamp(56px,8svh,88px); }
.sales-site .hero-system .sales-hero-copy { container-type:inline-size; width:min(720px,100%); }
.sales-site .hero-system .sales-overline { margin-block:0 12px; font-size:12px; line-height:1.5; letter-spacing:.2em; }
.sales-site .hero-system .sales-proof { margin-block:0 28px; max-width:560px; font-size:14px; line-height:1.6; letter-spacing:.11em; }
.sales-site .hero-system h1 { margin:0; max-width:100%; font-size:min(118px,var(--hero-domain-scale,17cqi)); line-height:1; text-transform:none; white-space:nowrap; }
.sales-site .hero-system .sales-hero-claim { margin-block:30px 0; max-width:620px; padding-block:14px; font-size:clamp(18px,1.6vw,22px); line-height:1.5; }
.sales-site .hero-system .sales-hero-rarity { margin-block:20px 0; max-width:470px; font-family:inherit; font-size:16px; font-weight:400; line-height:1.65; color:inherit; opacity:.84; text-wrap:pretty; }
.sales-site .hero-system .sales-actions { margin-block-start:28px; }
@media(max-width:1024px) { .sales-site .hero-system .sales-hero-copy { max-width:680px; } }
@media(max-width:760px) {
 .sales-site .sales-hero.hero-system { justify-content:center; padding-block:44px 60px; }
 .sales-site .hero-system .sales-hero-copy { max-width:410px; margin-block:0; }
 .sales-site .hero-system .sales-overline { margin-block-end:12px; font-size:12px; }
 .sales-site .hero-system .sales-proof { margin-block:0 24px; max-width:340px; font-size:14px; line-height:1.6; letter-spacing:.08em; }
 .sales-site .hero-system .sales-hero-claim { margin-block-start:26px; padding-block:12px; max-width:360px; font-size:18px; }
 .sales-site .hero-system .sales-hero-rarity { margin-block-start:18px; max-width:340px; font-size:16px; line-height:1.6; }
 .sales-site .hero-system .sales-actions { margin-block-start:26px; }
}
@media(max-width:760px) and (max-height:700px) { .sales-site .sales-hero.hero-system { padding-block:30px 42px; } }

.sales-site .hero-system { --hero-domain-scale:17.3cqi; }

/* Reveal the structural leading dot once, without changing layout. */
.sales-site .hero-system h1 .hero-domain-dot { display:inline-block; color:inherit; transform-origin:50% 80%; animation:hero-domain-dot-reveal 760ms cubic-bezier(.22,1,.36,1) 160ms both; }
@keyframes hero-domain-dot-reveal { from { opacity:0; transform:translateY(.08em) scale(.82); } to { opacity:1; transform:translateY(0) scale(1); } }
@media(prefers-reduced-motion:reduce) { .sales-site .hero-system h1 .hero-domain-dot { animation:none; } }

/* Mobile framing follows this photograph’s focal subject. */
@media (max-width:760px) {
 .sales-site .hero-system .hero-background { object-position:87% center; top:-4%; bottom:auto; height:80%; mask-image:linear-gradient(#000 0% 76%,transparent 100%); }
 .sales-site .sales-hero.hero-system::before,
 .sales-site[dir="rtl"] .sales-hero.hero-system::before { background:linear-gradient(180deg,rgba(2,3,4,.12) 0%,rgba(2,3,4,.22) 15%,rgba(2,3,4,.76) 26%,rgba(2,3,4,.86) 40%,rgba(2,3,4,.92) 58%,rgba(2,3,4,.96) 100%); }
}

/* Readable action label, subordinate to the domain. */
.sales-site .hero-system .sales-button { font-size:14px; }

/* Match the approved family hero while retaining Food’s domain scale and photograph. */
.sales-site .hero-system .sales-overline{font-size:clamp(12px,1vw,14px);line-height:1.65}
.sales-site .hero-system .sales-proof{font-size:clamp(13px,1.1vw,15px);line-height:1.7}
.sales-site .hero-system .sales-hero-rarity{font-size:clamp(16px,1.3vw,18px);line-height:1.75}
.sales-site .hero-system .sales-hero-claim{font-size:clamp(20px,2vw,30px);line-height:1.4}
.sales-site .hero-system .editorial-ending{display:inline-block;max-width:100%;white-space:normal;text-wrap:pretty}
@media(min-width:1025px){.sales-site .hero-system .sales-hero-claim .editorial-ending{display:block}}

/* Keep the two hero statements intact in every locale. */
.sales-site .hero-system .sales-proof{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:flex-start;column-gap:.45em;row-gap:0;text-wrap:wrap!important}
.sales-site .hero-system .sales-proof>.proof-category,
.sales-site .hero-system .sales-proof>.proof-address{display:block;flex:0 0 auto;white-space:nowrap!important;word-break:normal!important;overflow-wrap:normal!important;max-inline-size:none;text-wrap:nowrap!important}
.sales-site .hero-system .sales-proof>.proof-category{color:inherit;font-weight:inherit}
@media(max-width:760px){.sales-site .hero-system .sales-proof{justify-content:center;margin-inline:auto}}

/* Mobile containment: keep the desktop composition, but never clip translated copy or its CTA. */
@media(max-width:760px){
 .sales-site .hero-system{--hero-domain-scale:15cqi}
 .sales-site .hero-system .sales-hero-copy{width:100%;min-width:0;max-width:calc(100vw - 40px);box-sizing:border-box}
 .sales-site .hero-system :is(.sales-overline,.sales-hero-claim,.sales-hero-rarity),
 .sales-site .hero-system :is(.sales-overline,.sales-hero-claim,.sales-hero-rarity)>*{max-inline-size:100%;white-space:normal!important;overflow-wrap:anywhere;text-wrap:pretty}
 .sales-site .hero-system .sales-proof{width:100%;max-width:100%}
 .sales-site .hero-system .sales-proof>.proof-category,
 .sales-site .hero-system .sales-proof>.proof-address{flex:1 1 100%;max-inline-size:100%;white-space:normal!important;overflow-wrap:anywhere!important;text-wrap:pretty!important}
 .sales-site .hero-system .sales-actions{width:100%;max-width:100%}
 .sales-site .hero-system .sales-button{min-width:0;max-width:100%;white-space:normal}
}
