/* Font */
@import url('https://fonts.googleapis.com/css2?family=Merienda:wght@700&display=swap');

/* === Section Animation === */
.fade-in-zoom {
    opacity: 0;
    transform: scale(0.95) translateY(20px);
    animation: fadeInZoom 1s forwards;
}
@keyframes fadeInZoom {
    to { opacity: 1; transform: scale(1) translateY(0); }
}

.img-hover-tilt:hover {
    transform: scale(1.05) rotate(-1deg);
    transition: transform 0.5s ease;
}

.content-slide {
    opacity: 0;
    transform: translateY(30px);
    animation: slideFade 1s forwards;
}
@keyframes slideFade {
    to { opacity: 1; transform: translateY(0); }
}
.content-slide:hover {
    transform: scale(1.02);
    transition: transform 0.3s;
}

/* === Buttons === */
.custom-btn-primary {
    background-color: #eb5f2d;
    color: #fff;
    border: none;
    border-radius: 30px;
    padding: 0.6rem 1.8rem;
    font-weight: 700;
    font-family: 'Merienda', cursive;
    transition: transform 0.3s, box-shadow 0.3s;
}
.custom-btn-primary:hover {
    transform: translateY(-5px) scale(1.05);
    box-shadow: 0 1rem 2rem rgba(235,95,45,0.4);
}

/* === Headings === */
.custom-heading {
    font-family: 'Merienda', cursive;
    font-size: 2.5rem;
    font-weight: 700;
    color: #eb5f2d;
    margin-bottom: 1rem;
}

/* === Text === */
.text-muted-custom {
    font-size: 1rem;
    margin-bottom: 1rem;
}
.text-justify-custom {
    text-align: justify;
    line-height: 1.7;
    margin-bottom: 1.5rem;
}

/* === Banner Image === */
.banner-image {
    width: 100%;
    height: 600px;            /* fixed height */
    border-radius: 0.25rem;   /* rounded corners */
    object-fit: cover;        /* maintain aspect ratio */
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.075); /* shadow-sm */
}

/* --------- Blink animation --------- */
@keyframes blink {
  0%   { opacity: 1; }
  50%  { opacity: 0; }
  100% { opacity: 1; }
}

/* sharper, more "blink-like" timing using steps */
.blink-text {
  animation: blink 1.0s steps(2, start) infinite;
  will-change: opacity;
  -webkit-font-smoothing:antialiased;
}

/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  .blink-text {
    animation: none;
    opacity: 1;
  }
}