/* ==========================================================================
   DENTALINS — HAPPY PATIENTS SLIDER (testimonial-slider.css)
   Beyaz section içinde koyu rounded panel. Referans UI yapısı:
   Container-contained dark wrapper + horizontal photo card carousel.
   BEM: .happy-patients
   ========================================================================== */


/* ======================================================================
   1. DARK INNER PANEL (Rounded container)
   ====================================================================== */

.happy-patients {
  background: rgb(var(--btn-secondary-rgb));
  border-radius: var(--radius-2xl);
  padding: var(--space-12) var(--space-8) var(--space-10);
  position: relative;
  overflow: hidden;
  box-shadow: var(--shadow-secondary-lg);
}

/* Dotted world map background decoration */
.happy-patients::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 600'%3E%3Cdefs%3E%3Cstyle%3Ecircle%7Bfill:rgba(5,160,214,0.12)%7D%3C/style%3E%3C/defs%3E%3C!-- North America --%3E%3Ccircle cx='180' cy='120' r='2'/%3E%3Ccircle cx='190' cy='115' r='2'/%3E%3Ccircle cx='200' cy='118' r='2'/%3E%3Ccircle cx='210' cy='122' r='2'/%3E%3Ccircle cx='195' cy='128' r='2'/%3E%3Ccircle cx='185' cy='132' r='2'/%3E%3Ccircle cx='175' cy='138' r='2'/%3E%3Ccircle cx='165' cy='145' r='2'/%3E%3Ccircle cx='170' cy='155' r='2'/%3E%3Ccircle cx='180' cy='148' r='2'/%3E%3Ccircle cx='190' cy='142' r='2'/%3E%3Ccircle cx='200' cy='135' r='2'/%3E%3Ccircle cx='210' cy='140' r='2'/%3E%3Ccircle cx='220' cy='135' r='2'/%3E%3Ccircle cx='230' cy='130' r='2'/%3E%3Ccircle cx='240' cy='138' r='2'/%3E%3Ccircle cx='250' cy='145' r='2'/%3E%3Ccircle cx='220' cy='148' r='2'/%3E%3Ccircle cx='210' cy='155' r='2'/%3E%3Ccircle cx='200' cy='160' r='2'/%3E%3Ccircle cx='190' cy='158' r='2'/%3E%3Ccircle cx='180' cy='165' r='2'/%3E%3Ccircle cx='195' cy='170' r='2'/%3E%3Ccircle cx='205' cy='168' r='2'/%3E%3Ccircle cx='215' cy='162' r='2'/%3E%3Ccircle cx='225' cy='158' r='2'/%3E%3Ccircle cx='235' cy='155' r='2'/%3E%3Ccircle cx='245' cy='160' r='2'/%3E%3Ccircle cx='255' cy='155' r='2'/%3E%3Ccircle cx='260' cy='148' r='2'/%3E%3Ccircle cx='270' cy='150' r='2'/%3E%3Ccircle cx='280' cy='155' r='2'/%3E%3Ccircle cx='230' cy='168' r='2'/%3E%3Ccircle cx='240' cy='175' r='2'/%3E%3Ccircle cx='250' cy='172' r='2'/%3E%3Ccircle cx='260' cy='165' r='2'/%3E%3Ccircle cx='270' cy='168' r='2'/%3E%3Ccircle cx='155' cy='152' r='2'/%3E%3Ccircle cx='145' cy='148' r='2'/%3E%3Ccircle cx='160' cy='162' r='2'/%3E%3Ccircle cx='150' cy='170' r='2'/%3E%3Ccircle cx='175' cy='175' r='2'/%3E%3Ccircle cx='185' cy='178' r='2'/%3E%3Ccircle cx='215' cy='178' r='2'/%3E%3Ccircle cx='225' cy='182' r='2'/%3E%3Ccircle cx='235' cy='185' r='2'/%3E%3Ccircle cx='245' cy='188' r='2'/%3E%3Ccircle cx='190' cy='185' r='2'/%3E%3Ccircle cx='200' cy='182' r='2'/%3E%3Ccircle cx='278' cy='162' r='2'/%3E%3Ccircle cx='288' cy='165' r='2'/%3E%3Ccircle cx='295' cy='170' r='2'/%3E%3C!-- Central America --%3E%3Ccircle cx='235' cy='198' r='2'/%3E%3Ccircle cx='240' cy='208' r='2'/%3E%3Ccircle cx='245' cy='218' r='2'/%3E%3Ccircle cx='250' cy='225' r='2'/%3E%3Ccircle cx='255' cy='235' r='2'/%3E%3Ccircle cx='260' cy='240' r='2'/%3E%3C!-- South America --%3E%3Ccircle cx='290' cy='260' r='2'/%3E%3Ccircle cx='300' cy='265' r='2'/%3E%3Ccircle cx='310' cy='270' r='2'/%3E%3Ccircle cx='320' cy='275' r='2'/%3E%3Ccircle cx='305' cy='280' r='2'/%3E%3Ccircle cx='295' cy='285' r='2'/%3E%3Ccircle cx='310' cy='290' r='2'/%3E%3Ccircle cx='320' cy='295' r='2'/%3E%3Ccircle cx='315' cy='305' r='2'/%3E%3Ccircle cx='305' cy='310' r='2'/%3E%3Ccircle cx='310' cy='320' r='2'/%3E%3Ccircle cx='315' cy='335' r='2'/%3E%3Ccircle cx='318' cy='348' r='2'/%3E%3Ccircle cx='312' cy='358' r='2'/%3E%3Ccircle cx='308' cy='370' r='2'/%3E%3Ccircle cx='305' cy='385' r='2'/%3E%3Ccircle cx='300' cy='395' r='2'/%3E%3Ccircle cx='295' cy='408' r='2'/%3E%3Ccircle cx='290' cy='418' r='2'/%3E%3Ccircle cx='285' cy='430' r='2'/%3E%3Ccircle cx='280' cy='440' r='2'/%3E%3Ccircle cx='285' cy='452' r='2'/%3E%3Ccircle cx='325' cy='282' r='2'/%3E%3Ccircle cx='335' cy='278' r='2'/%3E%3Ccircle cx='330' cy='290' r='2'/%3E%3Ccircle cx='325' cy='300' r='2'/%3E%3C!-- Europe --%3E%3Ccircle cx='520' cy='120' r='2'/%3E%3Ccircle cx='530' cy='115' r='2'/%3E%3Ccircle cx='540' cy='118' r='2'/%3E%3Ccircle cx='550' cy='122' r='2'/%3E%3Ccircle cx='560' cy='118' r='2'/%3E%3Ccircle cx='570' cy='115' r='2'/%3E%3Ccircle cx='525' cy='130' r='2'/%3E%3Ccircle cx='535' cy='128' r='2'/%3E%3Ccircle cx='545' cy='132' r='2'/%3E%3Ccircle cx='555' cy='130' r='2'/%3E%3Ccircle cx='565' cy='128' r='2'/%3E%3Ccircle cx='575' cy='125' r='2'/%3E%3Ccircle cx='515' cy='138' r='2'/%3E%3Ccircle cx='528' cy='142' r='2'/%3E%3Ccircle cx='538' cy='140' r='2'/%3E%3Ccircle cx='548' cy='145' r='2'/%3E%3Ccircle cx='558' cy='142' r='2'/%3E%3Ccircle cx='568' cy='138' r='2'/%3E%3Ccircle cx='530' cy='152' r='2'/%3E%3Ccircle cx='540' cy='155' r='2'/%3E%3Ccircle cx='550' cy='152' r='2'/%3E%3Ccircle cx='560' cy='150' r='2'/%3E%3Ccircle cx='510' cy='148' r='2'/%3E%3Ccircle cx='520' cy='155' r='2'/%3E%3Ccircle cx='580' cy='132' r='2'/%3E%3Ccircle cx='590' cy='128' r='2'/%3E%3Ccircle cx='585' cy='140' r='2'/%3E%3Ccircle cx='578' cy='148' r='2'/%3E%3Ccircle cx='570' cy='155' r='2'/%3E%3Ccircle cx='505' cy='155' r='2'/%3E%3Ccircle cx='515' cy='162' r='2'/%3E%3Ccircle cx='525' cy='165' r='2'/%3E%3Ccircle cx='535' cy='162' r='2'/%3E%3Ccircle cx='545' cy='165' r='2'/%3E%3C!-- Turkey region (slightly brighter) --%3E%3Ccircle cx='598' cy='155' r='2.5' style='fill:rgba(5,160,214,0.2)'/%3E%3Ccircle cx='608' cy='152' r='2.5' style='fill:rgba(5,160,214,0.2)'/%3E%3Ccircle cx='618' cy='155' r='2.5' style='fill:rgba(5,160,214,0.2)'/%3E%3Ccircle cx='628' cy='158' r='2.5' style='fill:rgba(5,160,214,0.18)'/%3E%3Ccircle cx='638' cy='155' r='2.5' style='fill:rgba(5,160,214,0.18)'/%3E%3Ccircle cx='648' cy='158' r='2.5' style='fill:rgba(5,160,214,0.18)'/%3E%3Ccircle cx='603' cy='162' r='2' style='fill:rgba(5,160,214,0.18)'/%3E%3Ccircle cx='613' cy='165' r='2' style='fill:rgba(5,160,214,0.18)'/%3E%3Ccircle cx='623' cy='162' r='2' style='fill:rgba(5,160,214,0.18)'/%3E%3Ccircle cx='633' cy='165' r='2' style='fill:rgba(5,160,214,0.18)'/%3E%3C!-- Africa --%3E%3Ccircle cx='540' cy='210' r='2'/%3E%3Ccircle cx='550' cy='215' r='2'/%3E%3Ccircle cx='560' cy='220' r='2'/%3E%3Ccircle cx='555' cy='232' r='2'/%3E%3Ccircle cx='545' cy='238' r='2'/%3E%3Ccircle cx='558' cy='245' r='2'/%3E%3Ccircle cx='568' cy='250' r='2'/%3E%3Ccircle cx='575' cy='260' r='2'/%3E%3Ccircle cx='565' cy='268' r='2'/%3E%3Ccircle cx='555' cy='275' r='2'/%3E%3Ccircle cx='570' cy='280' r='2'/%3E%3Ccircle cx='580' cy='275' r='2'/%3E%3Ccircle cx='585' cy='265' r='2'/%3E%3Ccircle cx='575' cy='290' r='2'/%3E%3Ccircle cx='565' cy='300' r='2'/%3E%3Ccircle cx='570' cy='312' r='2'/%3E%3Ccircle cx='575' cy='325' r='2'/%3E%3Ccircle cx='568' cy='338' r='2'/%3E%3Ccircle cx='560' cy='348' r='2'/%3E%3Ccircle cx='555' cy='360' r='2'/%3E%3Ccircle cx='558' cy='372' r='2'/%3E%3Ccircle cx='548' cy='380' r='2'/%3E%3Ccircle cx='590' cy='255' r='2'/%3E%3Ccircle cx='598' cy='248' r='2'/%3E%3Ccircle cx='595' cy='270' r='2'/%3E%3Ccircle cx='588' cy='285' r='2'/%3E%3Ccircle cx='582' cy='298' r='2'/%3E%3Ccircle cx='585' cy='310' r='2'/%3E%3Ccircle cx='530' cy='225' r='2'/%3E%3Ccircle cx='522' cy='235' r='2'/%3E%3Ccircle cx='528' cy='248' r='2'/%3E%3Ccircle cx='535' cy='258' r='2'/%3E%3Ccircle cx='540' cy='268' r='2'/%3E%3C!-- Middle East / Asia --%3E%3Ccircle cx='660' cy='162' r='2'/%3E%3Ccircle cx='670' cy='168' r='2'/%3E%3Ccircle cx='680' cy='172' r='2'/%3E%3Ccircle cx='690' cy='168' r='2'/%3E%3Ccircle cx='700' cy='165' r='2'/%3E%3Ccircle cx='710' cy='160' r='2'/%3E%3Ccircle cx='720' cy='158' r='2'/%3E%3Ccircle cx='730' cy='155' r='2'/%3E%3Ccircle cx='740' cy='152' r='2'/%3E%3Ccircle cx='750' cy='148' r='2'/%3E%3Ccircle cx='660' cy='178' r='2'/%3E%3Ccircle cx='670' cy='182' r='2'/%3E%3Ccircle cx='680' cy='185' r='2'/%3E%3Ccircle cx='690' cy='182' r='2'/%3E%3C!-- Asia --%3E%3Ccircle cx='760' cy='145' r='2'/%3E%3Ccircle cx='770' cy='140' r='2'/%3E%3Ccircle cx='780' cy='138' r='2'/%3E%3Ccircle cx='790' cy='142' r='2'/%3E%3Ccircle cx='800' cy='148' r='2'/%3E%3Ccircle cx='810' cy='145' r='2'/%3E%3Ccircle cx='820' cy='142' r='2'/%3E%3Ccircle cx='830' cy='138' r='2'/%3E%3Ccircle cx='840' cy='135' r='2'/%3E%3Ccircle cx='850' cy='140' r='2'/%3E%3Ccircle cx='860' cy='145' r='2'/%3E%3Ccircle cx='870' cy='148' r='2'/%3E%3Ccircle cx='880' cy='152' r='2'/%3E%3Ccircle cx='890' cy='155' r='2'/%3E%3Ccircle cx='780' cy='150' r='2'/%3E%3Ccircle cx='790' cy='155' r='2'/%3E%3Ccircle cx='800' cy='158' r='2'/%3E%3Ccircle cx='810' cy='155' r='2'/%3E%3Ccircle cx='820' cy='152' r='2'/%3E%3Ccircle cx='830' cy='150' r='2'/%3E%3Ccircle cx='840' cy='155' r='2'/%3E%3Ccircle cx='850' cy='158' r='2'/%3E%3Ccircle cx='860' cy='160' r='2'/%3E%3Ccircle cx='870' cy='162' r='2'/%3E%3Ccircle cx='880' cy='165' r='2'/%3E%3Ccircle cx='890' cy='168' r='2'/%3E%3Ccircle cx='900' cy='160' r='2'/%3E%3Ccircle cx='910' cy='158' r='2'/%3E%3Ccircle cx='920' cy='162' r='2'/%3E%3Ccircle cx='930' cy='168' r='2'/%3E%3Ccircle cx='940' cy='172' r='2'/%3E%3Ccircle cx='750' cy='158' r='2'/%3E%3Ccircle cx='760' cy='162' r='2'/%3E%3Ccircle cx='770' cy='165' r='2'/%3E%3Ccircle cx='780' cy='168' r='2'/%3E%3Ccircle cx='790' cy='172' r='2'/%3E%3Ccircle cx='800' cy='175' r='2'/%3E%3Ccircle cx='810' cy='172' r='2'/%3E%3Ccircle cx='820' cy='168' r='2'/%3E%3Ccircle cx='830' cy='165' r='2'/%3E%3C!-- Russia --%3E%3Ccircle cx='620' cy='100' r='2'/%3E%3Ccircle cx='640' cy='95' r='2'/%3E%3Ccircle cx='660' cy='98' r='2'/%3E%3Ccircle cx='680' cy='95' r='2'/%3E%3Ccircle cx='700' cy='92' r='2'/%3E%3Ccircle cx='720' cy='88' r='2'/%3E%3Ccircle cx='740' cy='85' r='2'/%3E%3Ccircle cx='760' cy='88' r='2'/%3E%3Ccircle cx='780' cy='92' r='2'/%3E%3Ccircle cx='800' cy='95' r='2'/%3E%3Ccircle cx='820' cy='98' r='2'/%3E%3Ccircle cx='840' cy='95' r='2'/%3E%3Ccircle cx='860' cy='92' r='2'/%3E%3Ccircle cx='880' cy='95' r='2'/%3E%3Ccircle cx='900' cy='98' r='2'/%3E%3Ccircle cx='920' cy='100' r='2'/%3E%3Ccircle cx='940' cy='105' r='2'/%3E%3Ccircle cx='630' cy='108' r='2'/%3E%3Ccircle cx='650' cy='105' r='2'/%3E%3Ccircle cx='670' cy='108' r='2'/%3E%3Ccircle cx='690' cy='105' r='2'/%3E%3Ccircle cx='710' cy='102' r='2'/%3E%3Ccircle cx='730' cy='98' r='2'/%3E%3Ccircle cx='750' cy='95' r='2'/%3E%3Ccircle cx='770' cy='100' r='2'/%3E%3Ccircle cx='790' cy='105' r='2'/%3E%3Ccircle cx='810' cy='108' r='2'/%3E%3Ccircle cx='830' cy='105' r='2'/%3E%3Ccircle cx='850' cy='102' r='2'/%3E%3C!-- India / SE Asia --%3E%3Ccircle cx='730' cy='180' r='2'/%3E%3Ccircle cx='740' cy='185' r='2'/%3E%3Ccircle cx='750' cy='192' r='2'/%3E%3Ccircle cx='745' cy='202' r='2'/%3E%3Ccircle cx='738' cy='212' r='2'/%3E%3Ccircle cx='730' cy='220' r='2'/%3E%3Ccircle cx='742' cy='225' r='2'/%3E%3Ccircle cx='755' cy='218' r='2'/%3E%3Ccircle cx='760' cy='205' r='2'/%3E%3Ccircle cx='765' cy='195' r='2'/%3E%3Ccircle cx='850' cy='175' r='2'/%3E%3Ccircle cx='860' cy='180' r='2'/%3E%3Ccircle cx='870' cy='185' r='2'/%3E%3Ccircle cx='880' cy='190' r='2'/%3E%3Ccircle cx='870' cy='198' r='2'/%3E%3Ccircle cx='860' cy='205' r='2'/%3E%3Ccircle cx='850' cy='210' r='2'/%3E%3C!-- East Asia / Japan --%3E%3Ccircle cx='940' cy='145' r='2'/%3E%3Ccircle cx='950' cy='148' r='2'/%3E%3Ccircle cx='960' cy='145' r='2'/%3E%3Ccircle cx='970' cy='150' r='2'/%3E%3Ccircle cx='980' cy='155' r='2'/%3E%3Ccircle cx='985' cy='165' r='2'/%3E%3Ccircle cx='990' cy='175' r='2'/%3E%3Ccircle cx='1000' cy='160' r='2'/%3E%3Ccircle cx='1010' cy='155' r='2'/%3E%3Ccircle cx='1015' cy='165' r='2'/%3E%3Ccircle cx='1020' cy='175' r='2'/%3E%3C!-- Australia --%3E%3Ccircle cx='900' cy='350' r='2'/%3E%3Ccircle cx='910' cy='345' r='2'/%3E%3Ccircle cx='920' cy='348' r='2'/%3E%3Ccircle cx='930' cy='352' r='2'/%3E%3Ccircle cx='940' cy='348' r='2'/%3E%3Ccircle cx='950' cy='352' r='2'/%3E%3Ccircle cx='910' cy='358' r='2'/%3E%3Ccircle cx='920' cy='362' r='2'/%3E%3Ccircle cx='930' cy='365' r='2'/%3E%3Ccircle cx='940' cy='362' r='2'/%3E%3Ccircle cx='950' cy='365' r='2'/%3E%3Ccircle cx='935' cy='375' r='2'/%3E%3Ccircle cx='945' cy='378' r='2'/%3E%3Ccircle cx='955' cy='375' r='2'/%3E%3Ccircle cx='960' cy='358' r='2'/%3E%3Ccircle cx='970' cy='362' r='2'/%3E%3C!-- Greenland --%3E%3Ccircle cx='340' cy='72' r='2'/%3E%3Ccircle cx='350' cy='68' r='2'/%3E%3Ccircle cx='360' cy='72' r='2'/%3E%3Ccircle cx='370' cy='75' r='2'/%3E%3Ccircle cx='345' cy='80' r='2'/%3E%3Ccircle cx='355' cy='82' r='2'/%3E%3Ccircle cx='365' cy='85' r='2'/%3E%3C!-- UK / Scandinavia --%3E%3Ccircle cx='500' cy='105' r='2'/%3E%3Ccircle cx='495' cy='115' r='2'/%3E%3Ccircle cx='505' cy='112' r='2'/%3E%3Ccircle cx='535' cy='95' r='2'/%3E%3Ccircle cx='545' cy='92' r='2'/%3E%3Ccircle cx='555' cy='98' r='2'/%3E%3Ccircle cx='565' cy='95' r='2'/%3E%3Ccircle cx='575' cy='100' r='2'/%3E%3Ccircle cx='585' cy='105' r='2'/%3E%3Ccircle cx='595' cy='108' r='2'/%3E%3Ccircle cx='605' cy='105' r='2'/%3E%3C/svg%3E");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  pointer-events: none;
  z-index: 0;
}

