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

:root{
  --noir: #0B0B0C;
  --rouge: #FF0000;
  --blanc: #FFFFFF;
  --gris-clair: #9A9A9E;
}

*{ margin:0; padding:0; box-sizing:border-box; }

body{
  min-height:100vh;
  background:var(--noir);
  color:var(--blanc);
  font-family:'Inter', sans-serif;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:32px 24px;
}

.page{
  width:100%;
  max-width:520px;
  text-align:center;
}

.logo{
  width:150px;
  height:auto;
  margin:0 auto 32px;
}

h1{
  font-family:'Anton', sans-serif;
  text-transform:uppercase;
  letter-spacing:.01em;
  line-height:1;
  font-size:clamp(34px, 8vw, 54px);
  color:var(--blanc);
}

h1 span{
  color:var(--rouge);
}

.subtitle{
  margin-top:16px;
  font-size:16px;
  color:var(--gris-clair);
}

.store-buttons{
  margin-top:44px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:18px;
}

.store-buttons a{
  display:inline-block;
  transition:transform .15s ease, opacity .15s ease;
}

.store-buttons a:hover{
  transform:translateY(-2px);
  opacity:.85;
}

.store-buttons img{
  height:56px;
  width:auto;
  display:block;
  background:var(--blanc);
  border-radius:11px;
}

@media (max-width:480px){
  .logo{ width:120px; }
  .store-buttons img{ height:50px; border-radius:10px; }
}

