/* =========================================================
   ABOUT — OUR PLATFORMS (Figma 605:6780)
   ========================================================= */

/* Hero */
.pl-hero { position: relative; overflow: hidden; height: 727px; color: #fff; background: var(--navy); }
.pl-hero__bg { position: absolute; inset: 0; overflow: hidden; }
.pl-hero__bg img { position: absolute; left: -4.76%; top: -25.72%; width: 109.52%; height: 125.79%; max-width: none; object-fit: cover; animation: plDrift 3s var(--ease-out) both; }
.pl-hero__bg::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 853px 1139px at 0 100%, rgba(0, 0, 0, .6) 0%, rgba(0, 0, 0, 0) 100%); }
.pl-hero__inner { position: relative; height: 100%; display: flex; align-items: center; padding-top: 87px; }
.pl-hero__text { width: 584px; max-width: 100%; display: flex; flex-direction: column; gap: 24px; }
.pl-hero__eyebrow { margin-bottom: -10px; font-size: 32px; color: var(--green); }
.pl-hero__title { font-size: 54px; font-weight: 400; line-height: 1.2; }
.pl-hero__title .w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .06em; margin-bottom: -.06em; }
.pl-hero__title .w > span { display: inline-block; transform: translateY(110%); animation: wordUp .9s var(--ease-out) forwards; animation-delay: calc(.3s + var(--i) * .05s); }
.pl-hero__lead { font-size: 20px; }
.pl-hero .hero-in { opacity: 0; animation: fadeUp .9s var(--ease-out) forwards; animation-delay: var(--d, .2s); }

/* Platform blocks */
.pl-list { background: #fff; padding: 100px 0; }
.plat { scroll-margin-top: 110px; }
.plat__head { display: flex; align-items: stretch; gap: 64px; }
.plat__img { position: relative; flex: 1 1 0; min-width: 0; border-radius: 14px; overflow: hidden; }
.plat__img img { position: absolute; max-width: none; object-fit: cover; }
.plat__img--ship img { left: -60.32%; top: -9.34%; width: 194.14%; height: 143.14%; transform: scaleX(-1); }
.plat__img--truck img { left: -54.87%; top: -17.48%; width: 209.74%; height: 117.54%; }
.plat__img--steak img { inset: 0; width: 100%; height: 100%; }
.plat__body { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 32px; padding: 42px 0; }
.plat-logo { display: block; height: auto; margin-bottom: -10px; }
.plat__body h2 { font-size: 42px; font-weight: 600; line-height: 1.333; }
.plat__body > p { font-size: 20px; line-height: 1.2; opacity: .6; }
.plat__tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 4px; }
.plat__tags li { padding: 12px 24px; border-radius: 49px; background: var(--green); font-size: 16px; line-height: 1.375; transition: background-color .3s, color .3s, transform .35s var(--ease); }
.plat__tags li:hover { background: var(--navy); color: #fff; transform: translateY(-2px); }
/* audience pills enter one after another (each is its own .reveal with a staggered --d) */
.plat__tags li.reveal { transform: none; }
.plat__tags li.reveal.is-visible { animation: pillIn .6s var(--ease-out) var(--d, 0s) backwards; }
@keyframes pillIn { from { opacity: 0; transform: translateY(14px) scale(.94); } to { opacity: 1; transform: none; } }
.plat__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; margin-top: 80px; }
.feat { display: flex; flex-direction: column; }
.feat__icon { font-size: 42px; color: var(--green); margin-bottom: 14px; transition: transform .5s var(--ease); }
.feat h3 { font-size: 24px; font-weight: 400; line-height: 1.375; transition: color .3s; }
.feat p { margin-top: 4px; font-size: 20px; line-height: 1.2; opacity: .6; }
.feat:hover .feat__icon { transform: translateY(-4px) rotate(-8deg) scale(1.08); }
.feat:hover h3 { color: var(--marine); }
.pl-rule { margin: 80px 0; border-top-color: rgba(28, 28, 27, .2); }

/* Built around you + CTA */
.pl-fit { position: relative; background: #fff; padding: 80px 0 100px; }
.pl-fit::before { content: ""; position: absolute; top: 120.56px; left: 0; right: 0; bottom: 0; background: var(--light); border-radius: 45px 45px 0 0; }
.pl-fit .container { position: relative; }
.pl-fit__row { display: flex; align-items: flex-end; gap: 42px; }
.pl-fit__text { flex: 577 1 577px; min-width: 0; display: flex; flex-direction: column; gap: 32px; }
.pl-fit__text p { font-size: 20px; line-height: 1.2; opacity: .6; }
.pl-fit__card { flex: 661 1 661px; min-width: 0; align-self: stretch; display: flex; flex-direction: column; justify-content: flex-end; min-height: 358px; padding: 64px 42px; border-radius: 18px; background: var(--navy); color: #fff; }
.pl-fit__card p { font-size: 38px; line-height: 1.2; }
.pl-fit__rule { height: 0; margin: 80px 0; border: 0; border-top: 1px solid rgba(28, 28, 27, .2); }

@keyframes plDrift { from { transform: scale(1.08) translateX(-1.5%); } to { transform: none; } }

@media (prefers-reduced-motion: reduce) {
	.pl-hero__title .w > span { transform: none !important; }
	.pl-hero .hero-in { opacity: 1 !important; }
}

@media (max-width: 1240px) {
	.plat__head { gap: 48px; }
	.plat__body { padding: 16px 0; gap: 26px; }
	.plat__body h2 { font-size: 36px; }
	.pl-fit__card p { font-size: 32px; }
}

@media (max-width: 1024px) {
	.pl-hero { height: 640px; }
	.pl-hero__title { font-size: 46px; }
	.pl-list { padding: 80px 0; }
	.plat__head { flex-direction: column; gap: 40px; }
	.plat__img { flex: none; aspect-ratio: 608 / 470; }
	.plat__body { padding: 0; }
	.plat__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 56px; }
	.pl-rule { margin: 64px 0; }
	.pl-fit { padding: 64px 0 80px; }
	.pl-fit::before { top: 100px; border-radius: 32px 32px 0 0; }
	.pl-fit__row { flex-direction: column; align-items: stretch; gap: 40px; }
	.pl-fit__text, .pl-fit__card { flex: none; }
	.pl-fit__card { min-height: 0; padding: 48px 36px; order: -1; } /* stacked: blue statement box first */
	.pl-fit__rule { margin: 64px 0; }
}

@media (max-width: 760px) {
	.pl-hero { height: 560px; }
	.pl-hero__eyebrow { font-size: 24px; }
	.pl-hero__title { font-size: 36px; }
	.pl-hero__lead { font-size: 18px; }
	.pl-list { padding: 64px 0; }
	.plat__img { border-radius: 12px; aspect-ratio: 4 / 3; }
	.plat__body h2 { font-size: 30px; }
	.plat__body > p { font-size: 18px; }
	.plat-logo { width: 150px; margin-bottom: -8px; }
	.plat__tags li { padding: 10px 18px; font-size: 15px; }
	.plat__grid { grid-template-columns: 1fr; gap: 28px; margin-top: 44px; }
	.feat h3 { font-size: 22px; }
	.feat p { font-size: 18px; }
	.pl-rule { margin: 48px 0; }
	.pl-fit::before { top: 72px; border-radius: 24px 24px 0 0; }
	.pl-fit__text p { font-size: 18px; }
	.pl-fit__card { padding: 36px 24px; border-radius: 16px; }
	.pl-fit__card p { font-size: 26px; }
	.pl-fit__rule { margin: 48px 0; }
}