/* Caravelas — mobile responsive layer. Loaded once via SiteHeader helmet. */

/* Global scrollbar — gold thumb on all pages */
html { scrollbar-width: thin; scrollbar-color: #C8872A #F1EFE8; }
html::-webkit-scrollbar { width: 10px; height: 10px; }
html::-webkit-scrollbar-track { background: #F1EFE8; }
html::-webkit-scrollbar-thumb { background: #C8872A; border-radius: 10px; border: 2px solid #F1EFE8; background-clip: padding-box; }
html::-webkit-scrollbar-thumb:hover { background: #A66F1F; background-clip: padding-box; border: 2px solid #F1EFE8; }

.nowrap-desk { white-space: nowrap; }
@media (max-width: 1024px) {
  br.br-desk { display: none; }
  .nowrap-desk { white-space: normal !important; }
  /* All sections lose the wide horizontal padding on tablet+ */
  section[style*="padding: 100px 48px"],
  section[style*="padding: 120px 48px"],
  section[style*="padding: 80px 48px"],
  section[style*="padding: 88px 48px"],
  section[style*="padding: 96px 48px"],
  section[style*="padding: 72px 48px"],
  section[style*="padding: 60px 48px"],
  section[style*="padding: 56px 48px"],
  section[style*="padding: 40px 48px"],
  section[style*="padding: 20px 48px"],
  section[style*="padding: 24px 48px"],
  section[style*="padding: 26px 48px"],
  section[style*="padding: 32px 48px"],
  section[style*="padding: 48px"] {
    padding-left: 28px !important;
    padding-right: 28px !important;
  }
}

@media (max-width: 900px) {
  /* Section vertical rhythm */
  section[style*="padding: 100px 48px"],
  section[style*="padding: 120px 48px"] { padding-top: 64px !important; padding-bottom: 64px !important; padding-left: 20px !important; padding-right: 20px !important; }
  section[style*="padding: 80px 48px"],
  section[style*="padding: 88px 48px"],
  section[style*="padding: 96px 48px"],
  section[style*="padding: 72px 48px"] { padding-top: 52px !important; padding-bottom: 52px !important; padding-left: 20px !important; padding-right: 20px !important; }
  section[style*="padding: 56px 48px"],
  section[style*="padding: 40px 48px"],
  section[style*="padding: 60px 48px"] { padding-top: 36px !important; padding-bottom: 36px !important; padding-left: 20px !important; padding-right: 20px !important; }
  section[style*="padding: 20px 48px"],
  section[style*="padding: 24px 48px"],
  section[style*="padding: 26px 48px"],
  section[style*="padding: 32px 48px"] { padding-left: 20px !important; padding-right: 20px !important; }
  header[style*="padding: 20px 48px"] { padding-left: 20px !important; padding-right: 20px !important; }

  /* Header: single row (logo + hamburger); center wrapper padding tight */
  .cae-header > div { padding-left: 20px !important; padding-right: 20px !important; }
  .cae-header .cae-logo img { height: 62px !important; }
  .cae-header-cta { display: none !important; }

  /* Every 2-col intro grid becomes stacked with image ON TOP */
  div[style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
    display: flex !important;
    flex-direction: column-reverse !important;
    align-items: stretch !important;
  }
  div[style*="grid-template-columns: 1fr 1fr"] > * { min-width: 0 !important; max-width: 100% !important; }
  /* Preserve normal order for grids where image is NOT the second child (rare). */

  /* Every N-column grid becomes single column */
  div[style*="grid-template-columns: repeat(3, 1fr)"],
  div[style*="grid-template-columns: repeat(4, 1fr)"],
  div[style*="grid-template-columns: repeat(6, 1fr)"],
  div[style*="grid-template-columns: 1.4fr 1fr 1fr 1fr 1.2fr"],
  div[style*="grid-template-columns: 1fr 1.4fr 1.4fr"],
  div[style*="grid-template-columns: 1fr 1.4fr"],
  div[style*="grid-template-columns: 1fr 340px"],
  div[style*="grid-template-columns: 1.35fr 1fr"],
  div[style*="grid-template-columns: 1.6fr 1fr 1fr"],
  div[style*="grid-template-columns: 1.1fr 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  /* Sticky sidebars stop being sticky */
  aside[style*="position: sticky"] { position: static !important; }

  /* Buttons: keep one-line labels; reduce letter-spacing and padding when tight */
  .btn, .cae-btn {
    letter-spacing: .14em !important;
    padding: 13px 22px !important;
    font-size: 11.5px !important;
    white-space: normal !important;
    text-align: center;
    line-height: 1.35;
    max-width: 100% !important;
  }

  /* Hero H1 sizes */
  .h1-serif { font-size: clamp(30px, 8vw, 40px) !important; }
  .h2-serif { font-size: clamp(26px, 7vw, 34px) !important; }

  /* Hero left gold bar remains compact */
  section[style*="background: var(--green-1)"] div[style*="width: 2px"] + p,
  section[style*="background: var(--green-1)"] p { font-size: 16px !important; }

  /* Footer stack */
  footer > div > div[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
  footer > div > div[style*="justify-content: space-between"] {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 12px;
    text-align: left !important;
  }

  /* Newsletter form wraps */
  footer form[style*="display: flex"] { flex-direction: column !important; align-items: stretch !important; }
  footer form input, footer form button { width: 100% !important; }

  /* Blog and category grid also single-col */
  section [style*="grid-template-columns: 1fr 1.4fr 1.4fr"] { grid-template-columns: 1fr !important; }
  .cat-strip { padding-left: 20px !important; padding-right: 20px !important; }

  /* Testimonials: horizontal scroll-snap carousel */
  section[style*="background: var(--green-1)"] > div > div[style*="grid-template-columns: repeat(3, 1fr)"],
  .cae-depoimentos {
    display: flex !important;
    grid-template-columns: none !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    gap: 14px !important;
    padding-bottom: 10px !important;
    scrollbar-width: none;
  }
  section[style*="background: var(--green-1)"] > div > div[style*="grid-template-columns: repeat(3, 1fr)"]::-webkit-scrollbar,
  .cae-depoimentos::-webkit-scrollbar {
    display: none;
  }
  section[style*="background: var(--green-1)"] > div > div[style*="grid-template-columns: repeat(3, 1fr)"] > blockquote,
  .cae-depoimentos > * {
    flex: 0 0 88% !important;
    scroll-snap-align: start !important;
  }

  /* Cards (padding tighter, spacing reset) */
  div[style*="border-radius: 10px"][style*="padding: 44px"] { padding: 28px !important; }
  div[style*="padding: 40px"] { padding: 24px !important; }
  div[style*="padding: 56px"] { padding: 28px !important; }

  /* Historias reais grid keeps masonry via CSS columns */
  .grid { column-count: 1 !important; }

  /* Blog Categoria strip stays scroll */
  .cat-strip { gap: 16px !important; }

  /* Numbered stats etc. */
  div[style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: 1fr 1fr !important; }

  /* Fix the mobile mega menu inner padding */
  .cae-mega { padding: 6px 4px 12px !important; }
  .cae-mega-banner { padding: 20px !important; }
}


@media (min-width: 901px) {
  /* Depoimentos: mostrar apenas 3 no desktop; no mobile o carrossel exibe todos */
  section[style*="background: var(--green-1)"] > div > div[style*="grid-template-columns: repeat(3, 1fr)"] > blockquote:nth-child(n+4) { display: none; }
}


@media (max-width: 900px) {
  /* Contato: mapa section — reordena para kicker+h2, texto, mapa */
  .contato-mapa-head.contato-mapa-head { display: flex !important; flex-direction: column !important; grid-template-columns: none !important; gap: 20px !important; align-items: stretch !important; }
  .contato-mapa-head .contato-mapa-title { order: 1 !important; text-align: center; }
  .contato-mapa-head .contato-mapa-body { order: 2 !important; text-align: center; }
  .contato-form-card.contato-form-card { padding: 24px !important; }
}
::selection { background-color: #C8872A; color: #FFFFFF; }
::-moz-selection { background-color: #C8872A; color: #FFFFFF; }

.btn, .cae-btn, button {
  transition: transform .2s ease, background .2s ease, color .2s ease, box-shadow .2s ease;
}
.btn:hover, .cae-btn:hover, a.btn:hover, a.cae-btn:hover, button:hover {
  transform: scale(.965);
}
.btn:active, .cae-btn:active, button:active { transform: scale(.94); }

@media (max-width: 900px) {
  .placeholder { width: 100% !important; max-width: 100% !important; margin: 0 !important; aspect-ratio: 16/10 !important; }
  img { max-width: 100%; height: auto; }
  section img[src*="hero-"], section img[src*="post-"], section img[src*="assets/"] { width: 100% !important; }
}

@media (max-width: 900px) {
  /* Intro section text centralizado no mobile */
  div[style*="grid-template-columns: 1fr 1fr"] > div { text-align: center; }
  div[style*="grid-template-columns: 1fr 1fr"] > div > a.btn,
  div[style*="grid-template-columns: 1fr 1fr"] > div > div[style*="margin-top"],
  div[style*="grid-template-columns: 1fr 1fr"] > div > div[style*="flex-wrap: wrap"] { justify-content: center; display: flex; }
}

@media (max-width: 900px) {
  /* Cat-strip: colapsa em burger no mobile */
  .cat-strip.cat-strip-mobile { flex-direction: column !important; align-items: stretch !important; gap: 0 !important; padding: 0 !important; overflow: visible !important; }
  .cat-strip-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; }
  .cat-strip-head .kicker { flex: 1; }
  .cat-strip-toggle { width: 40px; height: 40px; background: transparent; border: 0; cursor: pointer; padding: 0; display: grid; place-items: center; gap: 4px; grid-template-rows: repeat(3, 2px); }
  .cat-strip-toggle span { display: block; width: 22px; height: 2px; background: var(--gold); border-radius: 2px; transition: transform .2s ease, opacity .2s ease; }
  .cat-strip.is-open .cat-strip-toggle span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .cat-strip.is-open .cat-strip-toggle span:nth-child(2) { opacity: 0; }
  .cat-strip.is-open .cat-strip-toggle span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
  .cat-strip .cat-strip-panel { display: none !important; flex-direction: column !important; align-items: stretch !important; gap: 0 !important; background: var(--cream); border-top: 1px solid var(--border); }
  .cat-strip.is-open .cat-strip-panel { display: flex !important; }
  .cat-strip .cat-strip-panel .cat-nav { display: block; width: 100%; text-align: left; padding: 18px 24px !important; border-bottom: 1px solid var(--border); font-size: 15px !important; }
  .cat-strip .cat-strip-panel .cat-nav.active { background: var(--gold); color: #FFF !important; font-weight: 600; }
  .cat-strip .cat-strip-panel .cat-nav.active::after { display: none; }
  .cat-strip .cat-strip-panel .cat-nav:hover { color: var(--gold); }
  .cat-strip .cat-strip-panel .cat-nav.active:hover { color: #FFF !important; }
}


/* ==== v6 mobile refinements: overlap→below, section rhythm, image widths ==== */
@media (max-width: 900px) {
  /* Experience pages: destaque com aspas que overlappa a foto no desktop → embaixo da foto no mobile */
  div[style*="position: relative"][style*="padding-bottom: 60px"] { padding-bottom: 0 !important; }
  div[style*="position: relative"][style*="padding-bottom: 60px"] > div[style*="position: absolute"] {
    position: static !important;
    left: 0 !important; right: 0 !important; bottom: 0 !important; top: auto !important;
    margin-top: 20px !important;
    border-radius: 12px !important;
    padding: 22px 24px !important;
    max-width: 100% !important;
    width: auto !important;
    box-shadow: 0 12px 30px -12px rgba(200,135,42,.35) !important;
  }

  /* Padroniza padding vertical das sections (horizontal já definido antes) */
  section[style*="padding: 100px 48px"],
  section[style*="padding: 120px 48px"] { padding-top: 60px !important; padding-bottom: 60px !important; }
  section[style*="padding: 80px 48px"],
  section[style*="padding: 88px 48px"],
  section[style*="padding: 96px 48px"] { padding-top: 48px !important; padding-bottom: 48px !important; }

  /* Placeholders e imagens ocupam a largura total do conteúdo */
  .placeholder, section img:not([style*="filter"]), section iframe, .card-hover .img, .event-card .img {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* Grids restantes que não colapsavam */
  div[style*="grid-template-columns: 1fr 1.05fr"],
  div[style*="grid-template-columns: 1fr 1.1fr"],
  div[style*="grid-template-columns: 1fr 1.2fr"],
  div[style*="grid-template-columns: 1.05fr 1fr"],
  div[style*="grid-template-columns: 1.1fr 1.05fr"] {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  /* CTA final dourado: título e botões centralizados */
  section[style*="background: linear-gradient(180deg, var(--gold)"] > div,
  section[style*="linear-gradient(180deg, var(--gold)"] > div { text-align: center !important; }

  /* Grids de eventos internos (event-card grid-3) */
  .grid-3, .grid-4 { grid-template-columns: 1fr !important; }

  /* Eventos: CELEBRE DO SEU JEITO — foto em cima no mobile */
  .grid-hero.grid-hero { display: flex !important; flex-direction: column !important; }
  .grid-hero.grid-hero > img { order: -1; }

  /* Eventos: CELEBRE DO SEU JEITO — texto e botão centralizados */
  .celebre-jeito.celebre-jeito > div { text-align: center; }
  .celebre-jeito.celebre-jeito > div > div[style*="flex-direction: column"] { align-items: center; }

  /* Eventos: citação — ícone em cima, texto centralizado */
  .quote-row.quote-row { flex-direction: column !important; align-items: center !important; text-align: center !important; }
  .quote-icon.quote-icon { margin: 0 auto; }

  /* Eventos: mapa mais largo */
  div[style*="aspect-ratio: 4/3; border-radius: 10px; overflow: hidden; background: #FFF;"] { margin-left: -8px; margin-right: -8px; width: calc(100% + 16px); }
}


@media (max-width: 900px) {
  .cae-cerimonial-inc { grid-template-columns: 1fr !important; text-align: center !important; padding: 28px 22px !important; gap: 18px !important; }
  .cae-cerimonial-inc > div:first-child { margin: 0 auto !important; width: 72px !important; height: 72px !important; }
}

@media (max-width: 900px) {
  .cae-history-sticky.cae-history-sticky { position: static !important; top: auto !important; }
}


/* ==== v7 QA mobile: overflow horizontal ==== */
@media (max-width: 900px) {
  html, body { overflow-x: clip; }
  div[style*="grid-template-columns: 1fr 1fr"] { align-items: stretch !important; }
  div[style*="display: grid"] > *, div[style*="grid-template-columns"] > * { min-width: 0; }
  div[style*="grid-template-columns: repeat(2, 1fr)"] { grid-template-columns: 1fr !important; gap: 16px !important; }
  .cat-arrow { display: none !important; }
  .cat-strip { min-width: 0; }
  .btn, .cae-btn { white-space: normal !important; text-align: center; line-height: 1.35; }
}

@media (max-width: 900px) {
  .buf-arrow[style*="left: -22px"] { left: 6px !important; }
  .buf-arrow[style*="right: -22px"] { right: 6px !important; }
  div[style*="position: absolute; left: -24px; bottom: 32px"] { position: static !important; max-width: 100% !important; margin-top: 16px; text-align: center; }
}

@media (max-width: 900px) {
  footer a:not(.btn):not(.cae-btn) { display: inline-block; padding-top: 6px; padding-bottom: 6px; }
}