@charset "UTF-8";
html {
  scroll-behavior: smooth;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
}

body {
  background-color: #ffffff;
  color: #000000;
  padding: 0;
  margin: 0;
}

a:focus-visible {
  outline-offset: 0;
  outline: none !important;
}

.custom-scroll {
  scrollbar-width: thin;
  scrollbar-color: #cdcdcd transparent;
}

.custom-scroll::-webkit-scrollbar {
  width: 5px !important;
}

.custom-scroll::-webkit-scrollbar-thumb {
  background-color: #888;
  border-radius: 10px;
}

.custom-scroll::-webkit-scrollbar-thumb:hover {
  background-color: #555;
}

.custom-scroll::-webkit-scrollbar-track {
  background-color: transparent;
}

@font-face {
    font-family: "Tiempos Headline";
    src: url("../../assets/font/TiemposHeadline-Bold.woff2") format("woff2"), url("../../assets/font/TiemposHeadline-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Tiempos Headline";
    src: url("../../assets/font/TiemposHeadline-BoldItalic.woff2") format("woff2"), url("../../assets/font/TiemposHeadline-BoldItalic.woff") format("woff");
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "Tiempos Headline";
    src: url("../../assets/font/TiemposHeadline-MediumItalic.woff2") format("woff2"), url("../../assets/font/TiemposHeadline-MediumItalic.woff") format("woff");
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "Tiempos Headline";
    src: url("../../assets/font/TiemposHeadline-Medium.woff2") format("woff2"), url("../../assets/font/TiemposHeadline-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Tiempos Headline";
    src: url("../../assets/font/TiemposHeadline-Regular.woff2") format("woff2"), url("../../assets/font/TiemposHeadline-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Tiempos Headline";
    src: url("../../assets/font/TiemposHeadline-Semibold.woff2") format("woff2"), url("../../assets/font/TiemposHeadline-Semibold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Tiempos Headline";
    src: url("../../assets/font/TiemposHeadline-RegularItalic.woff2") format("woff2"), url("../../assets/font/TiemposHeadline-RegularItalic.woff") format("woff");
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "Tiempos Headline";
    src: url("../../assets/font/TiemposHeadline-SemiboldItalic.woff2") format("woff2"), url("../../assets/font/TiemposHeadline-SemiboldItalic.woff") format("woff");
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "SF Pro Text";
    src: url("../../assets/font/SFProText-BoldItalic.woff2") format("woff2"), url("../../assets/font/SFProText-BoldItalic.woff") format("woff");
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "SF Pro Text";
    src: url("../../assets/font/SFProText-MediumItalic.woff2") format("woff2"), url("../../assets/font/SFProText-MediumItalic.woff") format("woff");
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "SF Pro Text";
    src: url("../../assets/font/SFProText-SemiboldItalic.woff2") format("woff2"), url("../../assets/font/SFProText-SemiboldItalic.woff") format("woff");
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "SF Pro Text";
    src: url("../../assets/font/SFProText-Regular.woff2") format("woff2"), url("../../assets/font/SFProText-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "SF Pro Text";
    src: url("../../assets/font/SFProText-Medium.woff2") format("woff2"), url("../../assets/font/SFProText-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "SF Pro Text";
    src: url("../../assets/font/SFProText-Semibold.woff2") format("woff2"), url("../../assets/font/SFProText-Semibold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "SF Pro Text";
    src: url("../../assets/font/SFProText-Bold.woff2") format("woff2"), url("../../assets/font/SFProText-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "SF Pro Text";
    src: url("../../assets/font/SFProText-RegularItalic.woff2") format("woff2"), url("../../assets/font/SFProText-RegularItalic.woff") format("woff");
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
/* Global font classes */
.sf-pro-font {
  font-family: "SF Pro Text";
}

.tiempos-font {
  font-family: "Tiempos Headline";
}

*,
body,
html {
  font-family: "SF Pro Text";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-kerning: none;
          font-kerning: none;
  /*font-size: 1rem;*/
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 500;
}

h1 {
  font-size: 2.25rem;
}

@media (min-width: 768px) {
  h1 {
    font-size: 3.5rem;
  }
}
h2 {
  font-size: 3rem;
  line-height: 3.625rem;
}

h3 {
  font-size: 2.25rem;
}

h4 {
  font-size: 1.25rem;
}

@media (min-width: 1280px) {
  h4 {
    font-size: 1.875rem;
  }
}
h5,
h6 {
  font-size: 1.25rem;
}

/* ===== REFERENCE HEADER SYSTEM ===== */
:root{
  --max: 1240px;
  --tr: 240ms cubic-bezier(.20,.80,.20,1);
  --top-drop-dur: 560ms;
  --top-drop-ease: cubic-bezier(.16,1,.30,1);
  --white:#fff;
  --ink:#111827;
  --muted:#6b7280;
  --border: rgba(17,24,39,.12);
  --shadow: 0 20px 60px rgba(2,6,23,.18);
  --accent:#10b981;
  --header-h: 160px;
}

.header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: var(--header-h);
  z-index: 1100;
  transition: height 0.5s cubic-bezier(0.4, 0, 0.2, 1),
              background 0.5s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1),
              backdrop-filter 0.5s cubic-bezier(0.4, 0, 0.2, 1),
              border-bottom 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.header * {
  pointer-events: auto; 
}


/* Homepage: transparent with dark gradient overlay */
body.page-home .header.transparent {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0) 100%) !important;
  backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Other pages: always solid white background, no dark overlay */
body.page-other .header {
  position: fixed !important;
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
}

/* Other pages: menu text colors should be dark */
body.page-other .header .menu > li > a,
body.page-other .header .menu > li > button {
  color: #1f2937 !important;
}

/* Other pages: language button colors should be dark */
body.page-other .header .utils a,
body.page-other .header .utils button {
  color: #1f2937 !important;
  border: 1px solid rgba(31, 41, 55, 0.2) !important;
}

/* Other pages: mobile menu button should be dark */
body.page-other .header .mobile-menu-btn i {
  color: #1f2937 !important;
}

/* Other pages: mobile language toggle should be dark and visible */
body.page-other .header #mobile-lang-toggle.mobile-header-lang-btn {
  background: rgba(31, 41, 55, 0.06) !important;
  border-color: rgba(31, 41, 55, 0.12) !important;
  color: #1f2937 !important;
}

.header.solid {
  position: fixed !important;
  height: 120px;
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
  z-index: 1105;
  display: flex;
  align-items: center;
}

/* Scrolled state - smaller header */
.header.scrolled {
  height: 90px !important;
}

.header.solid .logo-img,
.header.slab-open .logo-img {
  height: 70px;
}

.header.scrolled .logo-img {
  height: 70px !important;
}

body {
  transition: padding-top 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

body.header-scrolled {
  padding-top: 120px;
}

body.header-scrolled.header-compact {
  padding-top: 90px;
}

.header.transparent.slab-open {
  height: 120px; 
  background: rgba(255, 255, 255, 0.98) !important;
  backdrop-filter: blur(10px);
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
  z-index: 1105 !important; 
  padding-top: 2px; 
}

.header__inner {
  height: 100%;
  width: 100%;
  max-width: none;
  margin: 0 auto;
  padding: 0 56px;
  display: grid;
  grid-template-columns: 1fr 2fr 1fr;
  align-items: center;
  background: none !important;
  position: relative;
  z-index: 1096;
}

.header.transparent .header__inner,
.header.transparent .nav,
.header.transparent .menu,
.header.transparent .utils {
  background: none !important;
  background-color: transparent !important;
}

.header__left {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.header__left .logo-img {
  height: 90px;
  transition: height 0.5s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: height;
}

.logo-img--light {
  display: none;
}

body.page-home .header.transparent:not(.slab-open) .logo-img--light {
  display: block;
}

body.page-home .header.transparent:not(.slab-open) .logo-img--dark {
  display: none;
}

.header__center {
  display: flex;
  align-items: center;
  justify-content: center; 
}

.header__right {
  display: flex;
  align-items: center;
  justify-content: flex-end; 
  gap: 16px;
}

.brand {
  display: flex;
  align-items: center;
  text-decoration: none;
  color: inherit;
}

.brand img {
  height: 120px;
  width: auto;
  object-fit: contain;
}

.nav {
  display: flex;
  justify-content: center;
  width: 100%;
}

.menu {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 40px;
  align-items: center;
}

.menu > li {
  position: relative;
}

.menu > li > a,
.menu > li > button {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 0;
  font-weight: 600;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-decoration: none;
  background: none;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
}

.menu > li > a::after,
.menu > li > button::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  height: 2px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: center;
  opacity: 0.8;
  transition: transform 0.3s ease;
}

/* Metin renkleri */
.header.transparent .menu > li > a,
.header.transparent .menu > li > button {
  color: #ffffff;
}

.header.solid .menu > li > a,
.header.solid .menu > li > button {
  color: #1f2937;
}

.header.transparent.slab-open .menu > li > a,
.header.transparent.slab-open .menu > li > button {
  color: #1f2937;
}

.menu > li > a:hover,
.menu > li > button:hover {
  opacity: 0.7;
}

/* Hover'da alt çizgi animasyonu */
.menu > li:hover > a::after,
.menu > li:hover > button::after {
  transform: scaleX(1);
}

.caret {
  transition: transform 0.3s ease;
}

.has-mega.is-open .caret {
  transform: rotate(180deg);
}

.utils {
  display: flex;
  align-items: center;
  gap: 16px;
}

.utils a,
.utils button {
  display: inline-block;
  padding: 8px 16px;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  border-radius: 6px;
  transition: all 0.3s ease;
  background: transparent;
  cursor: pointer;
  font-family: inherit;
}

.header.transparent .utils a,
.header.transparent .utils button {
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.3);
}

.header.solid .utils a,
.header.solid .utils button,
.header.transparent.slab-open .utils a,
.header.transparent.slab-open .utils button {
  color: #1f2937;
  border: 1px solid rgba(31, 41, 55, 0.2);
}

.utils a:hover,
.utils button:hover {
  background: rgba(255, 255, 255, 0.1);
}

.overlay{position:fixed; inset:0; background:rgba(2,6,23,.32);
  opacity:0; pointer-events:none; transition:opacity var(--tr); z-index:1000}
.overlay.show{opacity:1; pointer-events:auto} 


.mega {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  background: #ffffff;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
  opacity: 0;
  pointer-events: none;
  z-index: 1085; 
  transform: translateY(-100%); 
  transition: all 0.6s cubic-bezier(0.16, 1, 0.30, 1);
}

.mega.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0); 
}

.mega__inner{
  max-width:var(--max); 
  margin:0 auto; 
  padding-top: 180px; 
  padding-left: 40px;
  padding-right: 40px;
  padding-bottom: 40px;
  opacity:0; 
  transform:translateY(-20px);
  transition: opacity 400ms ease-out 200ms, transform 400ms ease-out 200ms; 
  position: relative;
  z-index: 1089;
}
.mega.is-open .mega__inner{opacity:1; transform:translateY(0)}

.mega-grid{display:grid; grid-template-columns: 2fr 1fr; gap:20px}

.stores{display:grid; grid-template-columns: repeat(2, minmax(260px,1fr)); gap:15px 25px; align-items:start}
.stores h4{margin:0 0 4px; font:900 12px/1 ui-sans-serif; letter-spacing:.14em; color:var(--muted)}
.store-list{margin:0; padding:0; list-style:none; min-height: 180px}
.store-list li{padding:6px 0; border-bottom:1px solid var(--border)}
.store-list li:last-child{border-bottom:0}
.store-list a{color:var(--ink); text-decoration:none; font-weight:800}

.view-all{margin-top: 16px; text-align: center}
.btn{
  display:inline-block; 
  padding:14px 28px; 
  border-radius:8px; 
  border:2px solid transparent;
  background: linear-gradient(135deg, #10b981 0%, #059669 100%); 
  color:#ffffff; 
  text-decoration:none; 
  font-weight:700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(16, 185, 129, 0.3);
}
.btn:hover{
  background: linear-gradient(135deg, #059669 0%, #047857 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(16, 185, 129, 0.4);
  color: #ffffff;
}
.btn--accent {
    border-color: transparent;
    background: #000000;
    color: #fff;
    box-shadow: 0 4px 15px rgba(0,0,0,.3);
    position: relative; /*sonradan eklendi*/
    top: 60px; /*sonradan eklendi*/
}

.btn--accent:hover {
  background: #333333;
  box-shadow:0 6px 20px rgba(0,0,0,.4);
}

.cats{align-self:start}
.cats h4{margin:0 0 6px; font:900 12px/1 ui-sans-serif; letter-spacing:.14em; color:var(--muted)}
.cat-list{display:flex; flex-wrap:wrap; gap:8px}
.cat-list a{display:inline-block; padding:8px 10px; border:1px solid #e5e7eb; border-radius:999px;
  color:var(--ink); text-decoration:none; background:#f9fafb; font-weight:800}
.cat-list a:hover{background:#eef2f7}

/* mobil */
.sub{display:none !important;}
.nav-toggle{display:none !important; margin-left:8px; width:44px; height:36px; border:1px solid var(--border);
  border-radius:10px; background:transparent; color:inherit}
.bars{width:18px; height:14px; position:relative; display:inline-block}
.bars span{position:absolute; left:0; right:0; height:2px; background:currentColor; border-radius:2px;
  transition:transform var(--tr), opacity var(--tr)}
.bars span:nth-child(1){top:0} .bars span:nth-child(2){top:6px} .bars span:nth-child(3){bottom:0}
.nav-toggle[aria-expanded="true"] .bars span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .bars span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .bars span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

@media (max-width: 992px){
  .header {
    height: 80px !important;
  }

  .header.solid {
    height: 80px !important;
  }

  .header.scrolled {
    height: 70px !important;
  }

  .header.scrolled .logo-img {
    height: 58px !important;
  }

  .header__inner {
    padding: 0 16px;
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
  }

  .header__left {
    flex: 0 0 auto;
    order: 1;
  }

  .header__left .logo-img {
    height: 58px;
    transition: height 0.5s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: height;
  }

  .header__center {
    display: none !important;
  }

  .header__right {
    flex: 0 0 auto;
    order: 3;
    display: flex !important;
    align-items: center;
    gap: 16px;
  }

  .brand img {
    height: 58px !important;
  }

  .utils {
    gap: 8px;
    display: flex !important;
  }

  .utils button {
    padding: 8px 14px;
    font-size: 14px;
    font-weight: 700;
  }

  .nav-toggle {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: none !important;
    background: transparent !important;
    padding: 0;
    margin: 0;
    cursor: pointer;
  }

  .nav-toggle .bars {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }

  .nav-toggle .bars i {
    font-size: 24px;
    transition: all 0.3s ease;
  }

  .header.transparent .nav-toggle .bars i {
    color: #ffffff;
  }

  .header.solid .nav-toggle .bars i,
  .header.transparent.slab-open .nav-toggle .bars i {
    color: #1f2937;
  }

  body.nav-open .nav-toggle .bars i.fa-bars {
    display: none;
  }

  body.nav-open .nav-toggle .bars i.fa-times {
    display: block;
  }

  body.nav-open .header__center {
    display: block !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    top: 80px !important;
    bottom: 0 !important;
    width: 100% !important;
    height: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    z-index: 1200 !important;
    background: #ffffff;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    animation: slideInFromTop 0.3s cubic-bezier(0.16, 1, 0.30, 1) forwards;
  }

  body.nav-open .header__center .nav {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
  }

  @keyframes slideInFromTop {
    from {
      transform: translateY(-20px);
      opacity: 0;
    }
    to {
      transform: translateY(0);
      opacity: 1;
    }
  }

  .menu {
    flex-direction: column;
    justify-content: flex-start;
    gap: 0;
    align-items: stretch;
    padding: 16px;
    max-width: 100%;
  }

  .menu > li {
    padding: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  }

  .menu > li:last-child {
    border-bottom: none;
  }

  .menu > li > a,
  .menu > li > button {
    padding: 16px 8px;
    text-align: left;
    font-size: 15px;
    font-weight: 600;
    color: #1f2937 !important;
    width: 100%;
    justify-content: space-between;
  }

  .menu > li > a::after,
  .menu > li > button::after {
    display: none;
  }

  .menu > li > a:hover,
  .menu > li > button:hover {
    background: rgba(0, 0, 0, 0.03);
    opacity: 1;
  }

  .sub {
    display: grid !important;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s cubic-bezier(0.16, 1, 0.30, 1);
    margin-top: 0;
    background: rgba(0, 0, 0, 0.02);
  }

  .sub__inner {
    overflow: hidden;
    padding: 0 8px;
  }

  .has-mega.is-open .sub {
    grid-template-rows: 1fr;
  }

  .has-mega.is-open .sub__inner {
    padding: 12px 8px;
  }

  .sub .stores {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .sub .stores h4 {
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.1em;
    color: #6b7280;
    margin-bottom: 8px;
  }

  .sub .store-list {
    margin-bottom: 16px;
  }

  .sub .store-list li {
    border-color: rgba(0, 0, 0, 0.06);
    padding: 10px 0;
  }

  .sub .store-list a {
    font-size: 14px;
    font-weight: 600;
    color: #1f2937;
  }

  .sub .cats {
    margin-top: 12px;
  }

  .sub .cats h4 {
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.1em;
    color: #6b7280;
    margin-bottom: 10px;
  }

  .sub .cat-list {
    gap: 8px;
  }

  .sub .cat-list a {
    font-size: 13px;
    padding: 8px 14px;
    font-weight: 600;
  }

  .sub .view-all {
    margin-top: 20px;
    margin-bottom: 8px;
  }

  .sub .btn {
    width: 100%;
    text-align: center;
    padding: 14px 20px;
    font-size: 13px;
  }

  .mega {
    display: none !important;
  }


  body.header-scrolled {
    padding-top: 80px;
  }

  .page-content {
    padding-top: 96px !important;
  }
}

body.modal-lock{overflow:hidden}



.ifm-title {
  font-family: "Tiempos Headline";
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 400;
  letter-spacing: -0.01562em;
}
@media (min-width: 1024px) {
  .ifm-title {
    font-size: 2.25rem;
  }
}
@media (min-width: 1280px) {
  .ifm-title {
    font-size: 3rem;
    line-height: 58px;
  }
}
.ifm-title i {
  font-family: "Tiempos Headline";
  font-size: 1.875rem;
  font-weight: 700;
  font-style: normal;
}
@media (min-width: 1024px) {
  .ifm-title i {
    font-size: 2.25rem;
  }
}
@media (min-width: 1280px) {
  .ifm-title i {
    font-size: 3rem;
    font-style: italic;
  }
}

.no-scroll {
  overflow: hidden;
  height: 100vh;
}

.page-content {
  padding-top: 176px;
}

@media (max-width: 1024px) {
  .page-content {
    padding-top: 136px;
  }
}

.page-masthead {
  position: relative;
  width: 100%;
  background-color: #ffffff;
  overflow: hidden;
  padding: 60px 0 52px;
  margin-bottom: 8px;
}

.page-masthead::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('/assets/img/bg-2-gold.svg') center top / 140% auto no-repeat;
  opacity: 0.9;
  pointer-events: none;
  z-index: 0;
}

.page-masthead::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 55%;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
  pointer-events: none;
  z-index: 0;
}

.page-masthead-inner {
  position: relative;
  z-index: 1;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 24px;
}

.page-masthead-breadcrumb {
  display: flex;
  gap: 10px;
  align-items: center;
  font-size: 15px;
  color: #64748b;
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  font-family: "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.page-masthead-breadcrumb li {
  display: flex;
  align-items: center;
  gap: 10px;
}

.page-masthead-breadcrumb li:not(:last-child)::after {
  content: "\203A"; /* › */
  color: #b49968;
  font-size: 16px;
  line-height: 1;
}

.page-masthead-breadcrumb a {
  color: #64748b;
  text-decoration: none;
  transition: color 0.2s ease;
}

.page-masthead-breadcrumb a:hover {
  color: #b49968;
}

.page-masthead-breadcrumb .current {
  color: #0f172a;
  font-weight: 600;
}

.page-masthead-title {
  font-size: 34px;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
  padding-bottom: 16px;
  font-family: "Tiempos Headline", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  position: relative;
}

.page-masthead-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 64px;
  height: 3px;
  background: linear-gradient(90deg, #d7c3a0 0%, #b49968 100%);
  border-radius: 2px;
}

@media (max-width: 768px) {
  .page-masthead {
    padding: 36px 0 32px;
  }
  .page-masthead-title {
    font-size: 26px;
  }
}

.choices.is-focused .choices__inner {
    border: 1px solid #000;
}

.choices .choices__inner {
    height: 64px;
    background-color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #cbd5e1;
    border-radius: initial;
}

.choices .choices__inner.error {
    border: 1px solid #f00;
}

.choices .choices__list--dropdown {
    border-radius: initial;
}

.choices .choices__list--dropdown .choices__list .choices__item:first-child {
    color: #5f5f5f;
}

.choices .choices__list--dropdown.is-active {
    border: 1px solid #000;
}

.custom-gradient {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.8)), color-stop(50%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.8)));
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.8));
}

.swiper-button-next,
.swiper-button-prev {
  color: white;
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.swiper-pagination .swiper-pagination-bullet {
  border-radius: initial;
  width: 16px;
  height: 4px;
  background-color: white;
  opacity: 0.3;
}
.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: white;
  opacity: 1;
  width: 24px;
}

.swiper-gallery .swiper-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
    display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
    align-items: center;
}
    .swiper-gallery .swiper-wrapper .swiper-slide-active {
        /*border: 10px solid rgba(248, 209, 196, 0.8);*/
        border: 10px solid transparent; 
        border-image: linear-gradient(45deg, #D7C3A0, #B49968) 1;
    }
@media (max-width: 1024px) {
    .swiper-gallery .swiper-wrapper .swiper-slide-active {
        /*border: 4px solid rgba(248, 209, 196, 0.8);*/
        border: 4px solid transparent; 
        border-image: linear-gradient(45deg, #D7C3A0, #B49968) 1;
    }
}

.zoom-loop {
  display: inline-block;
  -webkit-animation: zoomLoop 13s infinite;
          animation: zoomLoop 13s infinite;
}

.tabMenu {
  width: 100%;
}
.tabMenu .tabButtons {
  width: 100%;
  overflow: hidden;
}
.tabMenu .tabButtons ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
}
.tabMenu .tabButtons ul li {
  font-weight: 600;
  font-size: 20px;
  color: #000000;
  position: relative;
  padding: 32px;
  cursor: pointer;
}
.tabMenu .tabButtons ul li::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 4px;
  background-color: #000000;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
}
.tabMenu .tabButtons ul li.active::before {
  opacity: 100;
}
.tabMenu .tabTexts {
  width: 100%;
}
.tabMenu .tabTexts ul.box {
  width: 100%;
}
.tabMenu .tabTexts ul.box li.item {
  display: none;
  background-color: white;
  color: #000000;
}
.tabMenu .tabTexts ul.box li.item.active {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

input[type=text],
input[type=email],
input[type=tel],
input[type=date] {
  height: 64px;
  background-color: white;
  color: #000000;
  padding: 8px 12px;
  border: 1px solid #cbd5e1;
}
input[type=text]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=date]:focus {
  outline: none;
  border: 1px solid #000000;
}
input[type=text].error,
input[type=email].error,
input[type=tel].error,
input[type=date].error {
  border: 1px solid red;
}

