/* =============================================
   DENTAL PLANET ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â Main Stylesheet
   Brand: #FF8500 (orange) | #F9AF5E (accent)
   Fonts: Inter (body) | Outfit (heading)
   ============================================= */
:root {
  --dp-black:#1A1A1A;--dp-primary:#FF8500;--dp-primary-dark:#D96E00;
  --dp-primary-light:#F9AF5E;--dp-primary-pale:#FFF0DC;--dp-accent:#F9AF5E;
  --dp-white:#FFFFFF;--dp-off-white:#FEFAF9;--dp-gray-100:#F0E8E0;
  --dp-gray-200:#DDD0C8;--dp-gray-300:#B8A898;--dp-gray-400:#8A7868;
  --dp-gray-500:#6B5B50;--dp-gray-600:#4A3B32;--dp-gray-700:#2C1F18;
  --dp-dark:#1A1209;--dp-success:#10B981;--dp-star:#FBBF24;--dp-whatsapp:#25D366;
  --dp-shadow-sm:0 1px 3px rgba(255,133,0,.06),0 1px 2px rgba(0,0,0,.04);
  --dp-shadow-md:0 4px 12px rgba(0,0,0,.08);--dp-shadow-lg:0 10px 30px rgba(0,0,0,.1);
  --dp-shadow-card:0 4px 20px rgba(255,133,0,.08);
  --dp-shadow-card-hover:0 8px 30px rgba(255,133,0,.18);
  --dp-font-primary:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --dp-font-heading:'Outfit','Inter',sans-serif;
  --dp-section-padding:80px 0;--dp-container-max:1200px;--dp-container-padding:0 24px;
  --dp-radius-sm:8px;--dp-radius-md:12px;--dp-radius-lg:16px;
  --dp-radius-xl:24px;--dp-radius-full:50%;
  --dp-transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;}
body{font-family:var(--dp-font-primary) !important;color:var(--dp-gray-600);background:var(--dp-white);line-height:1.7;overflow-x:hidden;}
img{max-width:100%;height:auto;display:block;}
a{text-decoration:none !important;color:inherit;transition:var(--dp-transition);}
ul,ol{list-style:none;padding-left:0 !important;margin-bottom:0 !important;}
h1,h2,h3,h4,h5,h6{font-family:var(--dp-font-heading) !important;color:var(--dp-gray-700);line-height:1.3;font-weight:700;margin-bottom:0;}
/* Bootstrap overrides */
.btn:focus,.form-control:focus,.form-select:focus{box-shadow:none !important;}
p{margin-bottom:0;}
label{margin-bottom:0;}
blockquote{margin-bottom:0;}
.dp-container{max-width:var(--dp-container-max);margin:0 auto;padding:var(--dp-container-padding);}
.dp-section{padding:var(--dp-section-padding);}
.dp-section-alt{padding:var(--dp-section-padding);background:var(--dp-off-white);}
.dp-section-title{text-align:center;margin-bottom:16px;font-size:2.25rem;color:var(--dp-gray-700);}
.dp-section-title span{color:var(--dp-primary);}
.dp-section-subtitle{text-align:center;color:var(--dp-gray-400);font-size:1.1rem;max-width:600px;margin:0 auto 48px;line-height:1.6;}
.dp-badge{display:inline-flex;align-items:center;gap:6px;background:var(--dp-primary-pale);color:var(--dp-primary);padding:6px 16px;border-radius:50px;font-size:.85rem;font-weight:600;margin-bottom:16px;}
.dp-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 32px;border-radius:50px;font-family:var(--dp-font-primary);font-size:1rem;font-weight:600;cursor:pointer;border:none;transition:var(--dp-transition);white-space:nowrap;}
.dp-btn-primary{background:linear-gradient(135deg,var(--dp-primary),var(--dp-accent));color:var(--dp-white);box-shadow:0 4px 15px rgba(255,133,0,.3);}
.dp-btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(255,133,0,.4);}
.dp-btn-secondary{background:var(--dp-white);color:var(--dp-primary);border:2px solid var(--dp-primary);}
.dp-btn-secondary:hover{background:var(--dp-primary);color:var(--dp-white);transform:translateY(-2px);}
.dp-btn-whatsapp{background:var(--dp-whatsapp);color:var(--dp-white);box-shadow:0 4px 15px rgba(37,211,102,.3);}
.dp-btn-whatsapp:hover{background:#1EBE5A;transform:translateY(-2px);}
.dp-btn-sm{padding:10px 24px;font-size:.9rem;}
.dp-btn-lg{padding:18px 40px;font-size:1.1rem;}
/* ===== HEADER ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â Premium Navbar ===== */
:root { --dp-header-h: 76px; }

.dp-header {
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  z-index: 1000;
  background: transparent;
  border-bottom: 1px solid transparent;
  /* Navbar slide-in animation */
  animation: navSlideIn .5s cubic-bezier(.22,1,.36,1) both;
  transition: background .4s ease, border-color .4s ease,
              box-shadow .4s ease, backdrop-filter .4s ease;
}
@keyframes navSlideIn {
  from { opacity: 0; transform: translateY(-100%); }
  to   { opacity: 1; transform: translateY(0); }
}
/* Orange shimmer accent line at very top */
.dp-header::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--dp-primary), var(--dp-accent), var(--dp-primary));
  background-size: 200% auto;
  animation: shimmer 4s linear infinite;
  opacity: 0;
  transition: opacity .4s ease;
}
.dp-header.scrolled::before { opacity: 1; }

/* Scrolled state ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â frosted glass */
.dp-header.scrolled {
  background: rgba(12, 12, 12, 0.85);
  backdrop-filter: blur(24px) saturate(1.8);
  -webkit-backdrop-filter: blur(24px) saturate(1.8);
  border-bottom: 1px solid rgba(255, 133, 0, 0.15);
  box-shadow: 0 4px 32px rgba(0, 0, 0, 0.4);
}

.dp-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--dp-header-h);
}

