/* =========================================================
   FINAL HERO REDESIGN — Premium / Professional / Responsive
   Scope: Hero core only.
   dt-hero-services keeps its existing working design.
   ========================================================= */

:root{
  --dt-navy:#061a33;
  --dt-navy-2:#0b2d50;
  --dt-gold:#f5ad08;
  --dt-gold-2:#ffbf22;
  --dt-white:#fff;
  --dt-text:#12233c;
}

.dt-hero{
  position:relative;
  width:100%;
  height:var(--dt-hero-height,520px);
  overflow:visible;
  background:
    radial-gradient(circle at 78% 38%,rgba(245,173,8,.08),transparent 28%),
    linear-gradient(120deg,#04162b 0%,#061a33 48%,#0a2949 100%);
  isolation:isolate;
  box-sizing:border-box;
  margin:0 0 38px;
  z-index:5;
}

.dt-hero:before{
  content:"";
  position:absolute;
  z-index:-1;
  left:-8%;
  top:-35%;
  width:62%;
  height:170%;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.045);
  box-shadow:
    0 0 0 28px rgba(255,255,255,.012),
    0 0 0 56px rgba(255,255,255,.008);
  pointer-events:none;
}

.dt-hero-inner{
  position:relative;
  width:min(var(--dt-site-width,1280px),calc(100% - 40px));
  height:100%;
  margin:0 auto;
  z-index:3;
  box-sizing:border-box;
  overflow:visible;
}

.dt-hero-copy{
  position:relative;
  z-index:8;
  width:52%;
  height:100%;
  padding:54px 22px 110px 18px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  box-sizing:border-box;
  color:#fff;
}

.dt-hero-copy:after{
  content:"";
  position:absolute;
  left:18px;
  bottom:76px;
  width:74px;
  height:3px;
  border-radius:99px;
  background:linear-gradient(90deg,var(--dt-gold),var(--dt-gold-2));
  box-shadow:0 4px 14px rgba(245,173,8,.22);
}

.dt-hero-badge{
  display:inline-flex;
  align-items:center;
  align-self:flex-start;
  margin:0 0 16px;
  padding:8px 13px;
  border-radius:999px;
  background:rgba(255,255,255,.065);
  border:1px solid rgba(245,173,8,.34);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  color:#fff;
  font-size:10.5px;
  font-weight:900;
  letter-spacing:.65px;
  line-height:1;
  white-space:nowrap;
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
}

.dt-hero h1{
  margin:0;
  max-width:700px;
  color:#fff;
  font-size:clamp(44px,4.35vw,61px);
  line-height:.98;
  letter-spacing:-2.2px;
  font-weight:950;
  text-wrap:balance;
}

.dt-hero h1 span{
  display:block;
  margin-top:4px;
  color:var(--dt-gold-2);
  font-family:inherit;
  font-size:1em;
  font-weight:950;
  letter-spacing:-2.2px;
  position:relative;
  text-shadow:0 4px 18px rgba(0,0,0,.12);
}

.dt-hero h1 span:after{
  display:none;
}

.dt-hero-copy>p{
  max-width:570px;
  margin:17px 0 20px;
  color:rgba(255,255,255,.88);
  font-size:14.5px;
  line-height:1.62;
  font-weight:500;
}

.dt-hero-features{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  width:100%;
  max-width:610px;
  margin:0 0 20px;
  padding:9px 0;
  border-top:1px solid rgba(245,173,8,.17);
  border-bottom:1px solid rgba(245,173,8,.17);
}

.dt-hero-features>div{
  min-width:0;
  display:flex;
  align-items:center;
  gap:7px;
  padding:0 11px;
  border-right:1px solid rgba(245,173,8,.28);
  box-sizing:border-box;
}

.dt-hero-features>div:first-child{padding-left:0}
.dt-hero-features>div:last-child{border-right:0}

.dt-hero-features span{
  width:31px;
  height:31px;
  flex:0 0 31px;
  display:grid;
  place-items:center;
  border-radius:9px;
  color:var(--dt-gold-2);
  background:rgba(245,173,8,.07);
  border:1px solid rgba(245,173,8,.13);
}

.dt-hero-features svg{width:22px;height:22px}

