/* ============= RESET / BASE ============= */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont,
               "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

body {
  background: #000;
  color: #fff;
  overflow-x: hidden;
  padding-top: 56px; /* fixed header yüksekliği */
}

/* ============= HERO / FULLSCREEN TOP SLIDER ============= */

.page-hero-wrapper {
  position: relative;
  width: 100%;
  height: 100vh;
  background: #000;
  overflow: hidden;
}

.hero-slider {
  height: 100%;
  position: relative;
}

/* her slide (masaüstü varsayılanı) */
.hero-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100vh;
  max-height: none;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;

  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  text-align: center;
  color: #fff;

  opacity: 0;
  transition: opacity .8s ease-in-out;
  z-index: 1;
}

.hero-slide.active {
  opacity: 1;
  z-index: 2;
}

/* slide içeriği */
.slide-inner {
  position: relative;
  z-index: 5;
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  text-shadow: 0 2px 10px rgba(0,0,0,0.6);
  margin-top: 80px;
}

.slide-title {
  font-size: clamp(2rem,1rem + 2vw,3rem);
  font-weight: 600;
  letter-spacing: -0.03em;
  color: #fff;
  margin-bottom: 16px;
  text-shadow: 0 2px 10px rgba(0,0,0,0.6);
}

/* buton grubu */
.slide-ctas {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  flex-direction: row;
  gap: 8px;
  margin-bottom: 16px;
}

.btn-blue,
.btn-outline {
  font-size: 14px;
  font-weight: 600;
  border-radius: 4px;
  padding: 10px 18px;
  min-width: 170px;
  text-align: center;
  line-height: 1.3;
  border: 0;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(0,0,0,0.4);
  text-decoration: none;
}

.btn-blue {
  background-color: #2d4fe3;
  color: #fff;
}
.btn-blue:hover {
  background-color: #1f3ed6;
}

.btn-outline {
  background-color: rgba(255,255,255,0.95);
  color: #000;
}
.btn-outline:hover {
  background-color: #fff;
}

.slide-footnote {
  font-size: 12px;
  color: #ddd;
  line-height: 1.4;
  max-width: 360px;
  text-align: center;
  text-shadow: 0 2px 8px rgba(0,0,0,0.6);
  margin-top: 8px;
}

/* hero oklar */
.slider-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255,255,255,0.85);
  color: #000;
  border: 0;
  border-radius: 4px;
  font-size: 24px;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(0,0,0,0.5);
  z-index: 6;
}
.hero-prev { left:16px; }
.hero-next { right:16px; }

/* hero dotlar */
.slider-dots {
  position: absolute;
  left: 50%;
  bottom: 24px;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 7;
}
.slider-dot {
  width: 10px;
  height: 10px;
  background: rgba(255,255,255,0.7);
  border-radius: 50%;
  border: 0;
  cursor: pointer;
}
.slider-dot.active {
  background: #fff;
}

/* ====== MOBILE HERO FINAL (tek slide görünür, siyah blok yok, yumuşak fade) ====== */
@media (max-width:768px){

  /* wrapper + slider mobilde akışta, ama yine kendi yüksekliğini verir */
  .page-hero-wrapper {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    background: #000;
    overflow: hidden;
  }

  .hero-slider {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    background: #000;
    overflow: hidden;
  }

  /* tüm slaytlar aynı koordinatta üst üste */
  .hero-slide {
    position: absolute;
    top:0;
    left:0;
    right:0;

    width:100%;
    height:70vh;
    min-height:480px;
    max-height:680px;

    background-size: cover;
    background-repeat: no-repeat;
    background-position: center 80%; /* arabayı biraz uzaklaştır */
    background-color:#fff;          /* load anında siyah yerine transparan flaş yok */

    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    align-items:center;

    padding-top:60px;   /* header altı boşluk */
    padding-bottom:40px;

    opacity:0;
    transition:opacity .4s ease;
    pointer-events:none;
    z-index:1;
  }

  /* sadece aktif olan DOM akışına sokuluyor */
  .hero-slide.active{
    position:relative;
    opacity:1;
    pointer-events:auto;
    z-index:2;
  }

  /* iç blok */
  .slide-inner{
    margin-top:0;
    width:100%;
    max-width:320px;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    color:#fff;
    text-shadow:0 2px 10px rgba(0,0,0,0.6);
  }

  .slide-title{
    font-size:28px;
    font-weight:600;
    line-height:1.2;
    color:#fff;
    margin-bottom:16px;
  }

  .slide-ctas{
    flex-direction:column;
    width:100%;
    gap:12px;
    margin-bottom:16px;
  }

  .btn-blue,
  .btn-outline{
    width:100%;
    min-width:0;
    border-radius:4px;
    text-align:center;
    font-size:16px;
    font-weight:600;
    line-height:1.3;
    padding:12px 16px;
    box-shadow:0 16px 32px rgba(0,0,0,.6);
  }

  .slide-footnote{
    font-size:12px;
    line-height:1.4;
    color:#fff;
    text-shadow:0 2px 8px rgba(0,0,0,.7);
    max-width:320px;
    margin-top:12px;
  }

  /* oklar mobilde görünmez */
  .hero-prev,
  .hero-next{
    display:none !important;
  }

  /* dotlar aktif slaytın altına */
  .slider-dots{
    position:relative;
    left:auto;
    bottom:auto;
    transform:none;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    margin:16px 0 24px;
    z-index:10;
  }

  .slider-dot{
    width:10px;
    height:10px;
    background:rgba(255,255,255,.7);
    border-radius:50%;
    border:0;
  }
  .slider-dot.active{
    background:#fff;
  }
}

