body { background-color: #f8f9fa; font-family: 'Poppins', sans-serif; }

        .custom-card { border-radius: 12px; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); }

        .custom-header2 {
            background: linear-gradient(45deg, #007bff, #00d4ff);
            color: white;
            font-weight: bold;
            text-align: center;
            padding: 10px;
            border-radius: 8px 8px 0 0;
            position: relative;
        }

        .custom-header {
            background: linear-gradient(45deg, #007bff, #00d4ff);
            color: white;
            font-weight: bold;
            padding: 10px;
            border-radius: 8px 8px 0 0;
            position: relative;
            min-height: 50px;
        }

        .btn-custom { transition: 0.3s; font-weight: bold; }
        .btn-custom:hover { background: #007bff !important; color: white !important; transform: scale(1.05); }

        /* accordion: lasciato invariato */
        .accordion-header { text-align: center; width: 100%; }
        .accordion-button { display: flex; justify-content: center; text-align: center; border-radius: 0 !important; }
        .accordion-button::after { margin-left: auto; }
        .accordion-body { text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; }
        .accordion-item { border-bottom: 2px solid #ddd; }
        .accordion-button:not(.collapsed) { border-bottom: 1px solid #ddd; }

        .back-btn { background: none; border: none; color: white; font-size: 1.8rem; padding: 0; line-height: 1; }

        #map { width: 100%; height: 400px; }

        /* ---- NEW: facts layout (sostituisce tabella) ---- */
        .fact {
            border: 1px solid rgba(0,0,0,.08);
            border-radius: .75rem;
            padding: .85rem 1rem;
            background: #fff;
            height: 100%;
        }
        .fact .label { font-size: .85rem; opacity: .7; margin-bottom: .15rem; }
        .fact .value { font-weight: 600; }

        /* ---- NEW: Amenities & Services ---- */
        .services-card .card-header {
            background: #fff;
            font-weight: 800;
            border-bottom: 1px solid rgba(0,0,0,.08);
        }
        .services-cat-title {
            font-weight: 800;
            margin-top: .75rem;
            margin-bottom: .35rem;
            font-size: .95rem;
            opacity: .85;
        }
        .badge-service {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .65rem;
            border: 1px solid rgba(0,0,0,.08);
            background: #f8f9fa;
            color: #212529;
            margin: .25rem .25rem 0 0;
            border-radius: 999px;
            font-weight: 600;
            white-space: nowrap;
        }
        .badge-service i { opacity: .85; }

        .heart-wrap { position: relative; }
		
		
		/* Header card servizi: gradiente come il resto */
		.services-card .card-header {
		  background: linear-gradient(45deg, #007bff, #00d4ff);
		  color: #fff;
		  font-weight: 800;
		  border-bottom: 0;
		  padding: 0; /* perché dentro mettiamo il button */
		}

		/* Bottone header: mantiene colore bianco */
		.services-card .card-header .btn {
		  color: #fff;
		}

		/* Pills più “vive” (blu soft) */
		.badge-service{
		  background: rgba(13,110,253,.10);
		  border-color: rgba(13,110,253,.28);
		}
		
		/* Icona che ruota nel collapse header */
		.chevron-rotate {
		  transition: transform .2s ease;
		}

		/* Quando il collapse è aperto aria-expanded="true" => ruota 180° */
		.services-card .card-header button[aria-expanded="true"] .chevron-rotate {
		  transform: rotate(180deg);
		}