/* Reset-ish */
* { box-sizing: border-box; }
body { margin: 0; font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; color: #233043; background: #f7fafc; line-height: 1.45; }

/* Utility button */
.btn {
  display: inline-block;
  padding: 0.7rem 1.25rem;
  border-radius: 10px;
  text-decoration: none;
  font-weight: 600;
  transition: transform .18s ease, box-shadow .18s ease;
  border: none;
  cursor: pointer;
}
.btn.primary { background: linear-gradient(90deg,#0b6fb8,#0ea5a1); color: white; box-shadow: 0 6px 18px rgba(14,165,161,0.12); }
.btn.primary:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(14,165,161,0.18); }

/* Hero */
.hero { padding: 3.5rem 1.5rem; background: linear-gradient(180deg,#ffffff 0%, #f0f7fb 100%); overflow: hidden; }
.hero-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: center; }
.hero-text h1 { margin: 0 0 .5rem 0; font-size: clamp(1.7rem, 3vw, 2.6rem); letter-spacing: -0.5px; }
.hero-text p { margin: 0 0 1rem 0; color:#475569; }
.hero-image img { width: 100%; height: auto; border-radius: 14px; object-fit: cover; transform: translateY(6px); box-shadow: 0 18px 40px rgba(2,6,23,0.06); }

/* Content grid */
.content-grid { max-width: 1200px; margin: 2rem auto; padding: 0 1.25rem 4rem 1.25rem; display: grid; grid-template-columns: repeat(3,1fr); gap: 1.25rem; align-items: start; }

/* Cards */
.card {
  background: white;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 8px 26px rgba(15,23,42,0.06);
  transform: translateY(0);
  transition: transform .35s cubic-bezier(.2,.9,.2,1), box-shadow .25s ease;
  min-height: 360px;
  display: flex;
  flex-direction: column;
  animation: fadeUp .7s ease both;
}
.card:hover { transform: translateY(-10px); box-shadow: 0 26px 60px rgba(15,23,42,0.12); }

/* card media */
.card-media { width: 100%; height: 200px; overflow: hidden; flex: 0 0 200px; }
.card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2,.9,.2,1); }
.card:hover .card-media img { transform: scale(1.05) rotate(-0.5deg); }

/* card body */
.card-body { padding: 1.25rem; display: flex; flex-direction: column; gap: .8rem; flex: 1 1 auto; }
.card-body h2 { margin: 0; font-size: 1.15rem; color: #0f1724; }
.card-body p { margin: 0; color: #475569; flex: 1 1 auto; }
.read-more {
  margin-top: 0.6rem;
  align-self: flex-start;
  padding: 0.5rem 0.9rem;
  border-radius: 10px;
  background: transparent;
  color: #0b6fb8;
  border: 1px solid rgba(11,111,184,0.18);
  text-decoration: none;
  font-weight: 600;
  transition: background .18s ease, transform .12s ease;
}
.read-more:hover { background: rgba(11,111,184,0.06); transform: translateY(-3px); }

/* contact-card special accent */
.contact-card { border-left: 4px solid #0ea5a1; }

/* Animations */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Responsive */
@media (max-width: 1000px) {
  .content-grid { grid-template-columns: repeat(2,1fr); }
  .hero-inner { grid-template-columns: 1fr; text-align: left; }
  .hero-image { order: -1; }
}
@media (max-width: 640px) {
  .content-grid { grid-template-columns: 1fr; }
  .hero { padding: 2rem 1rem; }
  .hero-inner { gap: 1rem; }
  .card-media { height: 160px; }
}

/* Carousel (homepage) - minimal corporate style */
.hp-events-hero { background: #ffffff; padding: 2rem 0 3rem; }
.hp-events-hero .container { max-width: 1100px; margin: 0 auto; padding: 0 1rem; }

.hp-events-hero h2 { color: #0b6fb8; margin: 0 0 1rem; font-size: 1.6rem; }

/* Carousel layout */
.carousel { display:flex; align-items:center; gap:1rem; position: relative; }
.carousel-arrow {
  background: transparent;
  border: 1px solid #e6eef6;
  padding: .4rem .7rem;
  border-radius: 8px;
  cursor: pointer;
  font-size: 1.6rem;
  color: #0b6fb8;
}
.carousel-track-wrapper { overflow: hidden; flex: 1 1 auto; }
.carousel-track { display: flex; gap: 1rem; padding: 0; margin: 0; list-style: none; transition: transform .5s ease; }
.carousel-slide { min-width: 300px; flex: 0 0 300px; display:flex; align-items:stretch; }

/* Square card inside slide */
.card-square { background: #f8fafc; border-radius: 10px; overflow: hidden; border: 1px solid #eef3f8; display:flex; flex-direction:column; }
.card-square img { width:100%; height: 300px; object-fit: cover; display:block; }
.card-info { padding: .8rem 1rem; display:flex; flex-direction:column; gap:.5rem; }
.card-info h3 { margin:0; color:#0b6fb8; font-size:1.05rem; }
.card-info p { margin:0; color:#475569; font-size:0.95rem; line-height:1.4; }
.btn-mini { margin-top: .6rem; align-self:flex-start; text-decoration:none; padding:.45rem .7rem; border-radius:8px; border:1px solid rgba(11,111,184,0.12); color:#0b6fb8; font-weight:600; background:transparent; }

/* View all button */
.carousel-actions { margin-top:1rem; text-align:center; }
.btn.view-all { display:inline-block; padding:.6rem 1rem; background:#0b6fb8; color:#fff; border-radius:8px; text-decoration:none; font-weight:600; }

/* Responsive */
@media (max-width: 900px) {
  .carousel-slide { min-width: 260px; flex:0 0 260px; }
  .card-square img { height:230px; }
}
@media (max-width: 640px) {
  .carousel-arrow { display:none; }
  .carousel-slide { min-width: 240px; flex:0 0 240px; }
  .card-square img { height:200px; }
}