/* ============= PROMO STRIP (ALTTAKİ BAND) ============= */

.promo-strip {
  position: relative;
  width: 100vw;
  max-width: 100vw;
  background:#fff;
  color:#000;
  padding: 32px 0 48px 0;
  overflow: hidden;
}

/* ok tuşları */
.promo-arrow {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background:#fff;
  color:#000;
  border:0;
  border-radius:4px;
  font-size:20px;
  width:32px;
  height:32px;
  line-height:32px;
  text-align:center;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(0,0,0,.4);
  z-index:10;
}
.promo-left  { left:8px; }
.promo-right { right:8px; }

/* viewport */
.promo-viewport {
  width:100%;
  max-width:100%;
  overflow:hidden;
}

/* track */
.promo-track {
  display:flex;
  flex-wrap:nowrap;
  gap:24px;
  justify-content:flex-start;
  align-items:flex-start;

  width:auto;
  min-width:max-content;
  max-width:none;

  transition:transform .6s ease;
  will-change:transform;
  padding:0 48px;
}

/* kart */
.promo-card {
  position:relative;
  width:1119px;
  height:600px;
  flex-shrink:0;

  border-radius:8px;
  overflow:hidden;
  background:#000;
  color:#fff;

  display:flex;
  align-items:flex-end;
  padding:24px;

  box-shadow:none;
}

.promo-card-media {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  z-index:0;
}

/* gradient overlay */
.promo-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    to top,
    rgba(0,0,0,.7) 0%,
    rgba(0,0,0,.15) 40%,
    rgba(0,0,0,0) 70%
  );
  z-index:1;
}

