* { 
    margin: 0; 
    padding: 0; 
    box-sizing: border-box; 
  }
  
  html {
    /* Można usunąć 'height: 100%' z poprzedniej reguły, 
       ponieważ 'min-height: 100vh' na body jest wystarczające. */
  }
  
  body {
    font-family: 'Segoe UI', sans-serif;
    color: #222;
    background: #fff;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
  }
  
  main#content {
    flex: 1 0 auto;
  }

  /* base.css (lub wspólny styl dla kart) */
.card:hover {
  transform: translateY(-10px) scale(1.02);
  box-shadow: 0 20px 40px rgba(0,0,0,0.1);
  transition: all 0.4s ease;
}

.card i, .feature-icon {
  transition: transform 0.4s ease;
}

.card:hover i, .feature-card:hover .feature-icon {
  transform: scale(1.2) rotate(3deg);
}


@media (min-width: 2000px) {
  .hero {
    padding: 8rem 2rem;
  }
  .feature-card {
    padding: 3rem 2.5rem;
  }
}

/* Optymalizacje dla urządzeń dotykowych */
.touch-device * {
  -webkit-tap-highlight-color: rgba(0,0,0,0.1);
}

.touch-device .btn,
.touch-device .nav-link,
.touch-device .card {
  cursor: pointer;
}

/* Zapobieganie zoom na input focus na iOS */
@media screen and (-webkit-min-device-pixel-ratio:0) {
  select,
  textarea,
  input[type="text"],
  input[type="password"],
  input[type="datetime"],
  input[type="datetime-local"],
  input[type="date"],
  input[type="month"],
  input[type="time"],
  input[type="week"],
  input[type="number"],
  input[type="email"],
  input[type="url"],
  input[type="search"],
  input[type="tel"],
  input[type="color"] {
    font-size: 16px;
  }
}