/* Logo */
.dp-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--dp-font-heading);
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--dp-white);
  transition: color .3s;
}
/* Always keep logo white â€” header is always dark */
.dp-header.scrolled .dp-logo { color: #fff; }

/* Nav links */
.dp-nav { display: flex; align-items: center; gap: 6px; }

.dp-nav a {
  font-size: .88rem;
  font-weight: 600;
  color: rgba(255,255,255,.8);
  padding: 7px 14px;
  border-radius: 50px;
  position: relative;
  letter-spacing: .01em;
  transition: color .25s, background .25s;
}
.dp-nav a:hover {
  color: var(--dp-white);
  background: rgba(255,255,255,.12);
}
/* Scrolled nav links */
.dp-header.scrolled .dp-nav a { color: #fff; }
.dp-header.scrolled .dp-nav a:hover {
  color: var(--dp-primary);
  background: var(--dp-primary-pale);
}
/* Active indicator dot */
.dp-nav a.active {
  color: var(--dp-primary);
  background: rgba(255,133,0,.12);
}

/* Header right side */
.dp-header-cta { display: flex; align-items: center; gap: 10px; }

.dp-header-phone {
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: rgba(255,255,255,.9);
  font-size: .88rem;
  padding: 6px 14px;
  border-radius: 50px;
  border: 1.5px solid rgba(255,255,255,.25);
  transition: all .3s;
}
.dp-header-phone:hover {
  background: rgba(255,255,255,.1);
  border-color: rgba(255,255,255,.5);
}
.dp-header.scrolled .dp-header-phone {
  color: var(--dp-primary);
  border-color: rgba(255,133,0,.3);
}
.dp-header.scrolled .dp-header-phone:hover {
  background: var(--dp-primary-pale);
}

/* CTA Book button in header */
.dp-header-book {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 20px;
  background: linear-gradient(135deg, var(--dp-primary), var(--dp-accent));
  color: var(--dp-white);
  border-radius: 50px;
  font-size: .88rem;
  font-weight: 700;
  box-shadow: 0 4px 14px rgba(255,133,0,.35);
  transition: transform .25s, box-shadow .25s;
  white-space: nowrap;
}
.dp-header-book:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(255,133,0,.45);
  color: var(--dp-white);
}

/* Hamburger */
.dp-menu-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  padding: 8px;
  background: none;
  border: none;
  z-index: 1001;
}
.dp-menu-toggle span {
  display: block;
  width: 22px;
  height: 2px;
  background: rgba(255,255,255,.9);
  border-radius: 2px;
  transition: var(--dp-transition);
}
.dp-header.scrolled .dp-menu-toggle span { background: #fff; }
.dp-menu-toggle.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px);}
.dp-menu-toggle.active span:nth-child(2){opacity:0;}
.dp-menu-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px);}
/* Close button â€” hidden everywhere by default, shown only inside open overlay */
.dp-nav-close { display: none; }
/* ===== HERO ===== */
.dp-hero {
  height: 100svh;
  background: #111;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  /* Push content below fixed navbar */
  padding-top: var(--dp-header-h);
  box-sizing: border-box;
}
.h-noise{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.03;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:200px;}
.h-grid{position:absolute;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(circle,rgba(255,133,0,.07) 1px,transparent 1px);background-size:36px 36px;mask-image:radial-gradient(ellipse 75% 80% at 60% 50%,#000 30%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 75% 80% at 60% 50%,#000 30%,transparent 100%);}
.h-orb{position:absolute;border-radius:50%;pointer-events:none;filter:blur(80px);}
.h-orb-tr{width:560px;height:560px;top:-140px;right:-120px;background:radial-gradient(circle,rgba(255,133,0,.18) 0%,transparent 65%);animation:orbF 16s ease-in-out infinite;}
.h-orb-bl{width:380px;height:380px;bottom:-80px;left:-80px;background:radial-gradient(circle,rgba(249,175,94,.10) 0%,transparent 68%);animation:orbF 22s ease-in-out infinite reverse 5s;}
@keyframes orbF{0%,100%{transform:translate(0,0) scale(1);}40%{transform:translate(30px,-36px) scale(1.06);}70%{transform:translate(-20px,24px) scale(.95);}}
.h-ring{position:absolute;border-radius:50%;border:1px solid rgba(255,133,0,.06);pointer-events:none;}
.h-ring-1{width:600px;height:600px;top:50%;right:-100px;transform:translateY(-50%);animation:ringPulse 8s ease-in-out infinite;}
.h-ring-2{width:900px;height:900px;top:50%;right:-280px;transform:translateY(-50%);animation:ringPulse 12s ease-in-out infinite 3s;}
@keyframes ringPulse{0%,100%{opacity:.4;transform:translateY(-50%) scale(1);}50%{opacity:.1;transform:translateY(-50%) scale(1.04);}}
/* Content grid: never overlaps navbar because hero already has padding-top */
.h-wrap{display:grid;grid-template-columns:1fr 440px;gap:40px;align-items:center;position:relative;z-index:1;width:100%;padding-top:0;padding-bottom:0;}
@media(min-width:1281px){.h-wrap{grid-template-columns:1fr 460px;gap:48px;}}
@media(max-width:1280px){.h-wrap{grid-template-columns:1fr 400px;gap:28px;}}
@media(max-width:1024px){
  .dp-hero{height:auto;padding-top:calc(var(--dp-header-h) + 24px);padding-bottom:56px;}
  .h-wrap{grid-template-columns:1fr;gap:32px;}
}
.h-a{opacity:0;transform:translateY(22px);animation:haIn .7s cubic-bezier(.22,1,.36,1) both;animation-delay:var(--d,0s);}
.h-right.h-a{transform:translateX(28px);animation-name:haRight;}
@keyframes haIn{to{opacity:1;transform:translateY(0);}}
@keyframes haRight{to{opacity:1;transform:translateX(0);}}
.h-badge{display:inline-flex;align-items:center;gap:9px;background:rgba(255,133,0,.1);border:1px solid rgba(255,133,0,.28);padding:6px 14px;border-radius:50px;font-size:.8rem;font-weight:600;color:rgba(255,255,255,.82);margin-bottom:14px;}
.h-badge strong{color:#FF8500;}
.h-badge-dot{width:8px;height:8px;border-radius:50%;background:#FF8500;flex-shrink:0;animation:pulse 2s ease-out infinite;}
.h-heading{font-size:clamp(1.9rem,3.2vw,2.8rem);font-weight:800;line-height:1.1;color:#fff;letter-spacing:-.03em;margin-bottom:14px;}
.h-orange{background:linear-gradient(110deg,#FF8500 10%,#F9AF5E 55%,#FF8500 90%);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer 4s linear infinite 1s;}
@keyframes shimmer{0%{background-position:200% center}100%{background-position:0% center}}
.h-stroke{-webkit-text-stroke:2px rgba(255,133,0,.5);color:transparent;}
.h-sub{font-size:.9rem;color:rgba(255,255,255,.56);line-height:1.65;margin-bottom:16px;max-width:480px;}
.h-features{list-style:none;padding:0;margin:0 0 18px;display:grid;grid-template-columns:1fr 1fr;gap:7px 16px;}
.h-features li{display:flex;align-items:center;gap:8px;font-size:.82rem;color:rgba(255,255,255,.68);font-weight:500;}
.h-check{color:#FF8500;font-weight:800;font-size:.9rem;flex-shrink:0;}
.h-stats{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding-top:16px;border-top:none;}
.h-stat{text-align:center;}
.h-stat strong{display:block;font-size:1.4rem;font-weight:800;color:#FF8500;line-height:1;}
.h-stat span{font-size:.65rem;color:rgba(255,255,255,.38);font-weight:500;margin-top:2px;display:block;}
.h-stat-sep{width:1px;height:28px;background:rgba(255,255,255,.1);align-self:center;}
/* Form card â€” premium glassmorphism with glow */
.h-form-card{background:rgba(255,255,255,.06);backdrop-filter:blur(28px) saturate(1.8);-webkit-backdrop-filter:blur(28px) saturate(1.8);border:1.5px solid rgba(255,133,0,.28);border-radius:22px;padding:20px 22px;box-shadow:0 32px 72px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.1),0 0 40px rgba(255,133,0,.08);position:relative;overflow:hidden;animation:formFloat 6s ease-in-out infinite,formGlow 4s ease-in-out infinite alternate;}
.h-form-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#FF8500,#F9AF5E,#FF8500);background-size:200% auto;animation:shimmer 3s linear infinite;}
.h-form-card::after{content:'';position:absolute;bottom:-50%;right:-50%;width:200px;height:200px;background:radial-gradient(circle,rgba(255,133,0,.08) 0%,transparent 70%);border-radius:50%;pointer-events:none;animation:orbFloat 8s ease-in-out infinite;}
@keyframes formFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}
@keyframes formGlow{0%{box-shadow:0 32px 72px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.1),0 0 30px rgba(255,133,0,.06);}100%{box-shadow:0 32px 72px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.1),0 0 50px rgba(255,133,0,.15);}}
@keyframes orbFloat{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(-20px,-30px) scale(1.2);}}
/* Form header â€” spacious */
.h-form-header{display:flex;align-items:center;gap:10px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.1);}
.h-form-header-icon{width:38px;height:38px;flex-shrink:0;background:linear-gradient(135deg,#FF8500,#F9AF5E);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 6px 18px rgba(255,133,0,.4);animation:iconPulse 3s ease-in-out infinite;}
@keyframes iconPulse{0%,100%{box-shadow:0 8px 24px rgba(255,133,0,.4);}50%{box-shadow:0 8px 32px rgba(255,133,0,.6);transform:scale(1.05);}}
.h-form-header-text{flex:1;}
.h-form-header-text h2{font-size:.95rem;font-weight:700;color:#fff;margin-bottom:1px;}
.h-form-header-text p{font-size:.72rem;color:rgba(255,255,255,.5);margin:0;}
.h-form-header-text strong{color:#FF8500;}
.h-form-header-badge{background:linear-gradient(135deg,#FF8500,#E07600);color:#fff;font-size:.65rem;font-weight:800;letter-spacing:.08em;padding:4px 12px;border-radius:50px;box-shadow:0 4px 12px rgba(255,133,0,.3);animation:badgePulse 2s ease-in-out infinite;}
@keyframes badgePulse{0%,100%{transform:scale(1);}50%{transform:scale(1.08);}}
/* Fields â€” spacious with smooth transitions */
.h-field{margin-bottom:8px;}
.h-field label{display:flex;align-items:center;gap:5px;font-size:.72rem;font-weight:600;color:rgba(255,255,255,.65);margin-bottom:3px;transition:color .3s;}
.h-field label svg{color:#FF8500;flex-shrink:0;transition:transform .3s;}
.h-field:focus-within label{color:rgba(255,255,255,.9);}
.h-field:focus-within label svg{transform:scale(1.15);}
.h-field input,.h-field textarea{width:100%;padding:9px 12px;background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.12);border-radius:10px;font-family:var(--dp-font-primary);font-size:.86rem;color:#fff;transition:all .3s cubic-bezier(.4,0,.2,1);}
.h-field input::placeholder,.h-field textarea::placeholder{color:rgba(255,255,255,.28);}
.h-field input:focus,.h-field textarea:focus{outline:none;border-color:#FF8500;background:rgba(255,133,0,.08);box-shadow:0 0 0 3px rgba(255,133,0,.12),0 4px 12px rgba(255,133,0,.08);transform:translateY(-1px);}
.h-field textarea{resize:none;min-height:46px;}
.h-submit-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:11px 18px;margin-top:6px;background:linear-gradient(135deg,#FF8500,#E07600);color:#fff;border:none;border-radius:10px;cursor:pointer;font-family:var(--dp-font-primary);font-size:.9rem;font-weight:700;box-shadow:0 6px 22px rgba(255,133,0,.4);transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;letter-spacing:.02em;}
.h-submit-btn::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.15),transparent 60%);}
.h-submit-btn::before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;background:rgba(255,255,255,.2);border-radius:50%;transform:translate(-50%,-50%);transition:width .5s,height .5s;}
.h-submit-btn:hover{transform:translateY(-3px);box-shadow:0 12px 36px rgba(255,133,0,.5);filter:brightness(1.08);}
.h-submit-btn:hover::before{width:300px;height:300px;}
.h-submit-btn:active{transform:translateY(0);box-shadow:0 4px 16px rgba(255,133,0,.3);}
.h-form-quick{display:flex;gap:8px;margin-top:12px;}
.h-quick-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:11px 14px;border-radius:12px;font-family:var(--dp-font-primary);font-size:.82rem;font-weight:600;text-decoration:none;transition:all .3s;}
.h-quick-btn:hover{transform:translateY(-2px);filter:brightness(1.1);}
.h-wa{background:#25D366;color:#fff;box-shadow:0 4px 14px rgba(37,211,102,.3);}
.h-call{background:rgba(255,255,255,.08);color:rgba(255,255,255,.8);border:1.5px solid rgba(255,255,255,.14);}
.h-form-trust{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.08);font-size:.72rem;color:rgba(255,255,255,.35);}
.h-form-trust svg{color:#FF8500;flex-shrink:0;}
.h-scroll-cue{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;z-index:2;opacity:0;animation:haIn .5s ease 1.6s both;}
.h-scroll-cue span{font-size:.65rem;color:rgba(255,255,255,.3);font-weight:500;letter-spacing:.08em;text-transform:uppercase;}
.h-scroll-mouse{width:22px;height:36px;border:2px solid rgba(255,255,255,.2);border-radius:11px;display:flex;justify-content:center;padding-top:6px;}
.h-scroll-dot{width:4px;height:7px;background:#FF8500;border-radius:2px;animation:dotScroll 2.2s ease-in-out infinite;}
@keyframes dotScroll{0%{transform:translateY(0);opacity:1;}60%{transform:translateY(9px);opacity:0;}61%{transform:translateY(0);opacity:0;}100%{opacity:1;}}
/* ===== SERVICES ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â Section Header (title left + CTA right) ===== */
.dp-services-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 48px;
  flex-wrap: wrap;
}
.dp-services-header-text { flex: 1; min-width: 280px; }
.dp-services-subtitle {
  color: var(--dp-gray-400);
  font-size: 1rem;
  line-height: 1.6;
  max-width: 520px;
  margin-top: 8px;
}
.dp-services-header-cta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  flex-shrink: 0;
}
.dp-services-cta-note {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: .78rem;
  color: var(--dp-gray-300);
  font-weight: 500;
}
.dp-services-cta-note svg { color: var(--dp-primary); flex-shrink: 0; }

/* Service number badge ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â bottom-left of image panel */
.svc-num {
  position: absolute;
  bottom: 10px;
  left: 12px;
  font-size: .72rem;
  font-weight: 800;
  color: rgba(255,255,255,.22);
  font-family: var(--dp-font-heading);
  letter-spacing: .04em;
  line-height: 1;
  user-select: none;
}

/* Footer row: dots centered, mobile CTA hidden on desktop */
.dp-svc-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin-top: 24px;
  flex-wrap: wrap;
}
.dp-carousel-dots { display: flex; gap: 8px; }
.dp-carousel-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--dp-gray-200); border: none; cursor: pointer; transition: var(--dp-transition); padding: 0; }
.dp-carousel-dot.active { background: var(--dp-primary); width: 24px; border-radius: 4px; }

/* Mobile CTA ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Â hidden on desktop, shown on mobile */
.dp-svc-mobile-cta {
  display: none;
  align-items: center;
  gap: 6px;
  font-size: .88rem;
  font-weight: 700;
  color: var(--dp-primary);
  padding: 10px 20px;
  border: 2px solid var(--dp-primary);
  border-radius: 50px;
  transition: var(--dp-transition);
}
.dp-svc-mobile-cta:hover { background: var(--dp-primary); color: #fff; }

.dp-services-carousel-wrap { position: relative; margin-bottom: 0; }
.dp-services-track-outer{overflow:hidden;border-radius:var(--dp-radius-lg);}
.dp-services-grid{display:flex;gap:24px;transition:transform .5s cubic-bezier(.4,0,.2,1);will-change:transform;}
.dp-service-card{background:#fff;border-radius:16px;border:1px solid rgba(0,0,0,.07);overflow:hidden;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s,border-color .3s;flex:0 0 calc((100% - 48px)/3);position:relative;}
.dp-service-card:hover{transform:translateY(-8px);box-shadow:0 20px 48px rgba(255,133,0,.14);border-color:rgba(255,133,0,.3);}
.dp-service-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#FF8500,#F9AF5E);transform:scaleX(0);transform-origin:left;transition:transform .35s ease;z-index:3;}
.dp-service-card:hover::before{transform:scaleX(1);}
.dp-service-img{width:100%;height:172px;background:linear-gradient(135deg,#1a1a1a 0%,#2a1f10 100%);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;flex-shrink:0;}
.dp-service-img::before{content:'';position:absolute;width:160px;height:160px;background:radial-gradient(circle,rgba(255,133,0,.18) 0%,transparent 70%);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);}
.svc-icon-wrap{width:72px;height:72px;background:rgba(255,133,0,.12);border:1.5px solid rgba(255,133,0,.22);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#FF8500;position:relative;z-index:1;transition:background .3s,transform .3s;}
.dp-service-card:hover .svc-icon-wrap{background:rgba(255,133,0,.22);transform:scale(1.08);}
.svc-tag{position:absolute;top:12px;right:12px;background:#FF8500;color:#fff;font-size:.68rem;font-weight:700;padding:3px 9px;border-radius:50px;letter-spacing:.03em;text-transform:uppercase;z-index:2;}
.dp-service-body{padding:20px;display:flex;flex-direction:column;flex:1;}
.dp-service-body h3{font-size:1rem;font-weight:700;color:#1A1A1A;margin-bottom:8px;}
.dp-service-body p{font-size:.83rem;color:#6B7280;line-height:1.6;flex:1;margin-bottom:14px;}
.svc-link{display:inline-flex;align-items:center;gap:4px;font-size:.8rem;font-weight:700;color:#FF8500;text-decoration:none;transition:gap .2s;margin-top:auto;}
.svc-link:hover{gap:8px;}
.dp-carousel-btn{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;background:var(--dp-white);border:2px solid var(--dp-gray-100);border-radius:var(--dp-radius-full);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;transition:var(--dp-transition);box-shadow:var(--dp-shadow-md);color:var(--dp-gray-600);}
.dp-carousel-btn:hover{background:var(--dp-primary);border-color:var(--dp-primary);color:var(--dp-white);transform:translateY(-50%) scale(1.05);}
.dp-carousel-btn.prev{left:-22px;}.dp-carousel-btn.next{right:-22px;}
.dp-carousel-btn:disabled{opacity:.35;cursor:not-allowed;pointer-events:none;}
.dp-why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:48px;}
.dp-why-card{background:var(--dp-white);border-radius:var(--dp-radius-lg);padding:36px 28px;text-align:center;transition:all .3s cubic-bezier(.4,0,.2,1);border:1.5px solid var(--dp-gray-100);}
.dp-why-card:hover{transform:translateY(-6px);box-shadow:0 16px 40px rgba(255,133,0,0.18);border-color:var(--dp-primary);}
.dp-why-icon{width:64px;height:64px;margin:0 auto 20px;background:var(--dp-primary-pale);border-radius:var(--dp-radius-full);display:flex;align-items:center;justify-content:center;color:var(--dp-primary);transition:var(--dp-transition);}
.dp-why-card:hover .dp-why-icon{background:var(--dp-primary);color:var(--dp-white);transform:rotate(10deg) scale(1.1);}
.dp-why-card h3{font-size:1.1rem;margin-bottom:8px;}
.dp-why-card p{font-size:.88rem;color:var(--dp-gray-400);line-height:1.6;}
.dp-equipment-visual{margin-top:0;background:linear-gradient(145deg,#1A1A1A,#0a0a0a);border:1px solid rgba(255,133,0,.15);box-shadow:0 20px 40px rgba(0,0,0,.1);border-radius:var(--dp-radius-xl);padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;color:var(--dp-white);position:relative;overflow:hidden;}
.dp-equipment-visual::before{content:'';position:absolute;top:-50px;left:-50px;width:250px;height:250px;background:radial-gradient(circle,rgba(255,133,0,.15) 0%,transparent 70%);border-radius:50%;pointer-events:none;}
.dp-equipment-content h3{font-size:1.8rem;color:var(--dp-white);margin-bottom:12px;}
.dp-equipment-content p{color:rgba(255,255,255,.6);margin-bottom:24px;line-height:1.6;font-size:0.95rem;}
.dp-equipment-list{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;}
.dp-equipment-list li{display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.85);font-weight:500;font-size:0.9rem;}
.dp-equipment-list li svg{color:var(--dp-primary);flex-shrink:0;}
.dp-equipment-image{background:rgba(255,255,255,.03);border-radius:var(--dp-radius-lg);height:320px;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid rgba(255,255,255,.08);position:relative;}
.dp-equipment-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s ease;}
.dp-equipment-visual:hover .dp-equipment-image img{transform:scale(1.05);}
/* ================================================================
   DOCTORS SECTION â€” Compact Layout v2
   ================================================================ */
.dp-doctors-section {
  background: #0d0d0d;
  position: relative;
  overflow: hidden;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding: 60px 0 40px;
}
.dp-doctors-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 60% at 15% 50%, rgba(255,133,0,.07) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

/* Header */
.ds-header-wrap {
  text-align: center;
  position: relative;
  z-index: 1;
  margin-bottom: 36px;
  padding: 0 24px;
}
.ds-label-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--dp-primary);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.ds-line { width: 28px; height: 1px; background: var(--dp-primary); }
.ds-header-wrap h2 {
  font-size: clamp(1.9rem, 3.5vw, 2.7rem);
  font-weight: 300;
  color: #fff;
  line-height: 1.1;
}
.ds-header-wrap h2 em { font-style: italic; color: var(--dp-primary); }

/* Body */
.ds-body {
  display: flex;
  gap: 32px;
  flex: 1;
  min-height: 0;
  max-width: 1260px;
  width: 100%;
  margin: 0 auto;
  padding: 0 24px;
  position: relative;
  z-index: 1;
}

/* Sidebar Tabs */
.ds-sidebar {
  width: 230px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ds-tab {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  cursor: pointer;
  text-align: left;
  transition: all 0.25s;
  color: inherit;
}
.ds-tab:hover { background: rgba(255,133,0,0.04); border-color: rgba(255,133,0,0.15); }
.ds-tab.active { background: rgba(255,133,0,0.07); border-color: rgba(255,133,0,0.35); }
.ds-tab-num {
  font-size: 1.1rem;
  font-weight: 700;
  color: rgba(255,255,255,0.18);
  min-width: 26px;
  transition: color 0.25s;
}
.ds-tab.active .ds-tab-num { color: var(--dp-primary); }
.ds-tab-bar {
  width: 2px;
  height: 26px;
  background: rgba(255,255,255,0.08);
  border-radius: 2px;
  flex-shrink: 0;
  transition: background 0.25s;
}
.ds-tab.active .ds-tab-bar { background: var(--dp-primary); }
.ds-tab-meta { display: flex; flex-direction: column; gap: 2px; }
.ds-tab-meta strong {
  display: block;
  font-size: 0.88rem;
  font-weight: 600;
  color: rgba(255,255,255,0.5);
  line-height: 1.2;
  transition: color 0.25s;
}
.ds-tab-meta span { font-size: 0.7rem; color: rgba(255,255,255,0.3); transition: color 0.25s; }
.ds-tab.active .ds-tab-meta strong { color: #fff; }
.ds-tab.active .ds-tab-meta span { color: rgba(255,133,0,0.7); }

/* Panels */
.ds-panels {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ds-nav-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.ds-nav {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(255,133,0,0.25);
  background: transparent;
  color: rgba(255,133,0,0.65);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}
.ds-nav:hover { background: rgba(255,133,0,0.1); border-color: rgba(255,133,0,0.5); color: var(--dp-primary); }
.ds-counter { font-size: 0.68rem; letter-spacing: 0.2em; color: rgba(255,255,255,0.3); margin-left: 8px; }
.ds-auto-badge { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.ds-pulse-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--dp-primary);
  animation: dsPulse 1.6s ease-in-out infinite;
}
@keyframes dsPulse {
  0%,100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.4; transform: scale(0.7); }
}
.ds-auto-txt { font-size: 0.62rem; letter-spacing: 0.2em; color: rgba(255,255,255,0.25); text-transform: uppercase; }

.ds-panel {
  display: flex;
  flex-direction: row;
  gap: 28px;
  flex: 1;
  min-height: 380px;
  animation: dsSlideIn 0.4s cubic-bezier(.22,1,.36,1) both;
}
@keyframes dsSlideIn {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
.ds-panel.active { display: flex; }

/* Photo */
.ds-panel-photo {
  width: 42%;
  aspect-ratio: 3/4;
  max-height: 500px;
  align-self: center;
  flex-shrink: 0;
  position: relative;
  background: rgba(255,255,255,0.02);
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.ds-photo-glow {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 75%; height: 75%;
  background: radial-gradient(circle, rgba(255,133,0,0.18) 0%, transparent 70%);
  filter: blur(40px);
  z-index: 0;
}
.ds-panel-photo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: bottom center;
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* Info */
.ds-panel-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}
.ds-accent {
  height: 3px;
  width: 52px;
  background: linear-gradient(to right, var(--dp-primary), transparent);
  border-radius: 2px;
  margin-bottom: 20px;
}
.ds-panel-info h3 {
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  font-weight: 400;
  color: #fff;
  margin-bottom: 4px;
  line-height: 1.2;
}
.ds-degree { font-size: 0.85rem; color: rgba(255,255,255,0.45); font-style: italic; margin-bottom: 18px; }
.ds-bullets { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 9px; margin-bottom: 18px; }
.ds-bullets li { font-size: 0.88rem; color: rgba(255,255,255,0.78); padding-left: 18px; position: relative; line-height: 1.4; }
.ds-bullets li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 6px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  border: 2px solid var(--dp-primary);
}
.ds-quote {
  font-size: 0.8rem;
  color: rgba(255,133,0,0.75);
  font-style: italic;
  border-left: 2px solid rgba(255,133,0,0.3);
  padding: 10px 14px;
  background: rgba(255,133,0,0.04);
  border-radius: 0 6px 6px 0;
  margin: 0 0 18px;
  line-height: 1.55;
}
.ds-panel-foot { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; padding-top: 10px; }
.ds-progress-dots { display: flex; gap: 6px; align-items: center; }
.ds-dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,0.12); transition: all 0.3s; }
.ds-dot.active { width: 20px; border-radius: 3px; background: var(--dp-primary); }
.ds-cta {
  padding: 10px 22px;
  background: linear-gradient(135deg, var(--dp-primary), #ff6a00);
  color: #fff;
  border-radius: 50px;
  font-weight: 700;
  font-size: 0.85rem;
  text-decoration: none;
  white-space: nowrap;
  transition: transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 6px 20px rgba(255,133,0,0.3);
}
.ds-cta:hover { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(255,133,0,0.5); color: #fff; }

/* â”€â”€ Mobile responsive â”€â”€ */
@media (max-width: 900px) {
  .dp-doctors-section { padding: 48px 0 28px; min-height: auto; }
  .ds-body { flex-direction: column; gap: 16px; padding: 0 14px; }
  .ds-sidebar {
    width: 100%;
    flex-direction: row;
    overflow-x: auto;
    scrollbar-width: none;
    gap: 6px;
    padding-bottom: 4px;
  }
  .ds-sidebar::-webkit-scrollbar { display: none; }
  .ds-tab {
    flex-shrink: 0;
    padding: 7px 12px;
    border-radius: 50px;
    gap: 7px;
  }
  .ds-tab-bar { display: none; }
  .ds-tab-num { font-size: 0.8rem; min-width: auto; }
  .ds-tab-meta strong { font-size: 0.78rem; }
  .ds-tab-meta span { display: none; }
  
  .ds-panel { flex-direction: column; gap: 14px; min-height: auto; }
  .ds-panel-photo { width: 100%; height: 350px; border-radius: 12px; align-self: center; }
  .ds-panel-photo img { position: relative; height: 100%; object-fit: contain; }
  
  .ds-panel-info { justify-content: flex-start; }
  .ds-panel-info h3 { font-size: 1.4rem; }
  .ds-quote { font-size: 0.76rem; }
  .ds-panel-foot { flex-direction: column; align-items: flex-start; gap: 10px; }
  .ds-cta { width: 100%; text-align: center; }
}

@media (max-width: 480px) {
  .ds-header-wrap h2 { font-size: 1.5rem; }
}




/* Base card */
.dp-doctor-card {
  background: var(--dp-white);
  border-radius: var(--dp-radius-lg);
  border: 1px solid var(--dp-gray-100);
  overflow: hidden;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 0;
  transition: var(--dp-transition);
  position: relative;
}
.dp-doctor-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--dp-primary), var(--dp-accent));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s ease;
}
.dp-doctor-card:hover { transform: translateY(-5px); box-shadow: var(--dp-shadow-card-hover); }
.dp-doctor-card:hover::before { transform: scaleX(1); }

/* Avatar column */
.dp-doctor-avatar {
  position: relative;
  flex-shrink: 0;
  width: 130px;
  min-height: 160px;
  background: linear-gradient(145deg, var(--dp-primary-pale) 0%, #FDE2B3 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}
.dp-doctor-card-featured .dp-doctor-avatar { width: 160px; min-height: 200px; }

.dp-doctor-avatar-inner {
  width: 90px; height: 90px;
  border-radius: 50%;
  background: rgba(255,133,0,.12);
  border: 2px solid rgba(255,133,0,.22);
  display: flex; align-items: center; justify-content: center;
  color: var(--dp-primary);
}
.dp-doctor-card-featured .dp-doctor-avatar-inner { width: 110px; height: 110px; }

/* Experience badge */
.dp-doctor-exp-badge {
  position: absolute;
  bottom: 10px; left: 50%;
  transform: translateX(-50%);
  background: var(--dp-primary);
  color: #fff;
  font-size: .68rem;
  font-weight: 800;
  padding: 3px 11px;
  border-radius: 50px;
  white-space: nowrap;
  letter-spacing: .04em;
  box-shadow: 0 3px 10px rgba(255,133,0,.4);
}

/* Body column */
.dp-doctor-body { flex: 1; padding: 22px 24px; display: flex; flex-direction: column; gap: 8px; }
.dp-doctor-card-featured .dp-doctor-body { padding: 26px 28px; gap: 10px; }

/* Header row inside body */
.dp-doctor-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 2px; }
.dp-doctor-header h3 { font-size: 1.1rem; font-weight: 800; color: var(--dp-gray-700); margin-bottom: 2px; }
.dp-doctor-card-featured .dp-doctor-header h3 { font-size: 1.25rem; }
.dp-doctor-degree { font-size: .8rem; color: var(--dp-primary); font-weight: 600; }

/* Gender badge */
.dp-doctor-gender-badge {
  flex-shrink: 0;
  font-size: .68rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 50px;
  letter-spacing: .03em;
  margin-top: 2px;
}
.dp-gender-f { background: rgba(236,72,153,.1); color: #BE185D; }
.dp-gender-m { background: rgba(59,130,246,.1); color: #1D4ED8; }

/* Specialization */
.dp-doctor-specialization { font-size: .82rem; color: var(--dp-primary); font-weight: 600; line-height: 1.5; }

/* Bio */
.dp-doctor-bio { font-size: .84rem; color: var(--dp-gray-400); line-height: 1.65; }
.dp-doctor-card-featured .dp-doctor-bio { font-size: .88rem; }

/* Tags */
.dp-doctor-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.dp-dtag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: .72rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 50px;
  background: var(--dp-primary-pale);
  color: var(--dp-primary-dark);
  border: 1px solid rgba(255,133,0,.15);
  line-height: 1;
}
.dp-dtag-accent { background: rgba(255,133,0,.08); color: var(--dp-primary); border-color: rgba(255,133,0,.25); }
.dp-dtag-gold { background: rgba(251,191,36,.12); color: #92400E; border-color: rgba(251,191,36,.3); }

.dp-doctors-cta { text-align: center; margin-top: 12px; }
.dp-transformations-gallery {
  display: flex;
  flex-direction: column;
  gap: 56px;
  margin-top: 48px;
  margin-bottom: 56px;
}
.dp-trans-group {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.dp-trans-group-title {
  font-size: 1.45rem;
  font-weight: 700;
  color: var(--dp-gray-700);
  margin-bottom: 8px;
  position: relative;
  padding-left: 18px;
  letter-spacing: -0.02em;
}
.dp-trans-group-title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 4px;
  background: var(--dp-primary);
  border-radius: 2px;
}
.dp-trans-images {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 28px;
}
.dp-trans-img-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: var(--dp-radius-lg);
  overflow: hidden;
  box-shadow: var(--dp-shadow-sm);
  transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s ease, border-color 0.4s ease;
  background: var(--dp-white);
  border: 1px solid var(--dp-gray-100);
  cursor: pointer;
}
.dp-trans-img-wrapper img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.dp-trans-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(26, 18, 9, 0.75) 0%, rgba(26, 18, 9, 0.2) 50%, rgba(26, 18, 9, 0) 100%);
  opacity: 0;
  transition: opacity 0.4s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.dp-trans-zoom-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--dp-primary);
  color: var(--dp-white);
  padding: 10px 20px;
  border-radius: 50px;
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transform: translateY(15px);
  opacity: 0;
  transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.4s ease, background 0.2s ease;
  box-shadow: 0 4px 15px rgba(255, 133, 0, 0.4);
}
.dp-trans-zoom-btn svg {
  stroke-width: 2.5px;
}
.dp-trans-img-wrapper:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 36px rgba(255, 133, 0, 0.18);
  border-color: var(--dp-primary-light);
}
.dp-trans-img-wrapper:hover img {
  transform: scale(1.08);
}
.dp-trans-img-wrapper:hover .dp-trans-overlay {
  opacity: 1;
}
.dp-trans-img-wrapper:hover .dp-trans-zoom-btn {
  transform: translateY(0);
  opacity: 1;
}
.dp-trans-zoom-btn:hover {
  background: var(--dp-primary-dark);
}
.dp-ba-cta {
  text-align: center;
  margin-top: 28px;
}
/* Case Study Subgroups */
.dp-trans-subgroups-container {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.dp-trans-subgroup {
  background: rgba(255, 133, 0, 0.015);
  border: 1px solid rgba(255, 133, 0, 0.08);
  border-radius: var(--dp-radius-xl);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.dp-trans-subgroup-header {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.dp-case-badge {
  background: var(--dp-primary);
  color: var(--dp-white);
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  padding: 4px 14px;
  border-radius: 50px;
  letter-spacing: 0.06em;
  box-shadow: 0 3px 8px rgba(255, 133, 0, 0.15);
}
.dp-trans-subgroup-header h4 {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--dp-gray-700);
  margin: 0;
}
@media(max-width:480px){
  .dp-trans-subgroup {
    padding: 16px;
    gap: 16px;
  }
}
.dp-testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:48px;}
.dp-testimonial-card{background:var(--dp-white);border-radius:var(--dp-radius-lg);padding:32px 28px;border:1px solid var(--dp-gray-100);transition:var(--dp-transition);position:relative;}
.dp-testimonial-card:hover{transform:translateY(-4px);box-shadow:var(--dp-shadow-card-hover);}
.dp-testimonial-card::before{content:'"';position:absolute;top:16px;right:24px;font-size:4rem;font-family:Georgia,serif;color:var(--dp-primary-pale);line-height:1;}
.dp-testimonial-stars{display:flex;gap:3px;margin-bottom:16px;}
.dp-testimonial-stars svg{width:18px;height:18px;color:var(--dp-star);fill:var(--dp-star);}
.dp-testimonial-card p{font-size:.95rem;color:var(--dp-gray-500);line-height:1.7;margin-bottom:20px;font-style:italic;}
.dp-testimonial-author{display:flex;align-items:center;gap:12px;}
.dp-testimonial-avatar{width:48px;height:48px;border-radius:var(--dp-radius-full);background:linear-gradient(135deg,var(--dp-primary),var(--dp-accent));display:flex;align-items:center;justify-content:center;color:var(--dp-white);font-weight:700;font-size:1.1rem;}
.dp-testimonial-author-info strong{display:block;font-size:.95rem;color:var(--dp-gray-700);}
.dp-testimonial-author-info span{font-size:.8rem;color:var(--dp-gray-400);}
.dp-faq-section{padding:var(--dp-section-padding);background:linear-gradient(165deg,#141414 0%,#1b1b1b 55%,#1e1408 100%);position:relative;}
.dp-faq-section::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#FF8500,#F9AF5E,#FF8500);}
.dp-faq-top{text-align:center;margin-bottom:48px;}
.dp-faq-top .dp-section-title{color:#fff;}
.dp-faq-top .dp-section-subtitle{color:rgba(255,255,255,.44);}
.dp-faq-grid{display:grid;grid-template-columns:1fr 290px;gap:48px;align-items:start;}
.dp-faq-list{display:flex;flex-direction:column;gap:10px;}
.dp-faq-item{border:1px solid rgba(255,255,255,.08);border-radius:12px;overflow:hidden;background:rgba(255,255,255,.028);transition:border-color .25s,box-shadow .25s;}
.dp-faq-item:hover,.dp-faq-item.faq-open{border-color:rgba(255,133,0,.36);box-shadow:0 4px 22px rgba(255,133,0,.07);}
.dp-faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;background:none;border:none;cursor:pointer;text-align:left;font-family:var(--dp-font-primary);font-size:.93rem;font-weight:600;color:rgba(255,255,255,.84);transition:color .2s;}
.dp-faq-q:hover,.dp-faq-item.faq-open .dp-faq-q{color:#FF8500;}
.faq-chev{flex-shrink:0;color:rgba(255,255,255,.3);transition:transform .35s cubic-bezier(.4,0,.2,1),color .2s;}
.dp-faq-item.faq-open .faq-chev{transform:rotate(180deg);color:#FF8500;}
.dp-faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s cubic-bezier(.4,0,.2,1);}
.dp-faq-inner{overflow:hidden;}
.dp-faq-item.faq-open .dp-faq-a{grid-template-rows:1fr;}
.dp-faq-a p{padding:0 20px 16px;margin:0;font-size:.875rem;color:rgba(255,255,255,.5);line-height:1.75;}
.dp-faq-cta{position:sticky;top:100px;background:rgba(255,133,0,.07);border:1px solid rgba(255,133,0,.24);border-radius:18px;padding:30px 22px;text-align:center;overflow:hidden;}
.faq-cta-orb{position:absolute;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(255,133,0,.12) 0%,transparent 70%);top:-60px;right:-60px;pointer-events:none;}
.faq-cta-icon{width:68px;height:68px;margin:0 auto 16px;background:linear-gradient(135deg,#FF8500,#F9AF5E);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 8px 24px rgba(255,133,0,.38);position:relative;z-index:1;}
.dp-faq-cta h3{font-size:1.15rem;color:#fff;margin-bottom:10px;}
.dp-faq-cta p{font-size:.86rem;color:rgba(255,255,255,.48);margin-bottom:20px;line-height:1.6;}
.faq-cta-btn{display:flex;width:100%;justify-content:center;margin-bottom:10px;font-size:.88rem;}
.faq-cta-hours{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:14px;font-size:.74rem;color:rgba(255,255,255,.32);}
.faq-cta-hours svg{color:#FF8500;}
.dp-footer{background:var(--dp-dark);color:rgba(255,255,255,.7);padding:64px 0 0;}
.dp-footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:48px;margin-bottom:48px;}
.dp-footer-brand .dp-logo{color:var(--dp-white);margin-bottom:16px;}
.dp-footer-brand p{font-size:.9rem;line-height:1.7;margin-bottom:20px;}
.dp-footer-social{display:flex;gap:12px;}
.dp-footer-social a{width:40px;height:40px;border-radius:var(--dp-radius-sm);background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.6);transition:var(--dp-transition);}
.dp-footer-social a:hover{background:var(--dp-primary);color:var(--dp-white);transform:translateY(-2px);}
.dp-footer h4{color:var(--dp-white);font-size:1.1rem;margin-bottom:20px;font-weight:600;}
.dp-footer-links li{margin-bottom:10px;}
.dp-footer-links a{font-size:.9rem;color:rgba(255,255,255,.6);display:flex;align-items:center;gap:8px;}
.dp-footer-links a:hover{color:var(--dp-primary-light);transform:translateX(4px);}
.dp-footer-contact li{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px;font-size:.9rem;}
.dp-footer-contact li svg{width:18px;height:18px;color:var(--dp-primary-light);flex-shrink:0;margin-top:3px;}
.dp-footer-map{width:100%;height:350px;background:rgba(255,255,255,.05);border-radius:var(--dp-radius-md);display:block;overflow:hidden;margin-bottom:40px;border:1px solid rgba(255,255,255,.08);}
.dp-footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding:24px 0;display:flex;align-items:center;justify-content:space-between;font-size:.85rem;}
.dp-whatsapp-float{position:fixed;bottom:24px;right:24px;width:60px;height:60px;background:var(--dp-whatsapp);border-radius:var(--dp-radius-full);display:flex;align-items:center;justify-content:center;color:var(--dp-white);font-size:1.6rem;box-shadow:0 4px 20px rgba(37,211,102,.4);z-index:999;transition:var(--dp-transition);cursor:pointer;animation:pulse 2s infinite;}
.dp-whatsapp-float:hover{transform:scale(1.1);box-shadow:0 6px 30px rgba(37,211,102,.5);}
@keyframes fadeInUp{from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);}}
@keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.5);}70%{box-shadow:0 0 0 15px rgba(37,211,102,0);}100%{box-shadow:0 0 0 0 rgba(37,211,102,0);}}
.dp-reveal{opacity:0;transform:translateY(30px);transition:opacity .65s cubic-bezier(.22,1,.36,1),transform .65s cubic-bezier(.22,1,.36,1);}
.dp-reveal.revealed{opacity:1;transform:translateY(0);}
@media(max-width:1024px){
  .dp-service-card{flex:0 0 calc((100% - 24px)/2);}
  .dp-doctors-row-2{grid-template-columns:1fr;}
  .dp-doctors-row-3{grid-template-columns:repeat(2,1fr);}
  .dp-why-grid{grid-template-columns:repeat(2,1fr);}
  .dp-testimonials-grid{grid-template-columns:repeat(2,1fr);}
  .dp-footer-grid{grid-template-columns:repeat(2,1fr);}
  .dp-equipment-visual{grid-template-columns:1fr;padding:36px;}
  /* Show hamburger, hide desktop nav */
  .dp-nav{display:none;}
  .dp-menu-toggle{display:flex;}
  /* Solid black header on tablet+ */
  .dp-header{ background: rgba(10,10,10,0.96) !important; backdrop-filter: blur(20px); }
  .dp-faq-grid{grid-template-columns:1fr;}
  .dp-faq-cta{position:static;}
  .dp-services-header{flex-direction:column;align-items:flex-start;gap:20px;margin-bottom:36px;}
  .dp-services-header-cta{align-items:flex-start;}
}
@media(max-width:768px){
  :root{--dp-section-padding:40px 0;}
  .dp-section-title{font-size:1.75rem;}
  .dp-section-subtitle{font-size:1rem;margin-bottom:28px;}
  .dp-service-card{flex:0 0 85% !important;}
  .dp-services-grid{padding: 0 7.5%;}
  .dp-carousel-btn{display:none;}
  .dp-services-header-cta{display:none;}
  .dp-svc-mobile-cta{display:inline-flex;}
  .dp-why-grid{grid-template-columns:1fr;}
  .dp-doctors-row-2,.dp-doctors-row-3{grid-template-columns:1fr;}
  .dp-doctor-card{flex-direction:column;}
  .dp-doctor-avatar{width:100%;min-height:120px;}
  .dp-doctor-card-featured .dp-doctor-avatar{width:100%;min-height:140px;}
  .dp-testimonials-grid{grid-template-columns:1fr;}
  .dp-footer{padding:40px 0 0;}
  .dp-footer-grid{grid-template-columns:1fr;gap:24px;}
  .dp-footer-bottom{flex-direction:column;gap:8px;text-align:center;}
  .dp-footer-map{height:250px;margin-bottom:24px;}
  /* Header on mobile: solid black, no transparency */
  .dp-header{ background: #0a0a0a !important; backdrop-filter: none !important; }
  .dp-header-cta .dp-btn{display:none;}
  .dp-header-phone{display:none;}
  .dp-book-text{display:none;}
  .dp-header-book{padding:8px 12px !important;min-width:unset;}
  .dp-menu-toggle span{background:#fff !important;}
  /* Mobile nav overlay */
  .dp-nav.mobile-active{
    display:flex;flex-direction:column;
    position:fixed;top:0;left:0;width:100%;height:100vh;
    background:#0a0a0a;
    justify-content:center;align-items:center;
    gap:10px;z-index:999;
    padding:60px 24px 24px;
  }
  .dp-nav.mobile-active .dp-nav-close{
    display:none;
  }
  .dp-nav.mobile-active a{
    font-size:1rem;color:#fff;
    padding:11px 0;
    width:85%;text-align:center;
    border-bottom:1px solid rgba(255,255,255,0.07);
    text-decoration:none;
    transition:color 0.2s;
  }
  .dp-nav.mobile-active a:last-child{border-bottom:none;}
  .dp-nav.mobile-active a:hover,
  .dp-nav.mobile-active a.active{color:var(--dp-primary);}
  /* Hero mobile */
  .h-heading{font-size:clamp(1.75rem,5.5vw,2.4rem);}
  .h-features{grid-template-columns:1fr;}
  .h-stat-sep{display:none;}
  .h-stats{gap:14px;}
  .h-form-card{padding:20px 16px;animation:none;}
  .h-scroll-cue{display:none;}
  .h-ring{display:none;}
  .h-sub{font-size:.9rem;}
}
@media(max-width:480px){
  :root{--dp-header-h:58px;--dp-section-padding:32px 0;}
  .dp-section-title{font-size:1.4rem;}
  .dp-btn{padding:11px 20px;font-size:.88rem;}
  .dp-btn-lg{padding:13px 24px;font-size:.95rem;}
  .h-heading{font-size:clamp(1.5rem,6vw,1.9rem);}
  .h-badge{font-size:.72rem;padding:5px 10px;}
  .dp-container{padding:0 14px;}
}

/* ---- Supplementary / Animations ---- */
/**
 * Dental Planet ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â Custom CSS
 *
 * Additional styles and enhancements beyond the main style.css.
 * Brand Colors: #FF8500 (primary orange), #F9AF5E (accent), #FEFAF9 (off-white)
 *
 * @package Dental_Planet
 */

/* =============================================
   ADDITIONAL MICRO-ANIMATIONS
   ============================================= */

/* Staggered card reveal */
.dp-services-grid .dp-service-card:nth-child(1) { transition-delay: 0s; }
.dp-services-grid .dp-service-card:nth-child(2) { transition-delay: 0.08s; }
.dp-services-grid .dp-service-card:nth-child(3) { transition-delay: 0.16s; }
.dp-services-grid .dp-service-card:nth-child(4) { transition-delay: 0.24s; }
.dp-services-grid .dp-service-card:nth-child(5) { transition-delay: 0.32s; }
.dp-services-grid .dp-service-card:nth-child(6) { transition-delay: 0.40s; }
.dp-services-grid .dp-service-card:nth-child(7) { transition-delay: 0.48s; }
.dp-services-grid .dp-service-card:nth-child(8) { transition-delay: 0.56s; }
.dp-services-grid .dp-service-card:nth-child(9) { transition-delay: 0.64s; }
.dp-services-grid .dp-service-card:nth-child(10) { transition-delay: 0.72s; }
.dp-services-grid .dp-service-card:nth-child(11) { transition-delay: 0.80s; }
.dp-services-grid .dp-service-card:nth-child(12) { transition-delay: 0.88s; }
.dp-services-grid .dp-service-card:nth-child(13) { transition-delay: 0.96s; }
.dp-services-grid .dp-service-card:nth-child(14) { transition-delay: 1.04s; }
.dp-services-grid .dp-service-card:nth-child(15) { transition-delay: 1.12s; }


.dp-why-grid .dp-why-card:nth-child(1) { transition-delay: 0s; }
.dp-why-grid .dp-why-card:nth-child(2) { transition-delay: 0.08s; }
.dp-why-grid .dp-why-card:nth-child(3) { transition-delay: 0.16s; }
.dp-why-grid .dp-why-card:nth-child(4) { transition-delay: 0.24s; }
.dp-why-grid .dp-why-card:nth-child(5) { transition-delay: 0.32s; }
.dp-why-grid .dp-why-card:nth-child(6) { transition-delay: 0.40s; }

.dp-doctors-row .dp-doctor-card:nth-child(1) { transition-delay: 0s; }
.dp-doctors-row .dp-doctor-card:nth-child(2) { transition-delay: 0.1s; }
.dp-doctors-row .dp-doctor-card:nth-child(3) { transition-delay: 0.2s; }

.dp-testimonials-grid .dp-testimonial-card:nth-child(1) { transition-delay: 0s; }
.dp-testimonials-grid .dp-testimonial-card:nth-child(2) { transition-delay: 0.1s; }
.dp-testimonials-grid .dp-testimonial-card:nth-child(3) { transition-delay: 0.2s; }
.dp-testimonials-grid .dp-testimonial-card:nth-child(4) { transition-delay: 0.3s; }
.dp-testimonials-grid .dp-testimonial-card:nth-child(5) { transition-delay: 0.4s; }
.dp-testimonials-grid .dp-testimonial-card:nth-child(6) { transition-delay: 0.5s; }

/* =============================================
   SELECTION STYLES
   ============================================= */
::selection {
  background: rgba(255, 133, 0, 0.2);
  color: #D96E00;
}

::-moz-selection {
  background: rgba(255, 133, 0, 0.2);
  color: #D96E00;
}

/* =============================================
   CUSTOM SCROLLBAR
   ============================================= */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #FDF6F0;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #FF8500, #F9AF5E);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #D96E00;
}

/* =============================================
   FOCUS STYLES (Accessibility)
   ============================================= */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #FF8500;
  outline-offset: 2px;
  border-radius: 4px;
}

/* =============================================
   SKIP TO CONTENT (Accessibility)
   ============================================= */
.skip-to-content {
  position: absolute;
  top: -100%;
  left: 16px;
  background: #FF8500;
  color: #fff;
  padding: 12px 24px;
  border-radius: 0 0 8px 8px;
  z-index: 10000;
  font-weight: 600;
  transition: top 0.3s ease;
}

.skip-to-content:focus {
  top: 0;
}

/* =============================================
   PRINT STYLES
   ============================================= */
@media print {
  .dp-header,
  .dp-whatsapp-float,
  .dp-hero-float-card,
  .dp-menu-toggle {
    display: none !important;
  }

  .dp-hero {
    padding-top: 20px;
    min-height: auto;
    background: none;
  }

  .dp-section,
  .dp-section-alt {
    padding: 30px 0;
  }

  * {
    box-shadow: none !important;
  }
}

/* =============================================
   SUCCESS MODAL 
   ============================================= */
.dp-modal { 
    display: none; 
    position: fixed; 
    z-index: 9999; 
    left: 0; 
    top: 0; 
    width: 100%; 
    height: 100%; 
    background-color: rgba(0, 0, 0, 0.8); 
    backdrop-filter: blur(8px); 
    -webkit-backdrop-filter: blur(8px);
    align-items: center; 
    justify-content: center; 
} 
.dp-modal.show { 
    display: flex; 
} 
.dp-modal-content { 
    background-color: rgba(26, 26, 26, 0.95); 
    border: 1px solid rgba(255, 133, 0, 0.3);
    padding: 40px; 
    border-radius: 20px; 
    text-align: center; 
    max-width: 420px; 
    width: 90%; 
    box-shadow: 0 20px 50px rgba(0,0,0,0.5), 0 0 30px rgba(255, 133, 0, 0.15); 
    animation: modalScale 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); 
} 
@keyframes modalScale { 
    from { transform: scale(0.8); opacity: 0; } 
    to { transform: scale(1); opacity: 1; } 
} 
.dp-modal-icon { 
    width: 80px; 
    height: 80px; 
    background: rgba(40, 167, 69, 0.15); 
    border-radius: 50%; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    margin: 0 auto 24px; 
    box-shadow: 0 0 20px rgba(40, 167, 69, 0.2);
} 
.dp-modal-icon svg { 
    color: #28a745; 
} 
.dp-modal-content h3 { 
    color: #ffffff; 
    font-size: 1.6rem; 
    margin-bottom: 12px; 
    font-weight: 700;
} 
.dp-modal-content p { 
    color: rgba(255, 255, 255, 0.7); 
    margin-bottom: 30px; 
    line-height: 1.6;
} 
.dp-modal-content .dp-btn { 
    width: 100%; 
    padding: 14px; 
    font-size: 1.05rem; 
    font-weight: 600;
    border-radius: 12px;
    letter-spacing: 0.5px;
    background: #28a745 !important;
    border-color: #28a745 !important;
    color: #ffffff;
    transition: transform 0.2s, box-shadow 0.2s;
} 
.dp-modal-content .dp-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(40, 167, 69, 0.35);
}
  }
}

/* =============================================
   LOADING SHIMMER EFFECT (placeholders)
   ============================================= */
@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

.dp-shimmer {
  background: linear-gradient(
    90deg,
    #FFF0DC 25%,
    #FFE0B0 50%,
    #FFF0DC 75%
  );
  background-size: 200% 100%;
  animation: shimmer 1.5s ease-in-out infinite;
}

/* =============================================
   TOOLTIP (for info icons)
   ============================================= */
[data-tooltip] {
  position: relative;
  cursor: help;
}

[data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(-4px);
  background: #2C1F18;
  color: #fff;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 0.78rem;
  font-weight: 500;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: all 0.2s ease;
  pointer-events: none;
  z-index: 100;
}

[data-tooltip]:hover::after {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(-8px);
}

/* =============================================
   FORM SUCCESS STATE
   ============================================= */
.dp-form-success {
  text-align: center;
  padding: 40px 20px;
}

.dp-form-success svg {
  width: 64px;
  height: 64px;
  color: #10B981;
  margin-bottom: 16px;
}

.dp-form-success h3 {
  color: #2C1F18;
  margin-bottom: 8px;
}

.dp-form-success p {
  color: #8A7868;
}

/* =============================================
   BADGE VARIANTS
   ============================================= */
.dp-badge-success {
  background: #D1FAE5;
  color: #065F46;
}

.dp-badge-warning {
  background: #FEF3C7;
  color: #92400E;
}

/* =============================================
   DOCTOR AVATAR PLACEHOLDER ANIMATION
   ============================================= */
.dp-doctor-avatar {
  background: linear-gradient(
    145deg,
    #FFF0DC 0%,
    #FDE2B3 50%,
    #FFF0DC 100%
  );
  background-size: 300% 300%;
  animation: gradientShift 8s ease infinite;
}

@keyframes gradientShift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

/* =============================================
   LOGO IN HEADER – ensure proper sizing
   ============================================= */
.dp-logo img {
  height: 68px;
  width: auto;
  display: block;
  border-radius: 6px;
  object-fit: contain;
}

@media(max-width:768px){
  .dp-logo img {
    height: 48px;
  }
}

@media(max-width:480px){
  .dp-logo img {
    height: 40px;
  }
}

/* ===== DOCTOR SPOTLIGHT â€” Responsive ===== */
@media(max-width:1024px){
  .dp-doctors-section { height: auto; min-height: 100svh; }
  .dp-ds-card { grid-template-columns: 1fr; flex: none; border-radius: 20px; }
  .dp-ds-photo { min-height: 500px; }
  .dp-ds-photo::after { background: linear-gradient(to top, #0f0f0f 0%, transparent 60%); }
  .dp-ds-content { padding: 40px 32px; }
  .dp-ds-exp-badge { bottom: 20px; left: 20px; padding: 14px 24px; }
  .dsy-num { font-size: clamp(2.5rem, 6vw, 3.5rem); }
}
@media(max-width:768px){
  .dp-ds-header { padding: 32px 20px 16px; }
  .dp-ds-photo { min-height: 420px; }
  .dp-ds-content { padding: 32px 24px; }
  .dp-ds-specialty { font-size: 1rem; margin-bottom: 8px; }
  .dp-ds-info h3 { font-size: 2rem; margin-bottom: 12px; }
  .dp-ds-bio { font-size: .95rem; margin-bottom: 32px; max-width: 100%; }
  .dp-ds-tabs { padding: 12px 16px 20px; gap: 8px; }
  .dp-ds-tab { min-width: 140px; padding: 10px 12px; }
  .dp-ds-tab-info strong { font-size: .75rem; }
  .dp-ds-tab-info span { display: none; }
  .dp-ds-tab-avatar { width: 32px; height: 32px; }
}

/* =======================================================================
   GOOGLE REVIEWS COMPONENT (STANDALONE)
   ======================================================================= */
/* Variables */
.grc-section {
    --grc-bg: #0d0d0d;
    --grc-text: #ffffff;
    --grc-text-muted: rgba(255, 255, 255, 0.6);
    --grc-primary: #FF8500;
    --grc-primary-glow: rgba(255, 133, 0, 0.25);
    --grc-glass-bg: rgba(255, 255, 255, 0.03);
    --grc-glass-border: rgba(255, 255, 255, 0.08);
    --grc-card-bg: rgba(255, 255, 255, 0.04);
    --grc-radius-lg: 24px;
    --grc-radius-md: 16px;
    --grc-radius-sm: 8px;
    
    background-color: var(--grc-bg);
    color: var(--grc-text);
    padding: 100px 0;
    overflow: hidden;
    position: relative;
    border-top: 1px solid rgba(255,255,255,0.05);
}

/* Subtle background glow */
.grc-section::before {
    content: '';
    position: absolute;
    top: -20%;
    right: -10%;
    width: 60%;
    height: 60%;
    background: radial-gradient(circle, var(--grc-primary-glow) 0%, transparent 60%);
    filter: blur(80px);
    z-index: 0;
    pointer-events: none;
}

.grc-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
    z-index: 1;
}

/* Header */
.grc-header {
    text-align: center;
    margin-bottom: 50px;
    opacity: 0;
    transform: translateY(20px);
    animation: grcFadeIn 0.8s forwards;
}

.grc-title {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 300;
    margin-bottom: 12px;
}

.grc-title span {
    color: var(--grc-primary);
    font-style: italic;
    font-weight: 400;
}

.grc-subtitle {
    font-size: 1.1rem;
    color: var(--grc-text-muted);
    max-width: 600px;
    margin: 0 auto;
}

/* Layout */
.grc-layout {
    display: flex;
    gap: 32px;
    align-items: stretch;
}

/* Map Wrapper */
.grc-map-wrapper {
    flex: 1;
    min-width: 0;
    opacity: 0;
    transform: translateX(-30px);
    animation: grcSlideRight 0.8s 0.2s forwards;
}

/* Reviews Wrapper */
.grc-reviews-wrapper {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    opacity: 0;
    transform: translateX(30px);
    animation: grcSlideLeft 0.8s 0.2s forwards;
}

/* Glass Panels */
.grc-glass-panel {
    background: var(--grc-glass-bg);
    border: 1px solid var(--grc-glass-border);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-radius: var(--grc-radius-lg);
    box-shadow: 0 20px 40px rgba(0,0,0,0.4);
    overflow: hidden;
    height: 100%;
}

.grc-map-panel {
    padding: 8px;
    min-height: 500px;
}

.grc-map-panel iframe {
    border-radius: var(--grc-radius-md);
    background: #111;
}

.grc-reviews-panel {
    padding: 32px;
    display: flex;
    flex-direction: column;
    max-height: 500px;
}

/* Business Summary */
.grc-biz-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 24px;
    margin-bottom: 24px;
    border-bottom: 1px solid var(--grc-glass-border);
}

.grc-biz-rating {
    display: flex;
    align-items: center;
    gap: 12px;
}

.grc-biz-score {
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1;
}

.grc-biz-stars {
    display: flex;
    gap: 4px;
}

.grc-star {
    font-size: 1.2rem;
    color: #444;
    position: relative;
    display: inline-block;
}

.grc-star.active {
    color: #FFB400;
    animation: grcStarPulse 2s infinite alternate;
}

.grc-star.active:nth-child(2) { animation-delay: 0.2s; }
.grc-star.active:nth-child(3) { animation-delay: 0.4s; }
.grc-star.active:nth-child(4) { animation-delay: 0.6s; }
.grc-star.active:nth-child(5) { animation-delay: 0.8s; }

.grc-biz-total {
    font-size: 0.9rem;
    color: var(--grc-text-muted);
}

.grc-biz-total span {
    color: var(--grc-text);
    font-weight: 600;
}

/* Reviews Viewport */
.grc-reviews-viewport {
    flex: 1;
    overflow-y: hidden;
    position: relative;
    mask-image: linear-gradient(to bottom, black 85%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 85%, transparent 100%);
}

.grc-reviews-viewport:hover .grc-reviews-track {
    animation-play-state: paused;
}

.grc-reviews-track {
    display: flex;
    flex-direction: column;
    gap: 16px;
    animation: grcScrollUp 30s linear infinite;
    padding-bottom: 20px;
}

/* Review Card */
.grc-review-card {
    background: var(--grc-card-bg);
    border: 1px solid var(--grc-glass-border);
    border-radius: var(--grc-radius-md);
    padding: 20px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer;
}

.grc-review-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.3);
    border-color: rgba(255,255,255,0.15);
}

