/* A blue introduction, using the blue and red of the company identity. */
body .hero.signature-hero {
  margin: 24px 3% 0;
  grid-template-columns: 1.08fr 1fr;
  min-height: 0;
  background: #296e97;
  color: #f8fafc;
  border: 1px solid #4386ad;
  border-radius: 20px;
  box-shadow: 0 16px 40px #112b4012;
  isolation: isolate;
}
body .signature-hero .copy {
  background: transparent;
  padding: 64px 8% 62px 9%;
  z-index: 2;
}
body .signature-hero .copy .eyebrow {
  color: #d4ecfa;
  font-size: 10px;
  line-height: 1.8;
  letter-spacing: 1.8px;
}
body .signature-hero .copy .eyebrow:before {
  background: #f15b54;
  width: 24px;
}
body .signature-hero .copy h1 {
  font-size: clamp(37px, 4.3vw, 64px);
  line-height: 1.12;
  letter-spacing: -2px;
  font-weight: 500;
  color: #fff;
  margin: 25px 0 22px;
}
body .signature-hero .copy h1 span { color: #d5efff; }
body .signature-hero .copy p {
  color: #e0edf5;
  font-size: 15px;
  line-height: 1.85;
  max-width: 370px;
}
body .signature-hero .copy .btn {
  background: #f5f9fc;
  color: #123249;
  border: 1px solid #f5f9fc;
  border-radius: 7px;
  box-shadow: none;
  padding: 16px 21px;
  margin-top: 20px;
}
body .signature-hero .copy .btn:hover { background: #d8edf9; border-color: #d8edf9; }
.signature-hero .heritage-link {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  color: #e2ecf3;
  font-size: 13px;
  margin-inline-start: 23px;
  padding: 16px 0;
}
.signature-hero .heritage-link span { color: #c6e8fc; }
.signature-hero .heritage-link:hover { color: #fff; }
.signature-hero a:focus-visible { outline: 2px solid #91d2f5; outline-offset: 5px; }
body .signature-hero .scene {
  min-height: 475px;
  background: radial-gradient(ellipse at 75% 30%, #69accf 0, #3981ac 45%, #296e97 78%);
  overflow: hidden;
}
body .signature-hero .scene:before {
  inset: 45px 8% 55px 8%;
  width: auto;
  height: auto;
  border-radius: 190px 190px 12px 12px;
  border: 0;
  background: linear-gradient(150deg, #def1fdd9, #a4cee36b 64%, #7aabc41a);
}
body .signature-hero .scene:after { content: none; }
body .signature-hero .appliance-stage { height: 410px; }
body .signature-hero .stage-item { filter: drop-shadow(0 16px 11px #020b1444); }
body .signature-hero .stage-item img { mix-blend-mode: normal; }
body .signature-hero .appliance-stage:after { background: #030e1a55; }
body .signature-hero .scene-caption { color: #e0eef6; bottom: 22px; right: 9%; font-size: 9px; }
.heritage-facts {
  position: relative;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  padding: 30px 4.6% 32px;
  background: #245f83;
  border-top: 1px solid #799fb62b;
}
.heritage-facts:before {
  content: '';
  position: absolute;
  height: 3px;
  width: 44px;
  top: -2px;
  inset-inline-start: 4.6%;
  background: #ed504b;
}
.heritage-fact { display: flex; flex-direction: column; padding-inline: 23px; min-width: 0; }
.heritage-fact:first-child { padding-inline-start: 0; }
.heritage-fact + .heritage-fact { border-inline-start: 1px solid #799fb62b; }
.heritage-fact dt { color: #eff6fa; font-size: 13px; line-height: 1.5; margin-top: 9px; }
.heritage-fact dd { margin: 0; }
.heritage-fact .fact-value { order: -1; color: #d3edff; font-size: 43px; font-weight: 500; letter-spacing: -1.5px; line-height: 1; text-align: start; width: fit-content; }
.fact-value span { font-size: .65em; vertical-align: 12%; margin-left: 2px; font-weight: 400; }
.fact-value .fact-range { margin-inline: 3px; vertical-align: 9%; }
.heritage-fact .fact-detail { color: #cfdfeb; font-size: 10px; line-height: 1.7; margin-top: 5px; }
html[lang="ar"] body .signature-hero .copy { padding: 58px 9% 54px 8%; }
html[lang="ar"] body .signature-hero .copy .eyebrow { font-size: 13px; letter-spacing: 0; }
html[lang="ar"] body .signature-hero .copy h1 { font-size: 40px; line-height: 1.5; font-weight: 500; letter-spacing: 0; }
html[lang="ar"] body .signature-hero .copy p { font-size: 17px; color: #e0edf5; line-height: 1.9; }
html[lang="ar"] .signature-hero .heritage-link { font-size: 15px; }
html[lang="ar"] .heritage-fact dt { font-size: 16px; }
html[lang="ar"] .heritage-fact .fact-detail { font-size: 12px; }
html[lang="ar"] .heritage-fact .fact-value { font-family: Arial, sans-serif; }
@media (min-width: 1200px) {
  body .signature-hero .scene { min-height: 520px; }
  body .signature-hero .appliance-stage { height: 450px; }
  body .signature-hero .stage-item.fridge { height: 380px; }
  body .signature-hero .stage-item.washer { height: 225px; }
  body .signature-hero .stage-item.airfryer { height: 135px; }
  .heritage-fact .fact-value { font-size: 48px; }
}
@media (max-width: 1000px) {
  body .signature-hero .copy { padding-inline: 7%; }
  .signature-hero .heritage-link { margin-inline-start: 15px; }
  .heritage-fact { padding-inline: 17px; }
}
@media (max-width: 720px) {
  body .hero.signature-hero { grid-template-columns: 1fr; margin-top: 18px; border-radius: 16px; }
  body .signature-hero .copy, html[lang="ar"] body .signature-hero .copy { padding: 36px 7% 18px; }
  body .signature-hero .copy h1 { font-size: clamp(35px, 6.5vw, 46px); max-width: none; letter-spacing: -1.3px; margin-block: 20px 16px; }
  body .signature-hero .copy p { max-width: 440px; font-size: 14px; }
  body .signature-hero .scene { min-height: 330px; height: 330px; background: radial-gradient(ellipse at 55% 50%, #69accf 0, #3981ac 45%, #296e97 78%); }
  body .signature-hero .scene:before { inset: 15px 16% 45px; }
  body .signature-hero .appliance-stage { width: 90%; max-width: 490px; height: 310px; }
  body .signature-hero .stage-item.fridge { height: 260px; width: 43%; left: 12%; }
  body .signature-hero .stage-item.washer { height: 160px; width: 38%; right: 7%; }
  body .signature-hero .stage-item.airfryer { height: 100px; width: 24%; left: 46%; bottom: 26px; }
  body .signature-hero .stage-item { bottom: 30px; }
  body .signature-hero .scene-caption { bottom: 15px; right: 9%; }
  .heritage-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 25px 7%; row-gap: 25px; }
  .heritage-facts:before { inset-inline-start: 7%; }
  .heritage-fact { padding-inline: 18px 0; }
  .heritage-fact:nth-child(odd) { border-inline-start: 0; padding-inline-start: 0; }
  .heritage-fact .fact-value { font-size: 37px; }
  .heritage-fact dt { font-size: 12px; margin-top: 7px; }
  .heritage-fact .fact-detail { font-size: 10px; }
  html[lang="ar"] body .signature-hero .copy h1 { font-size: 32px; }
  html[lang="ar"] .heritage-fact dt { font-size: 15px; }
  html[lang="ar"] .heritage-fact .fact-detail { font-size: 11px; }
}
