/*.director-section {*/
/*  padding: 75px 0;*/
/*  position: relative;*/
/*  overflow: hidden;*/
/*}*/

/* Subtle animated gradient */
/*.gradient-overlay {*/
/*  position: absolute;*/
/*  inset: 0;*/
/*  background: radial-gradient(circle at 20% 40%, rgba(236,29,36,0.08), transparent 70%),*/
/*              radial-gradient(circle at 80% 70%, rgba(236,29,36,0.04), transparent 70%);*/
/*animation: gradientFlow 10s ease-in-out infinite alternate;*/
/*  z-index: 0;*/
/*}*/
/*@keyframes gradientFlow {*/
/*  0% { transform: translate(0,0); opacity: 0.7; }*/
/*  100% { transform: translate(-3%, 3%); opacity: 1; }*/
/*}*/

/* Soft red glow behind photo */
/*.floating-glow {*/
/*  position: absolute;*/
/*  inset: -30px;*/
/*  border-radius: 40px;*/
/*  background: radial-gradient(circle, rgba(236,29,36,0.3), transparent 80%);*/
/*  filter: blur(60px);*/
/*  z-index: -1;*/
/*  animation: pulse 6s infinite alternate ease-in-out;*/
/*}*/
/*@keyframes pulse {*/
/*  0% { opacity: .4; transform: scale(1); }*/
/*  100% { opacity: .7; transform: scale(1.1); }*/
/*}*/

/* Gradient ring accent */
/*.red-gradient-ring {*/
/*  position: absolute;*/
/*  top: -15px; left: -15px;*/
/*  width: calc(100% + 30px); height: calc(100% + 30px);*/
/*  border-radius: 40px;*/
/*  background: linear-gradient(45deg, #ec1d24, #ff7575, #ec1d24);*/
/*  z-index: -2;*/
/*  opacity: 0.15;*/
/*  animation: ringRotate 12s linear infinite;*/
/*}*/
/*@keyframes ringRotate {*/
/*  from { transform: rotate(0deg); }*/
/*  to { transform: rotate(360deg); }*/
/*}*/

/* Floating shapes */
/*.bg-shape {*/
/*  position: absolute;*/
/*  width: 400px;*/
/*  height: 400px;*/
/*  border-radius: 50%;*/
/*  filter: blur(120px);*/
/*  opacity: 0.07;*/
/*  z-index: 0;*/
/*}*/
/*.bg-shape-1 {*/
/*  background: #ec1d24;*/
/*  top: -60px;*/
/*  left: -100px;*/
/*  animation: float1 9s infinite alternate ease-in-out;*/
/*}*/
/*.bg-shape-2 {*/
/*  background: #ff8686;*/
/*  bottom: -80px;*/
/*  right: -120px;*/
/*  animation: float2 10s infinite alternate ease-in-out;*/
/*}*/
/*@keyframes float1 { from { transform: translateY(0);} to { transform: translateY(30px);} }*/
/*@keyframes float2 { from { transform: translateY(0);} to { transform: translateY(-30px);} }*/

/*@media(max-width:991px){*/
/*  .director-section{padding:50px 0; text-align:center;}*/
/*  .director-text{padding-right:0;}*/
/*  .red-gradient-ring,.floating-glow{display:none;}*/
/*}*/

/*.director-section {*/
/*  padding: 75px 0;*/
/*  position: relative;*/
/*  overflow: hidden;*/
/*}*/

/* Subtle animated gradient */
/*.gradient-overlay {*/
/*  position: absolute;*/
/*  inset: 0;*/
/*  background: radial-gradient(circle at 20% 40%, rgba(236,29,36,0.08), transparent 70%),*/
/*              radial-gradient(circle at 80% 70%, rgba(236,29,36,0.04), transparent 70%);*/
/*  z-index: 0;*/
/*}*/

/* Soft red glow behind photo */
/*.floating-glow {*/
/*  position: absolute;*/
/*  inset: -30px;*/
/*  border-radius: 40px;*/
/*  background: radial-gradient(circle, rgba(236,29,36,0.3), transparent 80%);*/
/*  filter: blur(60px);*/
/*  z-index: -1;*/
/*  animation: pulse 6s infinite alternate ease-in-out;*/
/*}*/
/*@keyframes pulse {*/
/*  0% { opacity: .4; transform: scale(1); }*/
/*  100% { opacity: .7; transform: scale(1.1); }*/
/*}*/

/* Gradient ring accent */
/*.red-gradient-ring {*/
/*  position: absolute;*/
/*  top: -15px; left: -15px;*/
/*  width: calc(100% + 30px);*/
/*  height: calc(100% + 30px);*/
/*  border-radius: 40px;*/
/*  background: linear-gradient(45deg, #ec1d24, #ff7575, #ec1d24);*/
/*  z-index: -2;*/
/*  opacity: 0.15;*/
/*  animation: ringRotate 12s linear infinite;*/
/*}*/
/*@keyframes ringRotate {*/
/*  from { transform: rotate(0deg); }*/
/*  to { transform: rotate(360deg); }*/
/*}*/

