/**
 * Callback Modal — Chrome & Orange Theme
 */
.modal{display:none;position:fixed;z-index:9999;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);animation:modalBgIn .3s ease}
@keyframes modalBgIn{from{opacity:0}to{opacity:1}}

.modal-content{
    background:#0E0E0E;
    border:1px solid rgba(255,106,0,.1);
    margin:6vh auto;padding:48px 44px 44px;border-radius:20px;
    width:92%;max-width:440px;position:relative;
    box-shadow:0 40px 120px rgba(0,0,0,.6), 0 0 80px rgba(255,106,0,.04);
    animation:modalIn .45s cubic-bezier(.16,1,.3,1);
}
@keyframes modalIn{from{transform:translateY(-28px) scale(.97);opacity:0}to{transform:none;opacity:1}}

.modal .close{
    position:absolute;right:16px;top:14px;font-size:22px;cursor:pointer;
    color:#555;border:none;background:none;width:36px;height:36px;
    display:flex;align-items:center;justify-content:center;border-radius:8px;transition:all .25s ease;
}
.modal .close:hover{color:#FF6A00;background:rgba(255,106,0,.08);transform:rotate(90deg)}

.modal-content h2{
    margin:0 0 32px;font-family:'Oswald',sans-serif;
    font-size:1.3rem;font-weight:600;color:#fff;letter-spacing:3px;text-transform:uppercase;
}

#callback-form input,#callback-form textarea{
    width:100%;padding:14px 18px;margin-bottom:14px;
    border:1px solid rgba(255,255,255,.06);border-radius:12px;font-size:14px;
    background:rgba(255,255,255,.03);color:#fff;font-family:'Montserrat',sans-serif;transition:all .25s ease;
}
#callback-form input:focus,#callback-form textarea:focus{
    outline:none;border-color:#FF6A00;
    box-shadow:0 0 0 3px rgba(255,106,0,.08);background:rgba(255,106,0,.02);
}
#callback-form input::placeholder,#callback-form textarea::placeholder{color:#555}

.phone-input-wrapper{
    display:flex;align-items:center;border:1px solid rgba(255,255,255,.06);
    border-radius:12px;padding:4px 18px;margin-bottom:14px;background:rgba(255,255,255,.03);transition:all .25s ease;
}
.phone-input-wrapper:focus-within{
    border-color:#FF6A00;box-shadow:0 0 0 3px rgba(255,106,0,.08);background:rgba(255,106,0,.02);
}
.phone-prefix{font-weight:700;margin-right:8px;color:#FF6A00;font-size:14px;font-family:'Space Mono',monospace}
.phone-input-wrapper input{border:none!important;flex:1;outline:none;padding:10px 4px!important;margin:0!important;background:transparent!important;box-shadow:none!important}

/* CUSTOM SELECT */
#callback-form select{display:none}
.custom-select-wrapper{position:relative;margin-bottom:14px;z-index:100}
.custom-select-trigger{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 18px;background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.06);border-radius:12px;
    color:#555;cursor:pointer;transition:all .25s ease;font-size:14px;font-family:'Montserrat',sans-serif;
}
.custom-select-trigger.has-value{color:#fff}
.custom-select-trigger:hover{border-color:rgba(255,106,0,.2)}
.custom-select-trigger.open{border-color:#FF6A00;box-shadow:0 0 0 3px rgba(255,106,0,.08);border-radius:12px 12px 0 0}
.custom-select-trigger .arrow{transition:transform .3s cubic-bezier(.16,1,.3,1);font-size:.55rem;color:#555}
.custom-select-trigger.open .arrow{transform:rotate(180deg);color:#FF6A00}

.custom-select-options{
    position:absolute;top:100%;left:0;right:0;
    background:rgba(14,14,14,.98);border:1px solid #FF6A00;border-top:none;
    border-radius:0 0 12px 12px;max-height:0;overflow:hidden;
    transition:max-height .35s cubic-bezier(.16,1,.3,1),opacity .2s ease;
    opacity:0;z-index:200;box-shadow:0 20px 48px rgba(0,0,0,.4);backdrop-filter:blur(16px);
}
.custom-select-options.open{max-height:280px;opacity:1}
.custom-select-option{
    padding:14px 20px;cursor:pointer;color:#888;font-size:13px;
    transition:all .2s ease;border-bottom:1px solid rgba(255,255,255,.03);font-family:'Montserrat',sans-serif;
}
.custom-select-option:last-child{border-bottom:none}
.custom-select-option:hover{background:rgba(255,106,0,.06);color:#FF6A00;padding-left:26px}
.custom-select-option.selected{color:#FF6A00;background:rgba(255,106,0,.04)}

.btn-submit{
    width:100%;height:52px;background:#FF6A00;color:#fff;
    border:none;border-radius:999px;font-size:.82rem;font-weight:700;
    cursor:pointer;transition:all .3s cubic-bezier(.16,1,.3,1);
    text-transform:uppercase;letter-spacing:1.8px;font-family:'Montserrat',sans-serif;
    margin-top:10px;position:relative;overflow:hidden;
}
.btn-submit:hover{background:#FF8C33;transform:translateY(-2px);box-shadow:0 6px 36px rgba(255,106,0,.25)}

@media(min-width:769px){.mobile-only{display:none!important}}
@media(max-width:768px){
    .desktop-only{display:none!important}
    .modal-content{margin:10vh auto;padding:32px 24px;border-radius:16px}
}

.mobile-callback-btn{
    display:none;position:fixed;top:62px;left:50%;
    transform:translateX(-50%) translateY(-80px);z-index:998;
    background:#FF6A00;color:#fff;padding:0 24px;height:40px;
    border-radius:999px;font-size:.68rem;font-weight:700;
    box-shadow:0 4px 20px rgba(255,106,0,.25);opacity:0;
    transition:all .35s cubic-bezier(.16,1,.3,1);border:none;cursor:pointer;
    text-transform:uppercase;letter-spacing:1.2px;font-family:'Montserrat',sans-serif;
    align-items:center;justify-content:center;
}
.mobile-callback-btn.visible{transform:translateX(-50%) translateY(0);opacity:1}
@media(max-width:768px){.mobile-callback-btn{display:flex}}

/* NOTIFICATIONS */
.notification-toast{
    position:fixed;top:20px;right:20px;max-width:380px;padding:18px 22px;
    background:#0E0E0E;border:1px solid rgba(255,255,255,.05);
    border-radius:16px;box-shadow:0 24px 72px rgba(0,0,0,.5);
    display:flex;align-items:center;gap:14px;z-index:99999;
    transform:translateX(calc(100% + 30px));transition:transform .4s cubic-bezier(.16,1,.3,1);
}
.notification-toast.show{transform:translateX(0)}
.notification-success{border-left:3px solid #FF6A00}
.notification-error{border-left:3px solid #ff4444}
.notification-icon{font-size:24px;flex-shrink:0}
.notification-content{flex:1}
.notification-title{font-weight:600;font-size:14px;color:#fff;margin-bottom:3px}
.notification-message{font-size:12px;color:#888}
.notification-close{background:none;border:none;font-size:20px;color:#555;cursor:pointer;padding:0;line-height:1;transition:color .2s}
.notification-close:hover{color:#FF6A00}
@media(max-width:768px){.notification-toast{left:12px;right:12px;max-width:none;top:12px}}