/* ==========================================================================
   BUFFET FINESSE - CABEÇALHO E MENU UNIFICADOS (PADRÃO HOME)
   ========================================================================== */

/* 1. Header Global - PADRÃO OPACO PARA PÁGINAS COM BANNER DIVIDIDO OU SEM BANNER
   Quando o banner possui foto dividida (split) ou não tem banner, o menu não precisa
   ser translúcido: ele é opaco (#12171d), no fluxo natural (relative), com borda sutil. */
header.main-header,
header.wedding-header {
  position: relative !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 1000 !important;
  background: #12171d !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

header.main-header .header-sticky {
  position: relative !important;
  top: 0 !important;
  background: #12171d !important;
  transition: all 0.3s ease-in-out !important;
}

/* Exceção: Banner Contínuo / Foto de Fundo Inteira (Home Page)
   Na Home, a foto de fundo cobre 100% da tela sob o cabeçalho.
   Nesse caso (e em páginas com classe .header-transparent), o menu fica translúcido/transparente. */
body.finesse-home header.main-header,
body.finesse-home header.wedding-header,
body.header-transparent header.main-header,
body.header-transparent header.wedding-header {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  background: transparent !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

body.finesse-home header.main-header .header-sticky,
body.header-transparent header.main-header .header-sticky {
  background: transparent !important;
}

/* 2. Header Fixo ao Rolar a Página (Sticky em todas as páginas) */
header.main-header .header-sticky.is-sticky,
header.main-header .header-sticky.active {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  background: rgba(18, 23, 29, 0.96) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
  z-index: 1000 !important;
}

/* 3. Dropdown Menu Desktop - Dourado / Caramelo idêntico à Home */
@media (min-width: 1200px) {
  .wedding-header .main-menu {
    display: flex !important;
  }
  .wedding-header .main-menu .nav-menu-wrapper {
    margin: 0 8px;
  }
  .wedding-header .main-menu .nav-menu-wrapper > ul {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
  }
  .wedding-header .main-menu ul li {
    margin: 0 3px;
    position: relative;
  }
  .wedding-header .main-menu ul li a {
    padding: 12px 7px !important;
    font-size: 15px !important;
    white-space: nowrap !important;
    color: #fff7ed !important;
    font-weight: 600;
    transition: all 0.25s ease-in-out;
  }
  .wedding-header .main-menu ul li a:hover,
  .wedding-header .main-menu ul li a:focus {
    color: var(--accent-color, #c59864) !important;
  }
  .wedding-header .main-menu ul li.submenu > a::after {
    content: '\f107';
    font-family: 'Font Awesome 7 Free', 'Font Awesome 5 Free', 'FontAwesome', sans-serif;
    font-weight: 900;
    font-size: 13px;
    margin-left: 6px;
  }
  .wedding-header .header-btn .btn-default {
    font-size: 14px;
    padding-right: 58px;
    padding-left: 17px;
    white-space: nowrap;
  }
  .wedding-header .navbar-toggle,
  .wedding-header .wedding-menu-toggle {
    display: none !important;
  }

  /* O dropdown dourado da Home */
  .wedding-header .main-menu ul ul {
    visibility: hidden !important;
    opacity: 0 !important;
    transform: scale(1, 0.8) !important;
    transform-origin: top !important;
    padding: 8px 0 !important;
    margin: 0 !important;
    list-style: none !important;
    width: 240px !important;
    border-radius: 20px !important;
    position: absolute !important;
    left: 0 !important;
    top: 100% !important;
    background: var(--accent-color, #c59864) !important;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35) !important;
    transition: all 0.3s ease-in-out !important;
    text-align: left !important;
    z-index: 1100 !important;
  }
  .wedding-header .main-menu ul li:hover > ul {
    visibility: visible !important;
    opacity: 1 !important;
    transform: scale(1, 1) !important;
  }
  .wedding-header .main-menu ul ul li {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }
  .wedding-header .main-menu ul ul li a {
    display: block !important;
    color: #ffffff !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    padding: 8px 20px !important;
    line-height: 1.35 !important;
    transition: all 0.2s ease-in-out !important;
  }
  .wedding-header .main-menu ul ul li a:hover,
  .wedding-header .main-menu ul ul li a:focus {
    color: var(--primary-color, #191e24) !important;
    background: transparent !important;
    padding-left: 24px !important;
  }
}

/* 4. Menu Mobile (telas até 1199px) */
@media (max-width: 1199px) {
  .wedding-header .navbar > .container {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .wedding-header .navbar-brand {
    z-index: 100000 !important;
  }
  .wedding-header .navbar-brand img {
    width: 135px !important;
    max-width: 135px !important;
    height: auto !important;
  }
  .wedding-header .navbar-toggle {
    display: flex !important;
    align-items: center !important;
    margin-left: auto !important;
    z-index: 100000 !important;
  }
  .wedding-header .wedding-menu-toggle {
    display: flex !important;
    width: 44px !important;
    height: 44px !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    border: 1px solid rgba(212, 168, 111, 0.65) !important;
    border-radius: 8px !important;
    background: rgba(18, 23, 29, 0.85) !important;
    cursor: pointer !important;
    padding: 0 !important;
  }
  .wedding-header .wedding-menu-toggle span {
    display: block !important;
    width: 22px !important;
    height: 2px !important;
    border-radius: 2px !important;
    background: #f8f6f1 !important;
    transition: transform 0.25s ease, opacity 0.25s ease !important;
  }
  .wedding-header .wedding-menu-toggle.is-open span:nth-child(2) {
    opacity: 0 !important;
  }
  .wedding-header .wedding-menu-toggle.is-open span:first-child {
    transform: translateY(7px) rotate(45deg) !important;
  }
  .wedding-header .wedding-menu-toggle.is-open span:last-child {
    transform: translateY(-7px) rotate(-45deg) !important;
  }
  .wedding-header .main-menu {
    position: fixed !important;
    top: 76px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    display: none !important;
    max-height: none !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 20px 20px 40px !important;
    background: #12171d !important;
    border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
    z-index: 99999 !important;
  }
  .wedding-header .main-menu.is-open {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .wedding-header .main-menu .nav-menu-wrapper {
    width: 100% !important;
    margin: 0 !important;
    text-align: left !important;
  }
  .wedding-header .main-menu .nav-menu-wrapper > ul {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
  }
  .wedding-header .main-menu ul li {
    margin: 0 !important;
    width: 100% !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  }
  .wedding-header .main-menu ul li a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 13px 8px !important;
    white-space: normal !important;
    font-size: 16px !important;
    color: #ffffff !important;
  }
  .wedding-header .main-menu ul li.submenu > a::after {
    content: '\f107';
    font-family: 'Font Awesome 7 Free', 'Font Awesome 5 Free', 'FontAwesome', sans-serif;
    font-size: 13px;
    margin-left: 6px;
    color: var(--accent-color, #c59864);
  }
  .wedding-header .main-menu ul ul {
    position: static !important;
    display: block !important;
    width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    padding: 0 0 8px 16px !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    list-style: none !important;
  }
  .wedding-header .main-menu ul ul li {
    border-bottom: none !important;
  }
  .wedding-header .main-menu ul ul li a {
    padding: 8px 10px !important;
    font-size: 14.5px !important;
    color: #ddd5cc !important;
  }
  .wedding-header .main-menu .header-btn {
    display: block !important;
    margin: 20px 8px 0 !important;
    width: 100% !important;
  }
  .wedding-header .main-menu .header-btn .btn-default {
    display: flex !important;
    width: 100% !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    white-space: normal !important;
  }
}

/* 5. Espaçamento do Topo para páginas editoriais
   Com o header opaco no fluxo natural (relative), o grid do hero começa diretamente abaixo,
   usando o espaçamento planejado pelo design original (52px desktop / 28px mobile). */
.editorial-page .fe-hero-grid,
.editorial-rebuilt .fe-hero-grid {
  padding-top: 52px !important;
}
@media (max-width: 640px) {
  .editorial-page .fe-hero-grid,
  .editorial-rebuilt .fe-hero-grid {
    padding-top: 28px !important;
  }
}

body.header-transparent .fe-hero-grid {
  padding-top: 130px !important;
}
@media (max-width: 640px) {
  body.header-transparent .fe-hero-grid {
    padding-top: 85px !important;
  }
}

/* 6. Exceção para páginas sem hero (como política de privacidade) */
body.privacy-page header.main-header,
body.privacy-page .header-sticky {
  position: relative !important;
  background: #12171d !important;
}

/* 7. Rodapé */
@media (max-width: 767px) {
  .wedding-footer .footer-useful-heading,
  .wedding-footer .wedding-footer-links {
    display: block !important;
  }
  .wedding-footer .wedding-footer-links {
    margin-bottom: 24px;
  }
}