/* Everything inside above the decoration */
.happy-patients > * {
  position: relative;
  z-index: 1;
}


/* ======================================================================
   2. HEADER (Centered, inside dark panel)
   ====================================================================== */

.happy-patients__header {
  text-align: center;
  margin-bottom: var(--space-8);
}

/* Logo */
.happy-patients__logo {
  width: 140px;
  object-fit: contain;
  display: block;
  margin: 0 auto;
  filter: drop-shadow(0 4px 12px rgba(var(--btn-primary-rgb), 0.3));
}

/* Tag */
.happy-patients__tag {
  display: block;
  font-size: clamp(0.95rem, 1.5vw, 1.125rem);
  font-weight: var(--weight-bold);
  letter-spacing: 0.06em;
  color: var(--color-primary-300);
}

/* Title */
.happy-patients__title {
  font-size: clamp(1.65rem, 3.2vw, 2.5rem);
  font-weight: var(--weight-extrabold);
  line-height: var(--leading-tight);
  color: var(--color-neutral-0);
  margin-bottom: var(--space-3);
}

/* Subtitle */
.happy-patients__subtitle {
  font-size: var(--text-base);
  color: rgba(255, 255, 255, 0.5);
  max-width: 500px;
  margin: 0 auto;
  line-height: var(--leading-relaxed);
}


