body{margin:0;font-family:'Open Sans',Arial,sans-serif;color:#222;background:#fff}
header{background:#fff;color:#fff;text-align:left;padding:20px 10px}
header img{height:60px}
.hero{background:url('/images/hero.jpg')center/cover no-repeat;color:#fff;text-align:center;padding:140px 20px}
.hero h1{font-size:2.8rem;margin-bottom:10px}
.hero p{font-size:1.3rem;margin-bottom:30px}
.btn{background:#E53935;color:#fff;padding:12px 28px;text-decoration:none;border-radius:30px;font-weight:bold;transition:.3s}
.btn:hover{background:#b91c1c}
section{padding:60px 20px;max-width:unset;margin:auto}
section h2{text-align:center;font-size:2rem;margin-bottom:30px;color:#E53935}
.search-box{background:#f5f5f5;padding:30px;border-radius:10px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin-bottom:40px}
.search-box input,.search-box select{padding:10px;border-radius:5px;border:1px solid #ccc;font-size:1rem}
.search-box button{background:#E53935;border:none;color:#fff;padding:12px;border-radius:5px;cursor:pointer;font-weight:bold;transition:.3s}
.search-box button:hover{background:#b91c1c}
.card-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);/* default: 4 per riga */
  gap: 25px;
  justify-content: center;
  padding: 20px;
}	

/* Tablet orizzontale */
@media (max-width: 1800px) {
  .card-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Tablet verticale */
@media (max-width: 1300px) {
  .tour-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Smartphone */
@media (max-width: 900px) {
  .card-grid {
    grid-template-columns: 1fr;
  }
}
	
.card{border-radius:10px;overflow:hidden;box-shadow:0 4px 10px rgba(0,0,0,.1);transition:.3s;background:#fff}
.card:hover{transform:translateY(-5px)}
.card img{width:100%;height:180px;object-fit:cover}
.card-content{padding:15px}
.card-content h3{margin:0 0 10px;color:#E53935}
footer{background:#000;color:#fff;text-align:center;padding:40px 20px}
footer a{color:#E53935;text-decoration:none;margin:0 10px}
footer a:hover{text-decoration:underline}
@media(max-width:600px){.hero h1{font-size:2rem}.hero p{font-size:1rem}}

/* --- TEAM SECTION --- */
#bikers {
  background: #fff;
  padding: 80px 20px;
  text-align: center;
}

#bikers .intro-text {
  max-width: 750px;
  margin: 0 auto 50px;
  font-size: 1.1rem;
  color: #444;
  line-height: 1.6;
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 40px;
  justify-items: center;
}

.team-member {
  background: #fafafa;
  border-radius: 15px;
  padding: 25px 15px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.1);
  transition: transform 0.3s, box-shadow 0.3s;
  width: 100%;
  max-width: 300px;
}

.team-member:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 14px rgba(0,0,0,0.15);
}

.team-member img {
  width: 140px;
  height: 140px;
  border-radius: 50%;
  border: 4px solid #E53935;
  object-fit: cover;
  margin-bottom: 15px;
}

.team-member h3 {
  margin: 0;
  color: #E53935;
  font-size: 1.3rem;
}

.team-member p {
  margin: 10px 0 0;
  font-size: 0.95rem;
  color: #555;
}

/* --- TOUR SECTION --- */

.tour-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);/* default: 4 per riga */
  gap: 25px;
  justify-content: center;
  padding: 20px;	
}

/* Tablet orizzontale */
@media (max-width: 1800px) {
  .tour-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Tablet verticale */
@media (max-width: 1300px) {
  .tour-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Smartphone */
@media (max-width: 900px) {
  .tour-grid {
    grid-template-columns: 1fr;
  }
}

.tour-card {
  width:400px; /* opzionale, rinforza la larghezza */
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  display: flex;
  flex-direction: column;
}


.tour-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
}

.tour-image {
  position: relative;
}

.tour-image img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.tour-card:hover .tour-image img {
  transform: scale(1.05);
}

.tour-badge-facile {
  position: absolute;
  bottom: 12px;
  left: 12px;
  background: #2e7d32;
  color: #fff;
  font-size: 0.85rem;
  padding: 6px 10px;
  border-radius: 8px;
}

.tour-badge-medio {
  position: absolute;
  bottom: 12px;
  left: 12px;
  background: orange;
  color: #fff;
  font-size: 0.85rem;
  padding: 6px 10px;
  border-radius: 8px;
}

.tour-badge-impegnativo {
  position: absolute;
  bottom: 12px;
  left: 12px;
  background: red;
  color: #fff;
  font-size: 0.85rem;
  padding: 6px 10px;
  border-radius: 8px;
}

.tour-content {
  padding: 18px 20px;
}

.tour-title {
  font-size: 1.25rem;
  color: #1b1b1b;
  margin: 0 0 6px;
}

.tour-description {
  font-size: 0.95rem;
  color: #555;
  line-height: 1.4;
  margin-bottom: 14px;
}

.tour-link {
  text-decoration: none;
  color: #1e88e5;
  font-weight: 600;
  transition: color 0.3s;
}

.tour-link:hover {
  color: #1565c0;
}