.grc-reviewer-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.grc-reviewer-img {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: cover;
    background: #333;
}

.grc-reviewer-info {
    flex: 1;
}

.grc-reviewer-name {
    font-weight: 600;
    font-size: 0.95rem;
    margin-bottom: 4px;
}

.grc-review-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.8rem;
    color: var(--grc-text-muted);
}

.grc-review-stars {
    color: #FFB400;
    font-size: 0.9rem;
    letter-spacing: 2px;
}

.grc-review-text {
    font-size: 0.9rem;
    line-height: 1.6;
    color: rgba(255,255,255,0.85);
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.grc-skeleton-card {
    background: rgba(255,255,255,0.02);
    border-radius: var(--grc-radius-md);
    height: 140px;
    animation: grcPulseBg 1.5s infinite;
}

@keyframes grcFadeIn { to { opacity: 1; transform: translateY(0); } }
@keyframes grcSlideRight { to { opacity: 1; transform: translateX(0); } }
@keyframes grcSlideLeft { to { opacity: 1; transform: translateX(0); } }
@keyframes grcStarPulse { 
    0% { opacity: 0.7; transform: scale(0.95); text-shadow: none; }
    100% { opacity: 1; transform: scale(1.05); text-shadow: 0 0 10px rgba(255, 180, 0, 0.5); }
}
@keyframes grcScrollUp { 0% { transform: translateY(0); } 100% { transform: translateY(-50%); } }
@keyframes grcPulseBg { 0% { background: rgba(255,255,255,0.02); } 50% { background: rgba(255,255,255,0.06); } 100% { background: rgba(255,255,255,0.02); } }

@media (max-width: 900px) {
    .grc-layout { flex-direction: column; }
    .grc-map-panel { min-height: 350px; }
    .grc-reviews-panel { max-height: 600px; }
}

/* ===== STATIC PATIENT REVIEWS (Scrolling) ===== */
.dp-reviews-scroller {
  width: 100%;
  overflow: hidden;
  padding: 40px 0;
  position: relative;
  background: var(--dp-off-white);
}

.dp-reviews-track {
  display: flex;
  gap: 24px;
  width: max-content;
  animation: scrollReviews 120s linear infinite;
}
.dp-reviews-track:hover {
  animation-play-state: paused;
}
@keyframes scrollReviews {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.dp-review-card {
  background: var(--dp-white);
  border-radius: var(--dp-radius-lg);
  padding: 24px 30px;
  width: 350px;
  border: 1px solid var(--dp-gray-100);
  box-shadow: var(--dp-shadow-sm);
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: var(--dp-transition);
}
.dp-review-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--dp-shadow-md);
  border-color: rgba(255,133,0,.3);
}
.dp-review-stars {
  color: #FFB800;
  font-size: 1.2rem;
  letter-spacing: 2px;
}
.dp-review-text {
  font-size: 0.95rem;
  color: var(--dp-gray-600);
  line-height: 1.6;
  font-style: italic;
  flex: 1;
}
.dp-review-author {
  font-weight: 700;
  color: var(--dp-gray-700);
  font-size: 0.9rem;
  text-align: right;
  margin-top: 10px;
}

