/* =========================================================
   Home
   ========================================================= */

/* ---------- Topo ---------- */
.hm-hero { position: relative; min-height: 852px; color: #fff; background: #0b1200; overflow: hidden; display: flex; }
.hm-hero__bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.hm-hero__bg::after { content: ""; position: absolute; inset: 0; background: rgba(58, 85, 0, .7); mix-blend-mode: multiply; }
.hm-hero__inner { position: relative; display: flex; flex-direction: column; justify-content: space-between; padding-top: 156px; padding-bottom: 122px; }
.hm-hero__title { max-width: 1013px; }
.hm-hero__bottom { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; }
.hm-hero__logos { display: flex; align-items: center; gap: 0; padding-bottom: 12px; }
.hm-hero__logos li:nth-child(1) { width: 270px; }
.hm-hero__logos li:nth-child(2) { width: 285px; }
.hm-hero__logos li:nth-child(3) { width: auto; }
.hm-hero__logos a { display: block; transition: opacity .25s; }
.hm-hero__logos a:hover { opacity: .75; }
.hm-hero__logo { height: 39px; width: auto; }
.hm-hero__side { width: 443px; }
.hm-hero__text { max-width: 373px; margin-left: 4px; font-size: 16px; line-height: 20px; }
.hm-hero__btns { display: flex; gap: 8px; margin-top: 30px; }
.hm-hero__btns .sb-btn--contorno { width: 253px; }
.hm-hero__btns .sb-btn--vidro { width: 182px; }

/* ---------- Soluções (carrossel) ---------- */
.hm-sol { padding-top: 72px; padding-bottom: 140px; overflow-x: clip; }
.hm-sol__title { max-width: 470px; }
.hm-sol__text { max-width: 584px; margin-top: 20px; }
.hm-sol__carousel { position: relative; margin-top: 30px; }
.hm-sol__track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 28px) / 3); gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -ms-overflow-style: none; }
.hm-sol__track::-webkit-scrollbar { display: none; }
.hm-sol__card { scroll-snap-align: start; }
.hm-sol__card a { position: relative; display: block; height: 520px; border-radius: 30px; overflow: hidden; color: #e0e1e0; isolation: isolate; }
.hm-sol__img { position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform 1s var(--sb-ease); z-index: -1; }
.hm-sol__img::after { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .2); }
.hm-sol__card a:hover .hm-sol__img { transform: scale(1.05); }
.hm-sol__name { position: absolute; left: 20px; bottom: 23px; max-width: 200px; font-size: var(--sb-fs-sm); line-height: 1; letter-spacing: -.03em; font-weight: 500; }
.hm-sol__go { position: absolute; right: 20px; bottom: 20px; width: 57px; height: 57px; transition: transform .4s var(--sb-ease); }
.hm-sol__go svg { width: 57px; height: 57px; }
.hm-sol__card a:hover .hm-sol__go { transform: translateX(4px); }
.hm-sol__next { position: absolute; right: -29px; top: 50%; width: 84px; height: 84px; margin-top: -42px; padding: 0; border: 0; background: none; cursor: pointer; transition: transform .3s var(--sb-ease); }
.hm-sol__next svg { width: 84px; height: 84px; }
.hm-sol__next:hover { transform: scale(1.06); }
.hm-sol__next.is-end svg { transform: scaleX(-1); }
.hm-sol__next[hidden] { display: none; }

