/* =========================================================
   For companies (partners.html) — group E
   Hero, four "who it's for" cards with the co-branded .promo-band, one short enquiry form.
   Logical properties only, so the Arabic layout mirrors without overrides.
   ========================================================= */

/* ---------- hero (the shared .hero-grid / .hero-media contract) ---------- */
.biz-hero-copy .label { margin-block-end: 1rem; }
.biz-hero-actions { margin-block-start: 2rem; }
.biz-hero-photo > img { object-position: 50% 36%; }
/* desktop: the frame is about square, so show the canopy and keep the tag in the middle band */
@media (min-width: 961px) {
  .biz-hero-photo > img { object-position: 50% 8%; }
}
@media (max-width: 520px) {
  .biz-hero-actions .btn { flex: 1 1 100%; }
}

/* ---------- who it's for: four short cards ---------- */
.biz-audience { align-items: stretch; }
.aud { display: flex; flex-direction: column; gap: .75rem; }
.aud-title { font-weight: 800; font-size: 1.25rem; line-height: 1.25; color: var(--athar-green); margin-block-start: .4rem; }
html[lang="ar"] .aud-title { font-family: var(--font-arabic-display); font-weight: 700; }
.aud-text { color: var(--muted); }
html[lang="ar"] .aud-text { font-size: 1.0625rem; line-height: 1.8; color: rgba(28, 28, 24, .74); }

/* phones: the four cards stack as compact rows (icon beside the words), so nothing hides off-screen */
@media (max-width: 620px) {
  .biz-audience { grid-template-columns: 1fr; gap: .75rem; }
  .aud { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 1rem; row-gap: .15rem; align-items: start; padding: 1.1rem 1.25rem; }
  .aud .disc { grid-row: span 2; }
  .aud-title { margin-block-start: .15rem; }
}

/* ---------- co-branded band (shared .promo-band) ----------
   The product photo is shot on brand cream; multiplied over this tint it lands exactly on the
   band's dune colour, so the box sits on the band with no seam, and "contain" never crops it. */
.biz-who .biz-cobrand { margin-block-start: clamp(3rem, 6vw, 5rem); }
.biz-cobrand > .photo { background: #F2EEE2; isolation: isolate; }
.biz-cobrand > .photo > img { object-fit: contain; mix-blend-mode: multiply; padding: clamp(1rem, 3vw, 2.5rem); }
@media (max-width: 960px) {
  .biz-cobrand > .photo { aspect-ratio: 4 / 3; }
  .biz-cobrand > .photo > img { padding: 1rem 1rem 0; }
}

/* ---------- enquiry ---------- */
.biz-enquire .split { align-items: start; }
.biz-enquire-copy .label { margin-block-end: 1rem; }
.biz-promise { margin-block-start: 2rem; padding-block-start: 1.25rem; border-block-start: 1px solid var(--line); }

.biz-form { display: grid; gap: 1.5rem; }
.biz-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem 1rem; }
.biz-form-grid .span-2 { grid-column: 1 / -1; }
.biz-form .optional { font-weight: 400; color: var(--muted); font-size: .875rem; }
.biz-form .req { color: var(--athar-green); font-weight: 800; }
html[dir="rtl"] .ltr-field { text-align: end; }
.biz-form-foot { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; }
.biz-done { display: grid; gap: 1rem; justify-items: start; }
.biz-done a.ltr { color: var(--athar-green); font-weight: 700; }
.biz-done:focus { outline: none; }
.biz-form[hidden], .biz-done[hidden] { display: none; }
@media (max-width: 560px) {
  .biz-form-grid { grid-template-columns: 1fr; }
  .biz-form-foot .btn { width: 100%; }
}