
@font-face {
  font-family: "SkyInk Lemon Milk Medium";
  src: url("https://skyinkcreations.com.au/wp-content/uploads/2026/09/LEMONMILK-Medium-1.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}


/*
 * SkyInk Hero Carousel v1.3.0
 * Front-end CSS is intentionally isolated under .sicx-hero-root.
 * No generic h1/p/a/button selectors are emitted outside the component.
 */

.sicx-hero-root {
  --sicx-desktop-vh: var(--sh-desktop-vh, 92vh);
  --sicx-mobile-vh: var(--sh-mobile-vh, 78vh);
  --sicx-desktop-overlay: var(--sh-desktop-overlay, .42);
  --sicx-mobile-overlay: var(--sh-mobile-overlay, .52);
  --sicx-transition: var(--sh-transition, 900ms);
  --sicx-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --sicx-display-font: "SkyInk Lemon Milk Medium", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-height: var(--sicx-desktop-vh) !important;
  height: var(--sicx-desktop-vh) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #05070a !important;
  color: #fff !important;
  isolation: isolate !important;
  box-sizing: border-box !important;
  font-family: var(--sicx-font) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.sicx-hero-root,
.sicx-hero-root *,
.sicx-hero-root *::before,
.sicx-hero-root *::after {
  box-sizing: border-box !important;
}

.sicx-hero-root .sicx-hero-slides,
.sicx-hero-root .sicx-hero-slide,
.sicx-hero-root .sicx-hero-overlay {
  position: absolute !important;
  inset: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.sicx-hero-root .sicx-hero-slides {
  z-index: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

.sicx-hero-root .sicx-hero-slide {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0 !important;
  transition: opacity var(--sicx-transition) ease !important;
  pointer-events: none !important;
}

.sicx-hero-root .sicx-hero-slide.is-active {
  opacity: 1 !important;
}

.sicx-hero-root .sicx-hero-slide img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
  box-shadow: none !important;
}

.sicx-hero-root .sicx-hero-overlay {
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(
      90deg,
      rgba(0,0,0,var(--sicx-desktop-overlay)) 0%,
      rgba(0,0,0,calc(var(--sicx-desktop-overlay) * .78)) 43%,
      rgba(0,0,0,calc(var(--sicx-desktop-overlay) * .46)) 100%
    ) !important;
}

.sicx-hero-root .sicx-hero-inner {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: min(1600px, 100%) !important;
  max-width: 1600px !important;
  height: 100% !important;
  min-height: inherit !important;
  margin: 0 auto !important;
  padding: clamp(120px, 12vh, 180px) clamp(28px, 7vw, 120px) clamp(46px, 6vh, 80px) !important;
}

.sicx-hero-root .sicx-hero-content {
  display: block !important;
  width: min(850px, 72vw) !important;
  max-width: 850px !important;
  margin: 0 auto 0 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

.sicx-hero-root .sicx-hero-eyebrow {
  display: block !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  border: 0 !important;
  color: rgba(255,255,255,.82) !important;
  background: transparent !important;
  font-family: var(--sicx-font) !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}

.sicx-hero-root .sicx-hero-content > h1 {
  display: block !important;
  width: auto !important;
  max-width: 980px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: #fff !important;
  background: transparent !important;
  font-family: var(--sicx-display-font) !important;
  font-size: clamp(43px, 4.6vw, 78px) !important;
  line-height: 1.01 !important;
  font-style: normal !important;
  font-weight: 500 !important;
  letter-spacing: -.018em !important;
  text-align: left !important;
  text-transform: none !important;
  text-decoration: none !important;
}

.sicx-hero-root .sicx-hero-content > p {
  display: block !important;
  width: auto !important;
  max-width: 650px !important;
  margin: 28px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: rgba(255,255,255,.82) !important;
  background: transparent !important;
  font-family: var(--sicx-font) !important;
  font-size: clamp(16px, 1.2vw, 20px) !important;
  line-height: 1.55 !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-transform: none !important;
}

.sicx-hero-root .sicx-hero-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  margin: 34px 0 0 !important;
  padding: 0 !important;
}

.sicx-hero-root .sicx-hero-btn {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 54px !important;
  margin: 0 !important;
  padding: 0 22px !important;
  border: 1px solid rgba(255,255,255,.26) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  background-image: none !important;
  font-family: var(--sicx-font) !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  letter-spacing: .025em !important;
  text-align: center !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: background .25s ease, color .25s ease, border-color .25s ease !important;
}

.sicx-hero-root .sicx-hero-btn svg,
.sicx-hero-root .sicx-hero-arrow svg {
  display: block !important;
  width: 17px !important;
  height: 17px !important;
  margin: 0 !important;
  padding: 0 !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sicx-hero-root .sicx-hero-btn-primary {
  background: #fff !important;
  color: #05070a !important;
  border-color: #fff !important;
}

.sicx-hero-root .sicx-hero-btn-primary:hover,
.sicx-hero-root .sicx-hero-btn-primary:focus {
  background: #05070a !important;
  color: #fff !important;
  border-color: #05070a !important;
}

.sicx-hero-root .sicx-hero-btn-ghost {
  background: rgba(0,0,0,.16) !important;
  color: #fff !important;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.sicx-hero-root .sicx-hero-btn-ghost:hover,
.sicx-hero-root .sicx-hero-btn-ghost:focus {
  background: #fff !important;
  color: #05070a !important;
  border-color: #fff !important;
}

.sicx-hero-root .sicx-hero-nav {
  position: absolute !important;
  left: clamp(28px, 7vw, 120px) !important;
  bottom: clamp(24px, 4vh, 46px) !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.sicx-hero-root .sicx-hero-arrow {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: grid !important;
  place-items: center !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.44) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: rgba(0,0,0,.22) !important;
  color: #fff !important;
  cursor: pointer !important;
}

.sicx-hero-root .sicx-hero-arrow:hover,
.sicx-hero-root .sicx-hero-arrow:focus {
  background: #fff !important;
  color: #05070a !important;
}

.sicx-hero-root .sicx-hero-counter {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-width: 112px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  font-family: var(--sicx-font) !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
}

.sicx-hero-root .sicx-hero-line {
  display: block !important;
  width: 42px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: rgba(255,255,255,.6) !important;
}

@media (max-width: 767px) {
  .sicx-hero-root {
    min-height: var(--sicx-mobile-vh) !important;
    height: var(--sicx-mobile-vh) !important;
  }

  .sicx-hero-root .sicx-hero-overlay {
    background:
      linear-gradient(
        180deg,
        rgba(0,0,0,calc(var(--sicx-mobile-overlay) * .42)) 0%,
        rgba(0,0,0,calc(var(--sicx-mobile-overlay) * .72)) 48%,
        rgba(0,0,0,var(--sicx-mobile-overlay)) 100%
      ) !important;
  }

  .sicx-hero-root .sicx-hero-inner {
    padding: 112px 22px 40px !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .sicx-hero-root .sicx-hero-content {
    width: 100% !important;
    max-width: 680px !important;
    margin: 0 auto !important;
    text-align: center !important;
  }

  .sicx-hero-root .sicx-hero-eyebrow {
    margin: 0 0 14px !important;
    font-size: 10px !important;
    text-align: center !important;
  }

  .sicx-hero-root .sicx-hero-content > h1 {
    max-width: 100% !important;
    margin: 0 auto !important;
    font-size: clamp(33px, 9.2vw, 51px) !important;
    line-height: .98 !important;
    letter-spacing: -.04em !important;
    text-align: center !important;
  }

  .sicx-hero-root .sicx-hero-content > p {
    margin: 20px auto 0 !important;
    max-width: 540px !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    text-align: center !important;
  }

  .sicx-hero-root .sicx-hero-actions {
    justify-content: center !important;
    margin-top: 26px !important;
  }

  .sicx-hero-root .sicx-hero-btn {
    min-height: 50px !important;
    padding: 0 18px !important;
  }

  .sicx-hero-root .sicx-hero-nav {
    left: 50% !important;
    bottom: 20px !important;
    transform: translateX(-50%) !important;
  }

  .sicx-hero-root .sicx-hero-arrow {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sicx-hero-root .sicx-hero-slide {
    transition: none !important;
  }
}