/* içerik */
.promo-card-inner {
  position:relative;
  z-index:2;
  max-width:80%;
  color:#fff;
  text-shadow:0 2px 10px rgba(0,0,0,.7);
  font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

.promo-eyebrow{
  font-size:14px;
  font-weight:500;
  margin-bottom:8px;
  color:#fff;
}

.promo-headline{
  font-size:32px;
  line-height:1.2;
  font-weight:600;
  margin:0 0 16px 0;
  color:#fff;
  letter-spacing:-0.02em;
}

/* alt buton grubu */
.promo-ctas{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.promo-btn-primary,
.promo-btn-secondary{
  display:inline-block;
  font-size:14px;
  font-weight:600;
  line-height:1.3;
  border-radius:4px;
  padding:10px 16px;
  min-width:140px;
  text-align:center;
  text-decoration:none;
  cursor:pointer;
  box-shadow:0 12px 24px rgba(0,0,0,.6);
  border:0;
}

.promo-btn-primary{
  background:#2d4fe3;
  color:#fff;
}
.promo-btn-primary:hover{
  background:#1f3ed6;
}

.promo-btn-secondary{
  background:rgba(255,255,255,.95);
  color:#000;
}
.promo-btn-secondary:hover{
  background:#fff;
}

/* alt dotlar */
.promo-dots{
  display:flex;
  gap:8px;
  justify-content:center;
  margin-top:24px;
}
.promo-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:rgba(0,0,0,.3);
  border:0;
  cursor:pointer;
}
.promo-dot.active{
  background:#000;
}

/* promo-strip mobile */
@media(max-width:768px){
  .promo-arrow{ display:none; }
  .promo-track{
    flex-direction:column;
    gap:16px;
    width:100%;
    min-width:0;
    padding:0 16px;
  }
  .promo-card{
    width:100%;
    max-width:480px;
    height:auto;
    min-height:400px;
    margin:0 auto;
    border-radius:8px;
  }
}

/* ============= FOOTER / TESLA SECTIONS / CTA ROW / ENERGY ETC. ============= */
/* (senin aşağıdaki tüm Tesla bloklarını aynen koruyorum, sadece tekrarları sadeleştirdim) */

/* CTA rows, tesla-section, tesla-row-top, tesla-row-energy, sticky bar,
   footer ... bunlar aynen senin verdiğin gibi devam ediyor.
   ↓↓↓
*/

/* =========================
   CTA ROW  (Test sürüşü / Şarj)
   ========================= */

.cta-row{
  max-width:1600px;
  margin:32px auto 0;
  padding:0 24px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}

.cta-card{
  position:relative;
  background:#f5f5f5;
  border-radius:4px;
  overflow:hidden;
  min-height:180px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  padding:24px;
  color:#000;
  font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

.cta-left{
  display:flex;
  flex-direction:column;
  gap:8px;
  max-width:60%;
  z-index:2;
}

.cta-eyebrow{
  font-size:20px;
  font-weight:600;
  color:#000;
}
.cta-copy{
  font-size:14px;
  font-weight:400;
  color:#444;
  line-height:1.4;
}

.cta-btn-white{
  background:#fff;
  color:#000;
  font-size:13px;
  font-weight:600;
  line-height:1.3;
  padding:10px 16px;
  border-radius:4px;
  border:0;
  cursor:pointer;
  box-shadow:0 12px 24px rgba(0,0,0,.08);
  width:max-content;
}
.cta-btn-white:hover{
  background:#fff;
  box-shadow:0 16px 32px rgba(0,0,0,.12);
}

.cta-right{
  position:absolute;
  right:0;
  top:0;
  bottom:0;
  width:40%;
  background-repeat:no-repeat;
  background-position:center right;
  background-size:contain;
  pointer-events:none;
}

.cta-drive-img{
  background-image:url('/assets/img/cta_drive.jpg');
}
.cta-charge-img{
  background-image:url('/assets/img/cta_charge.jpg');
}

/* küçük noktalar row'u (5 nokta) */
.cta-dots{
  max-width:1600px;
  margin:8px auto 32px;
  text-align:center;
}
.cta-dots .dot{
  display:inline-block;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#444;
  margin:0 3px;
  opacity:.4;
}
.cta-dots .dot.active{
  opacity:1;
}

/* ===== TESLA ALT BLOK (TEST SÜRÜŞÜ / ŞARJ / POWERWALL / MEGAPACK) ===== */

.tesla-section{
  background:#fff;
  padding:32px 24px 64px;
  font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color:#000;
}

.tesla-row-top,
.tesla-row-energy,
.tesla-dots{
  max-width:1680px;
  margin-left:auto;
  margin-right:auto;
  box-sizing:border-box;
  padding:0 16px;
}

/* üst sıra */
.tesla-row-top{
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:16px;
  row-gap:16px;
  margin-bottom:24px;
  align-items:flex-start;
}

.tesla-cta-card{
  position:relative;
  background:#f8f8f8;
  border:1px solid rgba(0,0,0,0.06);
  border-radius:4px;
  box-shadow:none;
  min-height:170px;
  padding:24px;
  overflow:hidden;
  display:flex;
  align-items:flex-start;
  color:#000;
  font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

.tesla-cta-left{
  flex:1 1 auto;
  max-width:60%;
  display:flex;
  flex-direction:column;
  row-gap:12px;
  color:#000;
  z-index:2;
}

.tesla-cta-title{
  font-size:26px;
  font-weight:600;
  line-height:1.15;
  letter-spacing:-0.03em;
  color:#000;
  margin:0;
}
.tesla-cta-desc{
  font-size:15px;
  font-weight:400;
  line-height:1.4;
  color:#3a3a3a;
  margin:0;
  max-width:320px;
}

.tesla-cta-btn{
  background:#fff;
  color:#000;
  border:0;
  border-radius:4px;
  font-size:14px;
  font-weight:600;
  line-height:1.3;
  padding:10px 16px;
  min-width:140px;
  text-align:center;
  cursor:pointer;
  box-shadow:0 8px 16px rgba(0,0,0,.15);
}
.tesla-cta-btn:hover{
  background:#e9e9e9;
}

.tesla-cta-art{
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  width:40%;
  background-repeat:no-repeat;
  background-size:contain;
  background-position:100% 100%;
  pointer-events:none;
  z-index:1;
}
.tesla-cta-art-drive{
  background-image:url('/assets/img/cta-car.png');
  background-size:90% auto;
  background-position:95% 80%;
}
.tesla-cta-art-charge{
  background-image:url('/assets/img/charger.png');
  background-size:85% auto;
  background-position:90% 40%;
}

/* alt sıra */
.tesla-row-energy{
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:16px;
  row-gap:16px;
  margin-bottom:16px;
}

.tesla-energy-card{
  position:relative;
  border-radius:4px;
  overflow:hidden;
  min-height:580px;
  background:#000;
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  box-shadow:none;
  color:#fff;
  display:flex;
  align-items:flex-end;
  border:none;
}

.tesla-energy-powerwall{
  background-image:url('/assets/img/powerwall.jpg');
}
.tesla-energy-megapack{
  background-image:url('/assets/img/megapack.jpg');
}

.tesla-energy-overlay{
  width:100%;
  padding:24px;
  margin-top:auto;
  background:linear-gradient(
    to top,
    rgba(0,0,0,0.7) 0%,
    rgba(0,0,0,0.4) 30%,
    rgba(0,0,0,0) 70%
  );
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  color:#fff;
  text-shadow:0 2px 10px rgba(0,0,0,.8);
}

.tesla-energy-head{
  font-size:32px;
  font-weight:600;
  line-height:1.2;
  letter-spacing:-0.03em;
  margin:0 0 8px 0;
  color:#fff;
}
.tesla-energy-sub{
  font-size:15px;
  font-weight:400;
  line-height:1.4;
  color:#fff;
  margin:0 0 16px 0;
  max-width:480px;
  text-shadow:0 2px 10px rgba(0,0,0,.8);
}

.tesla-energy-btn{
  background:#2d4fe3;
  color:#fff;
  border:0;
  border-radius:4px;
  padding:10px 16px;
  font-size:14px;
  font-weight:600;
  line-height:1.3;
  min-width:90px;
  cursor:pointer;
  box-shadow:none;
}
.tesla-energy-btn:hover{
  background:#1f3ed6;
}

/* dots */
.tesla-dots{
  text-align:center;
  margin-top:8px;
  margin-bottom:24px;
}
.tesla-dots .dot{
  display:inline-block;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#000;
  opacity:.35;
  margin:0 4px;
}
.tesla-dots .dot.active{
  opacity:.85;
}

/* responsive tesla rows */
@media(max-width:1024px){
  .tesla-row-top,
  .tesla-row-energy{
    grid-template-columns:1fr;
    column-gap:16px;
    row-gap:16px;
    padding:0 16px;
    margin-bottom:24px;
  }

  .tesla-cta-card{
    min-height:200px;
    padding:20px;
  }

  .tesla-cta-left{
    max-width:70%;
  }

  .tesla-cta-art{
    width:45%;
    background-size:90% auto;
    background-position:95% 80%;
  }

  .tesla-energy-card{
    min-height:400px;
  }
}

/* ===== Sticky Test Drive Bar ===== */
.tesla-sticky-testdrive {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;

  width:100%;
  background:#fff;
  border-top:1px solid rgba(0,0,0,.08);
  box-shadow: 0 -2px 8px rgba(0,0,0,0.08);

  display:flex;
  justify-content:center;
  align-items:flex-start;

  padding:16px 0;
}

.tesla-sticky-btn {
  background:#fff;
  border:1px solid rgba(0,0,0,0.12);
  border-radius:4px;
  box-shadow:0 16px 32px rgba(0,0,0,0.15);

  display:flex;
  align-items:center;
  gap:8px;

  font-size:14px;
  font-weight:600;
  line-height:1.3;
  color:#000;

  padding:10px 16px;
  cursor:pointer;
  white-space:nowrap;
}
.tesla-sticky-btn:hover {
  box-shadow:0 20px 36px rgba(0,0,0,0.18);
  background:#fff;
}

.tesla-sticky-icon {
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}

.tesla-sticky-desktop{ display:none; }
@media(min-width:768px){
  .tesla-sticky-desktop{ display:flex; }
}

/* ===== Footer ===== */
.tesla-footer {
  background:#fff;
  color:#000;
  font-size:13px;
  line-height:1.4;
  text-align:center;
  margin-bottom:64px;  /* sticky bar çakışmasın */
  padding:24px 16px 24px;
  border-top:1px solid rgba(0,0,0,0.05);
  font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-weight:400;
}

.tesla-footer-inner {
  display:flex;
  flex-wrap:wrap;
  gap:12px 16px;
  justify-content:center;
  max-width:1200px;
  margin:0 auto;
  color:#000;
  font-weight:400;
}
.tesla-footer-inner a{
  color:#000;
  text-decoration:none;
  white-space:nowrap;
  font-weight:400;
}
.tesla-footer-inner a:hover{
  text-decoration:underline;
}

.tesla-footer-copy{
  white-space:nowrap;
  color:#000;
  font-weight:400;
}

/* promo-strip mobile tweaks tekrar */
@media(max-width:768px){
  .tesla-row-top,
  .tesla-row-energy{
    grid-template-columns:1fr;
  }
}



/* === MOBILE HERO BLACK STRIP FIX === */
@media (max-width:768px){

  /* pasif slaytların da arka plan rengi transparan olsun
     ki slide değişimi sırasında altta siyah blok görünmesin */
  .hero-slide {
    background-color: transparent !important;
    /* biraz daha uzun yapalım ki görsel aşağı kadar gelsin */
    height:75vh !important;
    min-height:500px !important;
    max-height:700px !important;

    /* arabayı biraz daha aşağı indir (daha az zoom, altta boşluk kalmasın) */
    background-position: center 70% !important;
  }

  /* aktif slayt özelinde de aynı ayarlar (güvenli tarafta tutuyoruz) */
  .hero-slide.active{
    background-color: transparent !important;
    height:75vh !important;
    min-height:500px !important;
    max-height:700px !important;
    background-position: center 70% !important;
  }

  /* dotları slaytın altındaki siyah boşluk yerine
     görsel üstüne biraz yukarı alıyoruz */
  .slider-dots{
    margin-top:16px !important;
    margin-bottom:16px !important;
    position:absolute !important;
    left:50% !important;
    bottom:16px !important;
    transform:translateX(-50%) !important;
    background:transparent !important;
  }
}

/* ==== TOP CTA KARTLARINI DIŞA TAŞ / YAY ==== */

/* kapsayıcı grid aynı kalıyor ama kartları kolonun dışına itiyoruz */
.tesla-row-top {
  position: relative;
  max-width: 1680px;
  padding-left: 16px;
  padding-right: 16px;
  column-gap: 16px;
}

/* SOL KART (Tesla'yı Deneyimleyin) -> sola taş ve genişlet */
.tesla-row-top .tesla-cta-card:first-child {
  margin-left: -150px;              /* grid sınırının soluna taş */
  width: calc(100% + 150px);        /* taşıdığın kadar genişlet */
}

/* SAĞ KART (Şarj) -> sağa taş ve genişlet */
.tesla-row-top .tesla-cta-card:last-child {
  margin-right: -150px;             /* grid sınırının sağına taş */
  width: calc(100% + 150px);        /* taşıdığın kadar genişlet */
}

/* kartların iç dolgusu hafif büyüsün ki sol taraftaki metin havasız kalmasın */
.tesla-row-top .tesla-cta-card {
  padding: 24px 28px 24px 28px;
}

/* görsel taraf daha baskın olsun (jant / şarj daha çok içeri girsin) */
.tesla-row-top .tesla-cta-art {
  width: 33%;                       /* 40% -> 33% = görsel daha iri konumlanır */
  background-size: 100% auto;       /* büyüt */
  background-position: 100% 70%;    /* sağ-alt tarafa doğru yasla */
}

/* jant görselini biraz yukarı-sağa oturt */
.tesla-row-top .tesla-cta-art-drive {
  background-position: 100% 52%;    /* sağ + biraz yukarı */
}

/* şarj cihazını biraz daha yukarı al */
.tesla-row-top .tesla-cta-art-charge {
  background-position: 80% 35%;     /* hafif içeri + biraz yukarı */
}

/* MOBILE'DA TAŞMA YAPMASIN */
@media (max-width:1024px){
  .tesla-row-top .tesla-cta-card:first-child,
  .tesla-row-top .tesla-cta-card:last-child {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
  }

  .tesla-row-top .tesla-cta-art {
    width: 45%;
    background-size: 90% auto;
    background-position: 80% 40%;
  }
}
/* kartların tekrar daha yuvarlak (oval) görünmesi için radius geri al */
.tesla-row-top .tesla-cta-card {
  border-radius: 8px;              /* 4px yerine tekrar 8px */
}

.tesla-row-top .tesla-cta-card:first-child,
.tesla-row-top .tesla-cta-card:last-child {
  border-radius: 8px;              /* taşan geniş kartlarda da aynı yuvarlaklık */
}

/* sağ taraftaki görsel panel kenardan içeri çiziliyor,
   kartın kendi radius’una uysun diye overflow zaten var,
   başka bir şey yapmana gerek yok */


/* enerji kartlarını da tekrar oval yap (Powerwall / Megapack) */
.tesla-energy-card {
  border-radius: 8px !important;
  overflow: hidden;               /* köşeden taşmasın diye */
}

/* gradient overlay'nin köşesi de aynı ovalliğe uysun */
.tesla-energy-overlay {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}