/*==================================================
    GERMAINE — "REQUEST OUR GRADUATE PROFILE" MODAL
    Premium glass modal, blue/white theme with subtle
    pink accents, matching the .ghire page language
    (--g-pink, --g-blue, --g-radius, --g-ease). Loaded
    only on graduate-hire.html, scoped under .gp- so it
    cannot leak onto any other page.
==================================================*/

.gp-modal{
    position:fixed;
    inset:0;
    z-index:4000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    opacity:0;
    visibility:hidden;
    transition:opacity .35s ease, visibility .35s ease;
}

.gp-modal.is-open{
    opacity:1;
    visibility:visible;
}

.gp-modal-backdrop{
    position:absolute;
    inset:0;
    background:rgba(16, 42, 92, .55);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
}

body.gp-modal-lock{
    overflow:hidden;
}

.gp-modal-panel{
    position:relative;
    width:100%;
    max-width:700px;
    max-height:88vh;
    overflow-y:auto;
    border-radius:28px;
    /* clean white "Request Our Graduate Profile" panel — no pink
       cast, no page-behind bleed-through */
    background:#FFFFFF;
    backdrop-filter:blur(28px) saturate(140%);
    -webkit-backdrop-filter:blur(28px) saturate(140%);
    border:1px solid rgba(255, 255, 255, .7);
    box-shadow:0 40px 90px rgba(16, 42, 92, .35), 0 0 0 1px rgba(236, 72, 153, .08);
    padding:44px 40px 40px;
    transform:translateY(24px) scale(.97);
    opacity:0;
    transition:transform .4s cubic-bezier(.25,.8,.25,1), opacity .4s ease;
}

.gp-modal.is-open .gp-modal-panel{
    transform:translateY(0) scale(1);
    opacity:1;
}

.gp-modal-panel::-webkit-scrollbar{ width:6px; }
.gp-modal-panel::-webkit-scrollbar-thumb{ background:rgba(236, 72, 153, .35); border-radius:10px; }

.gp-modal-close{
    position:absolute;
    top:18px; right:18px;
    width:38px; height:38px;
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background:rgba(16, 42, 92, .06);
    border:1px solid rgba(16, 42, 92, .1);
    color:#102A5C;
    cursor:pointer;
    transition:background .25s ease, transform .25s ease, color .25s ease;
    z-index:2;
}
.gp-modal-close:hover{
    background:#EC4899;
    color:#FFFFFF;
    transform:rotate(90deg);
}
.gp-modal-close i{ width:17px; height:17px; pointer-events:none; }

.gp-modal-head{
    text-align:center;
    max-width:520px;
    margin:0 auto 30px;
}
.gp-modal-icon{
    display:inline-flex; align-items:center; justify-content:center;
    width:56px; height:56px; border-radius:18px;
    background:linear-gradient(135deg, #EC4899, #102A5C);
    color:#FFFFFF;
    margin-bottom:16px;
    box-shadow:0 12px 28px rgba(236, 72, 153, .3);
}
.gp-modal-icon i{ width:26px; height:26px; }
.gp-modal-head h2{
    font-family:var(--font-heading,'Poppins',sans-serif);
    font-weight:800; font-size:1.55rem; color:#102A5C; margin:0 0 10px; line-height:1.25;
}
.gp-modal-head p{
    font-size:.92rem; line-height:1.65; color:rgba(16, 42, 92, .65); margin:0;
}

/* ---------- form layout ---------- */
.gp-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
}

.gp-field{
    margin-bottom:20px;
}
.gp-row .gp-field{ margin-bottom:0; }
.gp-row + .gp-field,
.gp-field + .gp-row{ margin-top:20px; }

