/* BF Farm route bundle: piglets. Route-specific public rules plus only order-sensitive shared overrides. */
.piglets {
scroll-margin-top: 96px;
}.piglets-hero-gallery {
position: absolute;
inset: 0;
z-index: -2;
overflow: hidden;
background: var(--theme-dark);
}.piglets-hero-gallery-slide {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
opacity: 0;
transform: scale(1.012);
transition: opacity 850ms ease-in-out, transform 4400ms linear;
}.piglets-hero-gallery-slide.is-active {
opacity: 1;
transform: scale(1.045);
}.piglet-listing-grid{
display: block;
max-width: 1180px;
}.piglet-summary-row{
display: grid;
grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
gap: clamp(34px, 5vw, 76px);
align-items: center;
padding: clamp(34px, 5vw, 68px) 0;
border-top: 1px solid var(--line);
}.piglet-summary-row:first-child{
padding-top: 0;
border-top: 0;
}.piglet-summary-image{
display: block;
overflow: hidden;
background: var(--card-bg);
}.piglet-summary-image img{
display: block;
width: 100%;
height: auto;
aspect-ratio: 4 / 3;
object-fit: cover;
transition: transform .45s ease;
}.piglet-summary-image:hover img{
transform: scale(1.02);
}.piglet-summary-image:focus-visible img{
transform: scale(1.02);
}.piglet-summary-copy{
min-width: 0;
}.piglet-summary-copy h3{
margin: 0;
font-size: clamp(2.1rem, 4.2vw, 3.6rem);
letter-spacing: -0.04em;
color: var(--text-heading-on-light);
}.piglet-availability{
margin: 0 0 12px;
color: var(--text-accent-on-light);
font-size: .76rem;
font-weight: 800;
letter-spacing: .15em;
text-transform: uppercase;
}.piglet-summary-copy h2{
margin: 0;
font-size: clamp(2.15rem, 4.6vw, 4.5rem);
letter-spacing: -.045em;
}.piglet-summary-copy h2 a{
color: var(--text-heading-on-light);
text-decoration: none;
}.piglet-summary-copy h2 a:hover{
color: var(--text-link-on-light);
}.piglet-summary-copy h2 a:focus-visible{
color: var(--text-link-on-light);
}.piglet-summary-facts{
display: flex;
flex-wrap: wrap;
gap: 24px 46px;
margin: 0 0 28px;
padding: 0;
}.piglet-summary-facts div{
min-width: 120px;
}.piglet-summary-facts dd{
margin: 0;
color: var(--text-heading-on-light);
font-size: 1.05rem;
font-weight: 750;
line-height: 1.2;
}.piglet-details-link{
display: inline-flex;
align-items: center;
color: var(--text-link-on-light);
font-size: 1.08rem;
font-weight: 800;
letter-spacing: .07em;
text-transform: uppercase;
}.section-soft{
background: var(--card-bg-alt);
}.section-heading > p{
margin-bottom: 7px;
color: var(--text-muted-on-light);
}.fact-list dt{
font-size: .8rem;
font-weight: 800;
text-transform: uppercase;
letter-spacing: .1em;
color: var(--text-muted-on-light);
}.piglet-summary-facts dt{
margin: 0 0 5px;
font-size: .82rem;
font-weight: 700;
letter-spacing: .13em;
text-transform: uppercase;
color: var(--text-muted-on-light);
}.text-link{
display: inline-flex;
gap: 16px;
align-items: center;
text-decoration: none;
font-size: 0.72rem;
font-weight: 800;
letter-spacing: 0.11em;
text-transform: uppercase;
transition: color 180ms ease;
color: var(--text-link-on-light);
}.piglet-pairing{
margin: 18px 0 26px;
font-size: clamp(1.05rem, 1.6vw, 1.3rem);
color: var(--text-muted-on-card);
}.page-hero--site{
position: relative;
isolation: isolate;
overflow: hidden;
background-color: var(--theme-dark);
background-position: var(--page-hero-position, center 50%);
background-size: cover;
background-repeat: no-repeat;
}.page-hero--site > .shell{
position: relative;
z-index: 1;
}.section.piglet-detail-section{
padding-top: 0;
padding-block-start: 0;
margin-top: 0;
}.piglet-detail-stack{
max-width: 1120px;
}.piglet-detail-stack .detail-media{
margin: 0;
}.piglet-detail-stack .detail-media img{
display: block;
width: 100%;
height: auto;
max-height: none;
aspect-ratio: auto;
object-fit: contain;
}.piglet-info-section{
padding: clamp(34px, 6vw, 72px) clamp(20px, 6vw, 72px);
color: var(--text-body-on-card);
background: var(--card-bg-alt);
}.piglet-info-section .piglet-availability{
margin: 0 0 16px;
color: var(--text-accent-on-card);
}.piglet-info-section h1{
max-width: 100%;
margin: 0;
color: var(--text-heading-on-card);
font-size: clamp(2.25rem, 7vw, 4.8rem);
white-space: nowrap;
}.piglet-info-section .fact-list{
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0 clamp(28px, 5vw, 64px);
margin: clamp(32px, 5vw, 56px) 0 0;
border-top: 1px solid var(--line);
}.piglet-info-section .fact-list div{
min-width: 0;
display: grid;
grid-template-columns: minmax(72px, .55fr) minmax(0, 1.45fr);
gap: 18px;
align-items: baseline;
padding: 18px 0;
border-bottom: 1px solid var(--line);
}.piglet-info-section .fact-list dt{
min-width: 0;
white-space: nowrap;
color: var(--text-muted-on-card);
}.piglet-info-section .fact-list dd{
min-width: 0;
white-space: nowrap;
margin: 0;
color: var(--text-body-on-card);
text-align: right;
}.piglet-info-section .piglet-detail-actions{
display: flex;
flex-wrap: wrap;
gap: 20px;
align-items: center;
}.piglet-detail-primary{
display: grid;
gap: clamp(22px, 4vw, 42px);
align-items: start;
}.piglet-detail-fader{
position: relative;
overflow: hidden;
aspect-ratio: 4 / 3;
border-radius: var(--bf-public-card-radius);
background: var(--surface-card);
isolation: isolate;
}.piglet-detail-stack .piglet-detail-fader .piglet-detail-slide{
position: absolute;
inset: 0;
display: block;
width: 100%;
height: 100%;
max-height: none;
object-fit: cover;
object-position: center;
opacity: 0;
transition: opacity 900ms ease-in-out;
}.piglet-detail-stack .piglet-detail-fader .piglet-detail-slide.is-active{
opacity: 1;
}.piglet-detail-secondary{
margin-top: clamp(34px, 5vw, 64px);
}.piglet-detail-secondary > .piglet-value-proof:first-child{
margin-top: 0;
}.piglet-detail-secondary .piglet-detail-actions{
display: flex;
flex-wrap: wrap;
gap: 20px;
align-items: center;
margin-top: clamp(34px, 5vw, 54px);
}.piglet-detail-secondary .piglet-detail-actions .piglet-purchase-actions{
width: 100%;
}@media (prefers-reduced-motion: reduce){.piglet-detail-stack .piglet-detail-fader .piglet-detail-slide{
transition: none;
}}.piglet-parents{
margin-top: clamp(48px, 8vw, 88px);
padding-top: clamp(36px, 6vw, 64px);
border-top: 1px solid var(--line);
}.piglet-parents-heading{
max-width: 720px;
margin-bottom: clamp(28px, 5vw, 48px);
}.piglet-parents-heading .section-label{
margin-bottom: 10px;
}.piglet-parents-heading h2{
margin: 0;
color: var(--text-heading-on-card);
font-size: clamp(2rem, 5vw, 3.7rem);
}.piglet-parent-grid{
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: clamp(34px, 6vw, 72px);
}.piglet-parent{
min-width: 0;
background: transparent;
}.piglet-parent-image{
display: block;
width: 100%;
height: auto;
object-fit: contain;
}.piglet-parent-copy{
padding-top: 22px;
}.piglet-parent-role{
margin: 0 0 8px;
color: var(--text-accent-on-card);
font-size: .78rem;
font-weight: 800;
letter-spacing: .14em;
text-transform: uppercase;
}.piglet-parent h3{
margin: 0;
color: var(--text-heading-on-card);
font-size: clamp(1.55rem, 3vw, 2.35rem);
}.piglet-parent-facts{
margin: 24px 0 0;
border-top: 1px solid var(--line);
}.piglet-parent-facts div{
display: grid;
grid-template-columns: minmax(92px, .7fr) minmax(0, 1.3fr);
gap: 18px;
align-items: baseline;
padding: 13px 0;
border-bottom: 1px solid var(--line);
}.piglet-parent-facts dt{
color: var(--text-muted-on-card);
font-size: .68rem;
font-weight: 800;
letter-spacing: .08em;
text-transform: uppercase;
}.piglet-parent-facts dd{
min-width: 0;
margin: 0;
color: var(--text-body-on-card);
text-align: right;
}@media (max-width:980px){.section-heading{
grid-template-columns: 1fr;
}.listing-grid{
grid-template-columns: repeat(2,1fr);
}}@media (max-width:760px){.page-hero--piglets{
height: 50svh;
min-height: 50svh;
padding: clamp(24px, 4svh, 40px) 0;
align-items: center;
background: linear-gradient(180deg, color-mix(in srgb, var(--theme-dark) 80%, transparent) 0%, color-mix(in srgb, var(--theme-dark) 70%, transparent) 46%, color-mix(in srgb, var(--theme-dark) 86%, transparent) 100%),
url("/assets/images/piglet-black-front.webp") 58% center / cover no-repeat;
}.piglets-hero-gallery-slide{
object-position: 58% center;
}.page-hero--piglets .section-label{
margin-bottom: 14px;
font-size: 0.65rem;
letter-spacing: 0.18em;
}.page-hero--piglets h1{
max-width: 8.5ch;
font-size: clamp(2.25rem, 10vw, 2.85rem);
}.page-hero--piglets > .shell > p:last-child{
max-width: 21rem;
margin-top: 16px;
font-size: 0.95rem;
line-height: 1.42;
}.listing-grid{
grid-template-columns: 1fr;
}.section{
padding: 82px 0;
}.section-heading{
gap: 20px;
margin-bottom: 38px;
}.intro.section{
padding-top: clamp(74px, 12vw, 96px);
}.piglet-listing-section{
padding-top: 26px;
}.piglet-summary-row{
grid-template-columns: 1fr;
gap: 0;
padding: 0;
margin: 0 0 28px;
border: 1px solid var(--card-border);
border-radius: 18px;
background: var(--surface-card);
overflow: hidden;
}.piglet-summary-row:first-child{
padding-top: 0;
}.piglet-summary-image{
background: var(--card-bg);
}.piglet-summary-image img{
width: 100%;
height: auto;
aspect-ratio: 4 / 3;
object-fit: cover;
}.piglet-summary-copy{
padding: 24px 22px 22px;
}.piglet-details-link{
min-height: 50px;
justify-content: center;
border: 1px solid var(--header-bg);
background: var(--field-surface);
color: var(--header-bg);
font-size: 0.84rem;
line-height: 1.25;
letter-spacing: 0.11em;
}.piglet-details-link:hover,
.piglet-details-link:focus-visible{
color: var(--header-bg);
background: color-mix(in srgb, var(--header-bg) 7%, #fff 93%);
border-color: var(--header-bg);
}.piglet-summary-copy h2,
.piglet-summary-copy h3{
font-size: clamp(2rem, 10vw, 2.7rem);
}.piglet-pairing{
margin: 12px 0 22px;
font-size: 0.98rem;
line-height: 1.45;
}.piglet-summary-facts{
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 18px 20px;
margin-bottom: 24px;
}.piglet-summary-facts div{
min-width: 0;
}.piglet-detail-section{
padding-inline: 0;
}.piglet-detail-section > .shell{
width: 100%;
}.piglet-info-section{
padding: 34px 24px 44px;
}.piglet-info-section h1{
font-size: clamp(2rem, 10vw, 3.4rem);
white-space: normal;
overflow-wrap: anywhere;
}.piglet-info-section .fact-list{
grid-template-columns: 1fr;
}.piglet-info-section .fact-list div{
grid-template-columns: 76px minmax(0, 1fr);
gap: 12px;
align-items: baseline;
}.piglet-info-section .fact-list dt{
font-size: .82rem;
line-height: 1.2;
}.piglet-info-section .fact-list dd{
font-size: 1.1rem;
line-height: 1.25;
letter-spacing: -.015em;
text-align: right;
white-space: normal;
overflow-wrap: anywhere;
}.piglet-info-section .piglet-detail-actions{
align-items: stretch;
flex-direction: column;
}.piglet-info-section .piglet-detail-actions .button{
width: 100%;
}.piglet-parent-grid{
grid-template-columns: 1fr;
gap: 48px;
}.piglet-parent-facts div{
grid-template-columns: 84px minmax(0, 1fr);
gap: 10px;
padding: 15px 0;
}.piglet-parent-facts dt{
font-size: clamp(.72rem, 3.5vw, .8rem);
line-height: 1.15;
white-space: nowrap;
}.piglet-parent-facts dd{
overflow: visible;
min-width: 0;
font-size: clamp(.95rem, 4.5vw, 1.18rem);
line-height: 1.28;
letter-spacing: -0.015em;
text-align: right;
overflow-wrap: anywhere;
white-space: normal;
}}.page-hero--piglets > .shell,
.page-hero--piglets > .shell h1,
.page-hero--piglets > .shell h2,
.page-hero--piglets > .shell h3,
.page-hero--piglets > .shell p,
.page-hero--piglets > .shell strong,
.page-hero--piglets > .shell small,
.page-hero--piglets > .shell span,
.page-hero--piglets > .shell a{
color: var(--white);
}@media (prefers-reduced-motion: reduce){.piglets-hero-gallery-slide{
transition: none;
transform: none;
}.piglets-hero-gallery-slide.is-active{
transform: none;
}}.piglet-summary-actions,
.piglet-purchase-actions{
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 14px;
}.piglet-summary-actions{
margin-top: 4px;
}.piglet-buy-button,
.piglet-purchase-actions [data-cart-buy]{
min-height: 48px;
padding: 0 22px;
border: 1px solid var(--header-bg);
background: var(--header-bg);
color: #fff;
white-space: nowrap;
}.piglet-buy-button:hover,
.piglet-buy-button:focus-visible,
.piglet-purchase-actions [data-cart-buy]:hover,
.piglet-purchase-actions [data-cart-buy]:focus-visible{
border-color: color-mix(in srgb, var(--header-bg) 88%, #fff 12%);
background: color-mix(in srgb, var(--header-bg) 88%, #fff 12%);
color: #fff;
}@media (max-width: 760px){.piglet-summary-actions,
.piglet-purchase-actions{
align-items: stretch;
flex-direction: column;
gap: 10px;
}.piglet-summary-actions .text-link,
.piglet-summary-actions .button,
.piglet-purchase-actions .button{
width: 100%;
}.piglet-summary-actions .button{
min-height: 52px;
}.piglet-summary-actions .text-link{
min-height: 48px;
justify-content: center;
border: 1px solid var(--card-border);
padding: 0 18px;
}}.is-purchase-in-process,
.is-purchase-in-process:disabled{
cursor: not-allowed;
opacity: .72;
background: var(--surface-soft);
color: var(--text-heading);
border-color: var(--card-border);
}.piglet-credibility-section{
padding-top: clamp(28px, 5vw, 64px);
padding-bottom: clamp(28px, 5vw, 64px);
overflow: hidden;
}.piglet-credibility-shell{
display: grid;
gap: clamp(24px, 4vw, 42px);
}.piglet-credibility-heading{
max-width: 780px;
}.piglet-credibility-heading h2{
margin: 0;
color: var(--text-heading);
font-size: clamp(2.2rem, 5vw, 4.6rem);
}@media (max-width: 720px){.page-hero--site{
background-position: center, center, var(--page-hero-mobile-position, var(--page-hero-position, center 50%));
}}.piglet-transport-grid{
display: grid;
}.piglet-transport-section{
padding-top: clamp(52px, 7vw, 90px);
background: var(--surface-page);
}.piglet-transport-heading{
margin-bottom: 32px;
}.piglet-transport-grid{
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 18px;
}.piglet-transport-card{
overflow: hidden;
border: 1px solid var(--line);
background: var(--surface-card);
}.piglet-transport-card > img{
width: 100%;
height: auto;
aspect-ratio: auto;
object-fit: contain;
}.piglet-transport-card__copy{
padding: clamp(24px, 4vw, 38px);
}.piglet-transport-card__copy h3{
margin: 0 0 14px;
font-size: clamp(1.45rem, 2.6vw, 2.3rem);
}.piglet-transport-card__copy > p:not(.section-label){
margin-bottom: 24px;
color: var(--text-muted-on-card);
line-height: 1.6;
}.piglet-transport-note{
max-width: 980px;
margin: 22px 0 0;
color: var(--text-muted-on-light);
font-size: .85rem;
line-height: 1.55;
}@media (max-width: 720px){.piglet-transport-grid{
grid-template-columns: 1fr;
}.piglet-transport-card__copy .button{
width: 100%;
}}.piglet-waitlist-panel{
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 36px;
align-items: end;
}.piglet-waitlist-panel h2{
margin-bottom: 16px;
font-size: clamp(2.2rem, 4vw, 3.8rem);
}.piglet-waitlist-panel > div:first-child > p:not(.section-label){
max-width: 760px;
margin-bottom: 0;
color: var(--text-muted-on-card);
line-height: 1.6;
}.piglet-waitlist-actions{
display: grid;
gap: 16px;
justify-items: start;
}@media (max-width: 720px){.piglet-waitlist-panel{
grid-template-columns: 1fr;
align-items: start;
}.piglet-waitlist-actions,
.piglet-waitlist-actions .button{
width: 100%;
}}.piglet-credibility-intro{
max-width: 820px;
margin: 22px 0 0;
color: var(--text-body);
font-size: clamp(1.04rem, 1.6vw, 1.24rem);
line-height: 1.65;
}@media (min-width: 981px){.page-hero--piglets h1{
max-width: 1000px;
font-size: clamp(3.6rem, 5.5vw, 5.5rem);
}.page-hero--site h1{
max-width: 980px;
font-size: clamp(3.25rem, 5.7vw, 5.85rem);
}}@media (min-width: 981px){.inner-main > .page-hero--piglets{
margin-top: 12px;
}.piglet-parent-grid{
align-items: stretch;
}.piglet-parent{
min-width: 0;
display: flex;
flex-direction: column;
}.piglet-parent-image{
width: 100%;
height: auto;
aspect-ratio: auto;
object-fit: contain;
object-position: center;
}.piglet-parent-copy,
.piglet-parent-facts,
.piglet-parent-facts div,
.piglet-parent-facts dd{
min-width: 0;
}.piglet-parent h3,
.piglet-parent-facts dd{
overflow-wrap: anywhere;
}}.piglets-hero-gallery-slide{
filter: var(--bf-public-image-filter);
}.page-hero--piglets::after{
background: linear-gradient(180deg,
rgba(16, 24, 32, .08),
transparent 30%,
rgba(16, 24, 32, .16));
}.page-hero--site h1,
.page-hero--site .section-label,
.page-hero--site > .shell > p:last-child{
text-shadow:
0 2px 8px rgba(1, 9, 16, .78),
0 1px 2px rgba(1, 9, 16, .88);
}@media (max-width: 760px){.page-hero--site{
background-image:
linear-gradient(90deg,
rgba(2, 13, 23, .52) 0%,
rgba(2, 13, 23, .33) 58%,
rgba(2, 13, 23, .16) 100%),
linear-gradient(180deg,
rgba(2, 13, 23, .02),
rgba(2, 13, 23, .12)),
var(--page-hero-image);
}}.piglet-waitlist-actions .split-link-card,
.piglet-detail-actions > .split-link-card,
.piglet-transport-card__copy .split-link-card{
width: 100%;
max-width: none;
}.piglet-detail-actions > .split-link-card{ flex: 1 1 100%; }@media (max-width: 760px){main .piglet-detail-section > .shell{
width: 100%;
}main .piglet-info-section{
padding-left: 20px;
padding-right: 20px;
}}.buyer-experiences__heading{
max-width: 820px;
margin-bottom: clamp(30px, 4vw, 48px);
}.buyer-experiences__heading .section-label{
margin-bottom: 16px;
}.buyer-experiences__heading h2{
max-width: 720px;
margin: 0;
color: var(--ink);
font-size: clamp(2.8rem, 4.6vw, 5rem);
letter-spacing: -.04em;
}.buyer-experiences__heading > p:last-child{
max-width: 620px;
margin: 22px 0 0;
color: var(--text-muted-on-light);
font-size: clamp(1rem, 1.2vw, 1.12rem);
line-height: 1.65;
}.buyer-experiences__grid{
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: clamp(18px, 2.2vw, 30px);
align-items: stretch;
}.buyer-quote-card{
position: relative;
min-width: 0;
margin: 0;
padding: clamp(28px, 3vw, 40px);
display: flex;
flex-direction: column;
background: rgba(255, 255, 255, .94);
border: 1px solid rgba(20, 54, 79, .13);
border-top: 4px solid var(--blue);
border-radius: 10px;
}.buyer-quote-card__mark{
display: inline-flex;
width: 50px;
height: 50px;
margin-bottom: 24px;
align-items: center;
justify-content: center;
flex: 0 0 auto;
border-radius: 50%;
background: var(--blue-deep);
color: var(--text-on-primary);
font-family: Georgia, serif;
font-size: 2.15rem;
line-height: 1;
padding-top: 9px;
}.buyer-quote-card > p{
margin: 0;
color: var(--ink);
font-family: var(--sans);
font-size: clamp(1.02rem, 1.25vw, 1.16rem);
font-weight: var(--runtime-testimonial-font-weight, 500);
line-height: 1.68;
}.buyer-quote-card footer{
margin-top: auto;
padding-top: 26px;
border-top: 1px solid var(--line);
display: flex;
flex-wrap: wrap;
gap: 6px 14px;
align-items: baseline;
}.buyer-quote-card cite{
color: var(--blue-deep);
font-style: normal;
font-size: .8rem;
font-weight: 800;
letter-spacing: .1em;
text-transform: uppercase;
}.buyer-quote-card footer span{
color: var(--text-muted-on-light);
font-size: .78rem;
font-weight: 600;
}@media (max-width: 980px){.buyer-experiences__grid{
grid-template-columns: 1fr;
}}@media (max-width: 760px){.buyer-experiences__heading{
margin-bottom: 28px;
}.buyer-experiences__heading h2{
max-width: 340px;
font-size: clamp(2.45rem, 11.5vw, 3.2rem);
letter-spacing: -.035em;
}.buyer-experiences__heading > p:last-child{
margin-top: 16px;
font-size: .98rem;
line-height: 1.58;
}.buyer-experiences__grid{
gap: 16px;
}.buyer-quote-card{
padding: 24px 20px;
border-top-width: 3px;
border-radius: 8px;
}.buyer-quote-card__mark{
width: 44px;
height: 44px;
margin-bottom: 18px;
font-size: 1.9rem;
padding-top: 8px;
}.buyer-quote-card > p{
font-size: .98rem;
line-height: 1.62;
}.buyer-quote-card footer{
margin-top: 22px;
padding-top: 18px;
}}.piglet-summary-image,
.detail-media{
position: relative;
}.piglet-image-stamp{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) rotate(-24deg);
z-index: 2;
display: inline-flex;
align-items: center;
justify-content: center;
padding: .16em .3em;
font-size: clamp(2rem, 6vw, 4.75rem);
font-weight: 900;
letter-spacing: .2em;
text-transform: uppercase;
color: transparent;
-webkit-text-stroke: 1.8px rgba(255,255,255,.78);
text-stroke: 1.8px rgba(255,255,255,.78);
text-shadow: 0 0 18px rgba(10, 20, 30, .18);
opacity: .72;
pointer-events: none;
user-select: none;
white-space: nowrap;
}.piglet-image-stamp--detail{
font-size: clamp(2.4rem, 8vw, 6rem);
-webkit-text-stroke-width: 2px;
text-stroke-width: 2px;
}.piglet-summary-image.is-sold::after,
.detail-media.is-sold::after{
content: "";
position: absolute;
inset: 0;
background: linear-gradient(180deg, rgba(10,20,30,.02), rgba(10,20,30,.10));
pointer-events: none;
}.piglet-summary-row.is-sold .piglet-availability,
.piglet-info-section .piglet-availability.is-sold{
color: color-mix(in srgb, var(--text-accent-on-light) 68%, #5d6773 32%);
}.piglet-summary-row.is-sold .piglet-details-link{
border-color: var(--header-bg);
}@media (max-width: 760px){.piglet-image-stamp{
font-size: clamp(1.85rem, 11vw, 3.25rem);
-webkit-text-stroke-width: 1.5px;
text-stroke-width: 1.5px;
}.piglet-image-stamp--detail{
font-size: clamp(2.15rem, 13vw, 4rem);
-webkit-text-stroke-width: 1.7px;
text-stroke-width: 1.7px;
}}@media (max-width: 760px){.piglets-hero-gallery-slide{
filter: var(--bf-public-image-filter);
}.page-hero--piglets::after{
background: linear-gradient(180deg,
rgba(9, 18, 28, .06) 0%,
rgba(9, 18, 28, .02) 22%,
rgba(9, 18, 28, .10) 50%,
rgba(9, 18, 28, .38) 100%);
}.page-hero--piglets > .shell{
padding-bottom: 0;
}.page-hero--piglets h1{
max-width: 7.2ch;
font-size: clamp(2rem, 8.8vw, 2.55rem);
text-shadow: 0 2px 10px rgba(0,0,0,.46);
}}.inner-main > .page-hero{
width: 100%;
margin-bottom: 0;
padding: 0;
display: grid;
align-items: start;
isolation: isolate;
border-radius: 0;
}.inner-main > .page-hero > .shell{
position: relative;
z-index: 2;
width: var(--shell);
max-width: none;
margin-inline: auto;
padding: 15px 0 22px;
display: block;
align-content: start;
}.inner-main > .page-hero .section-label{
color: var(--white);
text-transform: uppercase;
text-shadow: 0 2px 8px rgba(1, 9, 16, .82);
}.inner-main > .page-hero h1,
.page-hero.page-hero--article h1,
.page-hero.page-hero--piglets h1,
.page-hero.page-hero--kunekune h1{
color: var(--white);
text-shadow: 0 2px 10px rgba(1, 9, 16, .82);
}.inner-main > .page-hero > .shell > p:last-child:not(.section-label){
color: rgba(255,255,255,.94);
text-shadow: 0 2px 8px rgba(1, 9, 16, .82);
}.piglets-hero-gallery-slide{
filter: var(--bf-public-image-filter);
}.page-hero--piglets::after{
background: linear-gradient(90deg,
rgba(2, 13, 23, .60) 0%,
rgba(2, 13, 23, .38) 48%,
rgba(2, 13, 23, .14) 100%),
linear-gradient(180deg,
rgba(2, 13, 23, .08) 0%,
rgba(2, 13, 23, .04) 58%,
rgba(2, 13, 23, .18) 100%);
}.page-hero--site{
background-image:
linear-gradient(90deg,
rgba(2, 13, 23, .60) 0%,
rgba(2, 13, 23, .38) 48%,
rgba(2, 13, 23, .14) 100%),
linear-gradient(180deg,
rgba(2, 13, 23, .08) 0%,
rgba(2, 13, 23, .18) 100%),
var(--page-hero-image);
}.buyer-quote-card,
.piglet-parent{
border-radius: var(--bf-public-card-radius);
}.piglet-parent{
overflow: hidden;
}.inner-main > .page-hero--piglets{
margin-left: 0;
margin-right: 0;
}@media (max-width: 760px){.inner-main > .page-hero{
padding: 0;
align-items: start;
}.inner-main > .page-hero > .shell{
min-height: 0;
justify-content: flex-start;
}.inner-main > .page-hero h1,
.page-hero.page-hero--article h1,
.page-hero.page-hero--piglets h1,
.page-hero.page-hero--kunekune h1{
margin: 0;
}.inner-main > .page-hero > .shell > p:last-child:not(.section-label){
margin-top: 10px;
}.buyer-quote-card{
border-radius: var(--bf-public-card-radius);
}}.piglet-transport-card{
border-radius: var(--bf-public-card-radius);
}/* 2026-09-01: Piglet summary images keep rounded top corners and square bottom corners. */
.piglet-summary-image{
border-radius: var(--bf-public-card-radius) var(--bf-public-card-radius) 0 0;
}.piglet-transport-card{
border: 1px solid var(--line);
}.piglet-summary-row{
border-radius: var(--bf-public-card-radius);
}.inner-main > .page-hero{
height: var(--bf-full-hero-height);
min-height: 0;
max-height: none;
aspect-ratio: auto;
overflow: hidden;
background-color: var(--theme-dark);
}.page-hero--site{
background-repeat: no-repeat;
}.piglets-hero-gallery-slide{
object-position: right center;
}.piglets-hero-gallery-slide.is-active{
transform: none;
}.piglets-hero-gallery-slide{
transition: opacity 900ms ease-in-out;
}.piglets-hero-gallery{
background: var(--theme-dark);
}.inner-main > .page-hero > .shell{
height: 100%;
min-height: 0;
padding-top: 15px;
padding-bottom: 18px;
align-self: start;
justify-content: flex-start;
}.inner-main > .page-hero .section-label{
margin: 0 0 10px;
font-size: 12px;
font-weight: 700;
line-height: 1.2;
letter-spacing: .14em;
}.inner-main > .page-hero h1,
.page-hero.page-hero--article h1,
.page-hero.page-hero--piglets h1,
.page-hero.page-hero--kunekune h1{
max-width: 560px;
margin: 0 0 10px;
font-size: clamp(44px, 5vw, 72px);
font-weight: 400;
letter-spacing: -.035em;
}.inner-main > .page-hero > .shell > p:last-child:not(.section-label){
max-width: 560px;
margin: 0;
font-size: 16px;
line-height: 1.42;
}.inner-main > .page-hero > .shell > .section-label{
opacity: 0;
transform: translate3d(0, var(--bf-full-hero-rise), 0);
animation: bfInteriorHeroFadeUp var(--bf-full-hero-duration) var(--bf-full-hero-ease) .12s both;
}.inner-main > .page-hero > .shell > h1{
opacity: 0;
transform: translate3d(0, var(--bf-full-hero-rise), 0);
animation: bfInteriorHeroFadeUp var(--bf-full-hero-duration) var(--bf-full-hero-ease) .42s both;
}.inner-main > .page-hero > .shell > p:last-child:not(.section-label){
opacity: 0;
transform: translate3d(0, var(--bf-full-hero-rise), 0);
animation: bfInteriorHeroFadeUp var(--bf-full-hero-duration) var(--bf-full-hero-ease) .72s both;
}@media (max-width: 760px){.inner-main > .page-hero{
height: var(--bf-full-hero-mobile-height);
min-height: 0;
max-height: none;
}.inner-main > .page-hero > .shell{
height: 100%;
padding: 15px 0 14px;
}.inner-main > .page-hero .section-label{
margin-bottom: 5px;
font-size: 9px;
font-weight: 700;
letter-spacing: .13em;
}.inner-main > .page-hero h1,
.page-hero.page-hero--article h1,
.page-hero.page-hero--piglets h1,
.page-hero.page-hero--kunekune h1{
max-width: 320px;
margin-bottom: 6px;
font-size: clamp(25px, 7vw, 30px);
}.inner-main > .page-hero > .shell > p:last-child:not(.section-label){
max-width: 320px;
margin: 0;
font-size: 12.5px;
line-height: 1.36;
}.page-hero--site{
background-position: center, center, right center;
}}@media (prefers-reduced-motion: reduce){.inner-main > .page-hero > .shell > .section-label,
.inner-main > .page-hero > .shell > h1,
.inner-main > .page-hero > .shell > p:last-child:not(.section-label){
opacity: 1;
transform: none;
animation: none;
}}.inner-main > .page-hero{
margin-top: 0;
}.page-hero--site{
background-size: cover, cover, cover;
background-position: center, center, var(--page-hero-position, center 50%);
}.piglets-hero-gallery-slide{
object-fit: cover;
transform: none;
}.piglets-hero-gallery-slide{
object-position: 58% center;
}@media (max-width: 760px){.inner-main > .page-hero > .shell{
width: calc(100vw - 40px);
margin-inline: auto;
}.piglets-hero-gallery-slide{
object-position: 58% center;
}}.piglet-value-proof{
margin: clamp(38px, 6vw, 64px) 0 0;
padding: clamp(28px, 4.5vw, 46px);
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, .95fr);
grid-template-areas:
"intro guarantee"
"actions guarantee";
gap: 24px clamp(32px, 5vw, 64px);
align-items: start;
border: 1px solid var(--line);
border-radius: var(--bf-public-card-radius);
background: var(--surface-card);
}.piglet-value-proof__intro{
grid-area: intro;
min-width: 0;
}.piglet-value-proof__intro .section-label{ margin-bottom: 12px; }.piglet-value-proof__intro h2{
max-width: 620px;
margin: 0;
color: var(--text-heading-on-card);
font-size: clamp(2rem, 4vw, 3.45rem);
line-height: .98;
letter-spacing: -.035em;
}.piglet-value-proof__intro > p:not(.section-label){
max-width: 650px;
margin: 20px 0 0;
color: var(--text-muted-on-card);
font-size: clamp(1rem, 1.45vw, 1.1rem);
line-height: 1.65;
}.piglet-value-proof__guarantee{
grid-area: guarantee;
min-width: 0;
display: grid;
grid-template-columns: 42px minmax(0, 1fr);
gap: 16px;
align-items: start;
padding: clamp(22px, 3vw, 30px);
border-left: 3px solid var(--blue-deep);
background: color-mix(in srgb, var(--blue-deep) 5%, var(--surface-card));
border-radius: 0 14px 14px 0;
}.piglet-value-proof__mark{
width: 38px;
height: 38px;
display: grid;
place-items: center;
border-radius: 50%;
color: var(--text-on-primary);
background: var(--blue-deep);
font-size: 1rem;
font-weight: 900;
line-height: 1;
}.piglet-value-proof__guarantee-label{
margin: 0 0 7px;
color: var(--blue-deep);
font-size: .74rem;
font-weight: 850;
letter-spacing: .12em;
line-height: 1.2;
text-transform: uppercase;
}.piglet-value-proof__guarantee h3{
margin: 0;
color: var(--text-heading-on-card);
font-size: clamp(1.22rem, 2vw, 1.55rem);
line-height: 1.16;
}.piglet-value-proof__guarantee p:last-child{
margin: 12px 0 0;
color: var(--text-muted-on-card);
font-size: .98rem;
line-height: 1.58;
}.piglet-value-proof__actions{
grid-area: actions;
margin-top: 2px;
display: flex;
flex-wrap: wrap;
gap: 14px 22px;
align-items: center;
}.piglet-value-proof__actions .button{ min-height: 48px; }.piglet-value-proof__text-link{
color: var(--blue-deep);
font-size: .82rem;
font-weight: 850;
letter-spacing: .075em;
line-height: 1.3;
text-decoration: none;
text-transform: uppercase;
}.piglet-value-proof__text-link span{
display: inline-block;
margin-left: 5px;
transition: transform 180ms ease;
}.piglet-value-proof__text-link:hover span,
.piglet-value-proof__text-link:focus-visible span{ transform: translateX(4px); }.piglet-info-section .piglet-detail-actions{ margin-top: clamp(34px, 5vw, 54px); }.piglet-info-section .piglet-detail-actions .piglet-purchase-actions{ width: 100%; }@media (max-width: 900px){.piglet-value-proof{
grid-template-columns: 1fr;
grid-template-areas:
"intro"
"guarantee"
"actions";
}}@media (max-width: 760px){.piglet-value-proof{
margin-top: 34px;
padding: 26px 22px 28px;
gap: 24px;
}.piglet-value-proof__intro h2{
font-size: clamp(2rem, 9vw, 2.75rem);
line-height: 1.02;
}.piglet-value-proof__guarantee{
grid-template-columns: 38px minmax(0, 1fr);
gap: 14px;
padding: 20px 18px;
}.piglet-value-proof__actions{
align-items: stretch;
flex-direction: column;
}.piglet-value-proof__actions .button{ width: 100%; }.piglet-value-proof__text-link{ padding-block: 4px; }}button,
.button,
.nav-cta,
.piglet-buy-button,
.piglet-purchase-actions [data-cart-buy]{
border-radius: var(--bf-public-control-radius, 12px);
}.piglet-value-proof__mark{
border-radius: 50%;
}.brand img,
.footer-simple__brand img{
filter: none;
}.button,
.nav-cta{
border-color: var(--bf-silver-line-soft);
}.site-nav a,
.piglet-summary-facts,
.piglet-parent-facts{
border-color: var(--bf-silver-line-faint);
}@media (min-width: 981px){.piglet-credibility-heading > .piglet-waitlist-actions{
margin-top: 30px;
}}#bf-public .piglet-credibility-intro + .piglet-waitlist-actions{
margin-top: var(--bf-link-row-content-gap);
}#bf-public .piglet-parent{
min-width: 0;
max-width: 100%;
box-sizing: border-box;
}#bf-public .piglet-parent-copy{
min-width: 0;
padding: clamp(24px, 3.2vw, 34px) clamp(24px, 3.8vw, 38px) clamp(28px, 4vw, 40px);
box-sizing: border-box;
}#bf-public .piglet-parent-facts{
min-width: 0;
max-width: 100%;
}#bf-public .piglet-parent-facts div{
min-width: 0;
grid-template-columns: minmax(104px, .78fr) minmax(0, 1.22fr);
gap: clamp(16px, 2.2vw, 24px);
padding: 15px 4px;
}#bf-public .piglet-parent-facts dt,
#bf-public .piglet-parent-facts dd{
min-width: 0;
max-width: 100%;
overflow-wrap: anywhere;
}.detail-media[data-piglet-main-media]{
scroll-margin-top: calc(var(--header-height, 96px) + 14px);
}@media (max-width: 760px){#bf-public .piglet-parent-copy{
padding: 24px 24px 30px;
}#bf-public .piglet-parent-facts div{
grid-template-columns: minmax(86px, .82fr) minmax(0, 1.18fr);
gap: 16px;
padding: 16px 2px;
}#bf-public .piglet-parent-facts dt{
white-space: normal;
}#bf-public .piglet-parent-facts dd{
padding-left: 6px;
text-align: right;
}}@media (min-width: 1101px){.buyer-experiences__heading h2{
font-size: clamp(2.35rem, 5.6dvh, 4.7rem);
line-height: 1.02;
}.buyer-experiences__heading{
margin-bottom: clamp(18px, 2.6dvh, 30px);
}.buyer-experiences__heading > p:last-child{
margin-top: 10px;
font-size: clamp(.88rem, 1.55dvh, 1rem);
line-height: 1.45;
}.buyer-experiences__grid{
gap: 18px;
}.buyer-quote-card{
min-height: 0;
padding: clamp(20px, 2.8dvh, 30px);
}.buyer-quote-card__mark{
width: 42px;
height: 42px;
margin-bottom: clamp(10px, 1.5dvh, 16px);
font-size: 1.8rem;
}.buyer-quote-card > p{
font-size: clamp(.9rem, 1.65dvh, 1.04rem);
line-height: 1.5;
}.buyer-quote-card footer{
padding-top: clamp(12px, 1.8dvh, 20px);
}}@media (min-width: 1101px) and (max-height: 860px){.buyer-experiences__heading h2{
font-size: clamp(2.15rem, 5.2dvh, 3.5rem);
}.buyer-quote-card{
padding: 18px 20px;
}}@media (min-width: 1101px){#bf-public.inner-page .inner-main > .page-hero{
height: clamp(500px, 42vw, 680px);
min-height: 500px;
max-height: 680px;
aspect-ratio: auto;
overflow: hidden;
}#bf-public.inner-page .inner-main > .page-hero > .shell{
height: 100%;
min-height: 0;
padding-top: clamp(32px, 4vw, 64px);
padding-bottom: clamp(32px, 4vw, 64px);
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
align-self: stretch;
text-align: left;
}#bf-public.inner-page :is(
.inner-main > .page-hero .section-label,
.states-directory-hero .section-label,
.state-guide-hero.hero .hero-copy .eyebrow
){
margin: 0 0 16px;
font-size: clamp(14px, 1vw, 16px);
line-height: 1.2;
letter-spacing: .16em;
text-align: left;
}#bf-public.inner-page :is(
.inner-main > .page-hero > .shell > p:last-child:not(.section-label),
.page-hero--kb-index .kb-index-hero-copy > p:last-child,
.states-directory-hero p:not(.section-label),
.state-guide-hero.hero .hero-copy > p:last-child
){
max-width: 760px;
margin: 0;
font-size: clamp(20px, 1.55vw, 24px);
line-height: 1.42;
text-align: left;
}}.piglet-summary-image .piglet-buyer-badge{
position: absolute;
top: 14px;
left: 14px;
z-index: 4;
display: inline-flex;
align-items: center;
min-height: 34px;
padding: 7px 11px;
border: 1px solid color-mix(in srgb, #fff 46%, var(--header-bg) 54%);
border-radius: 12px;
background: var(--header-bg);
color: #fff;
font-size: .76rem;
font-weight: 800;
line-height: 1;
letter-spacing: .09em;
text-transform: uppercase;
white-space: nowrap;
pointer-events: none;
}@media (max-width: 760px){.piglet-summary-image .piglet-buyer-badge{
top: 12px;
left: 12px;
min-height: 31px;
padding: 6px 9px;
font-size: .7rem;
}}.review-public-stars{margin:0 0 12px;color:inherit;letter-spacing:.08em;font-size:1rem;line-height:1.2}.piglet-review-trust{margin:18px 0 0}.piglet-review-trust .text-link{font-weight:700}.piglet-detail-intro{
display: grid;
gap: clamp(14px, 2.5vw, 24px);
margin-bottom: clamp(22px, 3.5vw, 36px);
padding: clamp(28px, 5vw, 52px) clamp(20px, 5vw, 52px);
color: var(--text-body-on-card);
background: var(--card-bg-alt);
border-radius: var(--bf-public-card-radius);
}.piglet-detail-intro .piglet-availability{
margin-bottom: 12px;
color: var(--text-accent-on-card);
}.piglet-detail-intro h1{
margin: 0;
color: var(--text-heading-on-card);
font-size: clamp(2.2rem, 7vw, 4.2rem);
line-height: 1.02;
letter-spacing: -.04em;
white-space: normal;
overflow-wrap: anywhere;
}.piglet-detail-intro-copy{
max-width: 68ch;
margin: 0;
color: var(--text-muted-on-card);
font-size: clamp(1rem, 1.45vw, 1.18rem);
line-height: 1.68;
}.piglet-info-section--facts-only{
padding: clamp(22px, 4vw, 36px);
border-radius: var(--bf-public-card-radius);
}.piglet-info-section--facts-only .fact-list{
margin-top: 0;
}@media (min-width: 1101px){#bf-public .piglet-detail-stack{
max-width: 1320px;
padding-top: clamp(28px, 3vw, 44px);
}#bf-public .piglet-detail-intro{
grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
align-items: center;
gap: clamp(34px, 5vw, 72px);
padding: clamp(32px, 3.4vw, 48px) clamp(38px, 4.2vw, 60px);
}#bf-public .piglet-detail-intro h1{
font-size: clamp(2.35rem, 3.5vw, 3.75rem);
}#bf-public .piglet-detail-primary{
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: clamp(28px, 3.4vw, 50px);
align-items: stretch;
}#bf-public .piglet-detail-primary > .detail-media{
min-width: 0;
min-height: clamp(430px, 33vw, 535px);
height: 100%;
align-self: stretch;
aspect-ratio: auto;
border-radius: var(--bf-public-card-radius);
background: var(--surface-card);
}#bf-public .piglet-detail-primary > .detail-media .piglet-detail-slide{
object-fit: cover;
object-position: center;
}#bf-public .piglet-detail-primary > .piglet-info-section--facts-only{
min-width: 0;
height: 100%;
align-self: stretch;
display: flex;
padding: 0 clamp(30px, 3.1vw, 46px);
overflow: hidden;
}#bf-public .piglet-detail-primary > .piglet-info-section--facts-only .fact-list{
flex: 1 1 auto;
display: flex;
flex-direction: column;
margin: 0;
border-top: 0;
}#bf-public .piglet-detail-primary > .piglet-info-section--facts-only .fact-list div{
flex: 1 1 0;
min-height: 56px;
grid-template-columns: minmax(96px, .7fr) minmax(0, 1.3fr);
align-items: center;
padding: 12px 0;
}#bf-public .piglet-detail-primary > .piglet-info-section--facts-only .fact-list div:first-child{
border-top: 1px solid var(--line);
}#bf-public .piglet-detail-secondary{
width: 100%;
margin-top: clamp(42px, 5vw, 68px);
}}@media (min-width: 1101px){#bf-public .piglet-detail-section--registered > .piglet-detail-stack{
padding-top: clamp(18px, 2vw, 28px);
}#bf-public .piglet-detail-section--registered .piglet-detail-intro{
--registered-piglet-title-size: clamp(2.2rem, 3.1vw, 3.35rem);
align-items: end;
align-items: last baseline;
gap: clamp(28px, 4vw, 58px);
margin-bottom: clamp(16px, 2vw, 22px);
padding: clamp(20px, 2vw, 26px) clamp(34px, 4vw, 54px);
}#bf-public .piglet-detail-section--registered .piglet-detail-intro .piglet-availability{
margin-bottom: 7px;
}#bf-public .piglet-detail-section--registered .piglet-detail-intro h1,
#bf-public .piglet-detail-section--registered .piglet-detail-intro-copy--registered-line{
margin: 0;
color: var(--text-heading-on-card);
font-size: var(--registered-piglet-title-size);
font-weight: inherit;
line-height: 1.02;
letter-spacing: -.04em;
}#bf-public .piglet-detail-section--registered .piglet-detail-intro-copy--registered-line{
max-width: none;
overflow-wrap: anywhere;
}#bf-public .piglet-detail-section--registered .piglet-detail-primary > .detail-media{
min-height: 0;
height: clamp(370px, calc(100vh - 330px), 430px);
height: clamp(370px, calc(100svh - 330px), 430px);
}#bf-public .piglet-detail-section--registered .piglet-detail-primary > .piglet-info-section--facts-only .fact-list div{
min-height: 0;
padding: 7px 0;
}}
/* 2026-08-29: show piglet/For Sale image media without shading/gradient overlays; hero copy has no text shadow. */
#bf-public .page-hero--site{
background-position: var(--page-hero-position, center 50%);
background-size: cover;
background-repeat: no-repeat;
}
#bf-public .page-hero--piglets::after,
#bf-public .page-hero--site::after,
#bf-public .piglet-summary-image.is-sold::after,
#bf-public .detail-media.is-sold::after{
content: none;
background: none;
background-image: none;
}
#bf-public .page-hero--piglets .shell *,
#bf-public .page-hero--site > .shell *{
text-shadow: 1px 1px 0 rgba(0, 0, 0, .78);
}
/* 2026-08-31: mobile piglet detail continuity — natural parent-photo ratio, consistent gutters, and compact section rhythm. */
@media (max-width: 760px){
#bf-public .piglet-parents{
width: auto;
margin-top: 32px;
margin-left: 20px;
margin-right: 20px;
padding-top: 28px;
box-sizing: border-box;
}
#bf-public .piglet-parents-heading{
max-width: none;
margin-left: 0;
margin-right: 0;
margin-bottom: 24px;
}
#bf-public .piglet-parent-grid{
gap: 32px;
}
#bf-public .piglet-parent{
border-radius: 0;
}
#bf-public .piglet-parent-image{
display: block;
width: 100%;
height: auto;
aspect-ratio: auto;
object-fit: contain;
object-position: center;
border-radius: 0;
}
#bf-public .piglet-parent-copy{
padding: 22px 0 22px;
}
#bf-public .piglet-parent-facts div{
padding-left: 0;
padding-right: 0;
}
#bf-public .piglet-parent-facts dd{
padding-left: 6px;
}
#bf-public .piglet-detail-secondary{
margin-top: 28px;
}
#bf-public .piglet-detail-secondary .piglet-detail-actions{
margin-top: 26px;
margin-left: 20px;
margin-right: 20px;
}
#bf-public .section.piglet-detail-section{
padding-bottom: 24px;
}
#bf-public .section.piglet-transport-section{
padding-top: 28px;
}
#bf-public .piglet-transport-heading{
margin-bottom: 24px;
}
}
/* 2026-09-01: Piglet detail unified card system — one card per major subject, no nested-card clutter. */
#bf-public .piglet-detail-card{
box-sizing:border-box;
border:1px solid var(--line);
border-radius:var(--bf-public-card-radius,16px);
background:var(--surface-card);
overflow:hidden;
}
#bf-public .piglet-detail-overview-card{
width:100%;
}
#bf-public .piglet-detail-overview-card .piglet-detail-intro{
margin:0;
border:0;
border-bottom:1px solid var(--line);
border-radius:0;
background:var(--card-bg-alt);
}
#bf-public .piglet-detail-overview-card .piglet-detail-primary{
gap:0;
align-items:stretch;
}
#bf-public .piglet-detail-overview-card .detail-media{
margin:0;
border-radius:0;
background:var(--surface-card);
}
#bf-public .piglet-detail-overview-card .piglet-info-section--facts-only{
border-radius:0;
background:var(--surface-card);
}
#bf-public .piglet-detail-actions--overview{
margin:0;
padding:clamp(22px,3.4vw,34px) clamp(22px,4vw,42px);
border-top:1px solid var(--line);
background:var(--card-bg-alt);
}
#bf-public .piglet-detail-actions--overview .piglet-purchase-actions{
width:100%;
margin:0;
}
#bf-public .piglet-detail-secondary{
display:grid;
gap:clamp(24px,3.6vw,38px);
width:100%;
margin-top:clamp(24px,3.8vw,42px);
}
#bf-public .piglet-detail-secondary > .piglet-value-proof,
#bf-public .piglet-detail-secondary > .piglet-parents,
#bf-public .piglet-detail-secondary > .piglet-review-trust{
margin-top:0;
margin-bottom:0;
}
#bf-public .piglet-parents{
width:100%;
margin:0;
padding:clamp(28px,4.5vw,48px);
border-top:1px solid var(--line);
background:var(--surface-card);
}
#bf-public .piglet-parents-heading{
max-width:760px;
margin:0 0 clamp(24px,3.5vw,34px);
}
#bf-public .piglet-parent-grid{
gap:clamp(28px,4vw,44px);
}
#bf-public .piglet-parents .piglet-parent{
min-width:0;
border:0;
border-radius:0;
background:transparent;
overflow:visible;
}
#bf-public .piglet-parents .piglet-parent-copy{
padding:22px 0 0;
}
#bf-public .piglet-value-proof{
margin:0;
border:1px solid var(--line);
border-radius:var(--bf-public-card-radius,16px);
background:var(--surface-card);
}
#bf-public .piglet-value-proof__guarantee{
border-radius:0;
background:transparent;
}
#bf-public .piglet-review-trust{
padding-inline:4px;
}
#bf-public .piglet-transport-section{
padding-top:clamp(28px,4vw,48px);
padding-bottom:clamp(38px,5vw,64px);
}
#bf-public .piglet-transport-panel{
padding:clamp(28px,4.5vw,48px);
}
#bf-public .piglet-transport-heading{
margin:0 0 clamp(26px,3.6vw,38px);
padding-bottom:clamp(22px,3vw,30px);
border-bottom:1px solid var(--line);
}
#bf-public .piglet-transport-grid{
gap:0;
}
#bf-public .piglet-transport-panel .piglet-transport-card{
min-width:0;
border:0;
border-radius:0;
background:transparent;
overflow:visible;
}
#bf-public .piglet-transport-panel .piglet-transport-card:first-child{
padding-right:clamp(22px,3vw,34px);
}
#bf-public .piglet-transport-panel .piglet-transport-card + .piglet-transport-card{
padding-left:clamp(22px,3vw,34px);
border-left:1px solid var(--line);
}
#bf-public .piglet-transport-panel .piglet-transport-card > img{
display:block;
width:100%;
height:auto;
border-radius:0;
}
#bf-public .piglet-transport-panel .piglet-transport-card__copy{
padding:22px 0 0;
}
#bf-public .piglet-transport-panel .piglet-transport-card__copy > p:not(.section-label){
margin-bottom:18px;
}
#bf-public .piglet-transport-panel .split-link-card{
margin-top:10px;
}
#bf-public .piglet-transport-note{
margin:clamp(24px,3.5vw,34px) 0 0;
padding-top:20px;
border-top:1px solid var(--line);
}
@media (min-width:1101px){
#bf-public .piglet-detail-overview-card .piglet-detail-primary > .detail-media,
#bf-public .piglet-detail-section--registered .piglet-detail-overview-card .piglet-detail-primary > .detail-media{
border-radius:0;
}
#bf-public .piglet-detail-overview-card .piglet-detail-primary > .piglet-info-section--facts-only{
border-left:1px solid var(--line);
}
}
@media (max-width:760px){
#bf-public .piglet-detail-stack{
padding-top:20px;
}
#bf-public .piglet-detail-overview-card .piglet-detail-intro{
padding:24px 20px;
}
#bf-public .piglet-detail-overview-card .piglet-info-section--facts-only{
padding:20px;
border-top:1px solid var(--line);
}
#bf-public .piglet-detail-actions--overview{
padding:20px;
}
#bf-public .piglet-detail-actions--overview .piglet-purchase-actions{
display:grid;
grid-template-columns:1fr;
gap:12px;
}
#bf-public .piglet-detail-actions--overview .button{
width:100%;
margin:0;
}
#bf-public .piglet-detail-secondary{
gap:22px;
margin-top:22px;
}
#bf-public .piglet-parents{
width:100%;
margin:0;
padding:24px 20px 26px;
border-top:1px solid var(--line);
border-radius:var(--bf-public-card-radius,16px);
}
#bf-public .piglet-parents-heading{
margin:0 0 22px;
}
#bf-public .piglet-parent-grid{
gap:0;
}
#bf-public .piglet-parents .piglet-parent{
margin:0;
padding:0;
}
#bf-public .piglet-parents .piglet-parent + .piglet-parent{
margin-top:26px;
padding-top:26px;
border-top:1px solid var(--line);
}
#bf-public .piglet-parents .piglet-parent-image{
display:block;
width:100%;
height:auto;
aspect-ratio:auto;
object-fit:contain;
object-position:center;
border-radius:0;
}
#bf-public .piglet-parents .piglet-parent-copy{
padding:20px 0 0;
}
#bf-public .piglet-value-proof{
padding:24px 20px 26px;
gap:22px;
}
#bf-public .piglet-value-proof__guarantee{
padding:18px 0 18px 16px;
}
#bf-public .section.piglet-detail-section{
padding-bottom:22px;
}
#bf-public .section.piglet-transport-section{
padding-top:22px;
padding-bottom:38px;
}
#bf-public .piglet-transport-panel{
padding:24px 20px 26px;
}
#bf-public .piglet-transport-heading{
margin-bottom:22px;
padding-bottom:20px;
}
#bf-public .piglet-transport-grid{
grid-template-columns:1fr;
}
#bf-public .piglet-transport-panel .piglet-transport-card:first-child{
padding-right:0;
}
#bf-public .piglet-transport-panel .piglet-transport-card + .piglet-transport-card{
margin-top:26px;
padding-top:26px;
padding-left:0;
border-top:1px solid var(--line);
border-left:0;
}
#bf-public .piglet-transport-panel .piglet-transport-card__copy{
padding-top:18px;
}
#bf-public .piglet-transport-panel .split-link-card{
margin-top:8px;
}
#bf-public .piglet-transport-note{
margin-top:24px;
padding-top:18px;
}
}
/* 2026-09-01: Mobile piglet detail card gutters match the transport card frame. */
@media (max-width:760px){
#bf-public main .piglet-detail-section > .shell.piglet-detail-stack{
width:calc(100% - 40px);
}
}
/* 2026-09-01: Piglet detail gallery keeps one fixed frame so every slide stays the same size and fills it edge-to-edge. */
#bf-public .piglet-detail-overview-card .piglet-detail-fader{
width:100%;
aspect-ratio:4 / 3;
}
#bf-public .piglet-detail-stack .piglet-detail-overview-card .piglet-detail-fader .piglet-detail-slide,
#bf-public .piglet-detail-stack .piglet-detail-overview-card .piglet-detail-fader .piglet-detail-slide:first-of-type{
position:absolute;
inset:0;
width:100%;
height:100%;
max-height:none;
object-fit:cover;
object-position:center;
}
@media (max-width:760px){
#bf-public .piglet-detail-overview-card .piglet-info-section--facts-only{
border-top:0;
}
#bf-public .piglet-detail-overview-card .piglet-info-section--facts-only .fact-list{
border-top:0;
}
}
/* 2026-09-02: For Sale hero desktop copy sits left and is vertically centered. */
@media (min-width: 981px){
.inner-main > .page-hero--piglets > .shell{
height:100%;
padding-top:0;
padding-bottom:0;
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:center;
text-align:left;
}
.inner-main > .page-hero--piglets .section-label,
.inner-main > .page-hero--piglets h1,
.inner-main > .page-hero--piglets .piglets-hero-sale-copy{
text-align:left;
}
.inner-main > .page-hero--piglets .piglets-hero-sale-copy{
max-width:720px;
margin:0;
font-size:clamp(1.2rem,1.45vw,1.55rem);
line-height:1.42;
}
}
/* Piglet detail galleries can contain original-format images and videos. */
#bf-public .piglet-detail-media-gallery .piglet-detail-slide{pointer-events:none;}
#bf-public .piglet-detail-media-gallery .piglet-detail-slide.is-active{pointer-events:auto;}
#bf-public .piglet-detail-media-gallery .piglet-detail-video{object-fit:contain;background:#000;}
/* Original-format media fallback for containers the browser cannot play inline. */
#bf-public .piglet-detail-file-slide{display:none;position:absolute;inset:0;align-items:center;justify-content:center;flex-direction:column;gap:14px;padding:clamp(24px,5vw,52px);text-align:center;background:var(--surface-card);color:var(--text-heading-on-card);}
#bf-public .piglet-detail-file-slide.is-active{display:flex;}
#bf-public .piglet-detail-file-slide span{max-width:560px;color:var(--text-muted);line-height:1.5;}
/* Site-responsive transport banners; article/state media are not part of this system. */
#bf-public .piglet-transport-panel .piglet-transport-card>.bf-responsive-picture{display:block;width:100%;height:auto}
#bf-public .piglet-transport-panel .piglet-transport-card>.bf-responsive-picture>img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:0}
/* SEO buyer-path section: keep the educational handoff readable after current inventory at tablet/small-desktop widths. */
.piglet-buyer-paths-section .piglet-waitlist-panel > * {
min-width: 0;
}
@media (max-width: 1180px) {
.piglet-buyer-paths-section .piglet-waitlist-panel {
grid-template-columns: minmax(0, 1fr);
align-items: start;
}
.piglet-buyer-paths-section .piglet-waitlist-actions {
width: 100%;
}
}
/* BF Farm pig card farm-signature watermark — 2026-09-11 */
#bf-public .piglet-summary-copy,
#bf-public .piglet-detail-overview-card{
position:relative;
isolation:isolate;
}
#bf-public .piglet-summary-copy::after,
#bf-public .piglet-detail-overview-card::after{
content:"";
position:absolute;
left:0;
right:0;
top:42%;
bottom:0;
z-index:0;
background:url('/assets/img/pig-card-farm-watermark-v1.webp') center bottom / auto 100% no-repeat;
pointer-events:none;
}
#bf-public .piglet-summary-copy > *{
position:relative;
z-index:1;
}
#bf-public .piglet-detail-overview-card > *{
position:relative;
z-index:1;
}
#bf-public .piglet-detail-overview-card .piglet-info-section--facts-only,
#bf-public .piglet-detail-overview-card .piglet-detail-actions--overview{
background:transparent;
}
@media (max-width:760px){
#bf-public .piglet-summary-copy::after,
#bf-public .piglet-detail-overview-card::after{
top:40%;
background-size:auto 100%;
}
}
/* 2026-09-12: Piglet listing/detail photos show the complete animal while card/gallery frames stay consistent. */
#bf-public .piglet-summary-image{
background:var(--surface-card);
}
#bf-public .piglet-summary-image img{
object-fit:contain;
object-position:center;
}
#bf-public .piglet-summary-image:hover img,
#bf-public .piglet-summary-image:focus-visible img{
transform:none;
}
#bf-public .piglet-detail-overview-card .piglet-detail-fader{
background:var(--surface-card);
}
#bf-public .piglet-detail-stack .piglet-detail-overview-card .piglet-detail-fader .piglet-detail-slide:not(video),
#bf-public .piglet-detail-stack .piglet-detail-overview-card .piglet-detail-fader .piglet-detail-slide:first-of-type:not(video){
object-fit:contain;
object-position:center;
}