* { margin:0; padding:0; box-sizing:border-box; font-family:'Arial',sans-serif; }
body { background:#f9f9f9; color:#333; line-height:1.6; }
.container { max-width:1200px; margin:0 auto; padding:0 15px; }
header { background:#e91e63; color:white; padding:20px 0; text-align:center; }
.logo img { max-width:200px; height:auto; }
nav { background:#c2185b; padding:10px 0; }
nav ul { display:flex; justify-content:center; list-style:none; flex-wrap:wrap; }
nav ul li { margin:0 15px; }
nav ul li a { color:white; text-decoration:none; font-weight:bold; transition:all .3s; }
nav ul li a:hover, nav ul li a.active { color:#ffeb3b; }
.hero, .page-header { background-size:cover; background-position:center; height:400px; display:flex; align-items:center; justify-content:center; color:white; text-align:center; position:relative; }
.hero::before, .page-header::before { content:''; position:absolute; inset:0; background:rgba(0,0,0,.5); }
.hero-content, .page-header-content { position:relative; z-index:1; }
.hero h1, .page-header h1 { font-size:2.5rem; margin-bottom:20px; }
.page-header { height:350px; margin-bottom:30px; }
.cta-button { display:inline-block; background:#e91e63; color:white; padding:12px 30px; border-radius:5px; text-decoration:none; font-weight:bold; margin-top:20px; transition:all .3s; }
.cta-button:hover { background:#c2185b; transform:translateY(-3px); }
.products, .about, .contact, .agrowisata-content { padding:50px 0; }
.section-title { text-align:center; margin-bottom:40px; color:#e91e63; }
.product-grid, .activity-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:30px; }
.product-card, .activity-card { background:white; border-radius:8px; overflow:hidden; box-shadow:0 5px 15px rgba(0,0,0,.1); transition:all .3s; }
.product-card:hover, .activity-card:hover { transform:translateY(-10px); box-shadow:0 15px 30px rgba(0,0,0,.2); }
.product-image, .activity-image { height:200px; overflow:hidden; }
.product-image img, .activity-image img { width:100%; height:100%; object-fit:cover; transition:all .5s; }
.product-card:hover .product-image img, .activity-card:hover .activity-image img { transform:scale(1.1); }
.product-info, .activity-info { padding:20px; }
.product-info h3, .activity-info h3 { margin-bottom:10px; color:#e91e63; }
.product-info p, .activity-info p { margin-bottom:15px; color:#666; }
.price { font-weight:bold; color:#e91e63; font-size:1.2rem; }
.about { background:white; }
.about-content, .experience-section { display:flex; align-items:center; gap:40px; margin-top:30px; }
.about-image img, .experience-image img { width:100%; border-radius:8px; box-shadow:0 5px 15px rgba(0,0,0,.1); }
.contact { background:#f5f5f5; text-align:center; }
.whatsapp-button { display:inline-block; background:#25D366; color:white; padding:12px 30px; border-radius:5px; text-decoration:none; font-weight:bold; margin-top:20px; transition:all .3s; }
.whatsapp-button:hover { background:#128C7E; }
.highlight-box { background:#ffe6ee; border-left:4px solid #e91e63; padding:20px; margin:30px 0; border-radius:0 8px 8px 0; }
.pricing-table { width:100%; border-collapse:collapse; margin:30px 0; }
.pricing-table th, .pricing-table td { border:1px solid #ddd; padding:12px; text-align:left; }
.pricing-table th { background:#e91e63; color:white; }
.pricing-table tr:nth-child(even) { background:#f9f9f9; }
.pricing-table tr:hover { background:#ffe6ee; }
.map-container { margin:40px 0; text-align:center; }
.map-container iframe { width:100%; max-width:800px; height:450px; border:0; border-radius:8px; box-shadow:0 5px 15px rgba(0,0,0,.1); }
.breadcrumb { padding:15px 0; background:#f5f5f5; font-size:0.95rem; }
.breadcrumb a { color:#e91e63; text-decoration:none; }
.breadcrumb a:hover { text-decoration:underline; }
footer { background:#333; color:white; text-align:center; padding:20px 0; margin-top:50px; }
@media (max-width:768px) {
  nav ul { flex-direction:column; align-items:center; }
  nav ul li { margin:8px 0; }
  .hero, .page-header { height:300px; }
  .hero h1, .page-header h1 { font-size:2rem; }
  .about-content, .experience-section { flex-direction:column; gap:30px; }
  .map-container iframe { height:350px; }
}