/* ==========================================================================
   Pranam Kiran Educational Samiti — Phase 3 Visual System
   Version: 1.3.0
   DO NOT remove Phase 1 or Phase 2 snippets. This is an additive layer.
   ========================================================================== */

.e-con {
    --pk-blue:        #3A5BCC;
    --pk-navy:        #1A2B4A;
    --pk-light-blue:  #E8EEFF;
    --pk-mid-blue:    #6B82D6;
    --pk-text:        #4A5568;
    --pk-off-white:   #F7F9FC;
    --pk-border:      #E2E8F0;
    --pk-accent-gold: #C9973A;
}

/* ==========================================================================
   Buttons
   ========================================================================== */
.e-con .elementor-button {
    border-radius: 8px !important;
    padding: 12px 28px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
}
.e-con .elementor-button-primary,
.e-con .elementor-widget-button .elementor-button {
    background-color: var(--pk-blue) !important;
    color: #ffffff !important;
    border: none !important;
}
.e-con .elementor-button-primary:hover,
.e-con .elementor-widget-button .elementor-button:hover {
    background-color: var(--pk-navy) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(58, 91, 204, 0.2);
}
.e-con .elementor-button-ghost {
    background-color: transparent !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
}
.e-con .elementor-button-ghost:hover {
    background-color: #ffffff !important;
    color: var(--pk-blue) !important;
}
.e-con .pk-btn-donate {
    background-color: var(--pk-blue) !important;
    border: 2px solid var(--pk-accent-gold) !important;
    color: #ffffff !important;
}
.e-con .pk-btn-donate:hover {
    background-color: var(--pk-navy) !important;
    box-shadow: 0 4px 12px rgba(201, 151, 58, 0.3);
}

/* ==========================================================================
   CTA Cards — Image style
   ========================================================================== */
.e-con .pk-cta-card-img {
    background-color: #ffffff;
    border-radius: 16px;
    border: 1px solid var(--pk-border);
    box-shadow: 0 4px 20px rgba(0,0,0,0.03);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.e-con .pk-cta-card-img:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 30px rgba(0,0,0,0.06);
}
.e-con .pk-cta-card-img img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
    transition: transform 0.4s ease;
}
.e-con .pk-cta-card-img:hover img {
    transform: scale(1.04);
}

/* CTA Cards — Text-only style */
.e-con .pk-cta-card-text {
    background-color: #ffffff;
    border-radius: 16px;
    border: 1px solid var(--pk-border);
    box-shadow: 0 4px 20px rgba(0,0,0,0.03);
    padding: 32px;
    transition: transform 0.3s ease;
}
.e-con .pk-cta-card-text:hover {
    transform: translateY(-5px);
}
.e-con .pk-cta-card-text img {
    display: none !important;
}

/* Donate CTA — Gold top border */
.e-con .pk-cta-donate {
    border-top: 3px solid var(--pk-accent-gold) !important;
}

/* Team Page single CTA */
.page-template-default .elementor-widget-call-to-action.pk-cta-team {
    background-color: var(--pk-light-blue);
    border-left: 4px solid var(--pk-blue);
    border-radius: 16px;
    padding: 32px;
}

/* ==========================================================================
   Icon Boxes (Contact page)
   ========================================================================== */
.e-con .pk-icon-box {
    background-color: #ffffff;
    border-radius: 16px;
    padding: 32px;
    text-align: center;
    border: 1px solid var(--pk-border);
    transition: transform 0.3s ease;
}
.e-con .pk-icon-box:hover {
    transform: translateY(-5px);
}
.e-con .pk-icon-box .elementor-icon-box-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background-color: var(--pk-light-blue);
    color: var(--pk-blue);
    transition: all 0.3s ease;
    margin-bottom: 20px;
}
.e-con .pk-icon-box:hover .elementor-icon-box-icon {
    background-color: var(--pk-blue);
    color: #ffffff;
}

/* ==========================================================================
   Content Images — Radius & micro-zoom
   Excludes Hero 19c1d95, Header, Footer
   ========================================================================== */
.e-con:not([data-id="19c1d95"]) .elementor-widget-image img {
    border-radius: 12px;
    transition: transform 0.4s ease;
}
.e-con:not([data-id="19c1d95"]) .elementor-widget-image:hover img {
    transform: scale(1.025);
}

/* ==========================================================================
   Text Editor Links
   ========================================================================== */