.gp-field label{
    display:block;
    font-family:var(--font-button,'Montserrat',sans-serif);
    font-weight:600; font-size:.82rem; color:#102A5C;
    margin-bottom:8px;
    letter-spacing:.2px;
}
.gp-req{ color:#EC4899; }
.gp-optional{ color:rgba(16, 42, 92, .45); font-weight:500; }

.gp-input-wrap{
    position:relative;
    display:flex;
    align-items:center;
    background:rgba(16, 42, 92, .04);
    border:1.5px solid rgba(16, 42, 92, .12);
    border-radius:50px;
    transition:border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.gp-input-wrap:focus-within{
    border-color:#EC4899;
    background:#FFFFFF;
    box-shadow:0 0 0 4px rgba(236, 72, 153, .12);
}
.gp-input-wrap i{
    width:17px; height:17px;
    color:#EC4899;
    margin-left:18px;
    flex-shrink:0;
}
.gp-input-wrap input,
.gp-input-wrap select{
    width:100%;
    border:none;
    background:transparent;
    outline:none;
    padding:13px 18px 13px 12px;
    font-size:.92rem;
    color:#102A5C;
    font-family:var(--font-body,'Open Sans',sans-serif);
    appearance:none;
    -webkit-appearance:none;
}
.gp-input-wrap select{
    cursor:pointer;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23EC4899' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 18px center;
    padding-right:36px;
}
.gp-input-wrap input::placeholder,
.gp-input-wrap textarea::placeholder{
    color:rgba(16, 42, 92, .4);
}

/* textarea variant — rounded rectangle, not a pill */
.gp-input-wrap-textarea{
    border-radius:20px;
    align-items:flex-start;
    padding:2px 0;
}
.gp-input-wrap-textarea i{
    margin-top:15px;
}
.gp-input-wrap-textarea textarea{
    width:100%;
    border:none;
    background:transparent;
    outline:none;
    resize:vertical;
    min-height:96px;
    padding:13px 18px 13px 12px;
    font-size:.92rem;
    line-height:1.6;
    color:#102A5C;
    font-family:var(--font-body,'Open Sans',sans-serif);
}

/* ---------- file upload ---------- */
.gp-file-drop{
    display:flex;
    align-items:center;
    gap:12px;
    border:1.5px dashed rgba(16, 42, 92, .22);
    border-radius:18px;
    background:rgba(16, 42, 92, .03);
    padding:16px 18px;
    cursor:pointer;
    transition:border-color .25s ease, background .25s ease;
}
.gp-file-drop:hover{
    border-color:#EC4899;
    background:rgba(236, 72, 153, .05);
}
.gp-file-drop i{ width:19px; height:19px; color:#EC4899; flex-shrink:0; }
.gp-file-drop span{ font-size:.86rem; color:rgba(16, 42, 92, .65); }
.gp-file-drop input[type="file"]{
    position:absolute;
    width:1px; height:1px;
    opacity:0;
    overflow:hidden;
    clip:rect(0 0 0 0);
}

/* ---------- submit ---------- */
.gp-submit{
    width:100%;
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    margin-top:6px;
    padding:16px 28px;
    border:none; border-radius:50px;
    font-family:var(--font-button,'Montserrat',sans-serif);
    font-weight:700; font-size:.96rem; letter-spacing:.3px;
    color:#FFFFFF; cursor:pointer;
    background:linear-gradient(115deg, #EC4899 0%, #F472B6 55%, #102A5C 100%);
    box-shadow:0 14px 32px rgba(236, 72, 153, .35);
    transition:transform .3s ease, box-shadow .3s ease;
}
.gp-submit:hover{
    transform:translateY(-2px);
    box-shadow:0 20px 42px rgba(236, 72, 153, .45);
}
.gp-submit i{ width:18px; height:18px; }

/* ---------- success card ---------- */
.gp-success{
    text-align:center;
    padding:20px 10px 6px;
}
.gp-success-icon{
    display:inline-flex; align-items:center; justify-content:center;
    width:74px; height:74px; border-radius:50%;
    background:rgba(34, 197, 94, .12);
    color:#22C55E;
    margin-bottom:18px;
}
.gp-success-icon i{ width:38px; height:38px; }
.gp-success h2{
    font-family:var(--font-heading,'Poppins',sans-serif);
    font-weight:800; font-size:1.4rem; color:#102A5C; margin:0 0 12px;
}
.gp-success p{
    font-size:.94rem; line-height:1.7; color:rgba(16, 42, 92, .65);
    max-width:440px; margin:0 auto 26px;
}
.gp-btn-done{
    border:none; border-radius:50px;
    padding:13px 34px;
    font-family:var(--font-button,'Montserrat',sans-serif);
    font-weight:700; font-size:.88rem; color:#FFFFFF; cursor:pointer;
    background:#102A5C;
    transition:background .25s ease, transform .25s ease;
}
.gp-btn-done:hover{
    background:#EC4899;
    transform:translateY(-2px);
}

@media (prefers-reduced-motion: reduce){
    .gp-modal, .gp-modal-panel, .gp-modal-close, .gp-submit, .gp-btn-done{ transition:none !important; }
}

/* ---------- responsive ---------- */
@media(max-width:640px){
    .gp-modal{ padding:14px; align-items:flex-end; }
    .gp-modal-panel{
        max-height:92vh;
        padding:34px 22px 28px;
        border-radius:24px 24px 0 0;
    }
    .gp-row{ grid-template-columns:1fr; gap:20px; }
    .gp-modal-head h2{ font-size:1.3rem; }
}