/* ============================================================
   Dr. Yusuf Çelik — Main Design System
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600;700;800;900&family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root {
  --primary:       #6d28d9;
  --primary-dark:  #4c1d95;
  --primary-light: #a78bfa;
  --secondary:     #0891b2;
  --accent:        #f59e0b;
  --success:       #059669;
  --danger:        #dc2626;
  --bg-main:       #f8f6ff;
  --bg-section:    #f1eeff;
  --bg-card:       #ffffff;
  --text-dark:     #1a1033;
  --text-body:     #374151;
  --text-muted:    #6b7280;
  --border-light:  #e9e4f9;
  --font-body:     'Nunito', sans-serif;
  --font-head:     'Poppins', sans-serif;
  --radius-sm:     8px;
  --radius:        16px;
  --radius-xl:     24px;
  --shadow:        0 4px 24px rgba(109,40,217,.08);
  --shadow-xl:     0 20px 60px rgba(109,40,217,.15);
  --transition:    all .3s cubic-bezier(.4,0,.2,1);
  --grad-hero:     linear-gradient(135deg, #1a0533 0%, #3b0764 50%, #1e1b4b 100%);
  --grad-soft:     linear-gradient(135deg, rgba(109,40,217,.08), rgba(139,92,246,.04));
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { font-family:var(--font-body); background:var(--bg-main); color:var(--text-body); overflow-x:hidden; }
img  { max-width:100%; display:block; }
a    { text-decoration:none; color:inherit; }
ul   { list-style:none; }
textarea,input,select,button { font-family:inherit; }

/* ---- NAVBAR ---- */
.navbar {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  padding:16px 0; transition:var(--transition);
}
.navbar.scrolled, .navbar.scrolled-init {
  background:rgba(255,255,255,.95); backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border-light); box-shadow:var(--shadow); padding:12px 0;
}

