@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');

:root{
  --biot-blue:#253E6E;
  --biot-honey:#F4A300;
  --biot-navy:#0B1B3B;
  --biot-gray:#f8fafc;
}

html,body{height:100%}
body{
  font-family:'Inter',system-ui,Arial,sans-serif;
  background:var(--biot-gray);
}

.bg-biot-blue{background:var(--biot-blue)!important;}
.text-biot-blue{color:var(--biot-blue)!important;}

.card{
  border:none;
  border-radius:1rem;
  overflow:hidden;
  box-shadow:0 6px 14px rgba(0,0,0,.06);
}

.card-header{
  background:linear-gradient(135deg,var(--biot-blue) 0%,var(--biot-navy) 100%);
  padding:.65rem 1rem;
}

.slot{
  width:100%;
  height:44px;
  border:none;
  border-radius:.6rem;
  font-weight:500;
  transition:transform .15s ease;
}
.slot:hover{transform:translateY(-2px);}
.slot.free{
  background:var(--biot-honey);
  color:#fff;
}
.slot.taken{
  background:#ced4da;
  color:#fff;
  cursor:not-allowed;
}

@media (max-width:576px){
  h1{font-size:1.75rem;}
}