/* ======================================================================
   3. SLIDER CONTAINER (contained within panel)
   ====================================================================== */

.happy-patients__slider {
  position: relative;
}


/* ======================================================================
   4. TRACK WRAP + TRACK
   ====================================================================== */


.happy-patients__track {
  display: flex;
  gap: var(--space-4);
  transition: transform 600ms var(--ease-smooth);
  will-change: transform;
}


/* ======================================================================
   5. PHOTO CARD
   ====================================================================== */

.happy-patients__card {
  flex: 0 0 calc(25% - var(--space-4) * 3 / 4);
  min-width: 0;
  border-radius: var(--radius-xl);
  overflow: hidden;
  position: relative;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.06);
  transition:
    transform var(--transition-hover),
    box-shadow var(--transition-hover);
  cursor: grab;
}

.happy-patients__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
}

/* Photo wrapper */
.happy-patients__photo-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 5;
  overflow: hidden;
}

.happy-patients__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 600ms var(--ease-smooth);
}

.happy-patients__card:hover .happy-patients__photo {
  transform: scale(1.04);
}

/* Bottom gradient overlay on photo */
.happy-patients__photo-wrap::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 45%;
  background: linear-gradient(to top, rgba(var(--btn-secondary-rgb), 0.8) 0%, transparent 100%);
  pointer-events: none;
}