/* Transparent navbar (over dark hero) */
.navbar:not(.scrolled) .logo-name { color: #ffffff !important; }
.navbar:not(.scrolled) .logo-sub { color: rgba(255, 255, 255, 0.75) !important; }
.navbar:not(.scrolled) .nav-link { color: rgba(255, 255, 255, 0.85) !important; }
.navbar:not(.scrolled) .nav-link:hover { color: #ffffff !important; background: rgba(255, 255, 255, 0.12) !important; }
.navbar:not(.scrolled) .nav-link.active { color: #ffffff !important; background: rgba(255, 255, 255, 0.2) !important; }
.navbar:not(.scrolled) .btn-lang { background: rgba(255, 255, 255, 0.1) !important; border-color: rgba(255, 255, 255, 0.2) !important; color: #ffffff !important; }
.navbar:not(.scrolled) .btn-lang:hover { background: #ffffff !important; color: var(--primary) !important; }
.navbar:not(.scrolled) .hamburger span { background: #ffffff !important; }

/* Scrolled navbar (white background) */
.navbar.scrolled .logo-name { color: var(--text-dark) !important; }
.navbar.scrolled .logo-sub { color: var(--text-muted) !important; }
.navbar.scrolled .nav-link { color: var(--text-body) !important; }
.navbar.scrolled .nav-link:hover { color: var(--primary) !important; background: rgba(109, 40, 217, 0.08) !important; }
.navbar.scrolled .nav-link.active { color: var(--primary) !important; background: rgba(109, 40, 217, 0.12) !important; }
.navbar.scrolled .btn-lang { background: var(--bg-section) !important; border-color: var(--border-light) !important; color: var(--primary) !important; }
.navbar.scrolled .btn-lang:hover { background: var(--primary) !important; color: #ffffff !important; }
.navbar.scrolled .hamburger span { background: var(--text-dark) !important; }


.nav-container { max-width:1280px; margin:0 auto; padding:0 24px; display:flex; align-items:center; gap:32px; }
.nav-logo { display:flex; align-items:center; gap:12px; }
.logo-icon {
  width:44px; height:44px; border-radius:12px;
  background:linear-gradient(135deg,var(--primary),var(--primary-light));
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.1rem;
}
.logo-name  { font-family:var(--font-head); font-weight:700; font-size:.95rem; color:var(--text-dark); display:block; transition:var(--transition); }
.logo-sub   { font-size:.7rem; color:var(--text-muted); display:block; transition:var(--transition); }
.nav-links  { display:flex; gap:4px; margin-left:auto; }
.nav-link   { padding:8px 16px; border-radius:10px; font-weight:600; font-size:.9rem; color:var(--text-body); transition:var(--transition); }
.nav-link:hover,.nav-link.active { color:var(--primary); background:rgba(109,40,217,.08); }
.nav-actions { display:flex; align-items:center; gap:10px; }
.btn-lang {
  padding:7px 14px; border-radius:10px; font-weight:700; font-size:.82rem;
  background:var(--bg-section); color:var(--primary); border:1.5px solid var(--border-light);
  transition:var(--transition); cursor:pointer;
}
.btn-lang:hover { background:var(--primary); color:#fff; }
.btn-whatsapp {
  display:flex; align-items:center; gap:6px; padding:8px 16px; border-radius:12px;
  background:linear-gradient(135deg,#25D366,#128C7E); color:#fff;
  font-weight:700; font-size:.85rem; transition:var(--transition);
}
.btn-whatsapp:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(37,211,102,.4); }
.btn-appointment {
  padding:9px 20px; border-radius:12px; background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  color:#fff; font-weight:700; font-size:.85rem; transition:var(--transition);
}
.btn-appointment:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(109,40,217,.4); }
.hamburger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; }
.hamburger span { width:24px; height:2px; background:var(--text-dark); border-radius:2px; transition:var(--transition); display:block; }

/* ---- HERO ---- */
.hero { min-height:100vh; background:var(--grad-hero); position:relative; display:flex; align-items:center; overflow:hidden; }
.hero-bg-shapes { position:absolute; inset:0; pointer-events:none; }
.shape { position:absolute; border-radius:50%; filter:blur(80px); }
.shape-1 { width:500px; height:500px; background:rgba(109,40,217,.3); top:-100px; left:-150px; }
.shape-2 { width:400px; height:400px; background:rgba(139,92,246,.2); bottom:-100px; right:-100px; }
.shape-3 { width:300px; height:300px; background:rgba(8,145,178,.15); top:40%; left:40%; }
.floating-icons { position:absolute; inset:0; }
.fi { position:absolute; width:48px; height:48px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.08); backdrop-filter:blur(8px); color:rgba(255,255,255,.6); font-size:1.1rem;
  animation:floatIcon 6s ease-in-out infinite; }
.fi-1 { top:20%; left:8%; animation-delay:0s; }
.fi-2 { top:60%; left:12%; animation-delay:1s; }
.fi-3 { top:15%; right:25%; animation-delay:2s; }
.fi-4 { bottom:30%; left:6%; animation-delay:3s; }
.fi-5 { top:70%; right:20%; animation-delay:1.5s; }
@keyframes floatIcon { 0%,100%{transform:translateY(0) rotate(0)} 50%{transform:translateY(-16px) rotate(5deg)} }

.hero-container { max-width:1280px; margin:0 auto; padding:120px 24px 80px; display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; position:relative; z-index:1; }
.hero-badge { display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.1); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.2); border-radius:50px; padding:8px 20px; color:var(--primary-light); font-weight:700; font-size:.85rem; margin-bottom:20px; }
.hero-title { font-family:var(--font-head); font-size:clamp(2.2rem,4vw,3.4rem); font-weight:800; color:#fff; line-height:1.15; margin-bottom:20px; }
.gradient-text { background:linear-gradient(135deg,#a78bfa,#38bdf8); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero-desc { color:rgba(255,255,255,.7); font-size:1.05rem; line-height:1.75; margin-bottom:28px; }
.hero-stats { display:flex; align-items:center; gap:24px; margin-bottom:32px; }
.stat { text-align:center; }
.stat-num { display:block; font-family:var(--font-head); font-size:1.8rem; font-weight:800; color:#fff; }
.stat-label { font-size:.78rem; color:rgba(255,255,255,.6); }
.stat-divider { width:1px; height:40px; background:rgba(255,255,255,.2); }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:28px; }
.btn-primary {
  display:inline-flex; align-items:center; gap:8px; padding:14px 28px; border-radius:14px;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark)); color:#fff;
  font-weight:700; font-size:.95rem; transition:var(--transition); border:none; cursor:pointer;
}
.btn-primary:hover { transform:translateY(-3px); box-shadow:0 12px 32px rgba(109,40,217,.5); }
.btn-primary.btn-large { padding:16px 36px; font-size:1rem; }
.btn-secondary {
  display:inline-flex; align-items:center; gap:8px; padding:14px 28px; border-radius:14px;
  background:rgba(255,255,255,.12); backdrop-filter:blur(10px); border:1.5px solid rgba(255,255,255,.25); color:#fff;
  font-weight:700; transition:var(--transition);
}
.btn-secondary:hover { background:rgba(255,255,255,.2); transform:translateY(-3px); }
.btn-outline {
  display:inline-flex; align-items:center; gap:8px; padding:12px 24px; border-radius:12px;
  border:2px solid var(--primary); color:var(--primary); font-weight:700; background:transparent; transition:var(--transition);
}
.btn-outline:hover { background:var(--primary); color:#fff; transform:translateY(-2px); }
.btn-white {
  display:inline-flex; align-items:center; gap:8px; padding:14px 28px; border-radius:14px;
  background:#fff; color:var(--primary); font-weight:700; transition:var(--transition);
}
.btn-white:hover { transform:translateY(-3px); box-shadow:0 12px 32px rgba(0,0,0,.15); }
.hero-social { display:flex; align-items:center; gap:12px; color:rgba(255,255,255,.5); font-size:.85rem; }
.social-dot { width:36px; height:36px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.1); color:#fff; font-size:.9rem; transition:var(--transition); }
.social-dot:hover { transform:translateY(-3px); }
.ig:hover { background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); }
.yt:hover { background:#ff0000; }
.fb:hover { background:#1877f2; }
.tw:hover { background:#000; }

/* Hero Image */
.hero-image-wrap { position:relative; display:flex; align-items:center; justify-content:center; }
.hero-img-frame {
  width:min(420px,90vw); aspect-ratio:.8; border-radius:40px 40px 50px 50px; overflow:hidden;
  border:3px solid rgba(255,255,255,.15); box-shadow:0 40px 100px rgba(0,0,0,.5);
  position:relative; z-index:1;
}
.hero-img { width:100%; height:100%; object-fit:cover; object-position:top center; }
.img-badge {
  position:absolute; bottom:20px; right:20px; background:rgba(255,255,255,.95); backdrop-filter:blur(10px);
  padding:8px 16px; border-radius:50px; font-weight:700; font-size:.82rem; color:var(--text-dark);
  display:flex; flex-direction:column; align-items:center; box-shadow:var(--shadow);
}
.img-badge i { color:#f59e0b; }
.img-badge span { font-size:.7rem; color:var(--text-muted); }
.hero-card-floating {
  position:absolute; display:flex; align-items:center; gap:12px; padding:14px 20px;
  background:rgba(255,255,255,.95); backdrop-filter:blur(20px); border-radius:16px;
  box-shadow:0 20px 60px rgba(0,0,0,.15); animation:floatCard 4s ease-in-out infinite;
  z-index:10; white-space:nowrap;
}
.hero-card-floating i { font-size:1.4rem; color:var(--primary); }
.hero-card-floating strong { display:block; font-family:var(--font-head); font-weight:700; color:var(--text-dark); font-size:.9rem; }
.hero-card-floating span { font-size:.75rem; color:var(--text-muted); }
.card-top { top:10%; left:-60px; animation-delay:0s; }
.card-bottom { bottom:10%; right:-60px; animation-delay:2s; }
@keyframes floatCard { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-12px)} }
.hero-wave { position:absolute; bottom:0; left:0; right:0; }
.hero-wave svg { display:block; }

/* ---- TRUST BAR ---- */
.trust-bar { background:#fff; padding:24px 0; border-bottom:1px solid var(--border-light); }
.trust-bar .container { max-width:1280px; margin:0 auto; padding:0 24px; display:flex; justify-content:center; flex-wrap:wrap; gap:40px; }
.trust-item { display:flex; align-items:center; gap:14px; }
.trust-item i { font-size:1.6rem; color:var(--primary); }
.trust-item strong { display:block; font-family:var(--font-head); font-weight:700; color:var(--text-dark); }
.trust-item span { font-size:.8rem; color:var(--text-muted); }

/* ---- LAYOUT ---- */
.container { max-width:1280px; margin:0 auto; padding:0 24px; }
.section { padding:100px 0; }
.section-header { text-align:center; margin-bottom:64px; }
.section-label {
  display:inline-flex; align-items:center; gap:8px; background:rgba(109,40,217,.08);
  color:var(--primary); border-radius:50px; padding:6px 18px; font-weight:700; font-size:.8rem;
  text-transform:uppercase; letter-spacing:.1em; margin-bottom:16px;
}
.section-title { font-family:var(--font-head); font-size:clamp(1.6rem,3vw,2.4rem); font-weight:800; color:var(--text-dark); margin-bottom:16px; }
.section-desc { color:var(--text-muted); font-size:1.05rem; max-width:560px; margin:0 auto; }

/* ---- ABOUT TEASER ---- */
.about-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:80px; align-items:center; }
.about-img-wrapper { position:relative; }
.about-img-wrapper img { border-radius:var(--radius-xl); width:100%; object-fit:cover; aspect-ratio:.85; box-shadow:var(--shadow-xl); }
.experience-badge {
  position:absolute; bottom:-24px; right:-24px;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  color:#fff; padding:20px 24px; border-radius:20px; text-align:center; box-shadow:0 20px 40px rgba(109,40,217,.4);
}
.exp-num { display:block; font-family:var(--font-head); font-size:2.4rem; font-weight:800; }
.exp-text { font-size:.8rem; opacity:.8; white-space:pre-line; }
.about-text-col h2 { font-family:var(--font-head); }
.about-text-col p { color:var(--text-muted); margin:16px 0 24px; line-height:1.8; }
.about-features { display:flex; flex-direction:column; gap:12px; margin-bottom:28px; }
.about-features li { display:flex; align-items:center; gap:10px; font-weight:600; color:var(--text-body); }
.about-features i { color:var(--success); }

/* ---- SERVICES GRID ---- */
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-bottom:40px; }
.service-card {
  background:var(--bg-card); border-radius:var(--radius-xl); padding:36px 28px;
  border:1px solid var(--border-light); transition:var(--transition); cursor:pointer;
}
.service-card:hover,.service-card.featured { box-shadow:var(--shadow-xl); transform:translateY(-6px); }
.service-card.featured { background:linear-gradient(135deg,var(--primary),var(--primary-dark)); color:#fff; border-color:transparent; }
.service-card.featured h3,.service-card.featured p,.service-card.featured .service-link { color:rgba(255,255,255,.9); }
.service-icon {
  width:60px; height:60px; border-radius:16px; display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; margin-bottom:20px;
  background:color-mix(in srgb, var(--clr,var(--primary)) 12%, transparent);
  color:var(--clr,var(--primary));
}
.service-card.featured .service-icon { background:rgba(255,255,255,.15); color:#fff; }
.service-card h3 { font-family:var(--font-head); font-size:1.1rem; font-weight:700; color:var(--text-dark); margin-bottom:10px; }
.service-card p { color:var(--text-muted); font-size:.9rem; line-height:1.7; margin-bottom:20px; }
.service-link { display:flex; align-items:center; gap:6px; font-weight:700; font-size:.85rem; color:var(--primary); transition:var(--transition); }
.service-link:hover { gap:10px; }
.services-cta { text-align:center; }

/* ---- VIDEOS ---- */
.videos-grid,.videos-full-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.video-card { background:var(--bg-card); border-radius:var(--radius-xl); overflow:hidden; border:1px solid var(--border-light); cursor:pointer; transition:var(--transition); }
.video-card:hover { box-shadow:var(--shadow-xl); transform:translateY(-4px); }
.video-thumb { position:relative; aspect-ratio:16/9; overflow:hidden; }
.video-thumb-bg { width:100%; height:100%; display:flex; align-items:center; justify-content:center; }
.video-play {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.3); transition:var(--transition);
}
.video-play i { width:56px; height:56px; background:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--primary); font-size:1.1rem; margin-left:4px; }
.video-card:hover .video-play { background:rgba(0,0,0,.5); }
.video-duration { position:absolute; bottom:10px; right:10px; background:rgba(0,0,0,.7); color:#fff; padding:3px 8px; border-radius:6px; font-size:.75rem; }
.video-info { padding:20px 22px 22px; }
.video-tag { display:inline-block; background:var(--bg-section); color:var(--primary); font-size:.75rem; font-weight:700; padding:4px 12px; border-radius:50px; margin-bottom:8px; text-transform:capitalize; }
.video-info h4 { font-family:var(--font-head); font-size:1rem; font-weight:700; color:var(--text-dark); margin-bottom:6px; }
.video-info p { color:var(--text-muted); font-size:.85rem; line-height:1.6; }

/* ---- FILTER TABS ---- */
.filter-tabs { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-bottom:40px; }
.filter-tab { padding:8px 20px; border-radius:50px; border:1.5px solid var(--border-light); font-weight:600; font-size:.85rem; color:var(--text-muted); transition:var(--transition); }
.filter-tab:hover,.filter-tab.active { background:var(--primary); color:#fff; border-color:var(--primary); }

/* ---- HOW IT WORKS ---- */
.how-it-works { background:var(--bg-section); }
.steps-grid { display:flex; align-items:center; gap:24px; justify-content:center; }
.step-card { flex:1; max-width:300px; background:var(--bg-card); border-radius:var(--radius-xl); padding:40px 28px; text-align:center; border:1px solid var(--border-light); position:relative; }
.step-num { position:absolute; top:-16px; left:50%; transform:translateX(-50%); background:linear-gradient(135deg,var(--primary),var(--primary-dark)); color:#fff; font-family:var(--font-head); font-weight:800; font-size:.85rem; width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.step-icon { width:64px; height:64px; border-radius:18px; background:var(--bg-section); display:flex; align-items:center; justify-content:center; margin:0 auto 20px; font-size:1.5rem; color:var(--primary); }
.step-card h3 { font-family:var(--font-head); font-weight:700; color:var(--text-dark); margin-bottom:10px; }
.step-card p { color:var(--text-muted); font-size:.9rem; line-height:1.7; }
.step-arrow { color:var(--primary); font-size:1.4rem; opacity:.4; }

/* ---- TESTIMONIALS ---- */
.testimonials { background:var(--bg-main); }
.testimonials-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.testi-card { background:var(--bg-card); border-radius:var(--radius-xl); padding:32px; border:1px solid var(--border-light); }
.testi-card.featured { background:linear-gradient(135deg,var(--primary),var(--primary-dark)); color:#fff; }
.testi-card.featured p,.testi-card.featured .testi-stars { color:rgba(255,255,255,.9); }
.testi-stars { font-size:1.1rem; color:#f59e0b; margin-bottom:14px; letter-spacing:2px; }
.testi-card p { font-style:italic; color:var(--text-muted); line-height:1.75; margin-bottom:20px; }
.testi-author { display:flex; align-items:center; gap:12px; }
.testi-avatar { width:40px; height:40px; border-radius:50%; background:linear-gradient(135deg,var(--primary),var(--primary-light)); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.85rem; }
.testi-card.featured .testi-avatar { background:rgba(255,255,255,.2); }

/* ---- FAQ ---- */
.faq { background:var(--bg-section); }
.faq-container { max-width:800px; }
.faq-list { display:flex; flex-direction:column; gap:12px; }
.faq-item { background:var(--bg-card); border-radius:var(--radius); border:1px solid var(--border-light); overflow:hidden; cursor:pointer; transition:var(--transition); }
.faq-item:hover,.faq-item.open { box-shadow:var(--shadow); }
.faq-question { padding:20px 24px; display:flex; justify-content:space-between; align-items:center; font-weight:700; color:var(--text-dark); }
.faq-question i { transition:var(--transition); color:var(--primary); }
.faq-item.open .faq-question i { transform:rotate(180deg); }
.faq-answer { padding:0 24px; max-height:0; overflow:hidden; transition:max-height .4s ease, padding .3s; }
.faq-item.open .faq-answer { max-height:300px; padding:0 24px 20px; }
.faq-answer p { color:var(--text-muted); line-height:1.75; }

/* ---- CTA ---- */
.cta-section { background:var(--grad-hero); padding:100px 0; position:relative; overflow:hidden; }
.cta-shapes { position:absolute; inset:0; pointer-events:none; }
.cta-shape-1 { position:absolute; width:400px; height:400px; border-radius:50%; background:rgba(139,92,246,.2); top:-100px; left:-100px; filter:blur(60px); }
.cta-shape-2 { position:absolute; width:300px; height:300px; border-radius:50%; background:rgba(8,145,178,.15); bottom:-80px; right:-80px; filter:blur(60px); }
.cta-content { text-align:center; position:relative; z-index:1; }
.cta-content h2 { font-family:var(--font-head); font-size:clamp(1.8rem,3vw,2.8rem); font-weight:800; color:#fff; margin-bottom:16px; }
.cta-content p { color:rgba(255,255,255,.7); margin-bottom:40px; font-size:1.05rem; }
.cta-actions { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* ---- PAGE HERO ---- */
.page-hero {
  background:var(--grad-hero); padding:160px 0 80px; text-align:center; position:relative; overflow:hidden;
}
.page-hero::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:60px;
  background:var(--bg-main); clip-path:ellipse(55% 100% at 50% 100%);
}
.page-hero-title { font-family:var(--font-head); font-size:clamp(2rem,4vw,3rem); font-weight:800; color:#fff; margin-bottom:12px; }
.page-hero-sub { color:rgba(255,255,255,.7); font-size:1.05rem; }
.breadcrumb { display:flex; justify-content:center; gap:8px; margin-bottom:24px; font-size:.85rem; color:rgba(255,255,255,.6); }
.breadcrumb a { color:rgba(255,255,255,.8); }
.breadcrumb span { color:var(--primary-light); }

/* ---- ABOUT PAGE ---- */
.about-full-grid { display:grid; grid-template-columns:360px 1fr; gap:64px; align-items:start; }
.about-sticky { position:sticky; top:100px; }
.about-main-img { width:100%; border-radius:var(--radius-xl); box-shadow:var(--shadow-xl); margin-bottom:24px; }
.about-contact-card { background:var(--bg-card); border-radius:var(--radius); padding:24px; border:1px solid var(--border-light); }
.about-contact-card h4 { font-family:var(--font-head); font-weight:700; color:var(--text-dark); margin-bottom:16px; }
.about-contact-card li { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--border-light); font-size:.9rem; }
.about-contact-card li:last-child { border-bottom:none; }
.about-contact-card i { color:var(--primary); width:16px; }
.about-text-full h2 { font-family:var(--font-head); }
.about-text-full > p { color:var(--text-muted); line-height:1.8; margin:16px 0 40px; }
.timeline { display:flex; flex-direction:column; gap:0; margin-bottom:40px; position:relative; }
.timeline::before { content:''; position:absolute; left:80px; top:0; bottom:0; width:2px; background:var(--border-light); }
.timeline-item { display:grid; grid-template-columns:80px 1fr; gap:24px; padding-bottom:32px; position:relative; }
.timeline-item::before { content:''; position:absolute; left:74px; top:8px; width:14px; height:14px; border-radius:50%; background:var(--primary); border:3px solid #fff; box-shadow:0 0 0 3px var(--primary-light); }
.timeline-year { font-size:.75rem; font-weight:700; color:var(--primary); padding-top:6px; line-height:1.4; }
.timeline-item h4 { font-family:var(--font-head); font-weight:700; color:var(--text-dark); margin-bottom:4px; }
.timeline-item p { color:var(--text-muted); font-size:.9rem; }
.expertise-grid { display:flex; flex-wrap:wrap; gap:12px; margin:20px 0 32px; }
.expertise-item { display:flex; align-items:center; gap:8px; background:var(--bg-section); border-radius:50px; padding:8px 16px; font-size:.85rem; font-weight:600; color:var(--text-body); }
.expertise-item i { color:var(--primary); }

/* ---- SERVICES DETAIL PAGE ---- */
.services-detail { display:flex; flex-direction:column; gap:48px; }
.service-detail-card { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; background:var(--bg-card); border-radius:var(--radius-xl); padding:56px; border:1px solid var(--border-light); transition:var(--transition); }
.service-detail-card:hover { box-shadow:var(--shadow-xl); }
.service-detail-card.reverse { direction:rtl; }
.service-detail-card.reverse > * { direction:ltr; }
.sd-icon-wrap { display:flex; align-items:center; justify-content:center; width:100%; aspect-ratio:1; max-width:280px; margin:0 auto; border-radius:var(--radius-xl); background:var(--bg-section); }
.sd-text h3 { font-family:var(--font-head); font-size:1.6rem; font-weight:800; color:var(--text-dark); margin:12px 0 16px; }
.sd-text p { color:var(--text-muted); line-height:1.8; margin-bottom:24px; }

/* ---- CONTACT PAGE ---- */
.contact-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:64px; margin-bottom:80px; }
.contact-info-cards { display:flex; flex-direction:column; gap:16px; margin-bottom:24px; }
.contact-info-card { display:flex; gap:16px; background:var(--bg-card); border-radius:var(--radius); padding:20px; border:1px solid var(--border-light); }
.cic-icon { width:44px; height:44px; border-radius:12px; background:rgba(109,40,217,.1); color:var(--primary); display:flex; align-items:center; justify-content:center; font-size:1.1rem; flex-shrink:0; }
.cic-text h4 { font-weight:700; color:var(--text-dark); margin-bottom:4px; }
.cic-text a,.cic-text p { color:var(--text-muted); font-size:.9rem; }
.hours-card { background:var(--bg-card); border-radius:var(--radius); padding:24px; border:1px solid var(--border-light); }
.hours-card h4 { font-weight:700; color:var(--text-dark); margin-bottom:16px; display:flex; gap:8px; align-items:center; }
.hours-card h4 i { color:var(--primary); }
.hours-table { display:flex; flex-direction:column; gap:8px; }
.hours-row { display:flex; justify-content:space-between; font-size:.9rem; padding:4px 0; border-bottom:1px dashed var(--border-light); }
.hours-row:last-child { border-bottom:none; }
.quick-contact { display:flex; flex-direction:column; gap:10px; margin-top:20px; }
.quick-btn { display:flex; align-items:center; gap:10px; padding:12px 20px; border-radius:12px; font-weight:700; font-size:.9rem; transition:var(--transition); }
.qb-wp  { background:linear-gradient(135deg,#25D366,#128C7E); color:#fff; }
.qb-phone { background:linear-gradient(135deg,var(--primary),var(--primary-dark)); color:#fff; }
.qb-email { background:var(--bg-section); color:var(--primary); border:1.5px solid var(--border-light); }
.quick-btn:hover { transform:translateY(-2px); box-shadow:var(--shadow); }
.contact-form-card { background:var(--bg-card); border-radius:var(--radius-xl); padding:40px; border:1px solid var(--border-light); box-shadow:var(--shadow); }
.contact-form-card h3 { font-family:var(--font-head); font-weight:800; color:var(--text-dark); margin-bottom:8px; }
.contact-form-card > p { color:var(--text-muted); margin-bottom:28px; }
.form-row,.form-row-2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-row-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; }
.form-group { display:flex; flex-direction:column; gap:6px; margin-bottom:16px; }
.form-group label { font-weight:700; font-size:.85rem; color:var(--text-dark); }
.form-group input,.form-group select,.form-group textarea {
  padding:12px 16px; border:1.5px solid var(--border-light); border-radius:12px;
  background:#fff; color:var(--text-body); font-size:.92rem; transition:var(--transition);
}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 3px rgba(109,40,217,.1); }
.form-group textarea { resize:vertical; min-height:100px; }
.form-submit { width:100%; justify-content:center; margin-top:8px; }
.form-success { display:flex; flex-direction:column; align-items:center; gap:16px; padding:48px 24px; text-align:center; color:var(--success); }
.form-success i { font-size:3rem; }
.map-section { margin-top:80px; }
.map-wrap { border-radius:var(--radius-xl); overflow:hidden; box-shadow:var(--shadow-xl); height:400px; }
.map-wrap iframe { width:100%; height:100%; border:none; }
.contact-social,.cs-link { display:flex; gap:16px; flex-wrap:wrap; justify-content:center; }
.cs-link { align-items:center; gap:10px; padding:14px 24px; border-radius:14px; font-weight:700; transition:var(--transition); font-size:.95rem; }
.cs-ig { background:linear-gradient(135deg,#f09433,#e6683c,#dc2743); color:#fff; }
.cs-yt { background:#ff0000; color:#fff; }
.cs-fb { background:#1877f2; color:#fff; }
.cs-tw { background:#000; color:#fff; }
.cs-wp { background:linear-gradient(135deg,#25D366,#128C7E); color:#fff; }
.cs-link:hover { transform:translateY(-3px); box-shadow:var(--shadow); }

/* ---- VIDEOS PAGE ---- */
.yt-banner {
  background:linear-gradient(135deg,#ff0000,#cc0000); color:#fff; border-radius:var(--radius-xl); padding:32px 40px;
  margin-bottom:40px; display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap;
}
.yt-banner h3 { font-family:var(--font-head); font-weight:800; font-size:1.3rem; margin-bottom:6px; }
.yt-banner p { opacity:.85; font-size:.9rem; }
.btn-yt-subscribe { display:flex; align-items:center; gap:8px; padding:12px 24px; background:#fff; color:#ff0000; border-radius:12px; font-weight:800; font-size:.9rem; transition:var(--transition); white-space:nowrap; }
.btn-yt-subscribe:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.2); }
.social-channels { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.social-channel-card { display:flex; flex-direction:column; align-items:center; gap:10px; padding:32px 20px; border-radius:var(--radius-xl); font-weight:700; text-align:center; transition:var(--transition); }
.social-channel-card i { font-size:2.2rem; }
.social-channel-card h4 { font-family:var(--font-head); font-size:1rem; }
.social-channel-card p { font-size:.82rem; opacity:.8; }
.social-channel-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-xl); }
.scc-ig { background:linear-gradient(135deg,#f09433,#e6683c,#dc2743); color:#fff; }
.scc-yt { background:#ff0000; color:#fff; }
.scc-fb { background:#1877f2; color:#fff; }
.scc-wp { background:linear-gradient(135deg,#25D366,#128C7E); color:#fff; }

/* ---- VIDEO MODAL ---- */
.video-modal { position:fixed; inset:0; background:rgba(0,0,0,.85); backdrop-filter:blur(8px); z-index:9999; display:none; align-items:center; justify-content:center; }
.video-modal.active { display:flex; }
.modal-content { background:#111; border-radius:var(--radius-xl); width:min(900px,94vw); position:relative; overflow:hidden; }
.modal-close { position:absolute; top:12px; right:12px; width:36px; height:36px; background:rgba(255,255,255,.1); border:none; border-radius:50%; color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:1; transition:var(--transition); }
.modal-close:hover { background:rgba(255,255,255,.2); }
.modal-video-wrap { aspect-ratio:16/9; }
.modal-video-wrap iframe { width:100%; height:100%; border:none; }

/* ---- FOOTER ---- */
.footer { background:#0d0824; color:rgba(255,255,255,.7); padding:80px 0 0; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.5fr; gap:48px; padding-bottom:48px; }
.footer-brand p { font-size:.9rem; line-height:1.7; margin:16px 0 24px; }
.footer-logo .logo-name,.footer-logo .logo-sub { color:#fff; }
.footer-social { display:flex; gap:10px; }
.fsocial-link { width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.08); color:rgba(255,255,255,.7); transition:var(--transition); }
.fsocial-link:hover { background:var(--primary); color:#fff; transform:translateY(-3px); }
.footer-nav h4,.footer-contact h4 { font-family:var(--font-head); font-weight:700; color:#fff; margin-bottom:20px; font-size:.95rem; }
.footer-nav li,.footer-contact li { margin-bottom:10px; }
.footer-nav a { font-size:.9rem; color:rgba(255,255,255,.6); transition:var(--transition); }
.footer-nav a:hover { color:#fff; }
.footer-contact li { display:flex; gap:10px; align-items:flex-start; font-size:.9rem; }
.footer-contact li i { color:var(--primary); margin-top:3px; flex-shrink:0; }
.footer-contact a { color:rgba(255,255,255,.6); }
.footer-contact a:hover { color:#fff; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.08); padding:24px 0; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; font-size:.85rem; }

/* ---- WHATSAPP FLOAT ---- */
.whatsapp-float {
  position:fixed; bottom:32px; right:32px; z-index:999;
  width:60px; height:60px; border-radius:50%;
  background:linear-gradient(135deg,#25D366,#128C7E); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.6rem;
  box-shadow:0 8px 32px rgba(37,211,102,.5); transition:var(--transition);
}
.whatsapp-float:hover { transform:scale(1.1) translateY(-4px); }
.wp-tooltip {
  position:absolute; right:70px; top:50%; transform:translateY(-50%);
  background:var(--text-dark); color:#fff; padding:6px 14px; border-radius:8px;
  font-size:.8rem; white-space:nowrap; opacity:0; pointer-events:none; transition:var(--transition);
}
.whatsapp-float:hover .wp-tooltip { opacity:1; }

/* ---- SCROLL ANIMATION ---- */
.fade-up { opacity:0; transform:translateY(30px); transition:opacity .6s ease, transform .6s ease; }
.fade-up.visible { opacity:1; transform:translateY(0); }

.mobile-only-btn { display: none; }

/* ---- RESPONSIVE ---- */
@media (max-width:1024px) {
  .hero-container { grid-template-columns:1fr; text-align:center; gap:40px; }
  .hero-image-wrap { display:none; }
  .hero-stats { justify-content:center; }
  .hero-actions,.hero-social { justify-content:center; }
  .about-grid { grid-template-columns:1fr; }
  .about-img-col { max-width:400px; margin:0 auto; }
  .services-grid { grid-template-columns:repeat(2,1fr); }
  .testimonials-grid { grid-template-columns:1fr 1fr; }
  .social-channels { grid-template-columns:repeat(2,1fr); }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .about-full-grid { grid-template-columns:1fr; }
  .about-sticky { position:static; }
  .contact-grid { grid-template-columns:1fr; }
  .service-detail-card { grid-template-columns:1fr; padding:32px; }
  .service-detail-card.reverse { direction:ltr; }
}
@media (max-width:768px) {
  .nav-links { display:none; position:fixed; top:72px; left:0; right:0; background:#fff; padding:20px; flex-direction:column; box-shadow:var(--shadow-xl); border-top:1px solid var(--border-light); }
  .nav-links.open { display:flex; }
  .nav-link { padding:14px 16px; border-radius:12px; }
  .btn-whatsapp,.btn-appointment { display:none; }
  .hamburger { display:flex; }
  .section { padding:60px 0; }
  .services-grid { grid-template-columns:1fr; }
  .videos-grid,.videos-full-grid { grid-template-columns:1fr; }
  .testimonials-grid { grid-template-columns:1fr; }
  .social-channels { grid-template-columns:1fr 1fr; }
  .steps-grid { flex-direction:column; }
  .step-arrow { transform:rotate(90deg); }
  .footer-grid { grid-template-columns:1fr; }
  .form-row,.form-row-2,.form-row-3 { grid-template-columns:1fr; }
  .trust-bar .container { gap:20px; }

  /* Mobile Dropdown Fixes */
  .nav-links {
    display: none;
    position: fixed;
    top: 72px;
    left: 0;
    right: 0;
    background: #ffffff !important;
    padding: 24px;
    flex-direction: column;
    box-shadow: var(--shadow-xl);
    border-top: 1px solid var(--border-light);
    gap: 8px;
  }
  .nav-links.open { display: flex; }
  
  /* Force dark text inside mobile menu even if not scrolled */
  .navbar .nav-links .nav-link {
    color: var(--text-dark) !important;
    display: block;
    width: 100%;
    padding: 12px 16px;
  }
  .navbar .nav-links .nav-link:hover {
    color: var(--primary) !important;
    background: rgba(109, 40, 217, 0.06) !important;
  }
  .navbar .nav-links .nav-link.active {
    color: var(--primary) !important;
    background: rgba(109, 40, 217, 0.1) !important;
  }

  /* Hide navbar actions button on mobile and show inside dropdown menu */
  .nav-actions .btn-appointment { display: none !important; }
  .mobile-only-btn { display: block !important; }
  .mobile-only-btn .btn-appointment {
    display: block !important;
    text-align: center;
    padding: 14px;
    margin-top: 8px;
    font-size: 0.9rem;
  }
}

/* Timeline mobile optimization */
@media (max-width: 580px) {
  .timeline::before { left: 16px; }
  .timeline-item { grid-template-columns: 1fr; gap: 8px; padding-left: 36px; padding-bottom: 24px; }
  .timeline-item::before { left: 9px; top: 6px; }
  .timeline-year { font-size: 0.85rem; padding-top: 0; margin-bottom: 4px; text-align: left; }
}

@media (max-width:480px) {
  .social-channels { grid-template-columns:1fr; }
  .cta-actions { flex-direction:column; }
  
  /* Clean logo for very small mobile screens */
  .logo-sub { display: none !important; }
  .logo-name { font-size: 0.88rem; }
  .nav-container { padding: 0 16px; gap: 16px; }
}