/* =============================================
   SUCCESS MODAL 
   ============================================= */
.dp-modal { 
    display: none; 
    position: fixed; 
    z-index: 9999; 
    left: 0; 
    top: 0; 
    width: 100%; 
    height: 100%; 
    background-color: rgba(0, 0, 0, 0.8); 
    backdrop-filter: blur(8px); 
    -webkit-backdrop-filter: blur(8px);
    align-items: center; 
    justify-content: center; 
} 
.dp-modal.show { 
    display: flex; 
} 
.dp-modal-content { 
    background-color: rgba(26, 26, 26, 0.95); 
    border: 1px solid rgba(255, 133, 0, 0.3);
    padding: 40px; 
    border-radius: 20px; 
    text-align: center; 
    max-width: 420px; 
    width: 90%; 
    box-shadow: 0 20px 50px rgba(0,0,0,0.5), 0 0 30px rgba(255, 133, 0, 0.15); 
    animation: modalScale 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); 
} 
@keyframes modalScale { 
    from { transform: scale(0.8); opacity: 0; } 
    to { transform: scale(1); opacity: 1; } 
} 
.dp-modal-icon { 
    width: 80px; 
    height: 80px; 
    background: rgba(40, 167, 69, 0.15); 
    border-radius: 50%; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    margin: 0 auto 24px; 
    box-shadow: 0 0 20px rgba(40, 167, 69, 0.2);
} 
.dp-modal-icon svg { 
    color: #28a745; 
} 
.dp-modal-content h3 { 
    color: #ffffff; 
    font-size: 1.6rem; 
    margin-bottom: 12px; 
    font-weight: 700;
} 
.dp-modal-content p { 
    color: rgba(255, 255, 255, 0.7); 
    margin-bottom: 30px; 
    line-height: 1.6;
} 
.dp-modal-content .dp-btn { 
    width: 100%; 
    padding: 14px; 
    font-size: 1.05rem; 
    font-weight: 600;
    border-radius: 12px;
    letter-spacing: 0.5px;
    background: #28a745 !important;
    border-color: #28a745 !important;
    color: #ffffff;
    transition: transform 0.2s, box-shadow 0.2s;
} 
.dp-modal-content .dp-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(40, 167, 69, 0.35);
}

