/* ================================================
   AFRAD — Elementor Compatibility Stylesheet
   Compatible avec Elementor Free & Pro
   ================================================ */

/* Reset Elementor defaults to match AFRAD design */
.elementor-section,
.elementor-container,
.e-con,
.e-con-inner {
    max-width: 100%;
}

/* AFRAD CSS Variables available inside Elementor */
.elementor {
    --e-global-color-afrad-gold: #f3c443;
    --e-global-color-afrad-black: #07040a;
    --e-global-color-afrad-cream: #f5ede0;
    --e-global-typography-afrad-heading-font-family: 'Cairo';
    --e-global-typography-afrad-body-font-family: 'Cairo';
}

/* Elementor sections match AFRAD dark background */
.elementor-section.elementor-section-boxed > .elementor-container {
    max-width: min(1380px, calc(100% - 40px));
}

/* Make Elementor full-width sections work with our theme */
body.elementor-page .site-content {
    padding: 0;
}

/* Elementor buttons — apply AFRAD style */
.elementor-button.afrad-btn,
.elementor-widget-button .afrad-btn {
    background: linear-gradient(135deg, #f3c443, #e8a020);
    border: 1px solid rgba(243,196,67,.55);
    color: #111;
    border-radius: 999px;
    font-weight: 800;
    box-shadow: 0 0 38px rgba(243,196,67,.18);
    transition: transform .3s, box-shadow .3s;
    font-family: 'Cairo', sans-serif;
}
.elementor-button.afrad-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 0 58px rgba(243,196,67,.35);
}
.elementor-button.afrad-btn-ghost {
    background: rgba(255,255,255,.06);
    color: #f5ede0;
    border: 1px solid rgba(255,255,255,.17);
    border-radius: 999px;
    font-family: 'Cairo', sans-serif;
}

/* Elementor heading widget — apply AFRAD typography */
.elementor-widget-heading .elementor-heading-title.afrad-title {
    font-family: 'Cairo', sans-serif;
    font-weight: 300;
    line-height: 1.06;
    color: #f5ede0;
}

/* Elementor image widget — cinema frame style */
.elementor-widget-image.afrad-cinema img {
    border-radius: 34px;
    border: 1px solid rgba(255,255,255,.11);
    box-shadow: 0 35px 120px rgba(0,0,0,.65);
}

/* Eyebrow class for Elementor text widgets */
.elementor-widget-text-editor .afrad-eyebrow,
.afrad-eyebrow {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: .32em;
    color: #f3c443;
    font-size: 12px;
}

/* Reveal animation — add class "afrad-reveal" to any Elementor element */
.afrad-reveal {
    opacity: 0;
    transform: translateY(36px);
    transition: opacity .8s ease, transform .8s ease;
}
.afrad-reveal.in {
    opacity: 1;
    transform: none;
}

/* Gold divider */
.afrad-gold-line {
    border: none;
    height: 1px;
    background: linear-gradient(90deg, transparent, #f3c443, transparent);
    margin: 40px 0;
}

/* Card style for Elementor */
.afrad-card {
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 28px;
    padding: 28px;
    background: linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.025));
    box-shadow: 0 25px 70px rgba(0,0,0,.25);
    transition: transform .35s, border .35s;
}
.afrad-card:hover {
    transform: translateY(-8px);
    border-color: rgba(243,196,67,.35);
}

/* Formation card for Elementor */
.afrad-formation-card {
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 34px;
    padding: 42px;
    background: radial-gradient(circle at 80% 0, rgba(243,196,67,.15), transparent 40%), #090909;
}

/* Noise overlay — add to body via Elementor custom HTML */
.afrad-noise {
    position: fixed;
    inset: 0;
    z-index: 999;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");
    background-repeat: repeat;
    background-size: 128px;
    opacity: .45;
}

/* Elementor section backgrounds — dark theatre */
.elementor-section.afrad-dark-section,
.e-con.afrad-dark-section {
    background: radial-gradient(circle at 80% 10%, rgba(243,196,67,.06), transparent 35%), #07040a;
}
.elementor-section.afrad-velvet-section,
.e-con.afrad-velvet-section {
    background: linear-gradient(135deg, #080505, #140609 55%, #050505);
}

/* Spotlight effect available as CSS class */
.afrad-spotlight {
    position: relative;
    overflow: hidden;
}
.afrad-spotlight::before {
    content: '';
    position: absolute;
    top: -20%;
    left: 30%;
    width: 40%;
    height: 120%;
    background: linear-gradient(rgba(243,196,67,.15), transparent);
    filter: blur(40px);
    clip-path: polygon(40% 0, 60% 0, 100% 100%, 0 100%);
    pointer-events: none;
}

/* ===== RESPONSIVE ELEMENTOR ===== */
@media (max-width: 1024px) {
    .afrad-card { padding: 22px; }
    .afrad-formation-card { padding: 28px 22px; }
}
@media (max-width: 767px) {
    .elementor-section.elementor-section-boxed > .elementor-container {
        max-width: calc(100% - 32px);
    }
}