DentistWebApp_UsingAI_VibeCode/services.html at main · barik011/DentistWebApp_UsingAI_VibeCode · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="Explore complete dental services at BrightSmile Dental Clinic including general dentistry, root canal, implants, braces, pediatric care and cosmetic dentistry.">
  <meta name="keywords" content="dental services, general dentistry, root canal, implants, braces, pediatric dentistry">
  <title>Our Services | BrightSmile Dental Clinic</title>
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap" rel="stylesheet">
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" rel="stylesheet">
  <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
  <link href="assets/css/style.css" rel="stylesheet">
</head>
<body>
  <a class="skip-link" href="#main-content">Skip to main content</a>

  <nav class="navbar navbar-expand-lg fixed-top" aria-label="Main navigation">
    <div class="container">
      <a class="navbar-brand" href="index.html"><i class="fa-solid fa-tooth me-2"></i>BrightSmile Dental</a>
      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mainNavbar" aria-controls="mainNavbar" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="mainNavbar">
        <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
          <li class="nav-item"><a class="nav-link" href="index.html">Home</a></li>
          <li class="nav-item"><a class="nav-link" href="about.html">About Doctor</a></li>
          <li class="nav-item"><a class="nav-link" href="services.html">Services</a></li>
          <li class="nav-item"><a class="nav-link" href="treatments.html">Treatments</a></li>
          <li class="nav-item"><a class="nav-link" href="gallery.html">Smile Gallery</a></li>
          <li class="nav-item"><a class="nav-link" href="testimonials.html">Testimonials</a></li>
          <li class="nav-item"><a class="nav-link" href="blog.html">Blog</a></li>
          <li class="nav-item"><a class="nav-link" href="appointment.html">Appointment</a></li>
          <li class="nav-item"><a class="nav-link" href="contact.html">Contact</a></li>
          <li class="nav-item"><a class="nav-link" href="faqs.html">FAQs</a></li>
        </ul>
        <a href="appointment.html" class="btn btn-brand ms-lg-3">Book Now</a>
      </div>
    </div>
  </nav>

  <main id="main-content">
    <section class="page-hero">
      <div class="container" data-aos="fade-up">
        <h1>Our Dental Services</h1>
        <p>Comprehensive dentistry designed for prevention, restoration, and smile confidence. Every service is planned with clear communication and patient comfort in mind.</p>
      </div>
    </section>

    <section class="section-padding">
      <div class="container">
        <div class="row g-3">
          <div class="col-md-6 col-lg-3" data-aos="zoom-in">
            <article class="service-card">
              <div class="icon-circle"><i class="fa-solid fa-tooth"></i></div>
              <h3>General Dentistry</h3>
              <p>Routine checkups, cavity detection, fillings, and oral health monitoring for all ages.</p>
              <a href="treatments.html#general-dentistry" class="btn btn-soft btn-sm">Learn More</a>
            </article>
          </div>
          <div class="col-md-6 col-lg-3" data-aos="zoom-in" data-aos-delay="50">
            <article class="service-card">
              <div class="icon-circle"><i class="fa-solid fa-wand-magic-sparkles"></i></div>
              <h3>Teeth Cleaning & Whitening</h3>
              <p>Deep cleaning and safe whitening to remove stains, plaque, and dull discoloration.</p>
              <a href="treatments.html#teeth-whitening" class="btn btn-soft btn-sm">Learn More</a>
            </article>
          </div>
          <div class="col-md-6 col-lg-3" data-aos="zoom-in" data-aos-delay="100">
            <article class="service-card">
              <div class="icon-circle"><i class="fa-solid fa-staff-snake"></i></div>
              <h3>Root Canal Treatment</h3>
              <p>Pain-free root canal solutions to save infected teeth and restore chewing function.</p>
              <a href="treatments.html#root-canal" class="btn btn-soft btn-sm">Learn More</a>
            </article>
          </div>
          <div class="col-md-6 col-lg-3" data-aos="zoom-in" data-aos-delay="150">
            <article class="service-card">
              <div class="icon-circle"><i class="fa-solid fa-screwdriver-wrench"></i></div>
              <h3>Dental Implants</h3>
              <p>Permanent missing-tooth replacement with a natural look, feel, and bite support.</p>
              <a href="treatments.html#dental-implants" class="btn btn-soft btn-sm">Learn More</a>
            </article>
          </div>
          <div class="col-md-6 col-lg-3" data-aos="zoom-in">
            <article class="service-card">
              <div class="icon-circle"><i class="fa-solid fa-face-smile-beam"></i></div>
              <h3>Cosmetic Dentistry</h3>
              <p>Smile enhancement through veneers, contouring, bonding, and digital smile planning.</p>
              <a href="treatments.html#smile-designing" class="btn btn-soft btn-sm">Learn More</a>
            </article>
          </div>
          <div class="col-md-6 col-lg-3" data-aos="zoom-in" data-aos-delay="50">
            <article class="service-card">
              <div class="icon-circle"><i class="fa-solid fa-grip-lines"></i></div>
              <h3>Braces & Orthodontics</h3>
              <p>Alignment correction for children and adults using braces and clear aligner options.</p>
              <a href="treatments.html#braces-treatment" class="btn btn-soft btn-sm">Learn More</a>
            </article>
          </div>
          <div class="col-md-6 col-lg-3" data-aos="zoom-in" data-aos-delay="100">
            <article class="service-card">
              <div class="icon-circle"><i class="fa-solid fa-hand-holding-medical"></i></div>
              <h3>Tooth Extraction</h3>
              <p>Simple and surgical extraction with gentle technique and clear recovery guidance.</p>
              <a href="treatments.html#gum-treatment" class="btn btn-soft btn-sm">Learn More</a>
            </article>
          </div>
          <div class="col-md-6 col-lg-3" data-aos="zoom-in" data-aos-delay="150">
            <article class="service-card">
              <div class="icon-circle"><i class="fa-solid fa-baby"></i></div>
              <h3>Pediatric Dentistry</h3>
              <p>Child-friendly preventive and restorative care focused on comfort and early habits.</p>
              <a href="appointment.html" class="btn btn-soft btn-sm">Learn More</a>
            </article>
          </div>
        </div>
      </div>
    </section>

    <section class="section-padding pt-0">
      <div class="container">
        <div class="info-card p-4 p-lg-5" data-aos="fade-up">
          <div class="row align-items-center g-3">
            <div class="col-lg-8">
              <h2 class="h3 mb-2">Need Help Choosing the Right Treatment?</h2>
              <p class="text-muted mb-0">Book a consultation and get a personalized diagnosis and treatment roadmap based on your oral health goals and budget.</p>
            </div>
            <div class="col-lg-4 text-lg-end">
              <a href="appointment.html" class="btn btn-brand"><i class="fa-regular fa-calendar-check me-2"></i>Schedule Consultation</a>
            </div>
          </div>
        </div>
      </div>
    </section>
  </main>

  <footer class="pt-5">
    <div class="container">
      <div class="row g-4">
        <div class="col-lg-4">
          <h3 class="h5">BrightSmile Dental Clinic</h3>
          <p>Comprehensive, ethical, and modern dentistry led by Dr. Ananya Sharma with 15+ years of trusted experience.</p>
          <div class="social-links">
            <a href="#" aria-label="Facebook"><i class="fa-brands fa-facebook-f"></i></a>
            <a href="#" aria-label="Instagram"><i class="fa-brands fa-instagram"></i></a>
            <a href="#" aria-label="YouTube"><i class="fa-brands fa-youtube"></i></a>
            <a href="#" aria-label="LinkedIn"><i class="fa-brands fa-linkedin-in"></i></a>
          </div>
        </div>
        <div class="col-sm-6 col-lg-4">
          <h3 class="h6">Quick Links</h3>
          <ul class="list-unstyled small">
            <li class="mb-2"><a href="about.html">About Doctor</a></li>
            <li class="mb-2"><a href="treatments.html">Treatments</a></li>
            <li class="mb-2"><a href="gallery.html">Smile Gallery</a></li>
            <li class="mb-2"><a href="appointment.html">Book Appointment</a></li>
            <li><a href="contact.html">Contact</a></li>
          </ul>
        </div>
        <div class="col-sm-6 col-lg-4">
          <h3 class="h6">Contact Info</h3>
          <ul class="list-unstyled small mb-0">
            <li class="mb-2"><i class="fa-solid fa-location-dot me-2"></i>24 Green Park Road, New Delhi</li>
            <li class="mb-2"><i class="fa-solid fa-phone me-2"></i><a href="tel:+919876543210">+91 98765 43210</a></li>
            <li class="mb-2"><i class="fa-solid fa-envelope me-2"></i><a href="mailto:care@brightsmiledental.in">care@brightsmiledental.in</a></li>
            <li><i class="fa-regular fa-clock me-2"></i>Mon - Sat: 9 AM - 8 PM</li>
          </ul>
        </div>
      </div>
      <div class="footer-bottom mt-4 py-3 small d-flex flex-wrap justify-content-between gap-2">
        <span>Copyright <span class="current-year"></span> BrightSmile Dental Clinic. All rights reserved.</span>
        <span>Designed for patient trust, comfort, and accessibility.</span>
      </div>
    </div>
  </footer>

  <div class="floating-contact" aria-label="Quick contact buttons">
    <a class="whatsapp-float" href="https://wa.me/919876543210" target="_blank" rel="noopener" aria-label="Chat on WhatsApp"><i class="fa-brands fa-whatsapp"></i></a>
    <a class="call-float" href="tel:+919876543210" aria-label="Call clinic"><i class="fa-solid fa-phone"></i></a>
  </div>

  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
  <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
  <script src="assets/js/main.js"></script>
</body>
</html>