/* Shared readability and layout corrections. Keep after page styles. */
body { overflow-wrap: break-word; }
figure { margin-inline: 0; }
:where(main, footer) :where(div, section, article, figure, aside, nav, form, a) { min-width: 0; }
h1, h2, h3 { overflow-wrap: anywhere; }
.brand__descriptor { font-size: 10px; letter-spacing: .2em; }
.button { padding-block: 14px; line-height: 1.4; white-space: normal; }
.button__arrow { flex: 0 0 auto; }
.primary-nav__link { font-size: 16px; }
.site-header__inner { gap: 20px; }
.primary-nav { gap: clamp(11px, 1.15vw, 18px); }
.nav-dropdown__panel { visibility: hidden; }
.nav-dropdown.is-open .nav-dropdown__panel { visibility: visible; }
.nav-dropdown__panel a { font-size: 16px; }
.footer-column a, .site-footer__description { font-size: 16px; color: #c0d3e1; }
.footer-column h2, .site-footer__bottom, .site-footer__bottom a { font-size: 14px; }
.site-footer__bottom, .site-footer__bottom a { color: #c0d3e1; }
.site-footer__bottom > div { flex-wrap: wrap; }
.site-footer__main { gap: 28px; }
.footer-column a { padding-block: 3px; }
.footer-legal-pending { color: #c0d3e1; font-size: 14px; }
.button--accent, .button--header, .primary-nav__mobile-cta { background-color: #087746; }
input:not([type="checkbox"]):not([type="radio"]), select, textarea { font-size: 16px; }
textarea { line-height: 1.6; }
[hidden]:not([hidden="until-found"]) { display: none !important; }

/* A row may grow when readable labels wrap; images retain their aspect ratio. */
.ai-image-label, .insight-image-label { max-width: calc(100% - 24px); white-space: normal; }
.error-flow__stage-index { white-space: normal; }
.error-flow__topline { flex-wrap: wrap; gap: 6px; }
.error-flow__stage-label { overflow-wrap: anywhere; }
.error-flow__diagram { grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr) 18px minmax(0, 1fr); }
.error-flow__stage { min-height: 162px; }
.error-flow__stage--fault { min-height: 188px; }
.error-flow__stage-index, .error-flow__caption, .error-flow__topline { font-size: 14px; letter-spacing: 0; }
.error-flow__stage-label { font-size: 20px; }
.section-heading__aside { min-width: 0; }
.section-link-row { flex-wrap: wrap; }
.breadcrumb { flex-wrap: wrap; }
.will-reveal { opacity: 1; transform: none; }
.project-card, .visual-slot, .factory-photo-placeholder, .project-photo-slot { width: 100%; max-width: 100%; }
.process-tab { white-space: normal; overflow-wrap: anywhere; }
.process-tab > span { min-width: 0; }
.text-link { flex-wrap: wrap; }
.dry-text-link { flex-wrap: wrap; min-width: 0; white-space: normal; }
.dry-process__footer { flex-wrap: wrap; }
body:has(.machine-detail-hero) .site-header,
body:has(.project-detail-hero) .site-header {
  color: var(--color-primary);
  background: #fff;
  border-bottom-color: var(--color-border);
}

.materials-hero__image-note { margin-top: 14px; max-width: 540px; }
.breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 14px; line-height: 1.6; }
.contact-hero__visual { min-height: 340px; padding: 70px 20px 112px; }
.contact-hero__visual-caption { bottom: 78px; left: 18px; right: 18px; flex-wrap: wrap; gap: 8px; letter-spacing: .06em; }
.contact-hero__visual-index { bottom: 18px; }
.resource-pending { font-size: 14px; color: #c0d3e1; }
span.insight-read-link { color: #526b7e; }

@media (max-width: 1120px) and (min-width: 921px) {
  .site-header__inner { gap: 12px; }
  .primary-nav { gap: 13px; }
  .site-header__actions .button--header { padding-inline: 12px; gap: 10px; }
  .site-footer__main { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .site-footer__brand-block { grid-column: 1 / -1; }
}
@media (max-width: 920px) {
  .site-header.is-menu-open { backdrop-filter: none; }
  .primary-nav { height: calc(100dvh - var(--header-height)); }
  .primary-nav__link { font-size: 18px; }
  .site-header__actions { margin-left: auto; }
}
@media (max-width: 680px) {
  .site-footer__main { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 20px; }
  .site-footer__brand-block { grid-column: 1 / -1; }
  .section-heading__aside { grid-template-columns: minmax(0, 1fr); }
  .error-flow__diagram { grid-template-columns: minmax(0, 1fr) 10px minmax(0, 1fr) 10px minmax(0, 1fr); }
  .error-flow__stage { padding-inline: 6px; }
  .error-flow__stage-label { font-size: 18px; }
}

/* Equipment and feedstock pictures convey product detail, so their full frame stays visible. */
:is(
  .machine-category-card__visual,
  .machine-product-card__visual--scene,
  .solution-card__visual,
  .pet-equipment-card__visual,
  .film-equipment-card__visual,
  .rigid-equipment-card__visual,
  .woven-equipment-card__visual,
  .pellet-equipment-card__visual,
  .complete-module-card__visual,
  .pet-conversion-card__visual,
  .film-conversion-card__visual,
  .rigid-conversion-card__visual,
  .woven-conversion-card__visual,
  .pellet-conversion-card__visual,
  .complete-flow-card__visual,
  .material-machine-card__visual,
  .other-material-card__visual,
  .other-material-output-card__visual
) img {
  object-fit: contain;
  background: #e9f1f7;
}

:is(
  .machine-category-card,
  .machine-product-card,
  .solution-card,
  .pet-equipment-card,
  .film-equipment-card,
  .rigid-equipment-card,
  .woven-equipment-card,
  .pellet-equipment-card,
  .complete-module-card,
  .other-material-card,
  .material-card,
  .featured-insight__image
):hover :is(.visual-slot__image, img) {
  transform: none;
}

/* Editorial images used to explain a material or process also keep their full frame. */
.company-overview__visual {
  min-height: 0;
  align-self: center;
  aspect-ratio: 3 / 2;
}
.company-overview__visual img {
  min-height: 0;
  object-fit: contain;
}
.article-cover__panel img,
.featured-insight__image img,
.film-material-output-route__image img,
.solutions-hero ~ section .material-card__visual .visual-slot__image {
  object-fit: contain;
  background: #e9f1f7;
}
.article-inline-figure__visual img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: 4 / 3;
  object-fit: contain;
}
.film-material-output-route__image {
  aspect-ratio: 3 / 2;
}
:is(
  .pet-material-challenges__visual,
  .hdpe-material-challenges__visual,
  .rigid-material-challenges__visual,
  .wbag-material-challenges__visual,
  .other-material-challenges__visual
) {
  min-height: 0;
  align-self: start;
  aspect-ratio: 3 / 2;
}
:is(
  .pet-material-challenges__visual,
  .hdpe-material-challenges__visual,
  .rigid-material-challenges__visual,
  .wbag-material-challenges__visual,
  .other-material-challenges__visual
) > img {
  object-fit: contain;
  background: #e9f1f7;
}

.machine-category-card__index {
  padding: 6px 8px;
  color: #fff;
  background: rgba(6, 43, 72, 0.8);
}

@media (max-width: 620px) {
  .service-photo-placeholder--installation { width: 100%; aspect-ratio: auto; }
  .pet-equipment-card { grid-template-columns: minmax(0, 1fr); }
  .pet-equipment-card__visual { min-height: 0; aspect-ratio: 4 / 3; }
  .pet-equipment-card__body { min-height: 0; }
  .pet-equipment-card__visual .ai-image-label {
    top: 9px;
    right: 9px;
    left: auto;
    max-width: 65%;
  }
}

@media (min-width: 921px) and (max-width: 1180px) { .site-header__actions .button--header { display: none; } }

/* Give the expanded navigation room at intermediate desktop widths. */
@media (min-width: 921px) and (max-width: 1120px) {
  .site-header__actions .button--header { display: none; }
  .site-header__actions { gap: 0; }
}


/* Floating WhatsApp contact button */
.rayli-whatsapp-float {
  position: fixed; z-index: 1001; right: 24px; bottom: 24px;
  display: inline-flex; min-height: 58px; align-items: center; justify-content: center; gap: 10px;
  padding: 0 20px; border: 1px solid rgba(255,255,255,.22); border-radius: 999px;
  background: #20b85a; color: #fff; box-shadow: 0 10px 30px rgba(12,51,31,.28);
  font: 600 16px/1 var(--font-body, inherit); text-decoration: none;
  transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.rayli-whatsapp-float:hover { transform: translateY(-3px); background: #159447; color: #fff; box-shadow: 0 14px 34px rgba(12,51,31,.32); }
.rayli-whatsapp-float:focus-visible { outline: 3px solid #123958; outline-offset: 4px; }
.rayli-whatsapp-float svg { width: 27px; height: 27px; flex: 0 0 27px; fill: currentColor; }
@media (max-width: 600px) {
  .rayli-whatsapp-float { right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); min-height: 54px; padding: 0 17px; font-size: 15px; }
  .rayli-whatsapp-float svg { width: 25px; height: 25px; flex-basis: 25px; }
}
@media (prefers-reduced-motion: reduce) { .rayli-whatsapp-float { transition: none; } }
