:root {
  --bakery-cocoa: #5a3422;
  --bakery-cocoa-deep: #2f1a12;
  --bakery-caramel: #c97b49;
  --bakery-honey: #e5a85e;
  --bakery-berry: #b8566b;
  --bakery-cream: #fbf4ea;
  --bakery-vanilla: #fffaf4;
  --bakery-wafer: #f1dfcf;
  --bakery-text: #4c3428;
  --bakery-muted: #8d6d5b;
  --bakery-shadow: 0 18px 45px rgba(90, 52, 34, 0.12);
}

body {
  background: linear-gradient(180deg, #fffaf6 0%, #fbf2e8 100%);
  color: var(--bakery-text);
}

a {
  color: var(--bakery-caramel);
}

a:hover,
a:focus {
  color: var(--bakery-berry);
}

.header-top {
  background: linear-gradient(90deg, var(--bakery-cocoa-deep) 0%, var(--bakery-cocoa) 100%) !important;
}

.header-cta ul li,
.header-social span,
.header-social a {
  color: rgba(255, 248, 241, 0.92) !important;
}

.menu-area,
.header-three .menu-area {
  background: rgba(255, 250, 244, 0.92) !important;
  border-bottom: 1px solid rgba(201, 123, 73, 0.18);
  box-shadow: 0 10px 30px rgba(90, 52, 34, 0.08);
  backdrop-filter: blur(10px);
}

.header-three .menu-area::before {
  background: linear-gradient(90deg, rgba(255, 250, 244, 0.96), rgba(248, 235, 221, 0.92)) !important;
}

.main-menu ul li a,
.header-three .main-menu ul li a {
  color: var(--bakery-cocoa) !important;
  font-weight: 700;
}

.main-menu ul li:hover > a,
.main-menu ul li a:hover,
.main-menu ul li.active > a {
  color: var(--bakery-berry) !important;
}

.main-menu ul li a::after,
.section-title h2::before {
  background: linear-gradient(90deg, var(--bakery-caramel), var(--bakery-honey)) !important;
}

.btn,
.second-header-btn .btn,
.slider-btn .btn,
.contact-form .btn,
.s-cta-btn .btn {
  background: linear-gradient(135deg, var(--bakery-caramel), var(--bakery-honey)) !important;
  border: none !important;
  color: #fff !important;
  box-shadow: 0 14px 32px rgba(201, 123, 73, 0.28);
}

.btn::before,
.second-header-btn .btn::before,
.contact-form .btn::before,
.s-cta-btn .btn::before {
  background: linear-gradient(135deg, var(--bakery-berry), #d97a70) !important;
}

.btn:hover,
.second-header-btn .btn:hover,
.slider-btn .btn:hover {
  color: #fff !important;
  transform: translateY(-1px);
}

.btn.ss-btn.active,
.slider-btn .btn.ss-btn.active {
  background: transparent !important;
  color: #fff !important;
  border: 2px solid rgba(255, 245, 238, 0.8) !important;
  box-shadow: none;
}

.single-slider::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at top right, rgba(229, 168, 94, 0.22), transparent 34%),
    linear-gradient(120deg, rgba(47, 26, 18, 0.82), rgba(90, 52, 34, 0.52));
  pointer-events: none;
}

.single-slider .container,
.single-slider .row {
  position: relative;
  z-index: 1;
}

.slider-content h5,
.about-title h5,
.section-title h5,
.date-home {
  color: var(--bakery-caramel) !important;
}

.slider-content h2,
.section-title h2,
.about-title h2,
.single-post2 .blog-content2 h4 a,
.pro-title a,
.f-widget-title h2,
.footer-widget h2 {
  color: var(--bakery-cocoa) !important;
}

.slider-content p,
.about-content p,
.section-title p,
.single-post2 .blog-content2 p,
.footer-widget,
.footer-widget p,
.footer-link ul li a,
.f-contact ul li,
.copyright-wrap {
  color: var(--bakery-muted) !important;
}

.about-area,
.blog-area,
.product-slider,
#service-details2,
.newslater-area,
.faq-area,
.contact-area,
.shop-area {
  background-color: var(--bakery-cream) !important;
}