.e-con .elementor-widget-text-editor a {
    color: var(--pk-blue);
    text-decoration: none;
    border-bottom: 2px solid rgba(58, 91, 204, 0.35);
    transition: all 0.2s ease;
}
.e-con .elementor-widget-text-editor a:hover {
    color: var(--pk-navy);
    border-bottom-color: var(--pk-navy);
}

/* ==========================================================================
   WPForms — Forms 656 & 653
   ========================================================================== */
.wpforms-container#wpforms-656,
.wpforms-container#wpforms-653 {
    --wpforms-border: #D0D9E8;
}
.wpforms-container#wpforms-656 .wpforms-field-label,
.wpforms-container#wpforms-653 .wpforms-field-label {
    color: var(--pk-navy) !important;
    font-weight: 600 !important;
}
.wpforms-container#wpforms-656 input[type="text"],
.wpforms-container#wpforms-656 input[type="email"],
.wpforms-container#wpforms-656 textarea,
.wpforms-container#wpforms-653 input[type="text"],
.wpforms-container#wpforms-653 input[type="email"],
.wpforms-container#wpforms-653 textarea {
    height: 48px !important;
    border-radius: 8px !important;
    border: 1px solid var(--wpforms-border) !important;
    padding: 0 16px !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.wpforms-container#wpforms-656 textarea,
.wpforms-container#wpforms-653 textarea {
    height: 120px !important;
    padding: 12px 16px !important;
}
.wpforms-container#wpforms-656 input:focus,
.wpforms-container#wpforms-656 textarea:focus,
.wpforms-container#wpforms-653 input:focus,
.wpforms-container#wpforms-653 textarea:focus {
    border-color: var(--pk-blue) !important;
    box-shadow: 0 0 0 2px rgba(58, 91, 204, 0.2) !important;
    outline: none !important;
}

/* ==========================================================================
   Opt-in Spacing
   ========================================================================== */
.pk-section    { padding: 80px 0 !important; }
.pk-section-sm { padding: 48px 0 !important; }

/* ==========================================================================
   UNIVERSAL CTA CARD EQUAL-HEIGHT + BUTTON-BOTTOM ALIGNMENT
   --------------------------------------------------------------------------
   Applies globally to all CTA widgets inside Elementor containers (.e-con).
   Ensures cards grow to fill their flex row and buttons push to bottom.
   ========================================================================== */

/* 1. Ensure any flex container holding a CTA naturally stretches its children */
.e-con:has(> .elementor-widget-call-to-action),
.e-con > .e-con-inner:has(> .elementor-widget-call-to-action) {
    align-items: stretch !important;
}

/* 2. Force the widget root to act as a flex column filling 100% height */
.e-con .elementor-widget-call-to-action {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}

/* 3. Make inner container flex and expand */
.e-con .elementor-widget-call-to-action > .elementor-widget-container {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
}

/* 4. Expand the actual CTA element */
.e-con .elementor-widget-call-to-action .elementor-cta {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
}

/* 5. Expand the content area so the bottom is pushed down */
.e-con .elementor-widget-call-to-action .elementor-cta__content {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
}

/* 6. Push the button wrapper to the bottom */
.e-con .elementor-widget-call-to-action .elementor-cta__button-wrapper {
    margin-top: auto !important;
    padding-top: 20px;
    width: 100%;
}

/* Mobile Fallback: Cards stack, reset fixed height */
@media (max-width: 767px) {
    .e-con .elementor-widget-call-to-action {
        height: auto !important;
    }
    .e-con .elementor-widget-call-to-action .elementor-cta__button-wrapper {
        padding-top: 16px;
    }
}

/* ==========================================================================
   Mobile Global Adjustments
   ========================================================================== */
@media (max-width: 767px) {
    .e-con .elementor-button,
    .wpforms-container#wpforms-656 .wpforms-submit,
    .wpforms-container#wpforms-653 .wpforms-submit {
        width: 100% !important;
        text-align: center;
    }
    .wpforms-container#wpforms-656 input,
    .wpforms-container#wpforms-656 textarea,
    .wpforms-container#wpforms-653 input,
    .wpforms-container#wpforms-653 textarea {
        font-size: 16px !important;
    }
    .pk-section    { padding: 48px 0 !important; }
    .pk-section-sm { padding: 32px 0 !important; }
}
