@tailwind base;
@tailwind components;
@tailwind utilities;

:root{color-scheme:dark}

.nav-link{display:inline-flex;align-items:center;gap:.5rem;border-radius:.75rem;padding:.5rem .75rem;font-weight:600;color:rgb(226 232 240);transition:transform .15s ease,background-color .15s ease,color .15s ease}
.nav-link:hover{background-color:rgb(255 255 255 / .08);transform:translateY(-1px)}
.nav-link:focus{outline:2px solid transparent;outline-offset:2px;box-shadow:0 0 0 3px rgb(147 197 253 / .55)}

.menu-link{font-family:ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;font-size:1.5rem;line-height:2rem;color:rgb(248 250 252);padding:.75rem 1rem;border-radius:1rem;transition:transform .15s ease,background-color .15s ease,opacity .15s ease}
.menu-link:hover{background-color:rgb(255 255 255 / .08);transform:translateY(-2px)}
.menu-link:focus{outline:2px solid transparent;outline-offset:2px;box-shadow:0 0 0 4px rgb(147 197 253 / .55)}

.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.9rem;padding:.75rem 1rem;font-weight:700;background-image:linear-gradient(to bottom right,#bfdbfe,#2563eb);color:rgb(15 23 42);box-shadow:0 10px 30px rgb(37 99 235 / .25);transition:transform .15s ease,filter .15s ease,box-shadow .15s ease}
.btn-primary:hover{transform:translateY(-1px);filter:saturate(1.05);box-shadow:0 14px 34px rgb(37 99 235 / .3)}
.btn-primary:focus{outline:2px solid transparent;outline-offset:2px;box-shadow:0 0 0 4px rgb(147 197 253 / .6),0 14px 34px rgb(37 99 235 / .3)}
.btn-primary:active{transform:translateY(0)}
.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}

.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.9rem;padding:.75rem 1rem;font-weight:700;border:1px solid rgb(255 255 255 / .16);background-color:rgb(255 255 255 / .06);color:rgb(248 250 252);transition:transform .15s ease,background-color .15s ease,border-color .15s ease}
.btn-secondary:hover{background-color:rgb(255 255 255 / .1);transform:translateY(-1px)}
.btn-secondary:focus{outline:2px solid transparent;outline-offset:2px;box-shadow:0 0 0 4px rgb(147 197 253 / .55)}
.btn-secondary:active{transform:translateY(0)}
.btn-secondary:disabled{opacity:.6;cursor:not-allowed;transform:none}

.card{border-radius:1rem;border:1px solid rgb(255 255 255 / .12);background-color:rgb(255 255 255 / .04);padding:1.25rem;box-shadow:0 10px 26px rgb(0 0 0 / .25);transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease}
.card:hover{transform:translateY(-3px);background-color:rgb(255 255 255 / .06);box-shadow:0 16px 34px rgb(0 0 0 / .35)}
.card:focus-within{box-shadow:0 0 0 4px rgb(147 197 253 / .45),0 16px 34px rgb(0 0 0 / .35)}

.icon-badge{display:inline-flex;height:2.5rem;width:2.5rem;align-items:center;justify-content:center;border-radius:1rem;border:1px solid rgb(255 255 255 / .12);background-image:linear-gradient(to bottom right,rgb(191 219 254 / .15),rgb(37 99 235 / .15));color:rgb(191 219 254)}

.footer-link{color:rgb(226 232 240);text-decoration:none;transition:color .15s ease,opacity .15s ease}
.footer-link:hover{color:rgb(191 219 254)}
.footer-link:focus{outline:2px solid transparent;outline-offset:2px;box-shadow:0 0 0 3px rgb(147 197 253 / .55);border-radius:.5rem}

img{max-width:100%;height:auto;display:block}

:focus-visible{outline:2px solid transparent;outline-offset:2px;box-shadow:0 0 0 4px rgb(147 197 253 / .55)}

@media (prefers-reduced-motion:reduce){
  .btn-primary,.btn-secondary,.nav-link,.menu-link,.card{transition:none}
}