.brand-area,
.brand-area[style] {
  background: linear-gradient(90deg, var(--bakery-cocoa-deep), var(--bakery-cocoa)) !important;
}

.services-08-item,
.product,
.single-post2,
.blog-content2,
.footer-widget,
.contact-bg02,
.newslater-area #contact-form4,
.shop-sidebar,
.widget {
  background: var(--bakery-vanilla);
  border: 1px solid rgba(201, 123, 73, 0.12);
  box-shadow: var(--bakery-shadow);
}

.services-08-item,
.product,
.single-post2 {
  border-radius: 18px;
  overflow: hidden;
}

.services-08-content a,
.blog-btn a,
.product-action a,
.footer-social a,
.header-social a {
  color: var(--bakery-caramel) !important;
}

.services-08-content a:hover,
.blog-btn a:hover,
.product-action a:hover,
.footer-social a:hover,
.header-social a:hover {
  color: var(--bakery-berry) !important;
}

.product-action {
  background: linear-gradient(to top, rgba(47, 26, 18, 0.88), rgba(47, 26, 18, 0.25)) !important;
}

.price span,
.single-post2 .blog-content2 h4 a:hover,
.pro-title a:hover {
  color: var(--bakery-berry) !important;
}

input,
textarea,
select,
.form-control {
  background: #fffdf9 !important;
  border: 1px solid rgba(201, 123, 73, 0.25) !important;
  color: var(--bakery-text) !important;
}

input:focus,
textarea:focus,
select:focus,
.form-control:focus {
  border-color: var(--bakery-caramel) !important;
  box-shadow: 0 0 0 0.2rem rgba(201, 123, 73, 0.16) !important;
}

.breadcrumb-area::before,
.page-hero::before {
  background: linear-gradient(120deg, rgba(47, 26, 18, 0.78), rgba(90, 52, 34, 0.38)) !important;
}

.page-hero .breadcrumb-item a,
.breadcrumb-wrap .breadcrumb li a,
.breadcrumb-wrap h2,
.breadcrumb-item,
.breadcrumb-item.active {
  color: #fff8f1 !important;
}

.bakery-footer-top,
.footer-top[style] {
  background-color: var(--bakery-cocoa-deep) !important;
  background-image:
    linear-gradient(135deg, rgba(47, 26, 18, 0.94), rgba(90, 52, 34, 0.86)),
    url('/assets/img/bg/footer-bg.png') !important;
  background-size: cover !important;
  background-position: center !important;
}

.footer-bg,
.footer-bg .footer-widget,
.footer-bg .footer-link ul li a,
.footer-bg .f-contact ul li,
.footer-bg .f-widget-title h2,
.footer-bg .footer-widget h2,
.copyright-wrap,
.copyright-wrap a {
  color: rgba(255, 245, 238, 0.88) !important;
}

.copyright-wrap {
  background: #24130d !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.footer-social a {
  border-color: rgba(255, 245, 238, 0.28) !important;
}

.footer-social a:hover {
  background: var(--bakery-caramel) !important;
  color: #fff !important;
}

/* ══════════════════════════════════════════
   LOGO – Desktop
══════════════════════════════════════════ */
.logo {
  display: flex;
  align-items: center;
  padding: 6px 0;
}
.logo a {
  display: flex;
  align-items: center;
  line-height: 1;
}
.logo img {
  height: 140px !important;
  width: auto !important;
  max-width: 280px !important;
  object-fit: contain !important;
  display: block !important;
  transition: height 0.3s ease;
}
#header-sticky.sticky-menu .logo img {
  height: 100px !important;
}
.menu-area .second-menu .row {
  align-items: center !important;
  min-height: 140px;
}

/* ══════════════════════════════════════════
   MOBİL HEADER — özel hamburger + drawer
   (meanmenu tamamen gizlenir, kendi UI kullanılır)
══════════════════════════════════════════ */

/* Üst header sosyal medya ikonları sağda kalsın */
.header-top .row {
  justify-content: flex-end !important;
}