/* ---------- Visão completa ---------- */
.hm-visao__box { position: relative; display: flex; justify-content: space-between; min-height: 640px; border-radius: 50px; background: var(--sb-grad); padding: 15px 14px 15px 44px; color: #fff; }
.hm-visao__copy { display: flex; flex-direction: column; justify-content: space-between; padding: 31px 0 25px; }
.hm-visao__title { max-width: 471px; font-weight: 500; }
.hm-visao__text { max-width: 369px; font-size: 16px; line-height: 20px; }
.hm-visao__media { position: relative; width: 410px; flex: none; }
.hm-visao__photo { height: 100%; min-height: 610px; border-radius: 36px; overflow: hidden; }
.hm-visao__photo img { width: 100%; height: 100%; object-fit: cover; }
.hm-visao__pills { position: absolute; left: -57px; top: 31px; display: flex; flex-direction: column; gap: 17px; }
.hm-pill { display: flex; align-items: center; gap: 14px; width: 249px; height: 55px; padding: 0 7px; border-radius: 36px; background: rgba(147, 147, 147, .3); -webkit-backdrop-filter: blur(15px); backdrop-filter: blur(15px); }
.hm-pill__icon { width: 46px; height: 45px; border-radius: 36px; background: #fff; display: flex; align-items: center; justify-content: center; flex: none; }
.hm-pill__icon img { width: 26px; height: 26px; object-fit: contain; }
.hm-pill__name { font-size: 20px; line-height: 20px; letter-spacing: -.03em; font-weight: 500; }

/* ---------- Rastreabilidade ESG ---------- */
.hm-esg { padding-top: 114px; }
.hm-esg__grid { display: flex; justify-content: space-between; gap: 40px; }
.hm-esg__copy { max-width: 494px; }
.hm-esg__title { color: var(--sb-green-esg); max-width: 340px; }
.hm-esg__text { margin-top: 20px; }
.hm-esg__photos { display: grid; gap: 10px; width: 548px; flex: none; }
.hm-esg__photo { aspect-ratio: 548 / 330; border-radius: 50px; overflow: hidden; }
.hm-esg__photo img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Diferenciais ---------- */
.hm-dif { padding-top: 114px; }
.hm-dif__title { padding-left: 44px; }
.hm-dif__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 32px; }

/* ---------- Experiência ---------- */
.hm-exp { padding-top: 127px; }
.hm-exp__grid { position: relative; display: grid; grid-template-columns: 338px 440px 1fr; align-items: stretch; }
.hm-exp__copy { display: flex; flex-direction: column; padding-top: 17px; }
.hm-exp__title { max-width: 311px; }
.hm-exp__text { max-width: 295px; margin-top: 20px; }
.hm-exp__btn { margin-top: auto; }
.hm-exp__media { position: relative; margin-top: 10px; height: 500px; }
.hm-exp__photo { height: 100%; border-radius: 50px; overflow: hidden; }
.hm-exp__photo img { width: 100%; height: 100%; object-fit: cover; }
.hm-exp__float { position: absolute; left: 196px; top: 105px; width: 466px; pointer-events: none; }
.hm-exp__float img { width: 100%; height: auto; }
.hm-exp__nums { display: grid; grid-template-columns: 234px 1fr; grid-template-rows: 183px 205px auto; padding-left: 58px; }
.hm-num { display: flex; flex-direction: column; }
.hm-num--1 { grid-column: 1; grid-row: 1; }
.hm-num--2 { grid-column: 2; grid-row: 1; }
.hm-num--3 { grid-column: 2; grid-row: 2; }
.hm-num--4 { grid-column: 1; grid-row: 3; }
.hm-num--5 { grid-column: 2; grid-row: 3; }
.hm-num:nth-child(n+6) { grid-column: auto; grid-row: auto; margin-top: 30px; }
.hm-num__value { font-size: var(--sb-fs-lg); line-height: 1; letter-spacing: -.03em; font-weight: 300; color: var(--sb-green); white-space: nowrap; }
.hm-num__label { margin: -2px 0 0 39px; max-width: 130px; font-size: 16px; line-height: 20px; color: var(--sb-text); }

/* ---------- Clientes ---------- */
.hm-cli { margin-top: 56px; background: var(--sb-light); padding: 87px 0 76px; text-align: center; }
.hm-cli__title { color: var(--sb-muted); }
.hm-cli__text { max-width: 659px; margin: 20px auto 0; }
.hm-cli__logos { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin: 80px 0 0; min-height: 85px; }
.hm-cli__logos li { flex: 0 1 auto; display: flex; justify-content: center; }
.hm-cli__logo { max-height: 85px; max-width: 178px; width: auto; height: auto; filter: grayscale(1); opacity: .9; transition: filter .3s, opacity .3s; }
.hm-cli__logos a:hover .hm-cli__logo { filter: none; opacity: 1; }
.hm-cli__btn { margin-top: 83px; }
.hm-cli__btn .sb-btn { width: 264px; }

/* ---------- Responsivo ---------- */
@media (max-width: 1300px) {
	.hm-exp__grid { grid-template-columns: 1fr 1.3fr; row-gap: 48px; }
	.hm-exp__copy { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; column-gap: 40px; padding-top: 0; }
	.hm-exp__btn { margin-top: 24px; }
	.hm-exp__media { margin-top: 0; }
	.hm-exp__float { left: 40%; width: 80%; max-width: 466px; }
	.hm-exp__nums { padding-left: 40px; grid-template-rows: auto auto auto; row-gap: 32px; }
}
@media (max-width: 1200px) {
	.hm-hero__bottom { flex-direction: column; align-items: flex-start; }
	.hm-hero__logos li:nth-child(n) { width: auto; margin-right: 40px; }
	.hm-visao__box { padding-left: 36px; }
	.hm-esg__photos { width: 46%; }
}
@media (max-width: 1024px) {
	.hm-hero { min-height: 720px; }
	.hm-hero__inner { padding-top: 140px; padding-bottom: 70px; }
	.hm-sol__track { grid-auto-columns: calc((100% - 14px) / 2.2); }
	.hm-sol__next { right: -12px; }
	.hm-visao__box { flex-direction: column; gap: 40px; padding: 36px 24px 24px; }
	.hm-visao__copy { padding: 0; gap: 24px; }
	.hm-visao__media { width: 100%; max-width: 560px; margin-left: auto; }
	.hm-visao__photo { min-height: 520px; }
	.hm-visao__pills { left: -12px; }
	.hm-esg__grid { flex-direction: column; }
	.hm-esg__copy { max-width: none; }
	.hm-esg__photos { width: 100%; grid-template-columns: 1fr 1fr; }
	.hm-esg__photo { border-radius: 30px; }
	.hm-dif__title { padding-left: 0; }
	.hm-dif__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
	.hm-hero { min-height: 100svh; }
	.hm-hero__inner { padding-top: 120px; padding-bottom: 48px; gap: 48px; }
	.hm-hero__bottom { gap: 32px; }
	.hm-hero__logos { flex-wrap: wrap; gap: 18px 28px; padding-bottom: 0; }
	.hm-hero__logos li:nth-child(n) { margin-right: 0; }
	.hm-hero__logo { height: 30px; }
	.hm-hero__side { width: 100%; }
	.hm-hero__text { margin-left: 0; }
	.hm-hero__btns { flex-wrap: wrap; }
	.hm-hero__btns .sb-btn { width: auto; flex: 1 1 200px; }
	.hm-sol { padding-top: 64px; padding-bottom: 72px; }
	.hm-sol__track { grid-auto-columns: 82%; gap: 10px; margin-right: calc(var(--sb-gutter) * -1); padding-right: var(--sb-gutter); }
	.hm-sol__card a { height: 420px; border-radius: 24px; }
	.hm-sol__next { display: none; }
	.hm-visao__box { border-radius: 30px; padding: 32px 16px 16px; }
	.hm-visao__copy { padding: 0 8px; }
	.hm-visao__photo { min-height: 0; height: auto; aspect-ratio: 410 / 610; border-radius: 24px; }
	.hm-visao__pills { left: 10px; top: 16px; gap: 10px; }
	.hm-pill { width: auto; height: 48px; padding-right: 20px; }
	.hm-pill__icon { width: 38px; height: 38px; }
	.hm-pill__icon img { width: 22px; height: 22px; }
	.hm-pill__name { font-size: 17px; }
	.hm-esg, .hm-dif { padding-top: 72px; }
	.hm-esg__photos { grid-template-columns: 1fr; }
	.hm-dif__grid { grid-template-columns: 1fr; }
	.hm-exp { padding-top: 72px; }
	.hm-exp__grid { grid-template-columns: 1fr; }
	.hm-exp__copy { display: flex; }
	.hm-exp__media { height: auto; aspect-ratio: 440 / 500; max-height: 520px; }
	.hm-exp__photo { border-radius: 30px; }
	.hm-exp__float { left: 24%; top: 20%; width: 76%; }
	.hm-exp__nums { order: 3; padding-left: 0; grid-template-columns: 1fr 1fr; row-gap: 28px; column-gap: 16px; }
	.hm-num:nth-child(n) { grid-column: auto; grid-row: auto; }
	.hm-num__label { margin-left: 4px; margin-top: 4px; }
	.hm-cli { padding: 64px 0; }
	.hm-cli__logos { flex-wrap: wrap; justify-content: center; gap: 28px 36px; margin-top: 44px; }
	.hm-cli__logo { max-width: 130px; max-height: 60px; }
	.hm-cli__btn { margin-top: 48px; }
}