/* Card footer - overlaid on photo bottom */
.happy-patients__card-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: var(--space-4);
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.happy-patients__patient-name {
  font-size: var(--text-base);
  font-weight: var(--weight-bold);
  color: var(--color-neutral-0);
}

.happy-patients__patient-treatment {
  font-size: var(--text-xs);
  color: rgba(255, 255, 255, 0.55);
  font-weight: var(--weight-medium);
}


/* ======================================================================
   6. NAVIGATION ARROWS (inside dark panel)
   ====================================================================== */

.happy-patients__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-full);
  border: none;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: var(--color-neutral-0);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition:
    background-color var(--transition-hover),
    transform var(--transition-hover),
    box-shadow var(--transition-hover);
}

.happy-patients__arrow svg {
  width: 18px;
  height: 18px;
}

.happy-patients__arrow:hover {
  background: var(--color-primary-500);
  transform: translateY(-50%) scale(1.08);
  box-shadow: 0 4px 16px rgba(var(--btn-primary-rgb), 0.35);
}

.happy-patients__arrow:active {
  transform: translateY(-50%) scale(0.95);
}

.happy-patients__arrow--prev {
  left: calc(var(--space-3) * -1);
}

.happy-patients__arrow--next {
  right: calc(var(--space-3) * -1);
}


