/* style.css centrerar och gör logo.png rund Ⓐ Style */

:root{
  /* Justera dessa om du vill finlira */
  --top-padding: 40px;
  --logo-width: 50%;
  --max-logo-width: 520px; /* så den inte blir enorm på stora skärmar */
}

body{
  margin: 0;
  padding: 0;
  min-height: 100vh;
  display: flex;
  justify-content: center;   /* centrerar horisontellt */
  align-items: flex-start;   /* håller den i toppen (inte mitten) */
  background: #f3f3f3;
  font-family: Arial, sans-serif;
}

.page{
  width: 100%;
  padding-top: var(--top-padding);
  display: flex;
  justify-content: center;
}

.logo{
  width: var(--logo-width);
  max-width: var(--max-logo-width);
  height: auto;

  /* Gör den rund */
  border-radius: 50%;

  /* Lite luft runt bilden (om du vill) */
  padding: 10px;

  /* För att padding inte ska ”spräcka” 50%-bredden */
  box-sizing: border-box;

  /* Liten schysst skugga */
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}