/* ==========================================================================
IMPORTS
========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.0/css/all.min.css');
@import url("https://cdn.jsdelivr.net/npm/bulma@1.0.4/css/versions/bulma-no-dark-mode.min.css");
@import url('https://cdn.jsdelivr.net/npm/bulma-carousel@4.0.3/dist/css/bulma-carousel.min.css');
@import url('https://cdn.jsdelivr.net/gh/MathiasOxholm/humbleScroll@latest/cdn/css/humbleScroll.min.css');

/* ==========================================================================
  CSS VARIABLES
  ========================================================================== */

:root {
  --bulma-family-primary: 'Figtree', sans-serif;
  --bulma-navbar-height: 6rem;
  --bulma-link-h: 205;
  --bulma-link-s: 100%;
  --bulma-link-l: 39%;
}

/* ==========================================================================
  NAVIGATION
  ========================================================================== */

html {
  scroll-padding-top: calc(var(--bulma-navbar-height) + 6rem);
}

.navbar {
  --bulma-navbar-item-img-max-height: 3rem;
  z-index: 20;
  transition: background-color 0.3s ease;
  background-color: rgba(255, 255, 255, 0.8);
}

.navbar-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--bulma-navbar-height);
  z-index: 9;
  border-bottom: solid 1px #547998;
  background: white url('../images/flowercorner.svg') top right no-repeat;
}

/* ==========================================================================
  HERO SECTION
  ========================================================================== */

#main-hero {
  background: #0074c7 url('../images/flowerbg.svg') center center / cover no-repeat;
  margin-top: calc(var(--bulma-navbar-height) * -1);
  position: relative;
  z-index: 10;
}

#main-hero > .hero-body {
  margin-top: var(--bulma-navbar-height);
  text-shadow: #484848 1px 0 10px;
  background: linear-gradient(
    to bottom, 
    rgba(0, 0, 0, 0) 0%, 
    rgba(0, 0, 0, 0.5) 100%
  );
}

#main-hero > .hero-body > .button {
  text-shadow: none;
}

#main-hero.is-medium > .hero-body {
  padding: 18rem 4.5rem 0;
}

@media screen and (max-width: 768px) {
  #main-hero.is-medium > .hero-body {
    padding: 6rem 1.5rem 0;
  }
}

/* ==========================================================================
  COLOR THEMES
  ========================================================================== */