/* ======================================================================
   7. RESPONSIVE
   ====================================================================== */

/* Mobile */
@media (max-width: 639px) {
  .happy-patients {
    padding: var(--space-8) var(--space-4) var(--space-6);
    border-radius: var(--radius-xl);
  }

  .happy-patients__card {
    flex: 0 0 78%;
  }

  .happy-patients__arrow {
    width: 38px;
    height: 38px;
  }

  .happy-patients__arrow svg {
    width: 16px;
    height: 16px;
  }

  .happy-patients__arrow--prev {
    left: var(--space-2);
  }

  .happy-patients__arrow--next {
    right: var(--space-2);
  }
}

/* Tablet */
@media (min-width: 640px) and (max-width: 1023px) {
  .happy-patients {
    padding: var(--space-10) var(--space-6) var(--space-8);
  }

  .happy-patients__card {
    flex: 0 0 calc(50% - var(--space-4) / 2);
  }

  .happy-patients__arrow--prev {
    left: 0;
  }

  .happy-patients__arrow--next {
    right: 0;
  }
}

/* Desktop */
@media (min-width: 1024px) {
  .happy-patients__arrow--prev {
    left: calc(var(--space-3) * -1);
  }

  .happy-patients__arrow--next {
    right: calc(var(--space-3) * -1);
  }
}


/* ======================================================================
   8. SCROLL ANIMATION
   ====================================================================== */

.happy-patients {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity var(--duration-reveal) var(--ease-out),
    transform var(--duration-reveal) var(--ease-out);
}

#yorumlar.is-visible .happy-patients {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .happy-patients {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .happy-patients__track {
    transition: none;
  }

  .happy-patients__photo {
    transition: none;
  }
}
