.elementor-483 .elementor-element.elementor-element-31fc28e{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-483 .elementor-element.elementor-element-31fc28e:not(.elementor-motion-effects-element-type-background), .elementor-483 .elementor-element.elementor-element-31fc28e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://thebarcommunity.com/wp-content/uploads/2025/11/bg1.webp");background-repeat:no-repeat;background-size:cover;}.elementor-483 .elementor-element.elementor-element-e2b649c{--display:flex;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );}.elementor-483 .elementor-element.elementor-element-30fe6f9 img{width:70%;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );text-transform:var( --e-global-typography-primary-text-transform );color:var( --e-global-color-primary );}.elementor-483 .elementor-element.elementor-element-2c8bdfe .elementor-heading-title{font-family:"Oswald", Sans-serif;font-size:1em;font-weight:700;text-transform:uppercase;color:#FFFFFF;}.elementor-483 .elementor-element.elementor-element-9482f67 .elementor-heading-title{font-family:"Oswald", Sans-serif;font-size:1em;font-weight:700;text-transform:uppercase;color:#FFFFFF;}.elementor-483 .elementor-element.elementor-element-dba9682{--display:flex;}.elementor-483 .elementor-element.elementor-element-c9e02fe{--grid-template-columns:repeat(0, auto);text-align:center;--grid-column-gap:5px;--grid-row-gap:0px;}.elementor-483 .elementor-element.elementor-element-c9e02fe .elementor-social-icon{border-style:groove;border-color:#FFFFFF;}@media(max-width:1024px){.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );}.elementor-483 .elementor-element.elementor-element-30fe6f9 img{width:61%;}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-483 .elementor-element.elementor-element-2c8bdfe .elementor-heading-title{font-size:1em;}.elementor-483 .elementor-element.elementor-element-9482f67 .elementor-heading-title{font-size:1.2em;}}@media(max-width:767px){.elementor-483 .elementor-element.elementor-element-31fc28e:not(.elementor-motion-effects-element-type-background), .elementor-483 .elementor-element.elementor-element-31fc28e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://thebarcommunity.com/wp-content/uploads/2025/11/bg-mobil.webp");background-repeat:no-repeat;background-size:cover;}.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-483 .elementor-element.elementor-element-2c8bdfe .elementor-heading-title{font-size:0.8em;}.elementor-483 .elementor-element.elementor-element-9482f67 .elementor-heading-title{font-size:1.2em;}}/* Start custom CSS for container, class: .elementor-element-31fc28e *//* === THE BAR | Coming Soon - Responsive Fix === */

/* iOS safe-area ve mobil yüksekliği için düzeltme */
html, body {
  margin: 0;
  padding: 0;
  background: #fff;
  min-height: 100%;
}

.coming-wrap{
  min-height: 100svh; /* iOS için daha güvenli */
  padding: clamp(16px, 5vw, 56px);
  display: grid;
  place-items: center;
}

/* İçerik genişliği mobilde taşmasın */
.coming-card{
  width: min(960px, 100%);
  margin-inline: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(12px, 2.2vw, 20px);
  padding: 0; /* Elementor column padding çakışmasın */
}

/* Logo kutusu: mobilde daha yüksek orana geç */
.logo-box{
  width: min(420px, 88vw);
  aspect-ratio: 16 / 7; /* 3/1 bazı telefonlarda çok basık kalıyor, daha dengeli */
  padding: clamp(10px, 2.5vw, 18px);
  border-radius: 24px;
  border: 1px solid #eee;
  background: #fff;
  display: grid;
  place-items: center;
  overflow: hidden;
  box-shadow:
    0 10px 30px rgba(17,17,17,.08),
    0 2px 8px rgba(17,17,17,.05);
  animation: floatY 6s ease-in-out infinite, fadeIn .9s ease-out both;
}
.logo-box img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Başlık & alt başlık: mobilde akış */
.coming-title{
  font-size: clamp(22px, 5.4vw, 40px);
  line-height: 1.2;
  font-weight: 700;
  color: #111;
  margin: 6px 0 0;
}
.coming-sub{
  max-width: 720px;
  font-size: clamp(14px, 3.8vw, 18px);
  line-height: 1.6;
  color: #6b7280;
  padding-inline: clamp(8px, 4vw, 0);
}

/* Buton alanı: sarma + tam genişlik mobilde */
.coming-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  width: 100%;
}
.coming-btn{
  appearance: none;
  border: 1px solid #e5e7eb;
  background: #fff; color:#111;
  padding: 12px 18px;
  border-radius: 999px;
  font-weight: 600;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  min-height: 44px; /* touch target */
}
.coming-btn:hover{
  transform: translateY(-2px);
  border-color:#d1d5db;
  box-shadow: 0 10px 24px rgba(17,17,17,.08);
}

