*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Bricolage Grotesque',Arial,sans-serif;
  overflow-x:hidden;
  padding-top:90px;
}
img{display:block;max-width:100%}

/* HEADER */
header{
  position:fixed;top:0;width:100%;height:90px;
  background:#fff;display:flex;align-items:center;
  justify-content:space-between;padding:0 40px;z-index:1000;
}
.logo{width:40%;height:100%}
.logo img{width:100%;height:100%;object-fit:contain;object-position:left}
nav a{margin-left:30px;font-size:24px;color:#000;text-decoration:none}

/* HERO */
.hero {
  width: 100vw;
  height: calc(100vh - 90px);
  position: relative;
}

.hero img{width:100%;height:100%;object-fit:cover}
.hero-text{
  position:absolute;top:40px;right:40px;
  font-family:'Inknut Antiqua',serif;
  font-size:40px;color:#fff;text-align:right;
}
@media (max-width:768px){

  .hero img{
    height:auto;
  }

}
/* MOBILE HERO – CSS ONLY, NO HTML CHANGES */
@media (max-width:768px){

  .hero{
    position:relative;
    min-height:auto;
    height:auto;
     }

  .hero img{
    width:100%;
    height:auto;
    aspect-ratio:4 / 5;
    object-fit:cover;
    display:block;
  }

  .hero-text{
    position:absolute;
    top: 20px;          /* Adjust distance from top */
    right: 20px;        /* Adjust distance from right */
    left: 20px;         /* Added to prevent text from running off-screen */
    color: #fff;        /* Keeps it white */
    font-size: 24px;    
    line-height: 1.2;
    text-align: right;  /* Keeps the desktop alignment */
 text-shadow: 2px 2px 4px rgba(0,0,0,0.5);

  }

}

/* SECTION 2 */
.section-blue{
  background:#09126a;color:#fff;
  padding:80px 40px;font-size:30px;
}

/* SECTION 3 */
.section-images{
  display:grid;grid-template-columns:1fr 1fr;
  width:100vw;margin:0;
}
.image-box{position:relative;height:450px}
.image-box img{width:100%;height:100%;object-fit:cover}
.image-caption{
  position:absolute;top:20px;left:20px;
  font-size:30px;color:#09126a;
}

/* SECTION 4 CAROUSEL */
.carousel-section{padding:20px 40px}
.carousel-wrapper{position:relative;overflow:hidden}
.carousel-track{
  display:flex;gap:20px;
  gap: 50px;
    padding-top: 10px;      /* reduce top spacing */
  padding-bottom: 80px;   /* extra space below the carousel */
   border-radius: 8px;     /* optional: slightly rounded corners */
  transition:transform .4s ease;
  cursor:grab;
}
.carousel-track:active{cursor:grabbing}
.project-box{
  min-width:400px;
  aspect-ratio:16/6;
  border:1px solid #000;
}
.project-box img{width:100%;height:100%;object-fit:cover}

.carousel-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:40px;height:40px;
  background:#fff;border:1px solid #000;
  cursor:pointer;
  z-index:100;
}
.carousel-arrow.left{left:-10px}
.carousel-arrow.right{right:-10px}

/* SECTION 5 */
.section-people{
  background:#09126a;color:#fff;
  padding:20px 40px;
}
.section-people h3{
  font-family:'Bricolage Grotesque',Arial,sans-serif;
  font-size:30px;
}
.section-people img{
  display:block;
  width:1000px;max-width:100%;
  aspect-ratio:1000/450;
  margin:40px auto 0;
  border:1px solid #000;
  object-fit:cover;
}

/* SECTION 6 */
.section-partner{
  padding:40px 40px;
  font-size:20px;
  text-align:center;
}

/* FOOTER */
.footer{
  background:#09126a;color:#fff;
  padding:40px;display:flex;justify-content:space-between;
}
.footer small{
  font-family:'Times New Roman',serif;font-size:14px;
}
/* DESKTOP */
.hamburger{
  display:none;
}

/* MOBILE HEADER / HAMBURGER */
@media (max-width:768px){

  nav{
    display:none;
  }

  .hamburger{
    display:block;
    font-size:28px;
    background:none;
    border:none;
    cursor:pointer;
  }

  nav.active{
    display:block;
    position:absolute;
    top:90px;
    left:0;
    width:100%;
    background:#fff;
    padding:20px 40px;
  }

  nav a{
    display:block;
    margin:15px 0;
    font-size:22px;
  }

}
/* MOBILE SECTION 3 STACK */
@media (max-width:768px){

  .section-images{
    grid-template-columns:1fr;
  }

  .image-box{
    height:320px; /* optional: slightly tighter on mobile */
  }

}