/* =============================================
   PREMIUM LIGHTBOX MODAL 
   ============================================= */
.dp-lightbox {
  display: none;
  position: fixed;
  z-index: 10000;
  inset: 0;
  background-color: rgba(10, 10, 10, 0.95);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.35s ease;
}
.dp-lightbox.show {
  display: flex;
  opacity: 1;
}
.dp-lightbox-content {
  position: relative;
  max-width: 90%;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  animation: lightboxScale 0.35s cubic-bezier(0.165, 0.84, 0.44, 1) both;
}
@keyframes lightboxScale {
  from { transform: scale(0.92); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}
.dp-lightbox-content img {
  max-width: 100%;
  max-height: 70vh;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
#dp-lightbox-caption {
  margin-top: 18px;
  text-align: center;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
#dp-lightbox-tag {
  background: var(--dp-primary);
  color: #fff;
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
  padding: 3px 12px;
  border-radius: 50px;
  letter-spacing: 0.06em;
}
#dp-lightbox-title {
  font-size: 1.05rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.9);
  margin: 0;
}
.dp-lightbox-close {
  position: absolute;
  top: 24px;
  right: 24px;
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.6);
  font-size: 2.8rem;
  line-height: 1;
  cursor: pointer;
  transition: color 0.25s, transform 0.25s;
  z-index: 10002;
}
.dp-lightbox-close:hover {
  color: var(--dp-primary);
  transform: rotate(90deg);
}
.dp-lightbox-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.7);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.25s;
  z-index: 10001;
}
.dp-lightbox-nav:hover {
  background: var(--dp-primary);
  border-color: var(--dp-primary);
  color: #fff;
  box-shadow: 0 4px 15px rgba(255, 133, 0, 0.4);
}
.dp-lightbox-nav.prev {
  left: 32px;
}
.dp-lightbox-nav.next {
  right: 32px;
}