/* Original colours */
.has-background-blue { background-color: #1B2C5E; }
.has-background-sky { background-color: #0074c7; }
.has-background-purple { background-color: #70198e; }
.has-background-red { background-color: #b42025; }
.has-background-teal { background-color: #24b7ae; }
.has-background-slate { background-color: #557E9D; }
.has-background-azure { background-color: #4DA0D8; }
.has-background-violet { background-color: #9B4DBC; }
.has-background-coral { background-color: #CB595F; }
.has-background-mint { background-color: #4DC9AE; }

/* Light variants (90%+ lightened, maintaining contrast) */
.has-background-blue-light { background-color: #E8EDF7; }
.has-background-sky-light { background-color: #E6F3FC; }
.has-background-purple-light { background-color: #F3E9F7; }
.has-background-red-light { background-color: #F9EBEC; }
.has-background-teal-light { background-color: #E8F8F7; }
.has-background-slate-light { background-color: #EFF3F6; }
.has-background-azure-light { background-color: #EDF7FC; }
.has-background-violet-light { background-color: #F5EEFA; }
.has-background-coral-light { background-color: #FAF0F1; }
.has-background-mint-light { background-color: #EDF9F7; }

/* Text colour rules */
.has-text-blue { color: #1B2C5E !important; }
.has-text-sky { color: #0074c7 !important; }
.has-text-purple { color: #70198e !important; }
.has-text-red { color: #b42025 !important; }
.has-text-teal { color: #24b7ae !important; }
.has-text-slate { color: #557E9D !important; }
.has-text-azure { color: #4DA0D8 !important; }
.has-text-violet { color: #9B4DBC !important; }
.has-text-coral { color: #CB595F !important; }
.has-text-mint { color: #4DC9AE !important; }

/* Complementary colours */
.has-background-amber { background-color: #D97706; }
.has-background-emerald { background-color: #059669; }
.has-background-indigo { background-color: #4338CA; }
.has-background-rose { background-color: #E11D48; }
.has-background-lime { background-color: #65A30D; }

/* Light variants */
.has-background-amber-light { background-color: #FEF3E2; }
.has-background-emerald-light { background-color: #ECFDF5; }
.has-background-indigo-light { background-color: #EEF2FF; }
.has-background-rose-light { background-color: #FFF1F2; }
.has-background-lime-light { background-color: #F7FEE7; }

/* Text colour rules */
.has-text-amber { color: #D97706 !important; }
.has-text-emerald { color: #059669 !important; }
.has-text-indigo { color: #4338CA !important; }
.has-text-rose { color: #E11D48 !important; }
.has-text-lime { color: #65A30D !important; }

/* Light flower background */
.has-background-flower-light {
  background: #f3f4f6 url('../images/flowerbg-light.svg') center center / cover no-repeat;
}

/* ==========================================================================
  THEME COMPONENTS
  ========================================================================== */

/* Cards */
.theme-card {
  padding: 1.5rem;
  border-radius: 6px;
  color: #363636;
}

/* Icons */
.theme-icon {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
  flex-shrink: 0;
}
.theme-icon i {
  font-size: 1.5rem;
  color: white;
}
.theme-icon img {
  height: 1.5rem;
}

.theme-icon.is-128x128 {
  width: 128px;
  height: 128px;
}
.theme-icon.is-128x128 i {
  font-size: 3.75rem;
}
.theme-icon.is-128x128 img {
  height: 3.75rem;
}

.theme-icon.is-small {
  width: 2em;
  height: 2em;
}
.theme-icon.is-small i {
  font-size: 1rem;
}
.theme-icon.is-small img {
  height: 1rem;
}

.theme-icon img.is-rounded {
  bottom: 0;
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  object-fit: cover;
}

/* Underlines */
.theme-underline {
  width: 6rem;
  height: 4px;
  background-color: #24b7ae;
  margin: 0;
}

/* ==========================================================================
  LAYOUT & ALIGNMENT
  ========================================================================== */

/* Center alignment */
.has-text-centered .theme-underline,
.has-text-centered figure.image,
.has-text-centered .theme-icon {
  margin: 0 auto;
}

/* Mobile center alignment */
@media (max-width: 768px) {
  .has-text-centered-mobile .theme-underline,
  .has-text-centered-mobile figure.image,
  .has-text-centered-mobile .theme-icon {
    margin: 0 auto;
  }
}

/* ==========================================================================
  CONTENT SECTIONS
  ========================================================================== */

.content > section.section {
  position: relative;
  left: 50%;
  right: 50%;
  margin: 6rem -50vw;
  width: 100vw;
  max-width: 100vw;
}

/* ==========================================================================
  CARDS & TAGS
  ========================================================================== */

.card-content .tag {
  font-size: 0.8rem;
}

/* ==========================================================================
  CAROUSEL
  ========================================================================== */

.carousel-container {
  overflow: hidden;
}

.carousel-container .slider-container {
  height: 8rem;
}

.carousel-container figure {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 50px;
}

.carousel-container figure img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* ==========================================================================
  TEXT UTILITIES
  ========================================================================== */

/* Comma-separated lists */
.comma-list span {
  display: inline;
}

.comma-list span::after {
  content: ", ";
}

.comma-list span:last-of-type::after {
  content: "";
}

.comma-list span:nth-last-of-type(2)::after {
  content: " and ";
}

/* Edge case: only one span — no comma or 'and' */
.comma-list:has(span:first-of-type:last-of-type) span::after {
  content: "";
}

/* ==========================================================================
  ANIMATION DELAYS (HumbleScroll)
  ========================================================================== */

/* Generic (no breakpoint class) */
.fixed-grid.has-1-cols .cell:nth-child(1n) { --hs-delay: 0ms; }

.fixed-grid.has-2-cols .cell:nth-child(2n+1) { --hs-delay: 0ms; }
.fixed-grid.has-2-cols .cell:nth-child(2n+2) { --hs-delay: 100ms; }

.fixed-grid.has-3-cols .cell:nth-child(3n+1) { --hs-delay: 0ms; }
.fixed-grid.has-3-cols .cell:nth-child(3n+2) { --hs-delay: 100ms; }
.fixed-grid.has-3-cols .cell:nth-child(3n+3) { --hs-delay: 200ms; }

.fixed-grid.has-4-cols .cell:nth-child(4n+1) { --hs-delay: 0ms; }
.fixed-grid.has-4-cols .cell:nth-child(4n+2) { --hs-delay: 100ms; }
.fixed-grid.has-4-cols .cell:nth-child(4n+3) { --hs-delay: 200ms; }
.fixed-grid.has-4-cols .cell:nth-child(4n+4) { --hs-delay: 300ms; }

.fixed-grid.has-5-cols .cell:nth-child(5n+1) { --hs-delay: 0ms; }
.fixed-grid.has-5-cols .cell:nth-child(5n+2) { --hs-delay: 100ms; }
.fixed-grid.has-5-cols .cell:nth-child(5n+3) { --hs-delay: 200ms; }
.fixed-grid.has-5-cols .cell:nth-child(5n+4) { --hs-delay: 300ms; }
.fixed-grid.has-5-cols .cell:nth-child(5n+5) { --hs-delay: 400ms; }

/* Mobile (≤768px) */
@container bulma-fixed-grid (max-width: 768px) {
  .fixed-grid.has-1-cols-mobile .cell:nth-child(1n) { --hs-delay: 0ms; }

  .fixed-grid.has-2-cols-mobile .cell:nth-child(2n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-2-cols-mobile .cell:nth-child(2n+2) { --hs-delay: 100ms; }

  .fixed-grid.has-3-cols-mobile .cell:nth-child(3n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-3-cols-mobile .cell:nth-child(3n+2) { --hs-delay: 100ms; }
  .fixed-grid.has-3-cols-mobile .cell:nth-child(3n+3) { --hs-delay: 200ms; }

  .fixed-grid.has-4-cols-mobile .cell:nth-child(4n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-4-cols-mobile .cell:nth-child(4n+2) { --hs-delay: 100ms; }
  .fixed-grid.has-4-cols-mobile .cell:nth-child(4n+3) { --hs-delay: 200ms; }
  .fixed-grid.has-4-cols-mobile .cell:nth-child(4n+4) { --hs-delay: 300ms; }

  .fixed-grid.has-5-cols-mobile .cell:nth-child(5n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-5-cols-mobile .cell:nth-child(5n+2) { --hs-delay: 100ms; }
  .fixed-grid.has-5-cols-mobile .cell:nth-child(5n+3) { --hs-delay: 200ms; }
  .fixed-grid.has-5-cols-mobile .cell:nth-child(5n+4) { --hs-delay: 300ms; }
  .fixed-grid.has-5-cols-mobile .cell:nth-child(5n+5) { --hs-delay: 400ms; }
}

/* Tablet (≥769px) */
@container bulma-fixed-grid (min-width: 769px) {
  .fixed-grid.has-1-cols-tablet .cell:nth-child(1n) { --hs-delay: 0ms; }

  .fixed-grid.has-2-cols-tablet .cell:nth-child(2n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-2-cols-tablet .cell:nth-child(2n+2) { --hs-delay: 100ms; }

  .fixed-grid.has-3-cols-tablet .cell:nth-child(3n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-3-cols-tablet .cell:nth-child(3n+2) { --hs-delay: 100ms; }
  .fixed-grid.has-3-cols-tablet .cell:nth-child(3n+3) { --hs-delay: 200ms; }

  .fixed-grid.has-4-cols-tablet .cell:nth-child(4n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-4-cols-tablet .cell:nth-child(4n+2) { --hs-delay: 100ms; }
  .fixed-grid.has-4-cols-tablet .cell:nth-child(4n+3) { --hs-delay: 200ms; }
  .fixed-grid.has-4-cols-tablet .cell:nth-child(4n+4) { --hs-delay: 300ms; }

  .fixed-grid.has-5-cols-tablet .cell:nth-child(5n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-5-cols-tablet .cell:nth-child(5n+2) { --hs-delay: 100ms; }
  .fixed-grid.has-5-cols-tablet .cell:nth-child(5n+3) { --hs-delay: 200ms; }
  .fixed-grid.has-5-cols-tablet .cell:nth-child(5n+4) { --hs-delay: 300ms; }
  .fixed-grid.has-5-cols-tablet .cell:nth-child(5n+5) { --hs-delay: 400ms; }
}

/* Desktop (≥1024px) */
@container bulma-fixed-grid (min-width: 1024px) {
  .fixed-grid.has-1-cols-desktop .cell:nth-child(1n) { --hs-delay: 0ms; }

  .fixed-grid.has-2-cols-desktop .cell:nth-child(2n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-2-cols-desktop .cell:nth-child(2n+2) { --hs-delay: 100ms; }

  .fixed-grid.has-3-cols-desktop .cell:nth-child(3n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-3-cols-desktop .cell:nth-child(3n+2) { --hs-delay: 100ms; }
  .fixed-grid.has-3-cols-desktop .cell:nth-child(3n+3) { --hs-delay: 200ms; }

  .fixed-grid.has-4-cols-desktop .cell:nth-child(4n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-4-cols-desktop .cell:nth-child(4n+2) { --hs-delay: 100ms; }
  .fixed-grid.has-4-cols-desktop .cell:nth-child(4n+3) { --hs-delay: 200ms; }
  .fixed-grid.has-4-cols-desktop .cell:nth-child(4n+4) { --hs-delay: 300ms; }

  .fixed-grid.has-5-cols-desktop .cell:nth-child(5n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-5-cols-desktop .cell:nth-child(5n+2) { --hs-delay: 100ms; }
  .fixed-grid.has-5-cols-desktop .cell:nth-child(5n+3) { --hs-delay: 200ms; }
  .fixed-grid.has-5-cols-desktop .cell:nth-child(5n+4) { --hs-delay: 300ms; }
  .fixed-grid.has-5-cols-desktop .cell:nth-child(5n+5) { --hs-delay: 400ms; }
}

/* Widescreen (≥1216px) */
@container bulma-fixed-grid (min-width: 1216px) {
  .fixed-grid.has-1-cols-widescreen .cell:nth-child(1n) { --hs-delay: 0ms; }

  .fixed-grid.has-2-cols-widescreen .cell:nth-child(2n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-2-cols-widescreen .cell:nth-child(2n+2) { --hs-delay: 100ms; }

  .fixed-grid.has-3-cols-widescreen .cell:nth-child(3n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-3-cols-widescreen .cell:nth-child(3n+2) { --hs-delay: 100ms; }
  .fixed-grid.has-3-cols-widescreen .cell:nth-child(3n+3) { --hs-delay: 200ms; }

  .fixed-grid.has-4-cols-widescreen .cell:nth-child(4n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-4-cols-widescreen .cell:nth-child(4n+2) { --hs-delay: 100ms; }
  .fixed-grid.has-4-cols-widescreen .cell:nth-child(4n+3) { --hs-delay: 200ms; }
  .fixed-grid.has-4-cols-widescreen .cell:nth-child(4n+4) { --hs-delay: 300ms; }

  .fixed-grid.has-5-cols-widescreen .cell:nth-child(5n+1) { --hs-delay: 0ms; }
  .fixed-grid.has-5-cols-widescreen .cell:nth-child(5n+2) { --hs-delay: 100ms; }
  .fixed-grid.has-5-cols-widescreen .cell:nth-child(5n+3) { --hs-delay: 200ms; }
  .fixed-grid.has-5-cols-widescreen .cell:nth-child(5n+4) { --hs-delay: 300ms; }
  .fixed-grid.has-5-cols-widescreen .cell:nth-child(5n+5) { --hs-delay: 400ms; }
}

/* ==========================================================================
  IMAGES
  ========================================================================== */

.image.is-pulled-left,
.image.is-pulled-right {
  float: none;
  margin: 1rem 0;
}

@media screen and (min-width: 769px) {
  .image.is-one-quarter {
    width: 25%;
  }

  .image.is-one-third {
    width: 33.3333%;
  }

  .image.is-pulled-left {
    margin-right: 3.75rem;
  }

  .image.is-pulled-right {
    margin-left: 3.75rem;
  }
}

/* ==========================================================================
  TYPOGRAPHY - HEADINGS & SECTIONS
  ========================================================================== */

/* Base heading styles */
h1,
.section-title {
  color: hsl(var(--bulma-dark-h), var(--bulma-dark-s), var(--bulma-dark-l)) !important;
  color: var(--bulma-text-strong);
  font-size: var(--bulma-title-size);
  font-weight: var(--bulma-weight-extrabold);
  line-height: 1.125;
  margin-bottom: 0.5rem !important;
  text-align: center !important;
  font-size: 2rem;
}

/* Subtitle styles */
h1 + .subtitle,
.section-title + .subtitle {
  color: hsl(221, 14%, 48%) !important;
  text-align: center !important;
  font-size: 1.25rem;
}

/* Heading underlines */
h1::after,
.section-title::after {
  content: "";
  display: block;
  width: 6rem;
  height: 4px;
  background-color: #24b7ae;
  margin-top: 0.5rem !important;
  margin-bottom: 1.5rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Spacing */
h1:not(:last-child),
.section-title:not(:last-child) {
  margin-bottom: var(--bulma-block-spacing);
}

/* Left alignment override */
.has-text-left h1,
.has-text-left .section-title {
  text-align: left !important;
}

.has-text-left h1::after,
.has-text-left .section-title::after {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.has-text-left h1 + .subtitle,
.has-text-left .section-title + .subtitle {
  text-align: left !important;
}

/* Mobile center alignment override */
@media screen and (max-width: 768px) {
  .has-text-centered-mobile h1,
  .has-text-centered-mobile .section-title {
    text-align: center !important;
  }

  .has-text-centered-mobile h1::after,
  .has-text-centered-mobile .section-title::after {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .has-text-centered-mobile h1 + .subtitle,
  .has-text-centered-mobile .section-title + .subtitle {
    text-align: center !important;
  }
}

/* ==========================================================================
  BREADCRUMBS
  ========================================================================== */

.breadcrumb li {
  flex-shrink: 1;
  min-width: 0;
}

.breadcrumb li a {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}