.dt-hero-features strong{
  font-size:9.5px;
  line-height:1.18;
  color:#fff;
  font-weight:850;
}

.dt-hero-actions{
  display:flex;
  gap:9px;
  align-items:center;
  flex-wrap:wrap;
}

.dt-hero-actions a{
  min-height:46px;
  padding:0 18px;
  border-radius:8px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-decoration:none;
  font-size:12.5px;
  font-weight:900;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
  border:1px solid var(--dt-gold);
  box-sizing:border-box;
}

.dt-hero-actions a svg{width:16px;height:16px}

.dt-hero-primary{
  min-width:150px;
  background:linear-gradient(135deg,var(--dt-gold-2),var(--dt-gold));
  color:var(--dt-navy);
  box-shadow:0 9px 22px rgba(245,173,8,.18);
}

.dt-hero-primary:hover{
  color:var(--dt-navy);
  transform:translateY(-2px);
  box-shadow:0 13px 26px rgba(245,173,8,.28);
}

.dt-hero-secondary{
  min-width:158px;
  color:#fff;
  background:rgba(255,255,255,.045);
  border-color:rgba(245,173,8,.76)!important;
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
}

.dt-hero-secondary:hover{
  background:rgba(255,255,255,.10);
  color:#fff;
  transform:translateY(-2px);
}

.dt-hero-visual{
  position:absolute;
  z-index:1;
  top:0;
  right:-1px;
  width:61%;
  height:100%;
  overflow:hidden;
  background:#0a2949;
  clip-path:ellipse(76% 100% at 70% 50%);
}

.dt-hero-visual img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:62% 45%;
  transform:scale(1.035);
  transform-origin:center;
  filter:saturate(1.03) contrast(1.02);
}

.dt-hero-visual:before{
  content:"";
  position:absolute;
  z-index:2;
  left:-5px;
  top:0;
  bottom:0;
  width:48%;
  background:
    linear-gradient(90deg,
      rgba(6,26,51,1) 0%,
      rgba(6,26,51,.97) 20%,
      rgba(6,26,51,.72) 48%,
      rgba(6,26,51,0) 100%);
  pointer-events:none;
}