@media (max-width: 768px) {
  .dp-lightbox-nav {
    width: 44px;
    height: 44px;
  }
  .dp-lightbox-nav.prev {
    left: 12px;
  }
  .dp-lightbox-nav.next {
    right: 12px;
  }
  .dp-lightbox-close {
    top: 16px;
    right: 16px;
    font-size: 2.2rem;
  }
  #dp-lightbox-title {
    font-size: 0.95rem;
  }
}

/* ===== PREMIUM TRANSFORMATION GALLERY SECTION ===== */
.dp-gallery-tabs {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0 auto 36px;
  max-width: 800px;
}
.dp-gallery-tab {
  background: var(--dp-white);
  border: 1px solid var(--dp-gray-100);
  color: var(--dp-gray-500);
  padding: 10px 22px;
  border-radius: 50px;
  font-family: var(--dp-font-primary);
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 8px rgba(0,0,0,0.02);
}
.dp-gallery-tab:hover {
  border-color: var(--dp-primary);
  color: var(--dp-primary);
  transform: translateY(-1px);
}
.dp-gallery-tab.active {
  background: linear-gradient(135deg, var(--dp-primary), var(--dp-accent));
  color: var(--dp-white);
  border-color: transparent;
  box-shadow: 0 4px 15px rgba(255, 133, 0, 0.25);
}

