/* The imported page switches to its desktop copy only above 1400px. Between 768px and 1400px the mobile copy shows; the source site's hero is 768px tall from 768px up, so match that here. Remove this block to go back to the imported behavior. */
@media (min-width: 768px) {
  .data-liberation-mobile-document .wp-block-cover { min-height: 768px !important; }
}

/* Hero text column width steps with the window, as on the source site. */
@media (min-width: 768px) { .hero-text-column > * { max-width: 720px !important; } }
@media (min-width: 992px) { .hero-text-column > * { max-width: 629px !important; } }
@media (min-width: 1200px) { .hero-text-column > * { max-width: 768px !important; } }
@media (min-width: 1400px) { .hero-text-column > * { max-width: 901px !important; } }
@media (min-width: 768px) { .hero-text-column h1 { font-size: 52px !important; } }

/* Hero and banner backgrounds as on the source site: a blurred, enlarged copy fills the full width behind a sharper copy that is at most 1400px wide and centered. The white overlay sits on top of both. */
.hero-cover::before, .banner-cover::before { content: ''; position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center; filter: blur(10px); transform: scale(1.15); }
.hero-cover--desktop::before { background-image: url('https://bethstuqui.com/wp-content/uploads/2026/10/hero-desktop-photo-1586536672467-686dd4fabacb.avif'); }
.hero-cover--mobile::before { background-image: url('https://bethstuqui.com/wp-content/uploads/2026/10/hero-mobile-photo-1586536672467-686dd4fabacb-2.avif'); }
.hero-cover > img.wp-block-cover__image-background, .banner-cover > img.wp-block-cover__image-background { left: 50% !important; width: min(100%, 1400px) !important; transform: translateX(-50%) scale(1.05); object-fit: cover; }

