/*
 * MediaAcademy International — Homepage Reviews
 * Dedicated stylesheet. This section intentionally does not depend on
 * the review rules in assets/css/style.css.
 */

/* ===== PUBLIC REVIEW SECTION ===== */
.mai-reviews{
    --review-blue:#006599;
    --review-deep:#173746;
    --review-muted:#647780;
    --review-panel:#a9c7d2;
    --review-card:#fff;
    --review-line:#dce8ed;
    position:relative;
    overflow:hidden;
    padding:84px 0 92px;
    background:var(--review-panel);
}
.mai-reviews::before{
    content:"";
    position:absolute;
    width:430px;height:430px;
    right:-210px;top:-250px;
    border:1px solid rgba(255,255,255,.28);
    border-radius:50%;
    box-shadow:0 0 0 72px rgba(255,255,255,.07),0 0 0 145px rgba(255,255,255,.045);
    pointer-events:none;
}
.mai-reviews .container{position:relative;z-index:2}
.mai-reviews-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:42px;
    margin-bottom:34px;
}
.mai-reviews-heading>div{max-width:790px}
.mai-reviews-kicker{
    display:block;
    margin-bottom:10px;
    color:var(--review-blue);
    font-size:.66rem;
    font-weight:900;
    letter-spacing:2.2px;
}
.mai-reviews-heading h2{
    margin:0;
    color:#173746;
    font-family:"MAI GILBI",Arial,sans-serif;
    font-size:clamp(2.35rem,4.2vw,4.25rem);
    font-weight:400;
    line-height:.98;
    letter-spacing:-1px;
}
.mai-reviews-heading h2 span{color:var(--review-blue)}
.mai-reviews-heading p{
    max-width:680px;
    margin:16px 0 0;
    color:#405a66;
    font-size:.9rem;
    line-height:1.68;
}
.mai-review-add,.mai-reviews-empty button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    flex:0 0 auto;
    padding:13px 18px;
    border:1px solid var(--review-blue);
    border-radius:8px;
    background:var(--review-blue);
    color:#fff;
    font-size:.68rem;
    font-weight:900;
    letter-spacing:.9px;
    cursor:pointer;
    transition:.22s ease;
}
.mai-review-add:hover,.mai-reviews-empty button:hover{
    background:#004d75;
    border-color:#004d75;
    transform:translateY(-2px);
}