/* meanmenu çıktısını mobilde tamamen gizle */
@media (max-width: 991px) {
  .mean-container,
  .mean-container .mean-bar,
  .mean-container .mean-nav,
  .mean-container a.meanmenu-reveal,
  .mobile-menu {
    display: none !important;
  }

  /* Desktop nav ve CTA kolonunu gizle */
  .menu-area .second-menu .col-xl-7.col-lg-7,
  .menu-area .second-menu .col-xl-2.col-lg-2 {
    display: none !important;
  }

  /* Header row: logo col-8 + hamburger col-4 yan yana */
  .menu-area .second-menu .row {
    min-height: 80px;
    flex-wrap: wrap;
    align-items: center !important;
  }

  /* Logo kolonu */
  .menu-area .second-menu .col-xl-3.col-lg-3.col-8 {
    flex: 0 0 66.6667% !important;
    max-width: 66.6667% !important;
    display: flex;
    align-items: center;
  }

  /* Logo boyutu */
  .logo {
    padding: 4px 0;
    width: auto !important;
  }
  .logo img {
    height: 95px !important;
    width: auto !important;
    max-width: 200px !important;
  }
}

/* Hamburger butonu dikey ortalama */
#hg-mob-toggle-wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
}

/* ── Hamburger Toggle Butonu ── */
#hg-mob-toggle {
  display: none;
}
@media (max-width: 991px) {
  #hg-mob-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, var(--bakery-vanilla), #fdf3e7);
    border: 1.5px solid rgba(201,123,73,0.35);
    border-radius: 14px;
    box-shadow: 0 4px 16px rgba(90,52,34,0.12);
    cursor: pointer;
    flex-shrink: 0;
    margin-right: 4px;
    transition: background 0.2s, box-shadow 0.2s;
    outline: none;
  }
  #hg-mob-toggle:hover {
    background: linear-gradient(135deg, #fdf0e4, #fae6d3);
    box-shadow: 0 6px 20px rgba(201,123,73,0.22);
  }
  #hg-mob-toggle .hg-bar {
    display: block;
    width: 22px;
    height: 2.5px;
    background: var(--bakery-cocoa);
    border-radius: 99px;
    transition: transform 0.3s cubic-bezier(.4,0,.2,1), opacity 0.2s;
  }
  /* X animasyonu */
  #hg-mob-toggle.is-open .hg-bar:nth-child(1) {
    transform: translateY(7.5px) rotate(45deg);
  }
  #hg-mob-toggle.is-open .hg-bar:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
  }
  #hg-mob-toggle.is-open .hg-bar:nth-child(3) {
    transform: translateY(-7.5px) rotate(-45deg);
  }
}

/* ── Overlay Backdrop ── */
#hg-mob-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(47,26,18,0.48);
  backdrop-filter: blur(3px);
  z-index: 9998;
  opacity: 0;
  transition: opacity 0.3s ease;
}
#hg-mob-overlay.is-visible {
  opacity: 1;
}

/* ── Drawer Menü ── */
#hg-mob-drawer {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  width: min(320px, 88vw);
  height: 100dvh;
  background: var(--bakery-vanilla);
  z-index: 9999;
  flex-direction: column;
  box-shadow: -8px 0 40px rgba(47,26,18,0.18);
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(.4,0,.2,1);
  overflow-y: auto;
  overscroll-behavior: contain;
}
#hg-mob-drawer.is-open {
  transform: translateX(0);
}

/* Drawer başlık – logo + kapat butonu */
.hg-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 20px 16px;
  border-bottom: 1px solid rgba(201,123,73,0.18);
  background: linear-gradient(135deg, #fff9f2 0%, #fef0e0 100%);
}
.hg-drawer-logo img {
  height: 64px;
  width: auto;
  object-fit: contain;
  filter: drop-shadow(0 2px 8px rgba(90,52,34,0.14));
}
.hg-drawer-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: rgba(201,123,73,0.1);
  border: 1.5px solid rgba(201,123,73,0.25);
  border-radius: 50%;
  cursor: pointer;
  color: var(--bakery-cocoa);
  font-size: 18px;
  line-height: 1;
  transition: background 0.2s;
  outline: none;
}
.hg-drawer-close:hover {
  background: rgba(201,123,73,0.22);
}

