/* Homepage logo only: preserve the complete artwork at every screen size. */
body.reference-theme.home-page:before{
  background-image:url('assets/backgrounds/home-ishas-desktop.webp');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-color:#03224b;
}

/* Preserve the complete emblem on unusually wide or narrow screens. */
@media(min-width:761px) and (min-aspect-ratio:2/1){
  body.reference-theme.home-page:before{
    background-image:linear-gradient(90deg,#03224b 12%,transparent 24%,transparent 76%,#03224b 88%),url('assets/backgrounds/home-ishas-desktop.webp');
    background-size:100% 100%,auto 100%;
  }
}

/* Keep the service heading distinct from the bright background lettering. */
.reference-theme.home-page .services>h2{
  display:table;
  max-width:100%;
  margin:0 auto;
  padding:12px 24px;
  border:1px solid #8de0c44d;
  border-radius:14px;
  background:#0b2839f2;
  color:#8de0c4!important;
  text-shadow:none;
  box-shadow:0 8px 24px #0b28394d;
}
@media(max-width:760px){
  .reference-theme.home-page .services>h2{padding:10px 14px;border-radius:12px}
}

/* Purpose-composed portrait background; never stretch the desktop logo. */
@media(max-width:760px){
  body.reference-theme.home-page:before{
    background-image:url('assets/backgrounds/home-ishas-mobile.webp');
    background-size:cover;
    background-position:center;
  }
}
@media(max-width:360px) and (max-aspect-ratio:2/5){
  body.reference-theme.home-page:before{
    background-image:linear-gradient(#03224b 10%,transparent 20%,transparent 80%,#03224b 90%),url('assets/backgrounds/home-ishas-mobile.webp');
    background-size:100% 100%,100% auto;
  }
}

/* Small foreground brand beside the company name, scoped to the homepage. */
.reference-theme.home-page .name.home-brand{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
}
.home-page .home-brand-logo{
  width:84px;
  height:84px;
  flex:none;
  object-fit:contain;
}
.home-page .home-brand-title{
  display:inline-flex;
  align-items:baseline;
  gap:.23em;
  white-space:nowrap;
}
.home-page .home-brand-word{display:inline-flex;align-items:baseline}
.home-page .home-brand-a{
  width:1.07em;
  height:1em;
  object-fit:contain;
  align-self:center;
  margin-left:-.02em;
}
@media(max-width:760px){
  .reference-theme.home-page .name.home-brand{gap:8px;font-size:clamp(19px,6.7vw,30px)}
  .home-page .home-brand-logo{width:clamp(36px,12vw,52px);height:clamp(36px,12vw,52px)}
}