/* Floating background shapes */
/*.bg-shape {*/
/*  position: absolute;*/
/*  width: 400px;*/
/*  height: 400px;*/
/*  border-radius: 50%;*/
/*  filter: blur(120px);*/
/*  opacity: 0.07;*/
/*  z-index: 0;*/
/*}*/
/*.bg-shape-1 {*/
/*  background: #ec1d24;*/
/*  top: -60px;*/
/*  left: -100px;*/
/*  animation: float1 9s infinite alternate ease-in-out;*/
/*}*/
/*.bg-shape-2 {*/
/*  background: #ff8686;*/
/*  bottom: -80px;*/
/*  right: -120px;*/
/*  animation: float2 10s infinite alternate ease-in-out;*/
/*}*/
/*@keyframes float1 { from { transform: translateY(0);} to { transform: translateY(30px);} }*/
/*@keyframes float2 { from { transform: translateY(0);} to { transform: translateY(-30px);} }*/

/* âœ… Typography Adjustments (px units) */
/*.director-text h2 {*/
/*  font-size: 30px;*/
/*  line-height: 40px;*/
/*  font-weight: 700;*/
/*}*/

/*.director-text p {*/
/*  font-size: 14px;*/
/*  line-height: 25px;*/
/*}*/

/*.director-text h6 {*/
/*  font-size: 13px;*/
/*}*/

/*.director-text small {*/
/*  font-size: 14px;*/
/*  font-weight: 500;*/
/*}*/

/* ðŸ”¹ Tablet Devices (â‰¤ 991px) */
/*@media(max-width: 991px) {*/
/*  .director-section {*/
/*    padding: 60px 0;*/
/*    text-align: center;*/
/*  }*/
/*  .director-text h2 { font-size: 30px; line-height: 38px; }*/
/*  .director-text p { font-size: 16px; line-height: 26px; }*/
/*  .director-text h6 { font-size: 16px; }*/
/*  .director-text small { font-size: 14px; }*/
/*  .director-image img { max-width: 340px; }*/
/*  .red-gradient-ring,*/
/*  .floating-glow { display: none; }*/
/*}*/

/* ðŸ”¹ Mobile Devices (â‰¤ 768px) */
/*@media(max-width: 768px) {*/
/*  .director-section { padding: 50px 0; }*/
/*  .director-text h2 { font-size: 20px; line-height: 34px; }*/
/*  .director-text p { font-size: 15px; line-height: 24px; }*/
/*  .director-text h6 { font-size: 15px; }*/
/*  .director-text small { font-size: 13px; }*/
/*  .director-image img { max-width: 300px; }*/
/*}*/

/* ðŸ”¹ Extra Small Devices (â‰¤ 480px) */
/*@media(max-width: 480px) {*/
/*  .director-section { padding: 40px 0; }*/
/*  .director-text h2 { font-size: 18px; line-height: 28px; }*/
/*  .director-text p { font-size: 14px; line-height: 22px; }*/
/*  .director-text h6 { font-size: 14px; }*/
/*  .director-text small { font-size: 12px; }*/
/*  .director-image img { max-width: 260px; }*/
/*}*/

/* ================= Director Section ================= */
.director-section {
    position: relative;
    overflow: hidden;
    padding: clamp(40px, 5vw, 75px) 0;
    background: #f9f9f9;
    color: #222;
    z-index: 1;
}

/* ---------------- Gradient Overlay ---------------- */
.gradient-overlay {
    position: absolute;
    inset: 0;
    /* background: radial-gradient(circle at 20% 40%, rgba(236,29,36,0.08), transparent 70%),
                radial-gradient(circle at 80% 70%, rgba(236,29,36,0.04), transparent 70%); */
    background: radial-gradient(
            circle at 20% 40%,
            rgba(41, 137, 146, 0.08),
            transparent 70%
        ),
        radial-gradient(
            circle at 80% 70%,
            rgba(41, 137, 146, 0.04),
            transparent 70%
        );

    z-index: 0;
}

/* ---------------- Director Image Glow ---------------- */
.floating-glow {
    position: absolute;
    inset: -20px;
    border-radius: 40px;
    background: radial-gradient(
        circle,
        rgba(236, 29, 36, 0.3),
        transparent 80%
    );
    filter: blur(60px);
    z-index: 0;
    animation: pulse 6s infinite alternate ease-in-out;
}

@keyframes pulse {
    0% {
        opacity: 0.4;
        transform: scale(1);
    }
    100% {
        opacity: 0.7;
        transform: scale(1.1);
    }
}