/* Parıltı / ring efektleri (aynen kalsın) */
.logo-box::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(120deg, transparent 40%, rgba(255,255,255,.6) 50%, transparent 60%);
  transform: translateX(-130%) rotate(0.001deg);
  animation: sheen 5.2s ease-in-out infinite 1.2s;
  pointer-events:none;
}
.logo-box::before{
  content:"";
  position:absolute; inset:-2px;
  border-radius: inherit;
  box-shadow: 0 0 0 0 rgba(17,17,17,.06);
  animation: pulseRing 3.6s ease-out infinite 1s;
  pointer-events:none;
}

/* --- Breakpoints --- */

/* Tablet (≤ 1024px): başlık/sub biraz küçülür, kutu genişliği artar */
@media (max-width: 1024px){
  .logo-box{
    width: min(520px, 84vw);
    aspect-ratio: 16 / 7;
    border-radius: 22px;
  }
  .coming-title{ font-size: clamp(22px, 4.6vw, 34px); }
  .coming-sub{ font-size: clamp(14px, 2.6vw, 17px); }
}

/* Telefon (≤ 768px): daha sıkı tipografi ve boşluklar */
@media (max-width: 768px){
  .coming-wrap{ padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-left)) max(24px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-right)); }
  .logo-box{
    width: 86vw;
    aspect-ratio: 7 / 3.6; /* az daha yüksek; dikey alanda nefes */
    border-radius: 20px;
    padding: 12px;
    box-shadow:
      0 8px 22px rgba(17,17,17,.07),
      0 1px 6px rgba(17,17,17,.05);
  }
  .coming-title{ font-size: clamp(22px, 5.2vw, 30px); }
  .coming-sub{ font-size: clamp(14px, 3.6vw, 16px); }
  .coming-actions{ gap: 8px; }
  .coming-btn{ width: auto; padding: 12px 16px; }
}

/* Küçük telefon (≤ 420px): tek sütun, daha yüksek logo oranı */
@media (max-width: 420px){
  .logo-box{
    width: 90vw;
    aspect-ratio: 5 / 3; /* daha dikey görünüm, taşma yok */
    border-radius: 18px;
  }
  .coming-title{ font-size: 22px; }
  .coming-sub{ font-size: 14px; }
}

/* Animations (öncekilerle aynı) */
@keyframes fadeIn{ from{ opacity:0; transform: translateY(8px) } to{ opacity:1; transform: translateY(0) } }
@keyframes floatY{ 0%{transform:translateY(0) rotate(.0001deg)} 50%{transform:translateY(-8px) rotate(.0001deg)} 100%{transform:translateY(0) rotate(.0001deg)} }
@keyframes sheen{ 0%{ transform:translateX(-130%) } 45%{ transform:translateX(130%) } 100%{ transform:translateX(130%) } }
@keyframes pulseRing{ 0%{ box-shadow:0 0 0 0 rgba(17,17,17,.06) } 70%{ box-shadow:0 0 0 16px rgba(17,17,17,0) } 100%{ box-shadow:0 0 0 0 rgba(17,17,17,0) } }

/* Hareket hassasiyeti */
@media (prefers-reduced-motion: reduce){
  .logo-box{ animation:none }
  .logo-box::after, .logo-box::before{ animation:none }
}/* End custom CSS */