/* Header menu links are black on the source site; the imported rule makes every header link blue. */
.f1ismt9b .wp-block-navigation .wp-block-navigation-item__content { color: #000; }

/* Phone menu as on the source site: a white dropdown under the header (not full screen), left-aligned items, thin dividers around the Instagram icon, full-width Contact Us button, and the close icon in the header's top-right corner. */
@media (max-width: 599px) {
  header#Header, header#Header--dla-mobile { position: relative; }
  header#Header .wp-block-navigation, header#Header--dla-mobile .wp-block-navigation { position: static; }
  .wp-block-navigation__responsive-container.is-menu-open { position: absolute; width: auto; top: 72px; right: 0; bottom: auto; left: 0; height: auto; padding: 0; background: #fff; box-shadow: 0 2px 5px rgba(0,0,0,.2), 0 0 1px rgba(0,0,0,.2); overflow: visible; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog { margin: 0; padding: 0 !important; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding: 24px !important; align-items: stretch; gap: 12px; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: flex-start; gap: 12px; margin-bottom: 13px; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:has(> .wp-block-social-links) { width: 100%; margin-top: 13px; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-social-links { width: 100% !important; box-sizing: border-box; margin: 0; padding: 23px 0; border-top: 1px solid rgba(0,0,0,.25); border-bottom: 1px solid rgba(0,0,0,.25); justify-content: flex-start; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-buttons, .wp-block-navigation__responsive-container.is-menu-open .wp-block-button, .wp-block-navigation__responsive-container.is-menu-open .wp-block-button__link { width: 100%; text-align: center; }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close { top: -48px; right: 22px; }
  html.has-modal-open .wp-block-navigation__responsive-container-open { visibility: hidden; }
}

/* Keep the header menu items (links, icon, button) on one centered line. */
.f1ismt9b .wp-block-navigation__container { align-items: center; margin-bottom: 0; }

/* "Enriqueça" banner image strip: light-blue base, same blurred-plus-sharp background as the hero, 320px tall from 768px wide up (160px below that). */
.banner-cover { background-color: #edf2f8; }
.banner-cover--desktop::before { background-image: url('https://bethstuqui.com/wp-content/uploads/2026/10/banner-desktop-photo-1752649935248-04842b1d0f26.avif'); }
.banner-cover--mobile::before { background-image: url('https://bethstuqui.com/wp-content/uploads/2026/10/banner-mobile-photo-1752649935248-04842b1d0f26-2.avif'); }
@media (min-width: 768px) { .data-liberation-mobile-document .banner-cover { min-height: 320px !important; } }

/* Contact form as on the source site: labels move inside the fields (the placeholders carry the text; the labels stay in the page for screen readers), fields are 56px tall with a light 4px-rounded border, the message box is 100px tall, and the submit button is 40px tall, 20px below the message box. */
.wp-block-jetpack-contact-form.wp-block-jetpack-contact-form { gap: 13px; }
.wp-block-jetpack-contact-form .grunion-field-label { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.wp-block-jetpack-contact-form input.grunion-field, .wp-block-jetpack-contact-form textarea.grunion-field { box-sizing: border-box; border: 1px solid #dee2e6; border-radius: 4px; padding: 13px 9.75px; font-size: 16px; line-height: 20px; }
.wp-block-jetpack-contact-form input.grunion-field { height: 56px; }
.wp-block-jetpack-contact-form textarea.grunion-field { height: 100px; min-height: 100px; }
.wp-block-jetpack-contact-form .wp-block-button { min-height: 0 !important; margin-top: 6.5px; }
.wp-block-jetpack-contact-form .wp-block-button__link { min-height: 0 !important; }

/* Gallery slideshow sized like the source: a 4:3 box with 24px rounded corners, centered, using the same width steps as the hero text column (full width on phones). The counter sits below the box; the arrows and pause button sit inside it. */
.wp-block-jetpack-slideshow { --gallery-w: 100%; width: 100%; max-width: none; margin-bottom: 0; }
@media (min-width: 768px) { .wp-block-jetpack-slideshow { --gallery-w: 720px; } }
@media (min-width: 992px) { .wp-block-jetpack-slideshow { --gallery-w: 629px; } }
@media (min-width: 1200px) { .wp-block-jetpack-slideshow { --gallery-w: 768px; } }
@media (min-width: 1400px) { .wp-block-jetpack-slideshow { --gallery-w: 901px; } }
.wp-block-jetpack-slideshow .wp-block-jetpack-slideshow_container { max-width: var(--gallery-w); margin-inline: auto; overflow: visible; clip-path: inset(0 0 -80px 0); }
.wp-block-jetpack-slideshow .wp-block-jetpack-slideshow_swiper-wrapper { height: auto !important; max-height: none !important; }
.wp-block-jetpack-slideshow .swiper-slide { height: auto; aspect-ratio: 4 / 3; }
.wp-block-jetpack-slideshow .swiper-slide figure { height: 100%; margin: 0; }
.wp-block-jetpack-slideshow .wp-block-jetpack-slideshow_image { width: 100%; height: 100%; object-fit: cover; border-radius: 24px; }
.wp-block-jetpack-slideshow .swiper-button-prev { left: calc(50% - var(--gallery-w) / 2 + 12px); }
.wp-block-jetpack-slideshow .swiper-button-next { right: calc(50% - var(--gallery-w) / 2 + 12px); }
.wp-block-jetpack-slideshow .wp-block-jetpack-slideshow_button-pause { right: calc(50% - var(--gallery-w) / 2 + 12px); }
.wp-block-jetpack-slideshow .swiper-pagination { margin-top: 39px; }

/* Phone hero as on the source site: 32px of space between the heading and the text. */
@media (max-width: 767px) { .hero-text-column h1 { margin-bottom: 32px !important; } }

/* Phone footer: 32px of bottom padding as on the source site (64px on larger screens). */
@media (max-width: 767px) { footer > .wp-block-group[style*="padding-bottom:64px"] { padding-bottom: 32px !important; } }

/* Form placeholders (the labels shown inside the fields) use the source site's gray. */
.wp-block-jetpack-contact-form input.grunion-field::placeholder, .wp-block-jetpack-contact-form textarea.grunion-field::placeholder { color: #686f77; opacity: 1; }

/* Block editor only: the theme's editor rule for the three-column row also matches everything inside each column, squeezing the circle and text to a third of the column. Reset those items to the full column width with no extra padding or top margin. */
:root .editor-styles-wrapper .row-cols-lg-3 .f84fk8t > .block-editor-block-list__layout > * { width: 100%; max-width: 100%; flex: 0 0 auto; padding-left: 0; padding-right: 0; margin-top: 0; }