/* ---------------- Gradient Ring ---------------- */
.red-gradient-ring {
    position: absolute;
    top: -15px;
    left: -15px;
    width: calc(100% + 30px);
    height: calc(100% + 30px);
    border-radius: 40px;
    background: linear-gradient(45deg, #298992, #216e75, #275b83);
    z-index: -1;
    opacity: 0.15;
    animation: ringRotate 12s linear infinite;
}

@keyframes ringRotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* ---------------- Floating Background Shapes ---------------- */
.bg-shape {
    position: absolute;
    border-radius: 50%;
    filter: blur(120px);
    opacity: 0.07;
    z-index: -2;
    pointer-events: none;
}

/* Shape 1 */
.bg-shape-1 {
    background: #ec1d24;
    top: -10%;
    left: -15%;
    width: 35%;
    height: 35%;
    animation: float1 9s infinite alternate ease-in-out;
}

/* Shape 2 */
.bg-shape-2 {
    background: #ff8686;
    bottom: -10%;
    right: -15%;
    width: 35%;
    height: 35%;
    animation: float2 10s infinite alternate ease-in-out;
}

@keyframes float1 {
    from {
        transform: translateY(0);
    }
    to {
        transform: translateY(30px);
    }
}
@keyframes float2 {
    from {
        transform: translateY(0);
    }
    to {
        transform: translateY(-30px);
    }
}

/* ---------------- Director Text ---------------- */
.director-text h2 {
    font-family: "Poppins", sans-serif;
    font-size: clamp(18px, 2.5vw, 30px);
    line-height: clamp(28px, 3vw, 40px);
    font-weight: 700;
    color: #000;
    margin-bottom: 1rem;
}

.director-text p {
    font-size: clamp(14px, 1.5vw, 16px);
    line-height: clamp(22px, 2vw, 26px);
    color: #444;
    margin-bottom: 1.5rem;
    text-align: justify;
}

.director-text h6 {
    font-size: clamp(14px, 1vw, 16px);
    font-weight: 600;
    color: #000;
    margin-bottom: 0;
}

.director-text small {
    font-size: clamp(12px, 0.9vw, 14px);
    font-weight: 500;
    color: #ec1d24;
}

/* Badge */
.director-text .badge {
    background: rgba(236, 29, 36, 0.15);
    color: #ec1d24;
    font-weight: 600;
    padding: 0.35rem 0.75rem;
    margin-bottom: 1rem;
}

/* ---------------- Director Image ---------------- */
.director-image {
    position: relative;
    display: inline-block;
}
.director-image img {
    width: 100%;
    height: auto;
    max-width: 450px;
    border-radius: 30px;
    object-fit: cover;
}

/* ================= Responsive Adjustments ================= */

/* Tablets (≤991px) */
@media (max-width: 991px) {
    .director-section {
        padding: 60px 0;
        text-align: center;
    }
    .director-text h2 {
        font-size: clamp(20px, 3vw, 30px);
        line-height: clamp(28px, 3vw, 38px);
    }
    .director-text p {
        font-size: 16px;
        line-height: 26px;
    }
    .director-text h6 {
        font-size: 16px;
    }
    .director-text small {
        font-size: 14px;
    }
    .director-image img {
        max-width: 340px;
    }
    .bg-shape-1,
    .bg-shape-2 {
        width: 30%;
        height: 30%;
        top: -5%;
        bottom: -5%;
    }
    .floating-glow {
        inset: -15px;
        filter: blur(50px);
    }
    .red-gradient-ring {
        width: calc(100% + 20px);
        height: calc(100% + 20px);
        opacity: 0.12;
    }
}

/* Mobile (≤768px) */
@media (max-width: 768px) {
    .director-section {
        padding: 50px 0;
    }
    .director-text h2 {
        font-size: 20px;
        line-height: 34px;
    }
    .director-text p {
        font-size: 15px;
        line-height: 24px;
    }
    .director-text h6 {
        font-size: 15px;
    }
    .director-text small {
        font-size: 13px;
    }
    .director-image img {
        max-width: 300px;
    }
    .bg-shape-1,
    .bg-shape-2 {
        width: 25%;
        height: 25%;
    }
}

/* Extra Small (≤480px) */
@media (max-width: 480px) {
    .director-section {
        padding: 40px 0;
    }
    .director-text h2 {
        font-size: 18px;
        line-height: 28px;
    }
    .director-text p {
        font-size: 14px;
        line-height: 22px;
    }
    .director-text h6 {
        font-size: 14px;
    }
    .director-text small {
        font-size: 12px;
    }
    .director-image img {
        max-width: 260px;
    }
    .bg-shape-1,
    .bg-shape-2 {
        width: 20%;
        height: 20%;
    }
}
