/* TadikaPro website styles. Most layout lives in inline styles on each page (exported from the design);
   this file holds the shared classes, hover/focus states and component styles. */


body{margin:0}
a{color:#1D0E3C}a:hover{color:#573FAE}
.in{width:min(1180px,calc(100% - 64px));margin:0 auto}
.flink{color:inherit;text-decoration:none;white-space:nowrap;transition:color .15s}
.flink:hover{color:#1D0E3C;text-decoration:underline}
.stb{display:block;border-radius:8px;transition:transform .15s}
.stb:hover{transform:translateY(-2px)}
.stb:focus-visible{outline:3px solid #755DCB;outline-offset:3px}
.sv-item[data-s]:hover{background:rgba(255,255,255,.09)}
.sv-item:focus-visible{outline:2px solid #755DCB;outline-offset:-2px}
.sk{background:linear-gradient(90deg,var(--c1),var(--c2),var(--c1));background-size:200% 100%;animation:skm 2.4s ease-in-out infinite}
@keyframes skm{0%{background-position:100% 0}100%{background-position:-100% 0}}
.av-b{width:38px;height:38px;border-radius:50%;border:0;background:#FFFFFF;box-shadow:0 0 0 1px #E7E3EF,0 4px 10px rgba(29,14,60,.1);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:transform .15s,box-shadow .15s}
.av-b:hover{transform:scale(1.07);box-shadow:0 0 0 1px #CFC6E2,0 6px 14px rgba(29,14,60,.16)}
.av-b:focus-visible,.av-dot:focus-visible{outline:3px solid #755DCB;outline-offset:2px}
@media (prefers-reduced-motion:reduce){.sk{animation:none}.av-phone{transition:none!important}}
.soc{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--bg,var(--c));color:#FFFFFF;text-decoration:none;box-shadow:0 4px 10px rgba(29,14,60,.16);transition:transform .18s,box-shadow .18s,filter .18s}
.soc:hover{color:#FFFFFF;transform:translateY(-2px);box-shadow:0 10px 20px rgba(29,14,60,.24);filter:brightness(1.07)}
.soc:focus-visible{outline:3px solid #755DCB;outline-offset:2px}
.fl{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:#1D0E3C}
.fi{font:inherit;font-weight:400;font-size:15px;color:#1D0E3C;padding:13px 14px;border:0;border-radius:12px;background:#F9F7FC;box-shadow:inset 0 0 0 1px #E7E3EF;outline:none}
.fi:focus{box-shadow:inset 0 0 0 2px #1D0E3C;background:#FFFFFF}
.fi.err{box-shadow:inset 0 0 0 2px #D52E88}

#totop{position:fixed;right:28px;bottom:28px;width:52px;height:52px;border-radius:50%;border:0;cursor:pointer;color:#FFFFFF;background:linear-gradient(180deg,#442A7B,#1D0E3C);box-shadow:0 10px 24px rgba(29,14,60,.35);display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .25s,transform .25s,box-shadow .2s;z-index:50}#totop.show{opacity:1;transform:none;pointer-events:auto}#totop:hover{box-shadow:0 14px 30px rgba(29,14,60,.5);transform:translateY(-2px)}#totop:focus-visible{outline:3px solid #1D0E3C;outline-offset:3px}@media (prefers-reduced-motion:reduce){#totop{transition:none}}

nav.mainnav{transition:box-shadow .2s,background-color .2s}
nav.mainnav.stuck{background-color:rgba(255,255,255,.9)!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px rgba(230,228,236,.9),0 10px 30px rgba(29,14,60,.10)!important}
nav.mainnav .mlink{cursor:pointer;text-decoration:none;color:inherit;padding:6px 0;border-bottom:2px solid transparent;transition:color .15s,border-color .15s}
nav.mainnav .mlink:hover{color:#1D0E3C;border-bottom-color:#C2B7D9}
nav.mainnav .mlink.cur{color:#1D0E3C;border-bottom-color:#4CD483}
section[id]{scroll-margin-top:100px}
@media (max-width:1320px){nav.mainnav>div:nth-child(2){gap:16px!important;font-size:13.5px!important}nav.mainnav{padding-left:10px!important;padding-right:10px!important}}
@media (max-width:1180px){nav.mainnav>div:nth-child(2){gap:12px!important;font-size:13px!important}}

@keyframes nlshake{0%,100%{transform:translateX(0)}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}.nl-shake{animation:nlshake .35s}@media (prefers-reduced-motion:reduce){.nl-shake{animation:none}}

@keyframes skpulse{0%,100%{opacity:1}50%{opacity:.55}}.rpanel .skb{animation:skpulse 1.8s ease-in-out infinite}@media (prefers-reduced-motion:reduce){.rpanel .skb{animation:none}}

.fqh:focus-visible{outline:2px solid #1D0E3C;outline-offset:-2px;border-radius:16px}

#tmodal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center}#tmodal[hidden]{display:none}
.tm-back{position:absolute;inset:0;background:rgba(29,14,60,.45);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.tm-card{position:relative;width:480px;max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);overflow:auto;background:#FFFFFF;border-radius:24px;padding:30px;box-sizing:border-box;display:flex;flex-direction:column;gap:14px;box-shadow:0 30px 80px rgba(29,14,60,.3);margin:0;font-family:Inter,system-ui,sans-serif}
.tm-x{position:absolute;top:14px;right:16px;width:34px;height:34px;border-radius:50%;border:0;background:#F1EEF6;color:#1D0E3C;font-size:20px;cursor:pointer}
.tm-h{font-family:Poppins,system-ui,sans-serif;font-weight:600;font-size:22px;color:#1D0E3C}.tm-p{margin:-8px 0 0;font-size:14px;color:#615776}
.stars{display:flex;gap:4px}.stars button{border:0;background:none;font-size:28px;line-height:1;color:#DDD7EB;cursor:pointer;padding:0 2px}.stars button.on{color:#F5B800}
.tm-ck{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.5;color:#615776}.tm-ck input{margin-top:3px;accent-color:#1D0E3C;width:16px;height:16px;flex:none}
.tm-msg{font-size:13px;color:#D52E88}.tm-btn{font:inherit;font-weight:600;font-size:16px;color:#FFFFFF;background:linear-gradient(180deg,#442A7B,#1D0E3C);border:0;border-radius:14px;padding:14px;cursor:pointer}


/* Legal pages (Terma, Privasi, PDPA) */
html{scroll-behavior:smooth}
.page-legal .in{width:1180px}
.page-legal .toc{display:flex;gap:10px;align-items:flex-start;padding:7px 10px 7px 14px;margin-left:-1px;border-left:2px solid transparent;border-radius:0 8px 8px 0;font-size:13px;line-height:1.4;color:#615776;text-decoration:none;transition:background .15s,color .15s}
.page-legal .toc .tn{width:14px;flex:none;color:#ACA4BC}
.page-legal .toc:hover{color:#1D0E3C;background:#F6F3FC}
.page-legal .toc.on{color:#1D0E3C;font-weight:600;border-left-color:#1D0E3C;background:#EFEBFA}
.page-legal .toc.on .tn{color:#1D0E3C}
.page-legal .toc:focus-visible{outline:2px solid #1D0E3C;outline-offset:2px}
.page-legal .role{font:inherit;font-size:13px;font-weight:500;color:#1D0E3C;padding:7px 12px;border-radius:999px;border:0;box-shadow:0 0 0 1px #E7E3EF;background:#FFFFFF;cursor:pointer;transition:all .15s}
.page-legal .role:hover{box-shadow:0 0 0 1px #1D0E3C;color:#1D0E3C}
.page-legal .role.on{background:#1D0E3C;color:#FFFFFF;box-shadow:0 0 0 1px #1D0E3C}
.page-legal .role:focus-visible{outline:2px solid #1D0E3C;outline-offset:2px}
.page-legal .rtag{font-size:11px;font-weight:600;color:#1D0E3C;background:#EFEBFA;padding:3px 9px;border-radius:999px;transition:all .15s}
.page-legal .rtag.hit{background:#1D0E3C;color:#FFFFFF}
.page-legal .relpill{display:none;font-size:11px;font-weight:600;color:#3F8F52;background:#E8F4EA;padding:4px 10px;border-radius:999px;margin-left:auto}
.page-legal .psec{transition:opacity .2s}
.page-legal .psec.rel .relpill{display:inline-block}
.page-legal .psec.dim{opacity:.45}
.page-legal .tdot{width:6px;height:6px;border-radius:50%;background:#1D0E3C;margin-left:auto;margin-top:6px;flex:none;display:none}
.page-legal .toc.rel .tdot{display:block}


/* Legal pages (Terma, Privasi, PDPA) */
.page-legal aside>div{top:96px!important}
.page-legal .psec{scroll-margin-top:92px!important}