/* Motorfy marketing site: friendly first-visit "are you a driver or a workshop?" modal, shared
   by index.html and business.html. Reuses the page's own --purple/--lav/etc custom properties,
   same as chat-widget.css - see that file's header comment for why that works without
   redeclaring them here. */

#mfy-am-overlay{
  position:fixed;inset:0;z-index:300;background:rgba(28,21,48,.5);
  display:flex;align-items:center;justify-content:center;padding:20px;
  opacity:0;pointer-events:none;transition:opacity .2s;
}
#mfy-am-overlay.is-open{opacity:1;pointer-events:auto}

#mfy-am-card{
  width:min(460px,100%);background:#fff;border-radius:24px;
  box-shadow:0 30px 70px -20px rgba(28,21,48,.5);padding:32px 28px 28px;text-align:center;
  position:relative;transform:translateY(14px) scale(.97);transition:transform .2s;
}
#mfy-am-overlay.is-open #mfy-am-card{transform:none}

#mfy-am-close{
  position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;color:var(--muted);cursor:pointer;border:none;background:none;
}
#mfy-am-close:hover{background:var(--lav);color:var(--text)}
#mfy-am-close svg{width:16px;height:16px}

.mfy-am-emoji{
  width:52px;height:52px;border-radius:14px;background:var(--lav);color:var(--purple);
  display:flex;align-items:center;justify-content:center;margin:0 auto 16px;
}
.mfy-am-emoji svg{width:26px;height:26px}
#mfy-am-card h2{font-size:22px;font-weight:700;letter-spacing:-.01em;line-height:1.25;margin-bottom:8px;color:var(--text)}
#mfy-am-card p{font-size:14.5px;color:var(--muted);line-height:1.5;max-width:34ch;margin:0 auto 24px}

.mfy-am-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mfy-am-opt{
  display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px 12px;
  background:var(--lav);border:1.5px solid var(--lav-2);border-radius:16px;cursor:pointer;
  transition:border-color .15s,background-color .15s,transform .15s;
}
.mfy-am-opt:hover{border-color:var(--purple);background:var(--white);transform:translateY(-2px)}
.mfy-am-ic{
  width:40px;height:40px;border-radius:11px;background:var(--white);border:1px solid var(--lav-2);
  color:var(--purple);display:flex;align-items:center;justify-content:center;flex:none;
}
.mfy-am-ic svg{width:22px;height:22px}
.mfy-am-opt b{font-size:15px;font-weight:650;color:var(--text)}
.mfy-am-opt span{font-size:12.5px;color:var(--muted);line-height:1.3}

@media (prefers-reduced-motion:reduce){
  #mfy-am-overlay,#mfy-am-card,.mfy-am-opt{transition:none}
}
@media (max-width:420px){
  .mfy-am-options{grid-template-columns:1fr}
}