* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: "Dancing Script", cursive;
  line-height: 1.6;
  color: #2d3748;
  background: linear-gradient(135deg, #fbb6ce, #f687b3);
}

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* Header Styles */
.navbar {
  background: linear-gradient(135deg, #ed64a6, #d53f8c);
  padding: 1rem 0;
  position: sticky;
  top: 0;
  z-index: 1000;
  box-shadow: 0 4px 20px rgba(237, 100, 166, 0.4);
}

.nav-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.logo h1 {
  color: #fff5f5;
  font-size: 1.8rem;
  font-weight: bold;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  font-family: "Dancing Script", cursive;
}

.nav-menu {
  display: flex;
  gap: 2rem;
}

.nav-link {
  color: #fff5f5;
  text-decoration: none;
  font-weight: 500;
  transition: all 0.3s ease;
  padding: 0.5rem 1rem;
  border-radius: 20px;
  position: relative;
}

.nav-link:hover,
.nav-link.active {
  color: #ed64a6;
  background-color: rgba(255, 245, 245, 0.2);
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(237, 100, 166, 0.3);
}

.hamburger {
  display: none;
  flex-direction: column;
  cursor: pointer;
}

.hamburger span {
  width: 25px;
  height: 3px;
  background-color: #fff5f5;
  margin: 3px 0;
  transition: 0.3s;
  border-radius: 2px;
}

/* Hero Section */
.hero {
  background: linear-gradient(135deg, #ed64a6, #d53f8c);
  color: white;
  padding: 6rem 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.hero::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M50 20 Q60 30 50 40 Q40 30 50 20 M50 40 Q60 50 50 60 Q40 50 50 40 M50 60 Q60 70 50 80 Q40 70 50 60" fill="none" stroke="rgba(255,245,245,0.1)" stroke-width="2"/></svg>')
    repeat;
  opacity: 0.3;
}

.hero-content {
  position: relative;
  z-index: 2;
}

.hero-content h2 {
  font-size: 3.5rem;
  margin-bottom: 1rem;
  font-weight: bold;
  color: #fff5f5;
  text-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);
  font-family: "Dancing Script", cursive;
}

.hero-content p {
  font-size: 1.3rem;
  opacity: 0.95;
  color: #fff5f5;
}

/* Page Header */
.page-header {
  background: linear-gradient(135deg, #ed64a6, #d53f8c);
  color: white;
  padding: 4rem 0;
  text-align: center;
}

.page-header h1 {
  font-size: 2.8rem;
  margin-bottom: 0.5rem;
  color: #fff5f5;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  font-family: "Dancing Script", cursive;
}

.page-header p {
  font-size: 1.2rem;
  opacity: 0.9;
  color: #fff5f5;
}

/* About Section */
.about {
  padding: 5rem 0;
  background: linear-gradient(135deg, #fbb6ce, #f687b3);
}

.about h2 {
  font-size: 2.8rem;
  text-align: center;
  margin-bottom: 3rem;
  color: #2d3748;
  position: relative;
  font-family: "Dancing Script", cursive;
}

.about h2::after {
  content: "🌸";
  position: absolute;
  bottom: -15px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 2rem;
}

.about p {
  font-size: 1.1rem;
  text-align: justify;
  max-width: 1000px;
  margin: 0 auto;
  line-height: 1.8;
  color: #2d3748;
  background: white;
  padding: 2.5rem;
  border-radius: 20px;
  box-shadow: 0 10px 30px rgba(237, 100, 166, 0.15);
  border-left: 5px solid #ed64a6;
}

/* Services Section */
.services {
  padding: 5rem 0;
  background: linear-gradient(135deg, #d53f8c, #ed64a6);
}

.services h2 {
  font-size: 2.8rem;
  text-align: center;
  margin-bottom: 4rem;
  color: #fff5f5;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  font-family: "Dancing Script", cursive;
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 3rem;
}

.service-card {
  background: linear-gradient(135deg, #ed64a6, #d53f8c);
  padding: 2.5rem;
  border-radius: 20px;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.3);
  text-align: center;
  transition: all 0.3s ease;
  border: 2px solid rgba(255, 245, 245, 0.3);
  position: relative;
  overflow: hidden;
}

.service-card::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 245, 245, 0.1) 0%, transparent 70%);
  transition: all 0.3s ease;
  transform: scale(0);
}

.service-card:hover::before {
  transform: scale(1);
}

.service-card:hover {
  transform: translateY(-15px) scale(1.03);
  box-shadow: 0 25px 60px rgba(237, 100, 166, 0.4);
  border-color: #fff5f5;
}

.service-card h3 {
  font-size: 1.6rem;
  margin-bottom: 1.5rem;
  color: #fff5f5;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  position: relative;
  z-index: 2;
}

.service-card p {
  color: #fff5f5;
  line-height: 1.7;
  position: relative;
  z-index: 2;
  opacity: 0.95;
}

/* Services Detail */
.services-detail {
  padding: 5rem 0;
  background: linear-gradient(135deg, #e6fffa, #f0fff4);
}

.service-detail {
  background: white;
  margin-bottom: 3rem;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 15px 40px rgba(56, 161, 105, 0.15);
  border: 2px solid #38a169;
}

.service-detail h2 {
  background: linear-gradient(135deg, #38a169, #48bb78);
  color: #f7fafc;
  padding: 1.5rem 2rem;
  margin: 0;
  font-size: 1.8rem;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.service-content {
  padding: 2.5rem;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 2rem;
}

.service-info h3 {
  color: #2d3748;
  margin-bottom: 1rem;
  font-size: 1.4rem;
}

.service-info p {
  color: #4a5568;
  margin-bottom: 1.5rem;
  line-height: 1.6;
}

.service-info ul {
  list-style: none;
  padding-left: 0;
}

.service-info li {
  color: #2d3748;
  margin-bottom: 0.8rem;
  padding-left: 2rem;
  position: relative;
}

.service-info li::before {
  content: "👨‍🍳";
  position: absolute;
  left: 0;
  font-size: 1.2rem;
}

.service-price {
  text-align: right;
  min-width: 180px;
}

.price {
  font-size: 1.4rem;
  font-weight: bold;
  color: white;
  background: linear-gradient(135deg, #38a169, #48bb78);
  padding: 1.2rem 1.8rem;
  border-radius: 15px;
  display: inline-block;
  box-shadow: 0 8px 20px rgba(56, 161, 105, 0.3);
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

/* Contact Styles */
.contact-section {
  padding: 5rem 0;
  background: linear-gradient(135deg, #e6fffa, #f0fff4);
}

.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
}

.contact-info h2,
.contact-form h2 {
  font-size: 2.2rem;
  color: #2d3748;
  margin-bottom: 2rem;
}

.contact-item {
  margin-bottom: 2.5rem;
  background: white;
  padding: 1.5rem;
  border-radius: 15px;
  box-shadow: 0 8px 20px rgba(56, 161, 105, 0.1);
  border-left: 4px solid #38a169;
}

.contact-item h3 {
  font-size: 1.3rem;
  color: #4a5568;
  margin-bottom: 0.8rem;
}

.contact-item p {
  color: #2d3748;
  line-height: 1.7;
}

.contact-form {
  background: white;
  padding: 3rem;
  border-radius: 20px;
  box-shadow: 0 20px 50px rgba(56, 161, 105, 0.15);
  border: 2px solid #38a169;
}

.form-group {
  margin-bottom: 2rem;
}

.form-group label {
  display: block;
  margin-bottom: 0.8rem;
  color: #2d3748;
  font-weight: 600;
}

.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
  padding: 1rem;
  border: 2px solid #fef5e7;
  border-radius: 10px;
  font-size: 1rem;
  transition: all 0.3s ease;
  background: #fff8f0;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline: none;
  border-color: #38a169;
  background: white;
  box-shadow: 0 0 15px rgba(56, 161, 105, 0.3);
}

.submit-btn {
  background: linear-gradient(135deg, #38a169, #48bb78);
  color: white;
  padding: 1.2rem 2.5rem;
  border: none;
  border-radius: 25px;
  font-size: 1.1rem;
  font-weight: bold;
  cursor: pointer;
  transition: all 0.3s ease;
  width: 100%;
  text-transform: uppercase;
  letter-spacing: 1px;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.submit-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 15px 35px rgba(56, 161, 105, 0.4);
  background: linear-gradient(135deg, #48bb78, #cd853f);
}

/* Privacy Policy Styles */
.privacy-content {
  padding: 5rem 0;
  background: linear-gradient(135deg, #fbb6ce, #f687b3);
}

.privacy-section {
  background: white;
  padding: 2.5rem;
  margin-bottom: 2.5rem;
  border-radius: 20px;
  box-shadow: 0 15px 35px rgba(237, 100, 166, 0.1);
  border-left: 5px solid #ed64a6;
}

.privacy-section h2 {
  font-size: 1.6rem;
  color: #2d3748;
  margin-bottom: 1.5rem;
  position: relative;
  padding-left: 2rem;
}

.privacy-section h2::before {
  content: "🌸";
  position: absolute;
  left: 0;
  font-size: 1.5rem;
}

.privacy-section p {
  margin-bottom: 1.2rem;
  line-height: 1.8;
  color: #4a5568;
}

.privacy-section ul {
  margin-left: 2rem;
  margin-bottom: 1.5rem;
}

.privacy-section li {
  margin-bottom: 0.8rem;
  color: #2d3748;
  line-height: 1.6;
}

/* Footer Styles */
.footer {
  background: linear-gradient(135deg, #d53f8c, #ed64a6);
  color: #fff5f5;
  padding: 4rem 0 2rem;
  border-top: 4px solid #ed64a6;
}

.footer-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 3rem;
}

.footer-section h3 {
  font-size: 1.4rem;
  margin-bottom: 1.5rem;
  color: #fff5f5;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.footer-section p {
  margin-bottom: 0.8rem;
  line-height: 1.7;
  color: rgba(255, 245, 245, 0.9);
}

.footer-section ul {
  list-style: none;
}

.footer-section ul li {
  margin-bottom: 0.8rem;
}

.footer-section ul li a {
  color: rgba(255, 245, 245, 0.9);
  text-decoration: none;
  transition: all 0.3s ease;
  padding: 0.3rem 0;
}

.footer-section ul li a:hover {
  color: #fff5f5;
  text-shadow: 0 2px 4px rgba(255, 245, 245, 0.5);
  padding-left: 0.5rem;
}

.social-links {
  margin-top: 1.5rem;
}

.social-links a {
  color: rgba(255, 245, 245, 0.9);
  text-decoration: none;
  margin-right: 1.5rem;
  transition: all 0.3s ease;
  padding: 0.5rem;
  border-radius: 8px;
}

.social-links a:hover {
  color: #fff5f5;
  background-color: rgba(255, 245, 245, 0.2);
  text-shadow: 0 2px 4px rgba(255, 245, 245, 0.5);
}

.footer-bottom {
  border-top: 1px solid rgba(255, 245, 245, 0.3);
  margin-top: 3rem;
  padding-top: 2rem;
  text-align: center;
  color: rgba(255, 245, 245, 0.9);
}

/* Responsive Design */
@media (max-width: 768px) {
  .hamburger {
    display: flex;
  }

  .nav-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: linear-gradient(135deg, #ed64a6, #d53f8c);
    flex-direction: column;
    padding: 2rem;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
  }

  .nav-menu.active {
    display: flex;
  }

  .hero-content h2 {
    font-size: 2.5rem;
  }

  .page-header h1 {
    font-size: 2.2rem;
  }

  .about h2,
  .services h2 {
    font-size: 2.2rem;
  }

  .footer-container {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
}

@media (max-width: 480px) {
  .container {
    padding: 0 15px;
  }

  .hero {
    padding: 3rem 0;
  }

  .hero-content h2 {
    font-size: 2rem;
  }

  .page-header {
    padding: 3rem 0;
  }

  .about,
  .services,
  .services-detail,
  .contact-section,
  .privacy-content {
    padding: 3rem 0;
  }

  .service-card,
  .privacy-section {
    padding: 2rem;
  }

  .about p {
    padding: 1.5rem;
  }
}