/* Nav linkleri */
.hg-drawer-nav {
  display: flex;
  flex-direction: column;
  padding: 12px 0;
  flex: 1;
}
.hg-drawer-nav a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 24px;
  font-size: 15px;
  font-weight: 600;
  color: var(--bakery-cocoa) !important;
  text-decoration: none;
  border-bottom: 1px solid rgba(201,123,73,0.1);
  letter-spacing: 0.2px;
  transition: background 0.18s, color 0.18s, padding-left 0.18s;
}
.hg-drawer-nav a:last-child {
  border-bottom: none;
}
.hg-drawer-nav a:hover,
.hg-drawer-nav a:focus {
  background: linear-gradient(90deg, rgba(201,123,73,0.1), transparent);
  color: var(--bakery-caramel) !important;
  padding-left: 32px;
}
.hg-drawer-nav a .hg-nav-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(201,123,73,0.1);
  border-radius: 8px;
  font-size: 14px;
  color: var(--bakery-caramel);
  flex-shrink: 0;
  transition: background 0.18s;
}
.hg-drawer-nav a:hover .hg-nav-icon {
  background: rgba(201,123,73,0.2);
}

/* Kurumsal alt menü */
.hg-drawer-submenu-wrap {
  border-bottom: 1px solid rgba(201,123,73,0.1);
}
.hg-drawer-submenu-toggle {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 24px;
  font-size: 15px;
  font-weight: 600;
  color: var(--bakery-cocoa);
  background: none;
  border: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
  letter-spacing: 0.2px;
  transition: background 0.18s, color 0.18s, padding-left 0.18s;
}
.hg-drawer-submenu-toggle:hover,
.hg-drawer-submenu-toggle:focus {
  background: linear-gradient(90deg, rgba(201,123,73,0.1), transparent);
  color: var(--bakery-caramel);
  padding-left: 32px;
}
.hg-drawer-submenu-toggle .hg-nav-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(201,123,73,0.1);
  border-radius: 8px;
  font-size: 14px;
  color: var(--bakery-caramel);
  flex-shrink: 0;
  transition: background 0.18s;
}
.hg-drawer-submenu-toggle:hover .hg-nav-icon {
  background: rgba(201,123,73,0.2);
}
.hg-chevron {
  margin-left: auto;
  font-size: 12px;
  transition: transform 0.25s;
}
.hg-drawer-submenu-toggle.is-open .hg-chevron {
  transform: rotate(180deg);
}
.hg-drawer-submenu {
  background: rgba(201,123,73,0.05);
}
.hg-drawer-submenu a {
  padding-left: 36px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  border-bottom: 1px solid rgba(201,123,73,0.07) !important;
}
.hg-drawer-submenu a:last-child {
  border-bottom: none !important;
}
.hg-drawer-nav .hg-drawer-submenu-wrap:last-of-type {
  border-bottom: none;
}

/* Alt CTA alanı */
.hg-drawer-footer {
  padding: 20px 24px 28px;
  border-top: 1px solid rgba(201,123,73,0.18);
  background: linear-gradient(135deg, #fff9f2 0%, #fef0e0 100%);
}
.hg-drawer-footer .hg-cta-btn {
  display: block;
  width: 100%;
  text-align: center;
  padding: 14px 20px;
  background: linear-gradient(135deg, var(--bakery-caramel), var(--bakery-honey));
  color: #fff !important;
  font-size: 15px;
  font-weight: 700;
  border-radius: 12px;
  text-decoration: none;
  letter-spacing: 0.4px;
  box-shadow: 0 6px 20px rgba(201,123,73,0.32);
  transition: transform 0.2s, box-shadow 0.2s;
}
.hg-drawer-footer .hg-cta-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(201,123,73,0.42);
}

/* Body scroll kilidi */
body.hg-nav-open {
  overflow: hidden;
}

::selection {
  background: rgba(184, 86, 107, 0.22);
  color: var(--bakery-cocoa-deep);
}