.dt-hero-visual:after{
  content:"";
  position:absolute;
  z-index:3;
  left:-7%;
  top:-10%;
  width:20px;
  height:120%;
  background:linear-gradient(180deg,#d99600,#ffbf22 50%,#d99600);
  border-radius:50%;
  transform:rotate(-16deg);
  opacity:.94;
  box-shadow:0 0 0 2px rgba(255,255,255,.08),0 0 24px rgba(245,173,8,.16);
}

.dt-hero-seal{
  position:absolute;
  right:26px;
  top:auto;
  bottom:44px;
  z-index:20;
  width:128px;
  height:128px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#fff;
  background:
    radial-gradient(circle at 50% 38%,#12375d 0%,#071f3a 60%,#04182d 100%);
  border:2px solid var(--dt-gold);
  clip-path:polygon(50% 0%,58% 7%,68% 3%,73% 13%,84% 12%,85% 23%,95% 28%,90% 39%,98% 48%,90% 57%,95% 67%,85% 72%,83% 82%,73% 81%,68% 91%,58% 87%,50% 98%,42% 87%,32% 91%,27% 81%,17% 82%,15% 72%,5% 67%,10% 57%,2% 48%,10% 39%,5% 28%,15% 23%,16% 12%,27% 13%,32% 3%,42% 7%);
  box-sizing:border-box;
  padding:13px;
  filter:drop-shadow(0 13px 22px rgba(0,0,0,.30));
}

.dt-hero-seal:before{
  content:"";
  position:absolute;
  inset:10px;
  border-radius:50%;
  border:1px solid rgba(245,173,8,.72);
  box-shadow:inset 0 0 18px rgba(245,173,8,.08);
}

.dt-hero-seal:after{
  content:"";
  position:absolute;
  inset:19px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.08);
}

.dt-hero-seal small,
.dt-hero-seal strong,
.dt-hero-seal .dt-hero-seal-label,
.dt-hero-seal .dt-hero-seal-stars{
  position:relative;
  z-index:2;
  display:block;
  width:100%;
  text-align:center;
  white-space:nowrap;
}

.dt-hero-seal small{
  font-size:13px;
  font-weight:950;
  line-height:1.05;
}

.dt-hero-seal strong{
  font-size:13px;
  line-height:1.05;
  font-weight:950;
}

.dt-hero-seal .dt-hero-seal-label{
  font-size:12px;
  line-height:1.05;
  font-weight:900;
}

.dt-hero-seal .dt-hero-seal-stars{
  font-size:10px;
  line-height:1;
  margin-bottom:5px;
  letter-spacing:1.25px;
  color:var(--dt-gold-2);
  text-shadow:0 0 8px rgba(245,173,8,.28);
}

.dt-hero-bottom{display:none}
.dt-hero-trust{display:none}

@media(max-width:1180px){
  .dt-hero{height:500px}
  .dt-hero-inner{width:min(var(--dt-site-width,1280px),calc(100% - 32px))}
  .dt-hero-copy{width:55%;padding-left:12px;padding-right:20px}
  .dt-hero-visual{width:62%}
  .dt-hero h1{font-size:clamp(40px,4.4vw,54px)}
  .dt-hero-seal{right:18px;bottom:38px;width:116px;height:116px}
  .dt-hero-services a{padding:0 8px}
}

@media(max-width:980px){
  .dt-hero{
    height:auto;
    min-height:0;
    margin-bottom:0;
    z-index:auto;
  }

  .dt-hero-inner{
    width:100%;
    height:auto;
    display:flex;
    flex-direction:column;
  }

  .dt-hero-copy{
    width:100%;
    height:auto;
    min-height:390px;
    padding:42px 28px 88px;
    order:1;
    background:
      radial-gradient(circle at 10% 20%,rgba(245,173,8,.08),transparent 30%),
      var(--dt-navy);
  }

  .dt-hero-copy:after{
    left:28px;
    bottom:55px;
  }

  .dt-hero-visual{
    position:relative;
    right:auto;
    top:auto;
    width:100%;
    height:390px;
    order:2;
    clip-path:none;
  }

  .dt-hero-visual:after{
    display:block;
    left:-4%;
    width:14px;
    transform:rotate(-8deg);
  }

  .dt-hero-visual:before{
    width:42%;
    background:linear-gradient(90deg,rgba(6,26,51,.82),rgba(6,26,51,0));
  }

  .dt-hero-seal{
    right:24px;
    bottom:28px;
    top:auto;
  }

  .dt-hero h1{font-size:45px}
  .dt-hero-features{max-width:680px}
  .dt-hero-copy>p{max-width:680px}
}

@media(max-width:640px){
  .dt-hero-copy{
    padding:30px 18px 78px;
    min-height:0;
  }

  .dt-hero-copy:after{
    left:18px;
    bottom:49px;
    width:56px;
    height:2px;
  }

  .dt-hero-badge{
    font-size:8.5px;
    padding:7px 9px;
    margin-bottom:12px;
  }

  .dt-hero h1{
    font-size:clamp(31px,8.7vw,38px);
    letter-spacing:-1.1px;
    line-height:1.01;
  }

  .dt-hero h1 span{letter-spacing:-1.1px}

  .dt-hero-copy>p{
    font-size:13.5px;
    line-height:1.5;
    margin:12px 0 15px;
  }

  .dt-hero-features{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px 5px;
    margin-bottom:16px;
    padding:8px 0;
  }

  .dt-hero-features>div{
    padding:2px 5px!important;
    border-right:0;
  }

  .dt-hero-features span{
    width:27px;
    height:27px;
    flex-basis:27px;
    border-radius:8px;
  }

  .dt-hero-features svg{width:20px;height:20px}
  .dt-hero-features strong{font-size:9.3px}

  .dt-hero-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:7px;
    width:100%;
  }

  .dt-hero-actions a{
    width:100%;
    min-width:0;
    min-height:43px;
    padding:0 9px;
    font-size:10.5px;
    border-radius:8px;
  }

  .dt-hero-visual{
    height:285px;
  }

  .dt-hero-visual img{
    object-position:60% center;
    transform:scale(1.02);
  }

  .dt-hero-seal{
    width:96px;
    height:96px;
    right:13px;
    bottom:18px;
    padding:10px;
  }

  .dt-hero-seal:before{inset:8px}
  .dt-hero-seal:after{inset:15px}
  .dt-hero-seal small{font-size:10px}
  .dt-hero-seal strong{font-size:10px}
  .dt-hero-seal .dt-hero-seal-label{font-size:9px}
  .dt-hero-seal .dt-hero-seal-stars{font-size:8px;letter-spacing:1px;margin-bottom:3px}
}