textarea,
.textarea {
  background-color: white;
  color: #000000;
  padding: 8px 12px;
  border: 1px solid #cbd5e1;
}
textarea:focus,
.textarea:focus {
  outline: none;
  border: 1px solid #000000;
}
textarea:focus.error,
.textarea:focus.error {
  border: 1px solid red;
}
textarea.error,
.textarea.error {
  border: 1px solid red;
}

.choices.is-focused .choices__inner {
  border: 1px solid #000000;
}
.choices .choices__inner {
  height: 64px;
  background-color: white;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border: 1px solid #cbd5e1;
  border-radius: initial;
}
.choices .choices__inner.error {
  border: 1px solid red;
}
.choices .choices__list--dropdown {
  border-radius: initial;
}
.choices .choices__list--dropdown .choices__list .choices__item:first-child {
  color: rgb(95, 95, 95);
}
.choices .choices__list--dropdown.is-active {
  border: 1px solid #000000;
}

.iti {
  width: 100%;
}

.iti-mobile .iti--container {
  width: calc(100% - 60px);
}

.custom-checkbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

/* Checkbox input'u gizleme */
.custom-checkbox input[type=checkbox] {
  /*display: none;*/
  /**/
  opacity: 0;
  position: absolute;
  width: 0;
  height: 0;
}

