/* Wix reserves space at the top for its "Built on Wix" banner; the banner is gone, so drop the gap. */
:root, body { --wix-ads-height: 0px !important; }

/* Home hero: Wix puts the title ("Making your brand the main character") and the subtitle ("Hi, I'm Olivia…")
   in one grid cell and pushes the subtitle down a fixed distance. Whenever the title wraps to an extra line
   (narrow window, browser zoom, larger text settings) the two collide. Give the subtitle its own row under
   the title at every width, so it always follows the title however many lines it takes.
   These ids come from the Wix editor; if the hero is rebuilt there, update them. */
#comp-kbgaghri { grid-template-rows: auto auto !important; }
/* The decorative star shares the title's cell; let it span both rows so its height doesn't push the subtitle down. */
#comp-mu234rjh { grid-area: 1 / 1 / 3 / 2 !important; }
#comp-mu2361uf {
  grid-area: 2 / 1 / 3 / 2 !important;
  margin-top: clamp(10px, 2.2vw, 44px) !important; /* about the gap the Wix layout shows on desktop */
}
/* Phones: the title is left-aligned there, so line the subtitle up under it. */
@media screen and (max-width: 750px) {
  #comp-mu2361uf {
    justify-self: start !important;
    margin: 10px 0 0 !important;
    width: auto !important;
    max-width: 100%;
  }
  #comp-mu2361uf p { text-align: left !important; }
}

/* The home hero title ("Making your brand the main character") uses Lulo Clean at every width now
   that mobile no longer swaps in Mansalva. Lulo Clean is a wide display face, and the hero's grid
   cell is narrow on phones (~210px), so the desktop size (45px) breaks mid-word. Shrink it to a
   size at which the longest line ("CHARACTER") still fits the cell. */
@media screen and (max-width: 750px) {
  #comp-ly4kq2hc h1 { font-size: 20px !important; line-height: 1.1 !important; }
  /* Same situation on the accessibility page: Wix was swapping in Madefor Display on mobile; now
     that it also uses Lulo Clean, "ACCESSIBILITY STATEMENT" won't fit at the Wix default size.
     16px fits the whole title on a single line in the 354px cell; the explicit overflow-wrap
     keeps the browser from breaking mid-word if a future title is slightly over. */
  #comp-ly7h0hya6 h1 {
    font-size: 16px !important;
    line-height: 1.2 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }
}