@media(max-width:390px){
  .dt-hero-copy{padding:25px 14px 70px}
  .dt-hero-copy:after{left:14px;bottom:44px;width:48px}
  .dt-hero h1{font-size:30px}
  .dt-hero-copy>p{font-size:12.5px}
  .dt-hero-features strong{font-size:8.7px}
  .dt-hero-visual{height:245px}
  .dt-hero-seal{width:84px;height:84px;right:10px;bottom:14px}
  .dt-hero-seal:before{inset:7px}
  .dt-hero-seal:after{inset:13px}
  .dt-hero-seal small{font-size:8.5px}
  .dt-hero-seal strong{font-size:8.5px}
  .dt-hero-seal .dt-hero-seal-label{font-size:7.5px}
  .dt-hero-seal .dt-hero-seal-stars{font-size:7px}
}

@media(min-width:981px){
  .dt-hero-hide-desktop .dt-hero-visual{display:none!important}
}

@media(min-width:641px) and (max-width:980px){
  .dt-hero-hide-tablet .dt-hero-visual{display:none!important}
}

@media(max-width:640px){
  .dt-hero-hide-mobile .dt-hero-visual{display:none!important}
}

@media(prefers-reduced-motion:reduce){
  .dt-hero-actions a,
  .dt-hero-visual img{
    transition:none!important;
  }
}

.dt-hero-image-width-full .dt-hero-visual{
  left:50%;
  right:auto;
  width:100vw;
  transform:translateX(-50%);
}

.dt-hero-image-width-boxed .dt-hero-visual{
  left:auto;
  right:-1px;
  width:61%;
  transform:none;
}

.dt-hero-image-left .dt-hero-visual img{object-position:left center}
.dt-hero-image-center .dt-hero-visual img{object-position:center center}
.dt-hero-image-right .dt-hero-visual img{object-position:right center}

@media(max-width:980px){
  .dt-hero-image-width-full .dt-hero-visual,
  .dt-hero-image-width-boxed .dt-hero-visual{
    left:auto;
    right:auto;
    width:100%;
    transform:none;
  }
}