/* Showcase Container Layout */
.dp-showcase-container {
  display: flex;
  flex-direction: column;
  gap: 32px;
  background: var(--dp-white);
  border: 1px solid rgba(255, 133, 0, 0.08);
  border-radius: var(--dp-radius-xl);
  padding: 40px;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.02), 0 4px 15px rgba(255, 133, 0, 0.03);
  margin-top: 10px;
}

.dp-showcase-top-row {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 40px;
  align-items: center;
}

.dp-showcase-details {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.dp-showcase-meta {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.dp-showcase-badge {
  background: var(--dp-primary-pale);
  color: var(--dp-primary-dark);
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 50px;
  align-self: start;
  letter-spacing: 0.06em;
}

.dp-showcase-title {
  font-size: 1.85rem;
  font-weight: 700;
  color: var(--dp-gray-700);
}

.dp-showcase-subtitle {
  font-size: 0.85rem;
  color: var(--dp-gray-400);
}
.dp-showcase-subtitle strong {
  color: var(--dp-primary);
  font-weight: 600;
}

/* Details List */
.dp-showcase-info-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.dp-showcase-info-item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.dp-info-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--dp-primary-pale);
  color: var(--dp-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.dp-showcase-info-item h5 {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--dp-gray-700);
  margin-bottom: 2px;
}

.dp-showcase-info-item p {
  font-size: 0.82rem;
  color: var(--dp-gray-500);
  line-height: 1.45;
}

/* Bottom Panel: Doctor & Quote */
.dp-showcase-bottom-panel {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 40px;
  align-items: center;
  border-top: 1px solid rgba(255, 133, 0, 0.08);
  padding-top: 28px;
}

/* Doctor Card */
.dp-showcase-doctor {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: rgba(255, 133, 0, 0.02);
  border: 1px solid rgba(255, 133, 0, 0.05);
  border-radius: 12px;
}

.dp-showcase-doctor img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}