/* Checkbox kutusu */
.checkbox-box {
  width: 24px;
  height: 24px;
  background-color: white;
  border: 1px solid #000000;
  position: relative;
  cursor: pointer;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
  display: inline-block;
}
.checkbox-box.error {
  border: 1px solid red;
}

/* Check edildiğinde arka plan siyah olur */
.custom-checkbox input[type=checkbox]:checked + .checkbox-box {
  background-color: #000000;
}

/* Tik işareti */
.checkbox-box::after {
  content: "";
  position: absolute;
  top: 5px;
  left: 8px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 2px 2px 0;
  opacity: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

/* Check edildiğinde tik işareti görünür */
.custom-checkbox input[type=checkbox]:checked + .checkbox-box::after {
  opacity: 1;
}

.custom-modal {
  width: 700px;
  height: 80%;
  padding: 24px 0 24px 0 !important;
}

/* Ensure fancybox modal appears above everything (header: 1100, header.solid: 1105, loading: 9999) */
.fancybox__container {
  z-index: 999999 !important;
}

.custom-modal .header-modal {
  padding: 0 20px;
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 24px;
  color: #000000;
}
.custom-modal .content-modal {
  height: 100%;
  overflow: auto;
  padding: 0 20px;
  color: #000000;
}
.custom-modal .carousel__button.carousel__button {
  top: 20px;
  right: 16px;
  color: #000000;
  -webkit-box-shadow: none;
          box-shadow: none;
  text-shadow: none;
}

@media (max-width: 1024px) {
  .swiper-button-next,
  .swiper-button-prev {
    display: none;
  }
  .custom-modal {
    width: 100%;
  }
  .custom-modal .header-modal {
    padding: 0 16px;
    font-size: 24px;
  }
  .custom-modal .content-modal {
    padding: 0 16px;
  }
}
@-webkit-keyframes zoomLoop {
  from, to {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
}

@keyframes zoomLoop {
  from, to {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
}

.form-error{
    color: red;
    font-size: 13px;
}


/*TELEFON CSS*/
.iti__flag-container {
    height: 3.75rem;
}

.iti__selected-flag{
    padding: 0 17px;
}

.js-phone-number-control {
    visibility: hidden;
}

.phone-container {
    position: relative;
    border: 1px solid #ececec;
    background-color: #f2f2f2;
    height: 3.75rem;
}

    .phone-container .iti {
        height: 100%;
    }

        .phone-container .iti .text-danger {
            position: absolute;
        }

    .phone-container .iti__flag-container {
        padding: 0;
    }

    .phone-container > input {
        position: absolute;
        top: -1px;
        right: -1px;
        width: calc(100% - 63px);
        height: inherit;
        /*border-color: transparent*/
    }

#loading-overlay {
    display: none;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background-color: rgba(0, 0, 0, 0.8) !important;
    z-index: 9999 !important;
    pointer-events: all !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

#loading-animation {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 250px !important;
    height: 250px !important;
    z-index: 10000000 !important;
}

@media (min-width: 1024px) {
    .lg\:top-88 {
        top: -9rem !important;
    }
}


@media (min-width: 1024px) {
    .lg\:left-88 {
        left: 1rem !important;
    }
}

@media (min-width: 1024px) {
    .lg\:w-\[290px\]{
        width: 290px !important;
        padding-left: 0px !important;
        padding-right: 32px !important;
    }
}

body.is-locked {
    overflow: hidden !important;
    position: relative;
    width: 100%;
}

.skeleton-item {
  padding: 8px 0;
  animation: skeleton-pulse 1.5s ease-in-out infinite;
}

.skeleton-line {
  height: 14px;
  background: linear-gradient(90deg, #e5e7eb 0%, #f3f4f6 50%, #e5e7eb 100%);
  background-size: 200% 100%;
  border-radius: 4px;
  animation: skeleton-shimmer 1.5s ease-in-out infinite;
}

.skeleton-category {
  height: 32px;
  border-radius: 16px;
  margin-bottom: 8px;
}

@keyframes skeleton-shimmer {
  from {
    background-position: 200% 0;
  }
  to {
    background-position: -200% 0;
  }
}

@keyframes skeleton-pulse {
  from, to {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
}

.store-list.loaded .skeleton-item,
.cat-list.loaded .skeleton-item {
  display: none;
}