/* v131 - Mobil Hero Alt Hizmet Bağlantıları Premium / Okunabilir */
@media (max-width: 640px){
  body.home .dt-hero-services{
    width:100%;
    min-height:112px;
    height:auto;
    padding:10px 8px;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:4px 2px;
    align-items:stretch;
    box-sizing:border-box;
    background:#fff;
  }
  body.home .dt-hero-services a{
    min-width:0;
    min-height:44px;
    height:auto;
    padding:7px 8px;
    gap:7px;
    justify-content:flex-start;
    border:0!important;
    border-radius:8px;
  }
  body.home .dt-hero-services a:hover{background:#f8fafc;}
  body.home .dt-hero-services span{
    width:26px;
    height:26px;
    flex:0 0 26px;
  }
  body.home .dt-hero-services svg{width:22px;height:22px;}
  body.home .dt-hero-services strong{
    display:block;
    min-width:0;
    font-size:14px!important;
    line-height:1.2!important;
    font-weight:800!important;
    white-space:normal!important;
    text-align:left;
    color:var(--dt-navy,#071d3d);
  }
}
@media (max-width:390px){
  body.home .dt-hero-services{
    min-height:116px;
    padding:9px 6px;
  }
  body.home .dt-hero-services a{padding:7px 5px;gap:6px;}
  body.home .dt-hero-services strong{font-size:13px!important;}
  body.home .dt-hero-services span{width:24px;height:24px;flex-basis:24px;}
  body.home .dt-hero-services svg{width:20px;height:20px;}
}

/* v162 — hero alt hizmetler mobilde kompakt ve dokunmatik */
@media(max-width:640px){
  body.home .dt-hero-services{touch-action:pan-y pinch-zoom;}
}


/* =========================================================
   FINAL PATCH — Restore working Hero bottom service links
   The Hero redesign must not alter these links.
   ========================================================= */

.dt-hero-services{
  position:absolute!important;
  z-index:30!important;
  left:50%!important;
  bottom:-33px!important;
  transform:translateX(-50%)!important;
  width:calc(100% - 4px)!important;
  height:68px!important;
  padding:0 18px!important;
  box-sizing:border-box!important;
  border-radius:15px!important;
  background:#fff!important;
  border:1px solid rgba(6,26,51,.08)!important;
  box-shadow:0 8px 24px rgba(6,26,51,.13)!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  align-items:center!important;
}

.dt-hero-services a{
  min-width:0!important;
  height:46px!important;
  padding:0 16px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:11px!important;
  color:var(--dt-navy)!important;
  text-decoration:none!important;
  box-sizing:border-box!important;
  border-right:1px solid rgba(6,26,51,.09)!important;
}

.dt-hero-services a:last-child{
  border-right:0!important;
}

.dt-hero-services span{
  width:30px!important;
  height:30px!important;
  flex:0 0 30px!important;
  display:grid!important;
  place-items:center!important;
  color:var(--dt-gold)!important;
}

.dt-hero-services svg{
  width:27px!important;
  height:27px!important;
}

.dt-hero-services strong{
  font-size:15px!important;
  line-height:1.25!important;
  white-space:normal!important;
  font-weight:850!important;
  color:var(--dt-navy)!important;
}

.dt-hero-services a:hover strong{
  color:var(--dt-gold)!important;
}

@media(max-width:1180px){
  .dt-hero-services{
    width:calc(100% - 4px)!important;
    padding:0 10px!important;
  }
  .dt-hero-services a{
    padding:0 8px!important;
    gap:7px!important;
  }
  .dt-hero-services strong{
    font-size:13px!important;
  }
}

@media(max-width:980px){
  .dt-hero-services{
    position:relative!important;
    left:auto!important;
    bottom:auto!important;
    transform:none!important;
    width:100%!important;
    height:auto!important;
    min-height:70px!important;
    border-radius:0!important;
    order:3!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    padding:8px!important;
  }
  .dt-hero-services a{
    height:44px!important;
    padding:0 7px!important;
  }
  .dt-hero-services a:nth-child(3){
    border-right:0!important;
  }
}

@media(max-width:640px){
  .dt-hero-services{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    padding:6px 4px!important;
  }
  .dt-hero-services a{
    height:44px!important;
    padding:0 4px!important;
    gap:5px!important;
    border-right:0!important;
  }
  .dt-hero-services span{
    width:24px!important;
    height:24px!important;
    flex-basis:24px!important;
  }
  .dt-hero-services svg{
    width:22px!important;
    height:22px!important;
  }
  .dt-hero-services strong{
    font-size:9px!important;
    text-align:center!important;
  }
}

@media(max-width:380px){
  .dt-hero-services strong{
    font-size:8.5px!important;
  }
}


/* =========================================================
   FINAL — HERO ALT HİZMET BAĞLANTILARI
   Premium / Professional / Responsive
   ========================================================= */

.dt-hero-services{
  height:72px!important;
  padding:6px 8px!important;
  gap:4px!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.98)!important;
  border:1px solid rgba(6,26,51,.10)!important;
  box-shadow:0 14px 32px rgba(6,26,51,.16),0 2px 7px rgba(6,26,51,.07)!important;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

.dt-hero-services a{
  position:relative!important;
  height:58px!important;
  padding:0 14px!important;
  gap:9px!important;
  border-right:1px solid rgba(6,26,51,.08)!important;
  border-radius:11px!important;
  overflow:hidden!important;
  transition:background .2s ease,transform .2s ease,box-shadow .2s ease,color .2s ease!important;
}

.dt-hero-services a:before{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:5px;
  height:2px;
  border-radius:99px;
  background:linear-gradient(90deg,var(--dt-gold),var(--dt-gold-2));
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .2s ease;
}

.dt-hero-services a:hover{
  background:linear-gradient(180deg,rgba(245,173,8,.08),rgba(245,173,8,.025));
  transform:translateY(-1px);
  box-shadow:0 5px 13px rgba(6,26,51,.07);
}

.dt-hero-services a:hover:before{
  transform:scaleX(1);
}

.dt-hero-services span{
  width:34px!important;
  height:34px!important;
  flex:0 0 34px!important;
  border-radius:10px!important;
  background:linear-gradient(135deg,#fff8df,#fff)!important;
  border:1px solid rgba(245,173,8,.25)!important;
  box-shadow:0 3px 8px rgba(6,26,51,.06)!important;
  transition:transform .2s ease,background .2s ease!important;
}

.dt-hero-services svg{
  width:22px!important;
  height:22px!important;
}

.dt-hero-services a:hover span{
  transform:translateY(-1px) scale(1.04);
  background:#fff4cf!important;
}

.dt-hero-services strong{
  position:relative;
  z-index:2;
  font-size:12px!important;
  line-height:1.18!important;
  letter-spacing:.05px;
  font-weight:900!important;
  color:var(--dt-navy)!important;
}

.dt-hero-services a:hover strong{
  color:#c88d00!important;
}

/* Tablet */
@media(max-width:980px){
  .dt-hero-services{
    height:auto!important;
    min-height:76px!important;
    padding:7px!important;
    border-radius:0 0 14px 14px!important;
    gap:5px!important;
    box-shadow:0 9px 22px rgba(6,26,51,.10)!important;
  }

  .dt-hero-services a{
    height:58px!important;
  }
}

/* Mobil */
@media(max-width:640px){
  .dt-hero-services{
    min-height:0!important;
    padding:7px 6px!important;
    gap:6px!important;
    border-radius:0 0 13px 13px!important;
  }

  .dt-hero-services a{
    height:55px!important;
    padding:0 7px!important;
    gap:6px!important;
    border-right:0!important;
    border-radius:10px!important;
  }

  .dt-hero-services a:before{
    left:10px;
    right:10px;
    bottom:4px;
  }

  .dt-hero-services span{
    width:28px!important;
    height:28px!important;
    flex-basis:28px!important;
    border-radius:8px!important;
  }

  .dt-hero-services svg{
    width:19px!important;
    height:19px!important;
  }

  .dt-hero-services strong{
    font-size:9px!important;
    line-height:1.15!important;
    text-align:left!important;
  }

  /* Touch ekranlarda hover zıplaması yok */
  .dt-hero-services a:hover{
    transform:none!important;
  }
}

/* Küçük telefon */
@media(max-width:390px){
  .dt-hero-services{
    padding:6px 5px!important;
    gap:5px!important;
  }

  .dt-hero-services a{
    height:51px!important;
    padding:0 5px!important;
    gap:5px!important;
  }

  .dt-hero-services span{
    width:25px!important;
    height:25px!important;
    flex-basis:25px!important;
  }

  .dt-hero-services svg{
    width:17px!important;
    height:17px!important;
  }

  .dt-hero-services strong{
    font-size:8.2px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .dt-hero-services a,
  .dt-hero-services a:before,
  .dt-hero-services span{
    transition:none!important;
  }
}


/* =========================================================
   FINAL MOBILE — HERO ALT SERVICES
   Premium + Professional + Touch Responsive
   ========================================================= */

@media (max-width: 640px){

  .dt-hero-services{
    position:relative!important;
    z-index:50!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    margin:0!important;
    padding:8px!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    border-radius:0 0 16px 16px!important;
    background:rgba(255,255,255,.985)!important;
    border:1px solid rgba(6,26,51,.09)!important;
    box-shadow:0 12px 28px rgba(6,26,51,.13)!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  .dt-hero-services a{
    position:relative!important;
    width:100%!important;
    min-width:0!important;
    height:58px!important;
    padding:0 8px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;
    border:1px solid rgba(6,26,51,.07)!important;
    border-radius:11px!important;
    background:linear-gradient(145deg,#fff,#f8fafc)!important;
    box-shadow:0 3px 10px rgba(6,26,51,.055)!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
    -webkit-tap-highlight-color:transparent!important;
    touch-action:manipulation!important;
  }

  .dt-hero-services a:before{
    content:""!important;
    position:absolute!important;
    left:0!important;
    top:8px!important;
    bottom:8px!important;
    width:3px!important;
    border-radius:0 4px 4px 0!important;
    background:linear-gradient(180deg,var(--dt-gold-2),var(--dt-gold))!important;
    transform:none!important;
    opacity:.9!important;
  }

  .dt-hero-services a:hover{
    transform:none!important;
    background:linear-gradient(145deg,#fff,#f8fafc)!important;
    box-shadow:0 3px 10px rgba(6,26,51,.055)!important;
  }

  .dt-hero-services a:active{
    transform:scale(.985)!important;
    box-shadow:0 2px 6px rgba(6,26,51,.08)!important;
  }

  .dt-hero-services a:hover:before{
    transform:none!important;
  }

  .dt-hero-services span{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    flex:0 0 30px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:9px!important;
    background:linear-gradient(135deg,#fff6d7,#fff)!important;
    border:1px solid rgba(245,173,8,.28)!important;
    box-shadow:0 3px 8px rgba(6,26,51,.055)!important;
  }

  .dt-hero-services svg{
    width:19px!important;
    height:19px!important;
  }

  .dt-hero-services a:hover span{
    transform:none!important;
    background:linear-gradient(135deg,#fff6d7,#fff)!important;
  }

  .dt-hero-services strong{
    min-width:0!important;
    display:block!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:normal!important;
    color:var(--dt-navy)!important;
    font-size:9.5px!important;
    line-height:1.2!important;
    font-weight:900!important;
    letter-spacing:0!important;
  }

}

/* 480px ve altı */
@media (max-width:480px){

  .dt-hero-services{
    padding:7px!important;
    gap:6px!important;
    border-radius:0 0 14px 14px!important;
  }

  .dt-hero-services a{
    height:55px!important;
    padding:0 7px!important;
    gap:7px!important;
    border-radius:10px!important;
  }

  .dt-hero-services span{
    width:28px!important;
    height:28px!important;
    min-width:28px!important;
    flex-basis:28px!important;
  }

  .dt-hero-services svg{
    width:18px!important;
    height:18px!important;
  }

  .dt-hero-services strong{
    font-size:9px!important;
  }

}

/* Çok küçük telefonlar */
@media (max-width:390px){

  .dt-hero-services{
    padding:6px!important;
    gap:5px!important;
  }

  .dt-hero-services a{
    height:51px!important;
    padding:0 6px!important;
    gap:6px!important;
  }

  .dt-hero-services span{
    width:25px!important;
    height:25px!important;
    min-width:25px!important;
    flex-basis:25px!important;
    border-radius:8px!important;
  }

  .dt-hero-services svg{
    width:16px!important;
    height:16px!important;
  }

  .dt-hero-services strong{
    font-size:8.2px!important;
    line-height:1.15!important;
  }

}

/* 340px ve altı — güvenli tek satır taşma kontrolü */
@media (max-width:340px){

  .dt-hero-services{
    gap:4px!important;
    padding:5px!important;
  }

  .dt-hero-services a{
    height:48px!important;
    padding:0 5px!important;
    gap:5px!important;
  }

  .dt-hero-services span{
    width:23px!important;
    height:23px!important;
    min-width:23px!important;
    flex-basis:23px!important;
  }

  .dt-hero-services svg{
    width:15px!important;
    height:15px!important;
  }

  .dt-hero-services strong{
    font-size:7.7px!important;
  }

}

@media (prefers-reduced-motion:reduce){
  .dt-hero-services a,
  .dt-hero-services span,
  .dt-hero-services a:before{
    transition:none!important;
  }
}

/* =========================================================
   CLS STABILITY — HERO VISUAL
   Keep the visual block dimensions deterministic during paint.
   No visual design values are changed.
   ========================================================= */
.dt-hero-visual{
  box-sizing:border-box;
  contain:layout paint;
}

.dt-hero-visual img{
  display:block;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
}

@media(max-width:980px){
  .dt-hero-visual{
    flex:0 0 390px;
    min-height:390px;
    height:390px;
  }
}

@media(max-width:640px){
  .dt-hero-visual{
    flex-basis:285px;
    min-height:285px;
    height:285px;
  }
}

@media(max-width:390px){
  .dt-hero-visual{
    flex-basis:245px;
    min-height:245px;
    height:245px;
  }
}
