/*
Theme Name: Asim Jamal Dental Clinic
Theme URI: https://jamaldentalclinic.com/
Author: BrantzR.web
Author URI: https://brantzrweb.com/
Description: Custom Elementor-ready WordPress theme for Asim Jamal Dental Clinic with full blog support.
Version: 1.0
Requires PHP: 7.4
Text Domain: ajdc
*/

/* ---- Base ---- */
* { box-sizing: border-box; }
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  color: #1f2937;
  margin: 0;
  background: #ffffff;
}
a { text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }

/* ---- Layout helpers ---- */
.container { max-width: 1280px; margin: 0 auto; padding: 0 1rem; }

/* ---- Buttons ---- */
.btn-primary {
  display: inline-block;
  background: linear-gradient(90deg,#2563eb,#1d4ed8);
  color: #fff;
  padding: .9rem 2rem;
  border-radius: 999px;
  font-weight: 700;
  box-shadow: 0 10px 25px rgba(37,99,235,.25);
  transition: all .3s ease;
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(37,99,235,.35); }
.btn-outline {
  display: inline-block;
  border: 2px solid #fff;
  color: #fff;
  padding: .85rem 2rem;
  border-radius: 999px;
  font-weight: 700;
}

/* ---- Top bar ---- */
.topbar { background: linear-gradient(90deg,#1e3a8a,#1e40af); color:#fff; font-size:.85rem; padding:.5rem 0; }
.topbar .container { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.5rem; }
.topbar a { color:#fff; }
.topbar a:hover { color:#bfdbfe; }

/* ---- Nav ---- */
.site-header { background:#fff; box-shadow:0 4px 15px rgba(0,0,0,.07); position:sticky; top:0; z-index:50; }
.nav-wrap { display:flex; align-items:center; justify-content:space-between; height:5rem; }
.site-logo { display:flex; align-items:center; gap:.75rem; }
.site-logo img { width:56px; height:56px; border-radius:999px; object-fit:cover; border:2px solid #2563eb; }
.site-title { font-weight:800; font-size:1.15rem; background:linear-gradient(90deg,#1e3a8a,#2563eb); -webkit-background-clip:text; background-clip:text; color:transparent; }
.site-tagline { font-size:.7rem; color:#6b7280; }

.primary-menu { display:flex; gap:1.5rem; list-style:none; margin:0; padding:0; align-items:center; }
.primary-menu a { color:#374151; font-weight:600; }
.primary-menu a:hover, .primary-menu .current-menu-item > a { color:#2563eb; }

.menu-toggle { display:none; background:none; border:0; font-size:1.6rem; cursor:pointer; }
.mobile-menu { display:none; border-top:1px solid #e5e7eb; }
.mobile-menu.open { display:block; }
.mobile-menu ul { list-style:none; margin:0; padding:1rem; }
.mobile-menu li { padding:.5rem 0; }

@media (max-width: 1024px) {
  .primary-menu, .header-cta { display:none; }
  .menu-toggle { display:block; }
}

/* ---- Footer ---- */
.site-footer { background:linear-gradient(180deg,#111827,#030712); color:#fff; padding:4rem 0 2rem; }
.footer-grid { display:grid; grid-template-columns:repeat(1,1fr); gap:2.5rem; }
@media (min-width:768px){ .footer-grid{ grid-template-columns:repeat(2,1fr);} }
@media (min-width:1024px){ .footer-grid{ grid-template-columns:repeat(4,1fr);} }
.footer-grid h3 { font-size:1.1rem; font-weight:700; border-bottom:2px solid #2563eb; padding-bottom:.5rem; display:inline-block; margin-bottom:1.2rem; }
.footer-grid ul { list-style:none; margin:0; padding:0; }
.footer-grid li { margin-bottom:.6rem; }
.footer-grid a { color:#9ca3af; }
.footer-grid a:hover { color:#60a5fa; }
.social-icons { display:flex; gap:.75rem; margin-top:1.2rem; }
.social-icons a { width:40px; height:40px; border-radius:999px; background:#1f2937; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.85rem; }
.social-icons a:hover { background:#2563eb; }
.footer-bottom { text-align:center; border-top:1px solid #1f2937; margin-top:3rem; padding-top:2rem; color:#6b7280; font-size:.9rem; }

/* ---- Blog ---- */
.blog-wrap { max-width: 900px; margin:0 auto; padding:4rem 1rem; }
.blog-card { background:#fff; border:1px solid #e5e7eb; border-radius:1rem; overflow:hidden; margin-bottom:2.5rem; box-shadow:0 4px 15px rgba(0,0,0,.05); transition:transform .3s ease; }
.blog-card:hover { transform:translateY(-4px); }
.blog-card img { width:100%; aspect-ratio:16/9; object-fit:cover; }
.blog-card .entry-body { padding:1.5rem; }
.blog-card h2 { font-size:1.4rem; margin:.4rem 0; }
.blog-card h2 a { color:#111827; }
.blog-card h2 a:hover { color:#2563eb; }
.entry-meta { color:#6b7280; font-size:.85rem; }
.entry-content, .single .entry-content { line-height:1.8; font-size:1.05rem; }
.entry-content h2 { font-size:1.5rem; font-weight:800; margin:2rem 0 .75rem; color:#111827; }
.entry-content h3 { font-size:1.2rem; font-weight:700; margin:1.5rem 0 .5rem; color:#111827; }
.entry-content p { margin-bottom:1rem; color:#374151; }
.entry-content img { border-radius:.75rem; margin:1.5rem 0; }
.pagination { display:flex; justify-content:center; gap:.5rem; margin-top:2rem; }
.pagination a, .pagination span { padding:.5rem 1rem; border:1px solid #e5e7eb; border-radius:.5rem; color:#374151; }
.pagination .current { background:#2563eb; color:#fff; border-color:#2563eb; }

/* ---- Animations (used by original design) ---- */
@keyframes float { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-15px);} }
.animate-float { animation: float 6s ease-in-out infinite; }
.reveal { opacity:0; transform:translateY(30px); transition:all .7s ease; }
.reveal.active { opacity:1; transform:translateY(0); }
.hover-lift { transition:transform .3s ease, box-shadow .3s ease; }
.hover-lift:hover { transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,.1); }
