/* AI Mazen Costa — floating assistant (comic style) */
.mc-ai-launcher{position:fixed;bottom:24px;inset-inline-end:24px;z-index:900;width:76px;height:76px;border-radius:50%;background:var(--red);border:4px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:0;cursor:pointer;display:grid;place-items:center;transition:transform .3s cubic-bezier(.3,1.7,.5,1),box-shadow .2s;animation:aiBob 3.6s ease-in-out infinite}
.mc-ai-launcher:hover{transform:scale(1.1) rotate(-6deg);box-shadow:8px 8px 0 var(--ink)}
.mc-ai-launcher::before{content:"";position:absolute;inset:-10px;border-radius:50%;border:3px solid var(--red);opacity:0;animation:aiRing 2.6s ease-out infinite}
.mc-ai-launcher img{width:62px;height:62px;border-radius:50%;object-fit:cover;background:#fff;border:3px solid #fff}
.mc-ai-launcher .ai-badge{position:absolute;top:-8px;inset-inline-start:-8px;background:var(--ink);color:#fff;font:900 12px/1 var(--body);padding:5px 7px;border-radius:20px;border:2px solid #fff;letter-spacing:.04em}
.mc-ai-launcher .ai-x{display:none;color:#fff;font:900 30px/1 var(--body)}
.mc-ai-launcher.open img,.mc-ai-launcher.open .ai-badge{display:none}
.mc-ai-launcher.open .ai-x{display:block}
.mc-ai-launcher.open{animation:none}
@keyframes aiBob{50%{transform:translateY(-7px)}}
@keyframes aiRing{0%{transform:scale(.85);opacity:.8}100%{transform:scale(1.35);opacity:0}}
.mc-ai-tip{position:fixed;bottom:112px;inset-inline-end:24px;z-index:899;background:#fff;color:var(--ink);border:3px solid var(--ink);border-radius:18px;box-shadow:4px 4px 0 var(--ink);padding:8px 16px;font:900 14px var(--body);max-width:220px;opacity:0;transform:translateY(10px) scale(.9);transition:opacity .4s,transform .5s cubic-bezier(.3,1.7,.5,1);pointer-events:none}
.mc-ai-tip.show{opacity:1;transform:none}
.mc-ai-tip::after{content:"";position:absolute;bottom:-11px;inset-inline-end:26px;width:16px;height:16px;background:#fff;border-inline-end:3px solid var(--ink);border-bottom:3px solid var(--ink);transform:rotate(45deg)}

.mc-ai-panel{position:fixed;bottom:116px;inset-inline-end:24px;z-index:901;width:390px;max-width:calc(100vw - 28px);height:560px;max-height:calc(100vh - 140px);display:flex;flex-direction:column;background:var(--paper);border:4px solid var(--ink);border-radius:26px;box-shadow:10px 10px 0 var(--ink);overflow:hidden;transform:translateY(20px) scale(.92) rotate(1.5deg);transform-origin:bottom right;opacity:0;visibility:hidden;pointer-events:none;transition:transform .45s cubic-bezier(.3,1.5,.5,1),opacity .25s,visibility .45s}
html[dir=rtl] .mc-ai-panel{transform-origin:bottom left}
.mc-ai-panel.open{transform:none;opacity:1;visibility:visible;pointer-events:auto}
.mc-ai-head{display:flex;align-items:center;gap:12px;background:var(--red);color:#fff;padding:12px 16px;border-bottom:4px solid var(--ink);position:relative;overflow:hidden}
.mc-ai-head::before{content:"";position:absolute;inset:0;background:radial-gradient(rgba(255,255,255,.22) 1.6px,transparent 2px) 0 0/16px 16px;-webkit-mask-image:linear-gradient(90deg,transparent 30%,#000);mask-image:linear-gradient(90deg,transparent 30%,#000)}
.mc-ai-head img{width:48px;height:48px;border-radius:50%;object-fit:cover;background:#fff;border:3px solid var(--ink);position:relative}
.mc-ai-head .who{position:relative;flex:1;line-height:1.25}
.mc-ai-head .who b{display:block;font:400 25px/1 var(--disp);letter-spacing:.05em}
html[lang=ar] .mc-ai-head .who b{font-weight:900;font-size:19px}
.mc-ai-head .who small{font:700 12px var(--body);display:flex;align-items:center;gap:6px}
.mc-ai-head .who small::before{content:"";width:9px;height:9px;border-radius:50%;background:#7CFF9B;border:2px solid var(--ink)}
.mc-ai-head button{position:relative;background:#fff;color:var(--ink);border:3px solid var(--ink);border-radius:50%;width:34px;height:34px;font:900 16px/1 var(--body);cursor:pointer;box-shadow:2px 2px 0 var(--ink)}
.mc-ai-msgs{flex:1;overflow-y:auto;padding:16px 14px 6px;display:flex;flex-direction:column;gap:12px;background:radial-gradient(rgba(17,17,17,.09) 1.2px,transparent 1.6px) 0 0/16px 16px}
.mc-msg{max-width:88%;padding:10px 14px;border:3px solid var(--ink);border-radius:18px;font:600 15px/1.65 var(--body);white-space:pre-line;box-shadow:3px 3px 0 var(--ink);animation:msgIn .4s cubic-bezier(.3,1.6,.5,1)}
@keyframes msgIn{from{opacity:0;transform:translateY(10px) scale(.92)}}
.mc-msg.bot{background:#fff;color:var(--ink);align-self:flex-start;border-end-start-radius:4px}
.mc-msg.user{background:var(--red);color:#fff;align-self:flex-end;border-end-end-radius:4px}
.mc-msg a{display:inline-block;margin-top:8px;font-weight:900;color:var(--red);text-decoration:underline;text-underline-offset:3px}
.mc-msg .links{display:flex;flex-wrap:wrap;gap:6px 14px}
.mc-typing{align-self:flex-start;display:flex;gap:5px;background:#fff;border:3px solid var(--ink);border-radius:18px;padding:12px 16px}
.mc-typing i{width:8px;height:8px;border-radius:50%;background:var(--ink);animation:tdot 1s infinite}
.mc-typing i:nth-child(2){animation-delay:.15s}.mc-typing i:nth-child(3){animation-delay:.3s}
@keyframes tdot{50%{transform:translateY(-5px);background:var(--red)}}
.mc-chips{display:flex;flex-wrap:wrap;gap:8px;padding:8px 14px 10px;border-top:3px solid var(--ink);background:#fff;max-height:104px;overflow-y:auto}
.mc-chips button{font:900 13px var(--body);background:#fff;color:var(--ink);border:2px solid var(--ink);border-radius:30px;padding:3px 13px;cursor:pointer;box-shadow:2px 2px 0 var(--ink);transition:transform .15s,background .15s,color .15s}
.mc-chips button:hover{background:var(--red);color:#fff;transform:translate(-1px,-1px)}
.mc-ai-form{display:flex;gap:8px;padding:10px 12px 12px;background:#fff;border-top:3px solid var(--ink)}
.mc-ai-form input{flex:1;min-width:0;font:600 15px var(--body);border:3px solid var(--ink);border-radius:30px;padding:8px 16px;background:var(--paper);color:var(--ink);outline:none}
.mc-ai-form input:focus{background:#fff;box-shadow:3px 3px 0 var(--red)}
.mc-ai-form button{width:46px;height:46px;flex:none;border-radius:50%;background:var(--ink);color:#fff;border:3px solid var(--ink);font:900 18px/1 var(--body);cursor:pointer;box-shadow:3px 3px 0 var(--red);transition:transform .15s}
.mc-ai-form button:hover{transform:rotate(-12deg) scale(1.08)}
html[dir=rtl] .mc-ai-form button span{display:inline-block;transform:scaleX(-1)}
.mc-ai-note{font:600 11px var(--body);text-align:center;padding:0 12px 8px;color:#77716A;background:#fff}
@media(max-width:520px){.mc-ai-panel{inset-inline:10px;width:auto;bottom:108px;height:calc(100vh - 130px)}.mc-ai-launcher{width:66px;height:66px;bottom:18px;inset-inline-end:16px}.mc-ai-launcher img{width:52px;height:52px}.mc-ai-tip{bottom:96px;inset-inline-end:16px}}
@media(prefers-reduced-motion:reduce){.mc-ai-launcher,.mc-ai-launcher::before{animation:none}}

/* ---- Hero ask box + "ask any AI about me" menu ---- */
.ask-hero{position:relative;margin:22px 0 4px;max-width:560px}
.ask-box{display:flex;align-items:center;gap:8px;background:#fff;border:3px solid var(--ink);border-radius:40px;box-shadow:5px 5px 0 var(--ink);padding:6px 6px 6px 16px;transition:box-shadow .2s,transform .2s}
.ask-box:focus-within{box-shadow:7px 7px 0 var(--ink);transform:translate(-1px,-1px)}
.ask-dot{flex:none;width:11px;height:11px;border-radius:50%;background:#2fd35a;border:2px solid var(--ink)}
.ask-box input{flex:1;min-width:0;font:700 16px var(--body);border:0;background:transparent;color:var(--ink);outline:none;padding:8px 4px}
.ask-box input::placeholder{color:#6b6b6b;font-weight:600}
.ask-box button{flex:none;width:44px;height:44px;border-radius:50%;background:var(--red);color:#fff;border:3px solid var(--ink);font:900 17px/1 var(--body);cursor:pointer;box-shadow:2px 2px 0 var(--ink);transition:transform .15s}
.ask-box button:hover{transform:scale(1.08) rotate(-6deg)}
.ask-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.ask-chips button{font:900 13px var(--body);background:#fff;color:var(--ink);border:2px solid var(--ink);border-radius:30px;padding:4px 14px;cursor:pointer;box-shadow:2px 2px 0 var(--ink);transition:transform .15s,background .15s,color .15s}
.ask-chips button:hover{background:var(--ink);color:#fff;transform:translate(-1px,-1px)}
.ask-ext{position:relative;margin-top:12px;display:inline-block}
.ask-ext-btn{font:800 14px var(--body);background:transparent;color:#fff;border:0;border-bottom:2px dashed rgba(255,255,255,.7);padding:2px 0;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.ask-ext-btn:hover{border-bottom-style:solid}
.ask-ext-btn i{font-style:normal;transition:transform .25s;display:inline-block}
.ask-ext.open .ask-ext-btn i{transform:rotate(180deg)}
.ask-menu{position:absolute;inset-inline-start:0;bottom:calc(100% + 12px);width:min(380px,86vw);background:#fff;color:var(--ink);border:3px solid var(--ink);border-radius:20px;box-shadow:6px 6px 0 var(--ink);padding:8px;opacity:0;visibility:hidden;transform:translateY(8px) scale(.97);transform-origin:bottom;transition:opacity .2s,transform .25s cubic-bezier(.3,1.5,.5,1),visibility .2s;z-index:60}
.ask-ext.open .ask-menu{opacity:1;visibility:visible;transform:none}
.ask-menu small{display:block;font:900 12px var(--body);color:#6b6b6b;padding:6px 10px 4px}
.ask-menu a{display:flex;align-items:center;gap:12px;padding:10px;border-radius:14px;color:var(--ink);text-decoration:none;transition:background .15s}
.ask-menu a:hover{background:#f4f1ec}
.ask-menu a b{display:block;font:900 15px var(--body)}
.ask-menu a span{display:block;font:600 12px/1.4 var(--body);color:#6b6b6b}
.ask-menu a em{flex:none;width:38px;height:38px;border-radius:12px;border:2px solid var(--ink);display:grid;place-items:center;font:900 15px var(--body);font-style:normal;background:var(--paper)}
@media(max-width:520px){.ask-hero{max-width:none}.ask-menu{width:calc(100vw - 36px)}}
.ask-menu a em img{width:22px;height:22px;display:block}