/* ===== REVIEW CAROUSEL / INDIVIDUAL CARDS ===== */
.mai-review-carousel-shell{position:relative;padding:0 52px}
.mai-review-track{
    display:flex;
    align-items:stretch;
    gap:22px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    overscroll-behavior-inline:contain;
    padding:6px 2px 20px;
    scroll-behavior:smooth;
}
.mai-review-track::-webkit-scrollbar{display:none}
.mai-review-card{
    scroll-snap-align:start;
    flex:0 0 calc((100% - 44px)/3);
    min-width:0;
    min-height:360px;
    display:flex;
    flex-direction:column;
    padding:30px 30px 28px;
    border:1px solid rgba(255,255,255,.76);
    border-radius:30px;
    background:var(--review-card);
    box-shadow:0 14px 32px rgba(20,63,81,.10);
    transition:transform .25s ease,box-shadow .25s ease;
}
.mai-review-card:hover{
    transform:translateY(-5px);
    box-shadow:0 20px 42px rgba(20,63,81,.15);
}
.mai-review-quote{
    height:47px;
    margin:0 0 2px;
    color:#9fc3d0;
    font-family:Georgia,"Times New Roman",serif;
    font-size:5.2rem;
    font-weight:700;
    line-height:.72;
    letter-spacing:-8px;
}
.mai-review-stars{
    display:flex;
    gap:3px;
    margin:8px 0 16px;
    color:#d79d00;
    font-size:.76rem;
}
.mai-review-card blockquote{
    flex:1;
    margin:0 0 28px;
    color:#25383f;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1rem;
    font-style:italic;
    font-weight:400;
    line-height:1.72;
}
.mai-review-person{
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    align-items:center;
    column-gap:14px;
    padding-top:18px;
    border-top:1px solid var(--review-line);
}
.mai-review-person img,.mai-review-avatar-placeholder{
    width:58px;height:58px;
    border-radius:50%;
    object-fit:cover;
}
.mai-review-avatar-placeholder{
    display:grid;
    place-items:center;
    background:#e7f2f6;
    color:var(--review-blue);
    font-size:1.7rem;
}
.mai-review-avatar-placeholder.is-female{background:#f4eef5;color:#76527f}
.mai-review-person strong{
    display:block;
    color:#172a32;
    font-size:.92rem;
    font-weight:900;
    line-height:1.25;
}
.mai-review-person span{
    display:block;
    margin-top:4px;
    color:#73828a;
    font-size:.7rem;
    font-weight:600;
    letter-spacing:.25px;
    text-transform:capitalize;
}
.mai-review-arrow{
    position:absolute;
    top:50%;
    z-index:5;
    display:grid;
    place-items:center;
    width:42px;height:42px;
    border:1px solid rgba(255,255,255,.92);
    border-radius:50%;
    background:#fff;
    color:var(--review-blue);
    box-shadow:0 9px 22px rgba(15,58,76,.15);
    cursor:pointer;
    transform:translateY(-50%);
    transition:.2s ease;
}
.mai-review-arrow:hover{background:var(--review-blue);color:#fff;border-color:var(--review-blue)}
.mai-review-arrow.is-prev{left:0}.mai-review-arrow.is-next{right:0}

/* ===== EMPTY / FLASH ===== */
.mai-reviews-empty{
    display:flex;
    align-items:center;
    gap:18px;
    padding:26px 28px;
    border-radius:22px;
    background:#fff;
    box-shadow:0 12px 30px rgba(20,63,81,.09);
}
.mai-reviews-empty>i{font-size:2rem;color:var(--review-blue)}
.mai-reviews-empty>div{flex:1}
.mai-reviews-empty strong{display:block;color:#203039;font-size:.96rem}
.mai-reviews-empty span{display:block;margin-top:4px;color:#74818a;font-size:.82rem}
.mai-review-flash{
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin:-10px 0 25px;
    padding:13px 15px;
    border-left:4px solid;
    border-radius:7px;
    font-size:.84rem;
    line-height:1.5;
}
.mai-review-flash.is-success{color:#245b3a;background:#edf8f1;border-color:#45a46c}
.mai-review-flash.is-error{color:#7b3030;background:#fff0f0;border-color:#c84f4f}

/* ===== REVIEW SUBMISSION MODAL ===== */
/* The modal sits outside .mai-reviews in index.php, so it must own the
   review colour variables instead of relying on inheritance from the section. */
.mai-review-modal{
    --review-blue:#006599;
    --review-deep:#173746;
    --review-muted:#647780;
    --review-line:#dce8ed;
}
.mai-review-modal[hidden]{display:none!important}
.mai-review-modal{position:fixed;inset:0;z-index:12000;display:grid;place-items:center;padding:20px}
.mai-review-modal-backdrop{position:absolute;inset:0;border:0;background:rgba(2,22,34,.72);backdrop-filter:blur(5px);cursor:default}
.mai-review-modal-panel{
    position:relative;z-index:2;
    width:min(700px,100%);
    max-height:92vh;
    overflow:auto;
    padding:34px;
    border-radius:22px;
    background:#fff;
    box-shadow:0 32px 90px rgba(0,0,0,.32);
}
.mai-review-modal-close{position:absolute;right:16px;top:16px;width:38px;height:38px;border:1px solid #dce7ed;border-radius:50%;background:#fff;color:#23343e;cursor:pointer}
.mai-review-modal-panel h2{margin:0 0 8px;color:#20272b;font-family:"MAI GILBI",Arial,sans-serif;font-size:2.65rem;font-weight:400;line-height:1}
.mai-review-modal-panel>p{margin:0 42px 25px 0;color:#6e7b83;font-size:.88rem;line-height:1.6}
.mai-review-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}
.mai-review-form-grid .full{grid-column:1/-1}
.mai-review-form label{display:block;margin-bottom:7px;color:#17384b;font-size:.75rem;font-weight:800}
.mai-review-form label small{display:block;margin-top:2px;color:#7a858c;font-size:.65rem;font-weight:500}
.mai-review-form input[type=text],.mai-review-form select,.mai-review-form textarea{width:100%;padding:12px 13px;border:1px solid #cfdee6;border-radius:8px;background:#fff;color:#263740;font:inherit;outline:none}
.mai-review-form input[type=text]:focus,.mai-review-form select:focus,.mai-review-form textarea:focus{border-color:var(--review-blue);box-shadow:0 0 0 3px rgba(0,101,153,.08)}
.mai-review-rating{display:flex;flex-direction:row-reverse;justify-content:flex-end;gap:4px}
.mai-review-rating input{position:absolute;opacity:0;pointer-events:none}
.mai-review-rating label{margin:0;color:#cbd5da;font-size:1.65rem;cursor:pointer;transition:.15s ease}
.mai-review-rating input:checked~label,.mai-review-rating label:hover,.mai-review-rating label:hover~label{color:#e2a400}
.mai-review-label-row{display:flex;align-items:center;justify-content:space-between;gap:15px}
.mai-review-label-row>span{color:#75828a;font-size:.7rem;font-weight:800}
.mai-review-label-row>span.is-over{color:#b33838}
.mai-review-form textarea{resize:vertical;min-height:125px}
.mai-review-photo-input{display:flex;align-items:center;gap:14px}
.mai-review-photo-input input{min-width:0;flex:1}
.mai-review-photo-input img{width:62px;height:62px;border-radius:50%;object-fit:cover;border:2px solid #dce8ee}
.mai-review-consent{display:flex;gap:10px;align-items:flex-start;margin:18px 0;color:#69777f;font-size:.72rem;line-height:1.5}
.mai-review-consent i{color:var(--review-blue);font-size:1rem;margin-top:1px}
.mai-review-submit{display:inline-flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:14px 18px;border:1px solid var(--review-blue);border-radius:8px;background:var(--review-blue);color:#fff;font-size:.74rem;font-weight:900;letter-spacing:.9px;cursor:pointer}
.mai-review-submit:hover{background:#003b58;border-color:#003b58}
.mai-review-submit:disabled{opacity:.5;cursor:not-allowed}
.mai-review-honeypot{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(1px,1px,1px,1px)!important}
.mai-review-modal-open{overflow:hidden}

@media(max-width:1099px){
    .mai-review-card{flex-basis:calc((100% - 22px)/2)}
}
@media(max-width:767.98px){
    .mai-reviews{padding:62px 0 68px}
    .mai-reviews-heading{display:block;margin-bottom:27px}
    .mai-reviews-heading h2{font-size:clamp(2.15rem,11vw,3rem)}
    .mai-reviews-heading p{font-size:.84rem}
    .mai-review-add{width:100%;margin-top:20px}
    .mai-review-carousel-shell{padding:0 0 55px}
    .mai-review-card{flex-basis:100%;min-height:330px;padding:27px 24px 25px;border-radius:25px}
    .mai-review-card blockquote{font-size:.96rem;line-height:1.68}
    .mai-review-arrow{top:auto;bottom:0;transform:none}
    .mai-review-arrow.is-prev{left:calc(50% - 49px)}
    .mai-review-arrow.is-next{right:calc(50% - 49px)}
    .mai-reviews-empty{align-items:flex-start;flex-wrap:wrap;padding:22px}
    .mai-reviews-empty>div{flex:1 1 calc(100% - 55px)}
    .mai-reviews-empty button{width:100%}
    .mai-review-modal{padding:10px}
    .mai-review-modal-panel{padding:28px 20px 24px;border-radius:18px}
    .mai-review-modal-panel h2{font-size:2.25rem}
    .mai-review-form-grid{grid-template-columns:1fr}
    .mai-review-form-grid .full{grid-column:auto}
    .mai-review-photo-input{align-items:flex-start;flex-direction:column}
    .mai-review-photo-input img{width:72px;height:72px}
}

/* ==========================================================
   MAI REVIEWS — MOBILE SUBMIT VISIBILITY PATCH V3
   The entire modal can scroll, but the submit control itself is
   anchored to the mobile viewport so it is always immediately visible.
   Desktop remains unchanged.
   ========================================================== */
@media (max-width: 767.98px) {
    .mai-review-modal {
        height: 100vh;
        height: 100dvh;
        padding: 0 !important;
        place-items: stretch !important;
        overflow: hidden;
    }

    .mai-review-modal-panel {
        width: 100% !important;
        height: 100vh;
        height: 100dvh;
        max-height: none !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        display: block !important;
        padding: 24px 18px calc(98px + env(safe-area-inset-bottom)) !important;
        border-radius: 0 !important;
    }

    .mai-review-form {
        display: block !important;
        min-height: auto !important;
    }

    .mai-review-form-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        overflow: visible !important;
        min-height: auto !important;
        padding: 0 !important;
    }

    .mai-review-form-grid .full {
        grid-column: auto !important;
    }

    .mai-review-consent {
        margin: 18px 0 8px !important;
        padding: 12px 0 0;
        border-top: 1px solid #e2ebef;
    }

    .mai-review-submit {
        position: fixed !important;
        left: 12px !important;
        right: 12px !important;
        bottom: max(10px, env(safe-area-inset-bottom)) !important;
        z-index: 13050 !important;
        width: auto !important;
        min-height: 56px !important;
        margin: 0 !important;
        padding: 15px 18px !important;
        border: 1px solid #006599 !important;
        border-radius: 10px !important;
        background: #006599 !important;
        color: #fff !important;
        box-shadow: 0 8px 30px rgba(0, 38, 58, .34), 0 0 0 1px rgba(255,255,255,.16) inset !important;
        opacity: 1;
        visibility: visible;
    }

    .mai-review-submit span,
    .mai-review-submit i {
        color: #fff !important;
        visibility: visible !important;
    }

    .mai-review-submit:hover,
    .mai-review-submit:focus-visible,
    .mai-review-submit:active {
        border-color: #004d75 !important;
        background: #004d75 !important;
        color: #fff !important;
    }
}


/* MAI slow automatic review movement. Manual swipe restores normal snap behaviour. */
.mai-review-track.is-auto-scrolling{
    scroll-snap-type:none;
    scroll-behavior:auto;
}
@media (prefers-reduced-motion:reduce){
    .mai-review-track.is-auto-scrolling{scroll-snap-type:x mandatory;}
}