.dp-showcase-doctor h6 {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--dp-gray-700);
}

.dp-showcase-doctor p {
  font-size: 0.75rem;
  color: var(--dp-gray-400);
}

/* Testimonial */
.dp-showcase-quote {
  border-left: 3px solid var(--dp-primary);
  padding-left: 14px;
  margin: 0;
}

.dp-showcase-quote p {
  font-size: 0.85rem;
  font-style: italic;
  color: var(--dp-gray-600);
  line-height: 1.45;
}

.dp-showcase-quote cite {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--dp-primary);
  display: block;
  margin-top: 4px;
  font-style: normal;
}

/* Right Viewport */
.dp-showcase-viewport {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  max-height: 520px;
  background: #0E0A06;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(255, 133, 0, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
}

.dp-viewport-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: width 0.3s ease, height 0.3s ease, aspect-ratio 0.3s ease;
}

.dp-viewport-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 8;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(4px);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: var(--dp-white);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  opacity: 0;
  pointer-events: auto;
}
.dp-showcase-viewport:hover .dp-viewport-nav {
  opacity: 1;
}
.dp-viewport-nav:hover {
  background: var(--dp-primary);
  color: var(--dp-white);
  border-color: var(--dp-primary);
  box-shadow: 0 4px 12px rgba(255, 133, 0, 0.35);
}
.dp-viewport-nav.prev {
  left: 16px;
}
.dp-viewport-nav.next {
  right: 16px;
}

@media (max-width: 575px) {
  .dp-viewport-nav {
    width: 32px;
    height: 32px;
    opacity: 0.7;
  }
  .dp-showcase-viewport:hover .dp-viewport-nav {
    opacity: 0.9;
  }
  .dp-viewport-nav.prev {
    left: 8px;
  }
  .dp-viewport-nav.next {
    right: 8px;
  }
}

/* Draggable Comparison Slider */
.dp-slider-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  cursor: ew-resize;
  user-select: none;
}

.dp-slider-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}

.dp-slider-before {
  z-index: 1;
}

.dp-slider-after {
  z-index: 2;
  clip-path: inset(0 0 0 50%);
}

.dp-slider-handle {
  position: absolute;
  z-index: 10;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--dp-white);
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

.dp-slider-handle-button {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--dp-white);
  border: 2px solid var(--dp-primary);
  color: var(--dp-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.dp-slider-handle-button svg {
  stroke-width: 3px;
}

.dp-slider-label {
  position: absolute;
  z-index: 5;
  bottom: 16px;
  background: rgba(17, 17, 17, 0.75);
  backdrop-filter: blur(4px);
  color: var(--dp-white);
  font-size: 0.65rem;
  font-weight: 700;
  padding: 4px 8px;
  border-radius: 4px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.dp-slider-label.before {
  left: 16px;
}

.dp-slider-label.after {
  right: 16px;
}

/* Viewport Toggle Switch Tabs */
.dp-tabs-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

.dp-tabs-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity 0.3s ease;
}

.dp-tabs-selectors {
  position: absolute;
  z-index: 5;
  top: 16px;
  right: 16px;
  display: flex;
  gap: 6px;
}

.dp-tabs-btn {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(4px);
  border: 1px solid rgba(0, 0, 0, 0.08);
  color: var(--dp-gray-700);
  font-size: 0.72rem;
  font-weight: 700;
  padding: 5px 12px;
  border-radius: 50px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.dp-tabs-btn:hover {
  background: var(--dp-white);
}

.dp-tabs-btn.active {
  background: var(--dp-primary);
  color: var(--dp-white);
  border-color: var(--dp-primary);
}

/* Single View layout */
.dp-single-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.dp-single-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
  cursor: pointer;
}

.dp-single-wrapper:hover .dp-single-img {
  transform: scale(1.03);
}

.dp-single-badge {
  position: absolute;
  z-index: 5;
  bottom: 16px;
  left: 16px;
  background: rgba(255, 133, 0, 0.95);
  color: var(--dp-white);
  font-size: 0.65rem;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Lightbox Trigger Icon Overlay */
.dp-viewport-zoom-btn {
  position: absolute;
  z-index: 6;
  bottom: 16px;
  right: 16px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(4px);
  color: var(--dp-white);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.3s ease;
  border: none;
}

.dp-showcase-viewport:hover .dp-viewport-zoom-btn {
  opacity: 1;
}

.dp-viewport-zoom-btn:hover {
  background: var(--dp-primary);
  color: var(--dp-white);
}

/* Thumbnails Navigation Row */
.dp-showcase-nav-container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 32px;
}

.dp-showcase-thumbnails {
  position: relative;
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding: 6px 4px 14px 4px;
  scroll-behavior: smooth;
  max-width: 100%;
}

.dp-showcase-thumbnails::-webkit-scrollbar {
  height: 4px;
}

.dp-showcase-thumbnails::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.02);
}

.dp-showcase-thumbnails::-webkit-scrollbar-thumb {
  background: rgba(255, 133, 0, 0.15);
  border-radius: 10px;
}

.dp-showcase-thumb {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  background: var(--dp-white);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.25s ease;
  flex-shrink: 0;
  min-width: 145px;
  user-select: none;
}

.dp-showcase-thumb:hover {
  border-color: rgba(255, 133, 0, 0.25);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(255, 133, 0, 0.06);
}

.dp-showcase-thumb.active {
  background: var(--dp-primary-pale);
  border-color: var(--dp-primary);
}

.dp-showcase-thumb img {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  object-fit: cover;
}

.dp-showcase-thumb-info {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.dp-showcase-thumb-info span {
  font-size: 0.62rem;
  color: var(--dp-gray-400);
  font-weight: 700;
}

.dp-showcase-thumb.active .dp-showcase-thumb-info span {
  color: var(--dp-primary-dark);
}

.dp-showcase-thumb-info h6 {
  font-size: 0.75rem;
  color: var(--dp-gray-700);
  font-weight: 700;
  margin: 0;
}

.dp-showcase-thumb.active h6 {
  color: var(--dp-primary-dark);
}

.dp-nav-arrow {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--dp-white);
  border: 1px solid rgba(0, 0, 0, 0.06);
  color: var(--dp-gray-500);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  flex-shrink: 0;
}

.dp-nav-arrow:hover {
  border-color: var(--dp-primary);
  color: var(--dp-primary);
  box-shadow: 0 3px 8px rgba(0,0,0,0.05);
}

.dp-nav-arrow:active {
  transform: scale(0.95);
}

/* Responsiveness styles */
@media (max-width: 991px) {
  .dp-showcase-container {
    padding: 30px;
    gap: 24px;
  }
  .dp-showcase-top-row {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .dp-showcase-bottom-panel {
    grid-template-columns: 1fr;
    gap: 24px;
    padding-top: 20px;
  }
  .dp-showcase-viewport {
    max-height: none;
  }
  .dp-viewport-zoom-btn {
    opacity: 0.85;
  }
}

@media (max-width: 575px) {
  .dp-showcase-container {
    padding: 20px;
  }
  .dp-showcase-title {
    font-size: 1.45rem;
  }
  .dp-showcase-nav-container {
    gap: 8px;
  }
  .dp-nav-arrow {
    width: 32px;
    height: 32px;
  }
}