/* restore extras — generated by restore_04_polish.py */

/* Consent overlays: the restore ships no analytics or third-party tracking at all, so there
   is nothing to consent to. Their scripts are gone too, meaning the banner can never be
   dismissed and would cover the top of every page. Removing the markup is unreliable when a
   JS bundle re-renders it, so it is hidden here as well. */
.cookies-banner, .cookies-banner-content, .cookie-banner, .cookie-consent, .cookie-notice,
.cc-window, .cc-banner, #cookie-law-info-bar, #cookieChoiceInfo, .gdpr-banner,
#tarteaucitronRoot, .consent-overlay, .cookiebar {
  display: none !important;
}
body.cookie-banner-open, body.has-cookie-banner, html.cookies-open {
  overflow: auto !important;
}

/* Dead account/login modals left by the CMS (no backend on a static host) */
.modal-login, #loginModal, .login-modal { display: none !important; }

/* Carousel slots the platform's JS bundles would have filled at runtime: without a working
   bundle they stay as <img> elements with no src and render as broken-image icons. Nothing is
   lost by hiding them — they never had content in the restore. */
img:not([src]), img[src=""], img[src="#"] { display: none !important; }

/* The client's backlink block must read as the page's own copy. Where a theme only colours
   links inside specific containers, the anchor would otherwise look like plain text — inherit
   the surrounding colour but keep an underline so it is still visibly a link. */
.content-wraparea a { color: inherit; text-decoration: underline; }

/* A few px of horizontal overflow on phones (an absolutely-positioned login list, a wide footer
   logo) makes the whole page pannable sideways, which reads as broken.
   NB: use `clip`, never `hidden`, and never on html together with height:100%. `overflow:hidden`
   turns the element into a scroll container: on themes that set html{height:100%} it stops body's
   overflow propagating to the viewport, the window stops scrolling entirely and every
   scroll-driven behaviour (sticky nav, back-to-top, in-page anchors, PageDown/End) dies.
   `clip` suppresses the sideways pan without creating a scroll container. */
body { overflow-x: clip; }
/* ---- end generated block; anything below is preserved across re-runs ---- */
/* ---- terapiaadois.pt (order 6) ---- */

/* 1. WHITE LETTERING ON THE THEME'S OWN #b3b3b3, MEASURED AT 1.71:1.
   options.css sets `#footer{background-color:#b3b3b3}` and the header band to
   rgba(179,179,179,.75), which over the white page composites to about #c6c6c6, and the theme
   paints the menu and the footer links WHITE on top of it. Photographed and measured, not
   inferred: the nav reads as pale grey lettering on pale grey.

   THE TEXT IS DARKENED, NOT THE BAND, and that choice was made twice. Taking the band down to
   #606060 also fixes the contrast (white on it measures 5.2:1) and looked right - but it put a
   large #606060 surface at the top of every 2018-theme page, and qa_legibility's painted-contrast
   probe then scored three readable #565656-on-white paragraphs on /encontro-para-casais/ at 1366px
   as INVISIBLE at 1.35:1, which is exactly #565656 against #606060. Pixel-sampled at the probe's
   own scroll position, the ground under those lines is (255,255,255). Rather than argue with the
   probe or weaken it, the band is left exactly as the site drew it and the lettering is darkened
   to #262626, which measures 6.6:1 on #c6c6c6 and 5.7:1 on #b3b3b3. */
body.wpb-js-composer #header .mega-menu a.menu-link,
body.wpb-js-composer #header .mega-menu .item-title,
body.wpb-js-composer #header .dfd-additional-header-menu a,
body.wpb-js-composer #header .sub-nav a,
body.wpb-js-composer #footer a,
body.wpb-js-composer #footer .dfd-footer-menu ul li a,
body.wpb-js-composer #sub-footer, body.wpb-js-composer #sub-footer a { color: #262626 !important; }

/* 2. THE CONTACT FORM ON THE HOMEPAGE HAD NO STYLESHEET AT ALL.
   wpforms-full.min.css is ok:false in _assets.json, so every field rendered as a raw browser
   widget: 21px tall inputs, a 58x21 "Submit" with a 2px outset border, and labels running into
   the box below. This is the plugin's layout rebuilt as its plain-CSS equivalent, at sizes a
   finger can hit; nothing is added that the form did not have. */
.wpforms-container .wpforms-field { margin: 0 0 18px; }
.wpforms-container .wpforms-field-label { display: block; min-height: 24px; line-height: 24px;
  margin: 0 0 6px; font-weight: 600; }
.wpforms-container .wpforms-field-sublabel { display: block; font-size: .85em; opacity: .75; }
.wpforms-container input[type=text], .wpforms-container input[type=email],
.wpforms-container input[type=tel], .wpforms-container input[type=url],
.wpforms-container select, .wpforms-container textarea {
  box-sizing: border-box; width: 100%; max-width: 32rem; min-height: 44px;
  padding: 10px 12px; font: inherit; font-size: 16px; line-height: 1.4;
  border: 1px solid #b9b7c4; border-radius: 4px; background: #fff; color: inherit; }
.wpforms-container textarea { min-height: 132px; resize: vertical; }
.wpforms-container input:focus, .wpforms-container textarea:focus { outline: 2px solid #606060;
  outline-offset: 1px; }
.wpforms-container .wpforms-submit { display: inline-block; min-height: 44px; padding: 11px 26px;
  font: inherit; font-size: 16px; font-weight: 600; border: 0; border-radius: 4px;
  background: #606060; color: #fff; cursor: pointer; }
.wpforms-container .wpforms-submit:hover { background: #565656; }

/* 3. TAP TARGETS a finger can actually hit.
   Every one below was measured under 24px by qa_legibility at the width named in its comment;
   none is padded past the point where it would collide with its neighbour, which is checked by
   re-running the overflow probe afterwards. */
.wpforms-container .wpforms-field-label { }                      /* 21px -> 24px, rule 2 above */
.woocommerce-breadcrumb { line-height: 2.2; }                    /* "Inicio", "Servicos de Terapia": 20px */
.woocommerce-breadcrumb a { display: inline-block; min-height: 24px; }
.wp-block-navigation-item__content,
.wp-block-navigation-item__label { display: inline-block; min-height: 26px; line-height: 26px; }
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close { min-width: 44px; min-height: 44px; }
.logo-for-panel a, .mobile-logo a, .fixed-header-logo, .custom-logo-link {
  display: inline-block; min-height: 44px; }                     /* logo link: 19px at 768/390 */
.dfd-footer-menu a, .dfd-additional-header-menu a { display: inline-block; min-height: 24px;
  line-height: 24px; }

/* 4. The enquiry line that replaced each product's add-to-cart form. */
.restore-enquire { margin: 1.25rem 0 1.5rem; }
.restore-cardnote { margin: -0.75rem 0 1.25rem; font-size: .95em; opacity: .85; }

/* Two standalone controls the first pass missed: the product's category link, which the block
   theme renders as a bare 20px line, and the footer's LinkedIn icon at 16x16. Both are the only
   thing in their row, so padding them cannot collide with a neighbour. */
.wp-block-post-terms a { display: inline-block; min-height: 24px; line-height: 24px; }
.wp-block-social-link .wp-block-social-link-anchor { display: inline-flex; align-items: center;
  justify-content: center; min-width: 44px; min-height: 44px; }

/* The 2018 theme's accent tan is #b38c73 and options.css hands it to every heading level, to
   blockquotes and to every mailto: link. Measured on white it is 3.04:1, and a 22px <h5> needs
   4.5:1 - the 3:1 large-text allowance starts at 24px. "Morada e Contactos", "Centro de Lisboa
   (perto Loja Cidadao)" and the addresses on the legal page all read as washed out.
   Same hue, taken down to #8C6D5A, which measures 4.72:1. Only TEXT colour is changed: the .highlight
   background, the blockquote rule and the thumbnail borders keep the original tone, so the page's
   colour scheme is not altered - only its legibility. */
/* SCOPED TO THE 2018 THEME ONLY. The first version of this rule had no body selector and
   repainted the 2025 block theme's headings too - they are #0b0620 by design and were never part
   of the defect. `body.wpb-js-composer` is the class WPBakery puts on every Ronneby page and on no
   block-theme page (checked on both: the 2025 pages carry wp-theme-extendable instead). */
body.wpb-js-composer h1, body.wpb-js-composer h2, body.wpb-js-composer h3,
body.wpb-js-composer h4, body.wpb-js-composer h5, body.wpb-js-composer h6,
body.wpb-js-composer blockquote, body.wpb-js-composer blockquote p,
body.wpb-js-composer a[href^="mailto:"],
body.wpb-js-composer .main_site_color, body.wpb-js-composer .secondary_site_color,
body.wpb-js-composer .third_site_color { color: #8C6D5A; }
/* THE FOOTER IS DELIBERATELY NOT IN THAT LIST. Its band is now #606060 and its links are white,
   which measures 5.4:1; darkening the tan there does the opposite of the job. The first version
   included `#footer .dfd-footer-menu ul li` and, once the selector was scoped with `body.` and so
   gained specificity, it beat the theme's own white and repainted all thirteen footer links in
   #8C6D5A on #606060 - 1.33:1, which qa_legibility correctly called INVISIBLE TEXT. Measured, not
   reasoned: the fix for one contrast defect created a worse one two selectors away. */

/* WooCommerce's product grid is a <ul> and its own stylesheet is what removes the markers.
   Without wc-blocks.css (ok:false) every product on a category page renders with a bullet beside
   its title. Same reason the burger drew as a default bordered <button>: nothing had styled it. */
.wc-block-product-template, .wp-block-woocommerce-product-template { list-style: none;
  margin: 0; padding: 0; }
.wc-block-product-template > li, .wc-block-product { list-style: none; }
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close { background: transparent; border: 0;
  padding: 10px; cursor: pointer; color: inherit; }

/* THE "Perguntas Frequentes" BUTTON on /terapia-de-casal/, /terapia-de-adulto/ and
   /encontro-para-casais/. qa_legibility reported its label INVISIBLE at 1:1; that number is wrong
   and the defect is real, which took a measurement to separate. The theme paints the button's fill
   on `.dfd-button-inner-cover::before` (measured: background rgb(195,159,118), opacity 1, width
   209px) from a <style> block an inline jQuery snippet appends at runtime, so the walk up the
   element's ANCESTORS finds nothing but the white page and scores white-on-white. The label is not
   invisible - it is white on #C39F76, which is 2.13:1, and that is still too weak for a control.
   So the fill is taken to #8C6D5A (white on it: 4.72:1, the same tone as the darkened headings)
   AND put on the element as well as its ::before, so the ground a gate can see is the ground the
   visitor sees. */
body.wpb-js-composer .dfd-button-module .dfd-button-link .dfd-button-inner-cover {
  background: #8C6D5A; }
body.wpb-js-composer .dfd-button-module .dfd-button-link .dfd-button-inner-cover:before {
  background: #8C6D5A !important; }

/* THE FIXED HEADER AND scrollIntoView. #header-container on the 2018 theme is position:fixed,
   70px tall, z-index 999, so an in-page anchor can land its target behind the band. The obvious
   cure - scroll-margin-top: 96px - was tried, MEASURED, and removed again: with
   scrollIntoView({block:'center'}) on a page barely taller than the viewport it moves the target
   the wrong way and put a readable #565656-on-white paragraph under the header at 1366px, turning
   a clean page into three INVISIBLE TEXT findings. Left out on purpose; do not re-add it without
   re-running qa_legibility at 1366 on /encontro-para-casais/. */
/* ---- the search results page (o6_ta_rework2.py, defect 2) ---- */
.ta-search-page { padding: 40px 0 60px; }
.ta-search-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  margin: 0 0 28px; }
/* 24px, not the theme's 22: qa_legibility measured this label at 22px and blocked on it at all
   four widths the first time this page was built. */
.ta-search-form label { flex: 1 0 100%; margin: 0 0 4px; font-weight: 600;
  min-height: 26px; line-height: 26px; }
.ta-search-form .search-query { flex: 1 1 260px; box-sizing: border-box; min-height: 44px;
  padding: 10px 12px; font: inherit; font-size: 16px; border: 1px solid #b3b3b3;
  border-radius: 3px; background: #fff; color: #28262b; }
.ta-search-form .btn { min-height: 44px; padding: 11px 26px; font: inherit; font-size: 15px;
  border: 0; border-radius: 3px; background: #28262b; color: #fff; cursor: pointer; }
.ta-search-form .btn:hover { background: #565656; }
.ta-search-count { font-weight: 600; margin: 0 0 18px; }
.ta-search-list { list-style: none; margin: 0; padding: 0; }
.ta-search-list li { margin: 0 0 22px; padding: 0 0 18px; border-bottom: 1px solid #e6e6e6; }
.ta-search-list li a { display: inline-block; min-height: 24px; line-height: 24px;
  font-size: 18px; font-weight: 600; color: #8C6D5A; text-decoration: underline; }
.ta-search-list li p { margin: 4px 0 0; color: #565656; }
.ta-search-hint { color: #565656; }
/* The archive pages' own search widget: it is a working control again, so it gets a size a
   finger can hit rather than the theme's 21px browser default. */
form.form-search .search-query { box-sizing: border-box; min-height: 44px; padding: 8px 12px;
  font-size: 16px; }
form.form-search .btn { min-height: 44px; padding: 10px 22px; }

/* THE WHOLE PAGE IGNORED THE POINTER FOR 200ms AFTER EVERY SCROLL (defect 3's real cause).
   plugins.min.js puts `scrolling` on <body> at the first scroll event and takes it off 200ms after
   the last one:
       s.on("scroll", function(){ ... d.addClass("scrolling"); ...
           a = setTimeout(function(){ d.removeClass("scrolling"); l = !1 }, 200) })
   and app.css answers that with
       body.scrolling * { pointer-events: none !important; }
   a 2014 scroll-paint optimisation. The effect measured here: after a wheel scroll, a scrollTo or
   a scrollIntoView, `document.elementFromPoint` at the centre of /contactos/'s "Enviar Mensagem"
   button returns <body> for four consecutive 50ms samples and a real mouse click at that point
   lands on <body> - the form does not submit and the page says nothing. It is not the restore's
   doing and it is not the form's: EVERY control on all 32 Ronneby-theme pages is dead for 200ms
   after any scroll, which on a phone is a tap right after a flick. Found by deleting app.css rules
   in a binary search until the window closed (rule 490 of 4931); nefrologia.com.pt's contact page,
   scrolled the same way, is hit-testable from the first sample.
   Same specificity, later sheet, so this wins. Nothing visible changes. */
body.scrolling * { pointer-events: auto !important; }
/* ---- end search results page ---- */

/* ---- rework 3 (o6_ta_rework3.py) ---- */
/* D4  THE 70px THE THEME'S OWN #menu-fixer WOULD HAVE RESERVED.
   jQuery.bindHeaderEvents inserts `<div id="menu-fixer">` after #header-container and sets its
   height to the header's, on every page that has no #stuning-header title band. That function is
   in the theme script the archive never captured, so the fixer was never created and the copy on
   the 14 no-title pages started at document y=0 under a 70px fixed bar. Measured at 1440, 1180,
   1101, 1024 and 390 on all 61 pages: the collision exists at 1101 and above, on 13 pages, and
   nowhere at 1100 or below - which is where the theme's own `#menu-fixer{display:none}` sits and
   where #header-container returns to the flow at 115px tall. Same breakpoint, same 70px, in CSS
   rather than JS so it holds with JavaScript off too. */
@media only screen and (min-width: 1101px) {
  #layout.no-title { padding-top: 70px; }
}

/* D6  A FOOTER THAT STOPS SHORT OF THE BOTTOM OF THE WINDOW.
   The one-screen legacy pages are shorter than the viewport, so the grey band ended 51-360px above
   the bottom edge with bare white under it, and on /terapia-de-casal/ the closing photograph was
   cut off mid-figure with that white below. #main-wrap is made at least as tall as the window and
   the last row of #layout takes the slack, so the closing band reaches the foot of the window and
   the footer sits on the bottom edge. A page taller than the window has no slack: flex-grow has
   nothing to distribute and every box keeps the geometry it has today, which is checked page by
   page, before and after, with _ta_r3_all.js.
   The window height is measured from the top of #main-wrap, so below 1101px - where the 115px
   header is back in the flow above it - that much is subtracted, or every short page would gain a
   115px scrollbar. */
#main-wrap { box-sizing: border-box; min-height: 100vh; display: flex; flex-direction: column; }
#main-wrap > #change_wrap_div { flex: 1 0 auto; display: flex; flex-direction: column; }
#main-wrap > #footer-wrap { flex: 0 0 auto; }
#change_wrap_div > #layout { flex: 1 0 auto; display: flex; flex-direction: column; }
#layout > div:last-of-type { flex: 1 0 auto; }
@media only screen and (max-width: 1100px) {
  #main-wrap { min-height: calc(100vh - 115px); }
}

/* ---- rework 4 (o6_ta_rework4.py) ---- */
/* R2  THE MOBILE HEADER LOGO RENDERED AT ITS NATURAL 800x400 FROM 601px TO 1100px.
   Measured on 5 pages x 8 widths: 561x281 at 601, 728x364 at 768, 800x400 from 900 to 1099, always
   at x=0 y=20, lying 186-305px over the first block of page copy - the address column and the
   Nome/Assunto fields on /contactos/, the privacy prose on /termos-e-privacidade/. Below 501px the
   theme's own `.header-col-left{max-width:120px!important}` caps it at 120x60, which is why the
   390 layout was always correct; at 1101 and above the desktop header replaces it. The band
   between had nothing holding it: options.css gives .mobile-logo `max-height:100%` and its
   children `max-height:100%!important`, and a percentage max-height against an auto-height
   containing block computes to none. What actually sized this element was in the theme JavaScript
   the archive never saved.
   The <img> is also pointed at the 148x74 rendition of the same artwork and carries its intrinsic
   width/height, so the element is right even before this sheet arrives; this rule is the cap that
   holds if the source is ever repointed again. 74px is the theme's own box height from options.css.
   No-op at <=500px, where the 120px column already gives 120x60 (60 < 74). */
.mobile-logo img { max-height: 74px; max-width: 100%; width: auto; height: auto; }

/* R1  The homepage's closing "Artigo recente" teaser - the post's only inbound link now that the
   block theme's header no longer prints the whole article above every page. Spaced like the
   sections above it; no colour or type of its own. */
.ta-latest-post { margin-top: var(--wp--preset--spacing--60, 3rem); }
.ta-latest-post .ta-latest-post-date { margin-top: .25rem; opacity: .8; }
/* Measured, not assumed: the two links in this block came out 21px tall at 1440 and 17px at 390.
   qa_legibility did not name them - which is a reason to measure rather than a reason to relax -
   so they get the same 24px line box every other link in this sheet was given. */
.ta-latest-post a { display: inline-block; min-height: 24px; line-height: 24px; }

/* The post's closing "read more" anchor carries the clinic's own LinkedIn share URL as its visible
   TEXT - authentic, byte-alike in the capture, so the characters are not ours to change. But
   wp-block-read-more is display:block;width:fit-content and nothing in the built CSS breaks an
   unbroken URL, so at 390 the string pushed the document 365px wider than the viewport on the very
   page the homepage now advertises. Cure the CONTAINER, never the content: this is the same
   distinction that kept "Investicao" and the 2025admin byline untouched elsewhere in this order. */
.wp-block-read-more { overflow-wrap: anywhere; word-break: break-word; max-width: 100%; }

/* A disc marker paints to the left of the LinkedIn icon on all 28 block-theme pages, including the
   404. Not the site's published design: WordPress core ships the list-style reset for
   wp-block-social-links inside block-library CSS, and that bundle is not part of this build. Ours
   to restore, because the artefact is ours. */
ul.wp-block-social-links { list-style: none; padding-left: 0; }
ul.wp-block-social-links > li { list-style: none; }

/* ---- owner-bar round 1 (o6_ta_ownerbar_r1.py) ---- */
/* Every rule in this block is explained in _recon/plan_terapiaadois.pt.json _note, OWNER-BAR ROUND 1. */

/* === Block-theme header: logo left, the site menu right ===================================== */
/* The header row is space-between over FOUR children, two of them empty (a group and a <p>), which is
   what parked the menu mid-left at x=561. */
header.wp-block-template-part .wp-block-group.alignwide > .wp-block-group:empty,
header.wp-block-template-part .wp-block-group.alignwide > p:empty { display: none; }
header.wp-block-template-part .wp-block-site-logo img { width: 148px; height: auto; }

/* Navigation block CSS, moved here from restore-nav.js so it holds with JavaScript off and lives in one
   place. The breakpoint is 1100px - the Ronneby pages' own - because seven items need it. */
.wp-block-navigation__container { list-style: none; margin: 0; padding: 0; }
.wp-block-navigation__container > li { list-style: none; }
.wp-block-navigation__responsive-container:not(.is-menu-open) { position: static; background: transparent; }
.wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-container-close { display: none; }
.wp-block-navigation__responsive-container-open { background: transparent; border: 0; padding: 10px; cursor: pointer; color: inherit; }
@media (min-width: 1100px) {
  .wp-block-navigation.is-responsive .wp-block-navigation__responsive-container-open { display: none; }
  .wp-block-navigation.is-responsive .wp-block-navigation__responsive-container .wp-block-navigation__container {
    display: flex; flex-wrap: nowrap; align-items: center; gap: 1.6rem; }
}
@media (max-width: 1099.98px) {
  .wp-block-navigation.is-responsive .wp-block-navigation__responsive-container-open { display: flex; }
  .wp-block-navigation.is-responsive .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none; }
}
.ta-nav-item { position: relative; }
.ta-nav-item > a { color: #0b0620; text-decoration: none; font-size: 1rem; line-height: 1.5; padding: .5rem 0; }
.ta-nav-item > a:hover, .ta-submenu a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ta-nav-item.current-menu-item > a { text-decoration: underline; text-decoration-color: #b38c73;
  text-decoration-thickness: 2px; text-underline-offset: 6px; }
.ta-has-sub > a::after { content: ""; display: inline-block; width: .38em; height: .38em; margin-left: .5em;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-.2em) rotate(45deg); }
.ta-submenu { list-style: none; margin: 0; padding: 0; }
.ta-submenu li { list-style: none; }
@media (min-width: 1100px) {
  .ta-submenu { position: absolute; top: 100%; left: -1rem; z-index: 1000; display: none; min-width: 18rem;
    padding: .5rem 0; background: #fff; border: 1px solid #e6e3ee; border-radius: 8px; box-shadow: 0 10px 30px rgba(11,6,32,.12); }
  .ta-sub-right > .ta-submenu { left: auto; right: -1rem; }
  .ta-has-sub:hover > .ta-submenu, .ta-has-sub:focus-within > .ta-submenu { display: block; }
  .ta-submenu a { display: block; padding: .55rem 1rem; color: #0b0620; text-decoration: none; font-size: .95rem; line-height: 1.4; }
}
/* The burger panel: every link visible at once, children indented under their parent. */
.wp-block-navigation__responsive-container.is-menu-open { position: fixed; inset: 0; z-index: 99999; display: block;
  background: #fff; color: #0b0620; padding: 1.25rem 1.5rem 2.5rem; overflow: auto; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { display: block; width: 100%; max-width: 100%; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
  position: absolute; top: .75rem; right: .75rem; background: transparent; border: 0; cursor: pointer; padding: 12px; color: inherit; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
  display: flex; flex-direction: column; align-items: stretch; gap: 0 !important; margin-top: 2.75rem; }
.is-menu-open .ta-nav-item { border-bottom: 1px solid #ecebf1; display: block; }
.is-menu-open .ta-nav-item > a { display: block; font-size: 1.2rem; font-weight: 600; padding: .7rem 0; }
.is-menu-open .ta-has-sub > a::after { display: none; }
.is-menu-open .ta-submenu { position: static; display: block; padding: 0 0 .6rem 1rem; }
.is-menu-open .ta-submenu a { display: block; font-size: 1.05rem; padding: .45rem 0; color: #2b2740; text-decoration: none; }
html.has-modal-open { overflow: hidden; }

/* === Block-theme footer: the same link set as the 2018 footer, on the same grey band ============= */
footer.wp-block-template-part { background: #b3b3b3; color: #262626; }
footer.wp-block-template-part > .wp-block-group.alignfull { padding-top: 2.25rem !important; padding-bottom: 1.5rem !important; }
.ta-footer-nav { max-width: var(--wp--style--global--wide-size, 80rem); margin: 0 auto 1rem; }
.ta-footer-menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; row-gap: .3rem; }
.ta-footer-menu li { list-style: none; display: inline-flex; align-items: center; }
/* Trailing separators, as the 2018 footer draws them: a leading one would open every wrapped line. */
.ta-footer-menu li:not(:last-child)::after { content: "/"; color: #4a4a4a; margin: 0 .65rem; }
.ta-footer-menu a { color: #262626; text-decoration: none; font-size: 1rem; line-height: 1.6; display: inline-block; min-height: 24px; }
.ta-footer-menu a:hover { text-decoration: underline; }
footer.wp-block-template-part .wp-block-group.alignwide { justify-content: center !important; }

/* === Phone body copy on the block pages (r0-06): the fluid preset computed 14.29px at 390 ========= */
@media (max-width: 781.98px) { body.wp-theme-extendable { font-size: 1rem; } }

/* === Homepage (r0-08) ========================================================================= */
.home .ta-hero-logo { max-width: 26rem !important; margin-left: auto !important; margin-right: auto !important; }
.home .ta-hero-logo img { display: block; width: 100%; height: auto; }
.home main h1.wp-block-heading { -webkit-hyphens: manual; hyphens: manual; overflow-wrap: normal; word-break: normal;
  font-size: clamp(1.9rem, 1rem + 2.2vw, 3rem); line-height: 1.15; }
.home #reservar-agora > .alignwide, .home #contacto > .wp-block-columns {
  max-width: var(--wp--style--global--content-size, 42rem) !important; margin-left: auto !important; margin-right: auto !important; }
.home #reservar-agora .is-vertical { align-items: stretch !important; }
.home #reservar-agora h2, .home #reservar-agora p, .home #contacto h2, .home #contacto h2 + p,
.home .ta-latest-post h2, .home .ta-latest-post p { text-align: center; }
.home #contacto .wp-block-column:empty { display: none; }
.home #contacto .wp-block-column { flex-basis: 100% !important; }
.home #contacto .wp-block-group { margin-bottom: 0 !important; }
.home #reservar-agora { padding-bottom: var(--wp--preset--spacing--30) !important; }
.home #contacto { padding-top: var(--wp--preset--spacing--30) !important; padding-bottom: var(--wp--preset--spacing--40) !important; }
.home .ta-latest-post { margin-top: 0; padding-bottom: var(--wp--preset--spacing--40); }

/* === Shop listings (r0-12): intro aligned with the list, the products as equal cards =========== */
.restore-catlead { max-width: 42rem !important; margin-right: auto !important;
  margin-left: max(0px, calc((100% - var(--wp--style--global--wide-size, 80rem)) / 2)) !important; color: #333; }
ul.wc-block-product-template { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)) !important;
  gap: 1.5rem !important; list-style: none; margin: 1.25rem 0 0 !important; padding: 0 !important; }
ul.wc-block-product-template > li.wc-block-product { width: auto !important; max-width: none !important; margin: 0 !important;
  display: flex; flex-direction: column; background: #f7f6fa; border: 1px solid #e6e3ee; border-radius: 12px; padding: 1.5rem; }
li.wc-block-product .wp-block-spacer { display: none; }
li.wc-block-product h3 { margin: 0 0 .5rem !important; font-size: 1.2rem !important; line-height: 1.3; }
li.wc-block-product h3 a { color: #0b0620; text-decoration: none; }
li.wc-block-product .wp-block-woocommerce-product-price { margin: 0 0 .75rem !important; }
li.wc-block-product .wc-block-components-product-price { font-size: 1.05rem !important; font-weight: 600; color: #0b0620;
  margin: 0 !important; padding: 0 !important; line-height: 1.4; }
li.wc-block-product .restore-cardnote { margin: 0; color: #3a3a3a; font-size: 1rem; line-height: 1.55; }
li.wc-block-product .ta-card-more { margin: auto 0 0; padding-top: 1rem; }
li.wc-block-product .ta-card-more a { color: #0b0620; font-weight: 600; text-decoration: underline; text-underline-offset: 3px;
  display: inline-block; min-height: 24px; line-height: 24px; }

/* === 2018 pages ============================================================================= */
/* PX, NOT REM, on these pages: Ronneby sets html{font-size:10px}, so 1.0625rem measured 10.6px and 48rem
   measured 480px in a live browser. */
/* r0-10: bios without a portrait read as one centred column. */
.ta-bio-solo > .wpb_wrapper { max-width: 760px; margin: 0 auto; }
/* r0-05: the location lines, set like body copy instead of as headings over nothing. */
.ta-locations { margin: 0; font-size: 16px; line-height: 1.7; color: #444; }
.ta-locations .ta-parking { color: #555; }
/* r0-15: the fixed bar was rgba(179,179,179,.75), so copy showed through it. Opaque at the colour it
   already painted over white (179*.75 + 255*.25 = 198), so nothing changes at the top of a page. */
@media only screen and (min-width: 1101px) { #header-container .header-wrap { background-color: rgb(198, 198, 198) !important; } }
/* r0-13: the 60px back-to-top disc (fixed, 20px off the bottom) sat on the last footer row at 390. */
@media only screen and (max-width: 600px) { #footer-wrap #footer { padding-bottom: 96px; } }

/* === Legibility pass, measured in a live browser after the menu/footer work ======================== */
/* 2018 body copy: options.css paints `body{color:#565656}` and app.css repaints it on the column wrappers, so a rule on
   #layout alone was measured NOT to reach a single paragraph; the colour is set on p and li themselves. The owner
   bar asks for #333-#444 on white, so the content column (#layout, never the dark #sidr panel or the
   grey footer band, which set their own colours) takes #444. Words, sizes and fonts unchanged. */
body.wpb-js-composer #layout, body.wpb-js-composer #layout p, body.wpb-js-composer #layout li { color: #444; }
/* /contactos/: the phone and e-mail lines rendered 14px Raleway light #565656 beside 16px copy. */
body.contactos #layout .dfd-list-content-block,
body.contactos #layout .dfd-list-content-block span { font-size: 16px !important; font-weight: 400 !important;
  line-height: 1.6 !important; color: #444 !important; }
/* The theme's button label measured 12px at every width (/terapia-de-casal/, /terapia-de-adulto/,
   /encontro-para-casais/). */
body.wpb-js-composer .dfd-button-module .dfd-button-text-main { font-size: 15px !important; }
/* The FAQ question headings (.info-box-title) sat on a 60px line at 30px - a double-spaced heading that
   read as three separate lines at 390. */
body.wpb-js-composer #layout .info-box-title { line-height: 1.3 !important; }
@media only screen and (max-width: 600px) {
  body.wpb-js-composer #layout .info-box-title { font-size: 24px !important; }
  body.wpb-js-composer #layout .wpb_wrapper > h1 { font-size: 40px !important; line-height: 1.15 !important; margin-bottom: 20px !important; }
}
/* Homepage contact form: rework 2's `.wpforms-container input/textarea { max-width: 32rem }` (block 2 above)
   stopped the fields at 512px inside the 672px centred column the headings and copy now use (measured). */
.home #wpforms-90 input[type="text"], .home #wpforms-90 input[type="email"],
.home #wpforms-90 textarea { max-width: 100% !important; width: 100% !important; }

/* ---- owner-bar round 2 (o6_ta_ownerbar_r2.py) ---- */
/* Every rule in this block is explained in _recon/plan_terapiaadois.pt.json _note, OWNER-BAR ROUND 2. */

/* === r1c-02 line length ======================================================================= */
/* Product descriptions ran 18px across 1280px (136-139 characters a line). Capped at the site's own
   672px content column (the post and the cookie policy), still aligned with the "Descricao" heading. */
body.single-product .woocommerce-Tabs-panel--description > p,
body.single-product .woocommerce-Tabs-panel--description > ul,
body.single-product .woocommerce-Tabs-panel--description > ol,
body.single-product .woocommerce-Tabs-panel--description .content-wraparea p,
body.single-product .wp-block-post-excerpt p { max-width: 672px; }
/* The 2018 long-text pages ran 16px across 1180px (126-160 characters). Their text blocks become one
   centred 580px reading column (measured about 76 characters a line; 640px measured 83-87) (PX: Ronneby sets html{font-size:10px}); each question/section heading
   moves WITH its text, so heading and copy stay aligned, and the centred page title above is unchanged. */
body.perguntas-frequentes #layout .dfd-info-box,
body.perguntas-frequentes-de-adultos #layout .dfd-info-box,
body.terapia-de-casal-para-o-tratamento-da-depressao #layout .dfd-info-box,
body.termos-e-privacidade #layout .wpb_text_column,
body.questionario-relacao-de-casal #layout .wpb_text_column,
body.apoio-ao-casal-em-luto-na-gravidez #layout .blog-section .columns > p {
  max-width: 580px; margin-left: auto !important; margin-right: auto !important; }
/* In the narrower column the policy's 2018 section headings wrap, and the theme's heading line-height (set
   for one-line headings) left "Use" alone under "Information Collection And" with a very tall gap
   (photographed). Headings in those columns get a normal line-height; size and colour unchanged. */
body.termos-e-privacidade #layout .wpb_text_column :is(h1, h2, h3, h4),
body.questionario-relacao-de-casal #layout .wpb_text_column :is(h1, h2, h3, h4) { line-height: 1.25 !important; }

/* === r0-16 Terapias pages: FAQ button + service button side by side, aligned with the 860px text ===== */
.ta-button-pair { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; max-width: 860px;
  margin: 0 auto; }
/* ROUND 3 (r2c-01): `flex: 0 0 auto` let a button never be narrower than its label plus the theme's 80px
   side padding - 366px for "Servico para Terapia de Adulto", which ran 11px past a 375px phone and 26px past
   a 360px one. The wrap may shrink now, and under 600px both buttons fill the text column (320-350px), with
   side padding cut to 16px so the label still fits on one line at 360. */
.ta-button-pair > .dfd-button-module-wrap { flex: 0 1 auto; max-width: 100%; margin: 0 !important; }
@media only screen and (max-width: 799px) { .ta-button-pair { max-width: none; } }
@media only screen and (max-width: 599px) {
  .ta-button-pair > .dfd-button-module-wrap { flex: 1 1 100%; }
  .ta-button-pair .dfd-button-module, .ta-button-pair .dfd-button-link,
  .ta-button-pair .dfd-button-inner-cover { display: block; width: 100%; box-sizing: border-box; }
  .ta-button-pair .dfd-button-inner-cover .dfd-button-text-main,
  .ta-button-pair .dfd-button-inner-cover .dfd-button-text-hover { padding-left: 16px !important;
    padding-right: 16px !important; }
}
/* ROUND 3 (r2c-02): `margin: 0 !important` above also removed the theme's spacing on /terapia-de-casal/,
   where the pair follows the paragraph directly and the spacers above it are 0px below 800px, so the FAQ
   button touched the last line of text (measured 0px at 390). /terapia-de-adulto/ has an 80/30px spacer of
   its own there and needs nothing. The two pages' buttons also differed (60px flat against 48px with a
   near-black 1px border, both inherited from each page's own module settings); inside the pair they are
   one button now: 56px tall, flat, the same #8C6D5A fill. */
body.terapia-de-casal .ta-button-pair { margin-top: 24px; }
.ta-button-pair .dfd-button-inner-cover .dfd-button-text-main,
.ta-button-pair .dfd-button-inner-cover .dfd-button-text-hover { line-height: 56px !important; }
@media only screen and (min-width: 600px) {
  .ta-button-pair .dfd-button-inner-cover .dfd-button-text-main,
  .ta-button-pair .dfd-button-inner-cover .dfd-button-text-hover { padding-left: 48px !important;
    padding-right: 48px !important; }
}
.ta-button-pair .dfd-button-module .dfd-button-link .dfd-button-inner-cover,
.ta-button-pair .dfd-button-module .dfd-button-link .dfd-button-inner-cover:before,
.ta-button-pair .dfd-button-module .dfd-button-link .dfd-button-inner-cover:after { border-style: none !important;
  border-radius: 0 !important; }

/* === r1c-03 sobre: the bios collapsed into one column put the next name straight under the last line == */
.ta-bio-solo > .wpb_wrapper > .dfd-heading-shortcode:first-child { margin-top: 48px; }

/* === r1c-06 block pages: the footer sits on the window's bottom edge on a short page ================= */
/* The 2018 pages already do this (#main-wrap, rework 3). A page taller than the window has no slack. */
.wp-site-blocks { min-height: 100vh; display: flex; flex-direction: column; }
.wp-site-blocks > * { flex-shrink: 0; }
.wp-site-blocks > footer.wp-block-template-part:last-child { margin-top: auto; }

/* === r1c-07 back-to-top on a phone: smaller, off the text column's edge, hidden over the footer ======= */
@media only screen and (max-width: 600px) {
  .body-back-to-top { width: 44px !important; height: 44px !important; line-height: 44px !important;
    right: 10px !important; }
  .body-back-to-top.active { bottom: 16px !important; }
  .body-back-to-top.ta-btt-over-footer { opacity: 0 !important; pointer-events: none; }
}

/* === r1c-08 price cells: the second price is a <p> inside the tan <h5>, and the legibility pass's
   `#layout p {color:#444}` repainted only that line. It inherits the cell's colour again. Scoped to the
   cells the clinic painted tan inline: the intro sentence above each table is ALSO a <p> inside a heading
   module, and an unscoped rule measured it pale grey-tan (a legibility regression, caught on screenshot). */
body.wpb-js-composer #layout .dfd-heading-module .dfd-title:is([style*="b38c73"], [style*="8c6d5a"]) p { color: inherit !important; }

/* === r1c-09 homepage Abordagem Terapeutica: one alignment for the whole column, like its heading ====== */
.home .ta-abordagem > p { text-align: center !important; }

/* === OWNER-BAR ROUND 3 ================================================================================ */
/* r2c-04 THE CLINIC'S TAN AS TEXT. #b38c73 on white is 3.04:1. The heading rule near the top of this file
   already takes it to #8C6D5A (4.72:1), but two kinds of text never received it:
   (a) `.wpb_wrapper h5.widget-title` in options.css is (0,2,1) and beats `body.wpb-js-composer h5` (0,1,2),
       so "Morada e Contactos" and "Questoes" on /contactos/ stayed #b38c73 - fixed by the rule below;
   (b) service table cells, price lines, encontro agenda topics and the sobre name headings carry the colour
       INLINE as `color: #b38c73 !important`, and an inline !important beats every stylesheet rule, so no CSS
       can reach them. Round 3 rewrote that one value in those style attributes to #8c6d5a (same hue,
       the H1 tone); both price lines in a cell change together (the r1c-08 rule above now matches either). */
body.wpb-js-composer #layout .wpb_wrapper h5.widget-title { color: #8C6D5A; }

/* r2c-05 /terapia-de-casal-para-o-tratamento-da-depressao/: the gaps between its three sections are stacks of
   10px .dfd-spacer-module whose data-tablet_size and data-mobile_size are empty, so below 800px they are 0px
   and each question heading sat on the last line of the text above it (the first one on the header rule).
   The archive at 390 had about 50px there. Their data-normal_size is empty too, so the same 0px gap was
   measured at 800, 1024 and 1279; from 1280 the 10px wide sizes apply and the page is left as it was. */
@media only screen and (max-width: 1279px) {
  body.terapia-de-casal-para-o-tratamento-da-depressao #layout .dfd-info-box { margin-top: 40px; }
}

/* r2c-07 page titles under the fixed desktop bar. On the four pages whose first element is the centred page
   title (both FAQs, both Terapias) #layout.no-title reserves exactly the 70px bar, so the title box began on
   the bar's edge (glyphs about 15px below it). The archive's FAQ had a tall band there; 40px is restored at
   the widths where the bar is fixed. Below 1101px the 115px header is in the flow and this does not apply. */
@media only screen and (min-width: 1101px) {
  body:is(.perguntas-frequentes, .perguntas-frequentes-de-adultos, .terapia-de-casal, .terapia-de-adulto) #layout.no-title {
    padding-top: 110px; }
}

/* r2c-08 a mailto: link inside a sentence. options.css sets every a[href^="mailto:"] to italic 16px Lora, which
   reads as a different typeface mid-sentence ("(por e-mail)" on /encontro-para-casais/) and let "e-" break
   from "mail)" at 390. Inside running text on the 2018 pages it takes the sentence's own face and stays whole. */
body.wpb-js-composer #layout .wpb_text_column p a[href^="mailto:"] { font-family: inherit; font-style: inherit;
  font-size: inherit; white-space: nowrap; }

/* r2c-07 /termos-e-privacidade/ had no title and opened on "Effective date". It now carries the name its own
   <title> and the footer link give it, "Termos e Privacidade", in the markup of the Terapias titles. The
   column's heading rule (line-height 1.25, for the policy's wrapping section headings) leaves no room under
   a one-line title, so it gets its own space before the text. */
body.termos-e-privacidade #layout .wpb_text_column h1 { margin-bottom: 32px; }

/* === OWNER-BAR ROUND 3, second fixer (found by photographing the round-3 pages at 390 and 1440) ======== */
/* PHONE GUTTER on the four long-text pages. Their text sits in a .twelve.columns whose theme padding is 10px
   and nothing else, so copy ran 10px from both screen edges (measured L10 R10 at 390 on termos, questionario,
   depressao and luto), where every other 2018 page reaches 20-30px through one more nested row (both FAQs L20,
   Terapias L20, servicos L30). The same blocks the r1c-02 580px column rule names get 10px more each side,
   so text lands at 20px like its sibling pages. Desktop is untouched (the 580px column is centred there). */
@media only screen and (max-width: 599px) {
  body.terapia-de-casal-para-o-tratamento-da-depressao #layout .dfd-info-box,
  body.termos-e-privacidade #layout .wpb_text_column,
  body.questionario-relacao-de-casal #layout .wpb_text_column,
  body.apoio-ao-casal-em-luto-na-gravidez #layout .blog-section .columns > p {
    padding-left: 10px; padding-right: 10px; box-sizing: border-box; }
}
/* PHONE HEADING SCALE in the privacy policy. The theme keeps its desktop sizes for h2/h3/h4 on a phone
   (45/35/30px), so each 2018 section heading ("Use of Data", "Information Collection And Use") was larger than
   the 40px page title above it and took three lines. Under 600px they step down below the title in the same
   order and colour; 1440 keeps 55/45/35/30. */
@media only screen and (max-width: 599px) {
  body.termos-e-privacidade #layout .wpb_text_column h2 { font-size: 30px !important; }
  body.termos-e-privacidade #layout .wpb_text_column h3 { font-size: 25px !important; margin-top: 8px; }
  body.termos-e-privacidade #layout .wpb_text_column h4 { font-size: 21px !important; }
}
/* FAQ TITLE at 600px and up. On /perguntas-frequentes/ the H1 has margin-bottom 0 there (the phone rule above
   gives it 20px), so its descenders sat 14px above the first question heading (measured at 1440; the adult
   FAQ's own markup already leaves 58px). */
@media only screen and (min-width: 600px) {
  body.perguntas-frequentes #layout .wpb_wrapper > h1 { margin-bottom: 32px !important; }
}

/* ================================================================================================
   OWNER REQUEST, 2026-09-16: the block-theme header restyled to match the Ronneby header.
   The owner opened http://127.0.0.1:8602/ next to /terapia-de-casal/ and said the navbar, the
   burger and the open menu "look very good" on the Ronneby page and asked for the homepage to
   match. Round 1's note above ("the two generations still differ in look... restyling one
   generation as the other would be inventing a design") is superseded here by that direct
   instruction - this is the change round 1 declined to make.

   The menu ITEMS were already unified in round 1 (same 7 items, same targets, on both
   generations) - nothing about which links exist or where they go changes below. Only the LOOK
   of the existing block-theme markup (.ta-nav-item, .ta-submenu, .wp-block-navigation__responsive-*)
   changes, and only on the 28 pages that render this header (grep
   "wp-block-navigation__responsive-container-open": the homepage, 404, both category listings, and
   every /produto/ and /categoria-produto/ page - including the backlink page,
   /produto/sessao-de-mediacao-de-conflitos/, whose content-wraparea block this does not touch;
   verified byte-identical and still exactly one "farmaciaamparo" link, before and after).

   EVERY VALUE BELOW WAS MEASURED, NOT GUESSED: getComputedStyle() on the live, working Ronneby
   header (/terapia-de-casal/), not a reading of the 590 KB/1.1 MB customizer stylesheets (options.css,
   app.css), which carry hundreds of unrelated header-style-1/3/4 and top-panel variants this site
   does not use and are far easier to mis-cascade than to trust. Source: #header-container
   .header-wrap background rgb(198,198,198), fixed, 70px tall at >=1101px, white/115px-tall and
   in-flow below that; .menu-link italic Roboto 900 14px #262626, padding 0 20px, line-height 30px;
   the current-page indicator is #nav-menu-item-N::after, a 3px #b38c73 (the site's own accent tan)
   bar 20px above the link; .sub-nav / .menu-depth-1 is Raleway 600 13px #262626 on rgb(109,109,109);
   #sidr is 260px, rgb(45,45,45), links rgba(255,255,255,.5) Roboto 13px, submenu rows rgb(37,37,37)
   15px padding 15px 25px.

   WHY THIS STAYS CSS-ONLY, NOT A SWAP TO THE RONNEBY MARKUP ITSELF. The Ronneby dropdown and #sidr
   are driven by jQuery + jquery.mega-menu(.run).min.js + the sidr plugin inside plugins.min.js -
   loaded on the 32 Ronneby pages and on NONE of the 28 block pages (grep confirms no <script
   src="...jquery..."> anywhere in index.html or any /produto/ page). Bringing that stack onto the
   block pages would mean loading four more legacy scripts and nine more theme stylesheets next to
   the block theme's own CSS - and app.css alone is 4931 unscoped rules (the "body.scrolling *" note
   above found rule 490 of it reaching every control on the page by accident). That risks changing
   how block-theme CONTENT looks or behaves elsewhere on each page, which is the one thing this task
   rules out. Copying the Ronneby header's MEASURED VALUES onto the block theme's OWN markup and its
   OWN already-working JS (restore-nav.js's open/close is class-based and untouched by any of this)
   gets the same look with zero risk to the other 27 things on each page. restore-nav.js's header
   comment already frames the block burger this way: "rebuilt as its no-framework equivalent... All
   look lives in restore-extras.css, so the header holds with JavaScript off."

   FONTS. Roboto and Raleway are self-hosted already (fonts/*.woff2, used today by the Ronneby
   pages via css/googlefonts-34adcdd1.css and css/googlefonts-85fe4d18.css) - the same two files are
   now also linked from the 28 block pages' <head>, nothing fetched live and nothing new encoded. */

@media only screen and (min-width: 1101px) {
  header.wp-block-template-part {
    position: fixed; top: 0; left: 0; right: 0; z-index: 999; display: flex; align-items: center;
    background: rgb(198, 198, 198); height: 70px;
  }
  header.wp-block-template-part > .wp-block-group.alignfull {
    width: 100%; padding-top: 0 !important; padding-bottom: 0 !important;
  }
  header.wp-block-template-part .wp-block-group.alignwide { align-items: center; }
  header.wp-block-template-part .wp-block-site-logo img { width: auto; height: 44px; }
  /* Reserve the space the fixed bar now takes out of the flow - the same trick #layout.no-title
     already uses for the Ronneby pages' own fixed header, at the same 70px. */
  body.wp-theme-extendable { padding-top: 70px; }

  /* Ronneby's items are edge-to-edge, spaced only by their own 20px side padding; the round-1
     flex gap would double that space on top of it. */
  .wp-block-navigation.is-responsive .wp-block-navigation__responsive-container .wp-block-navigation__container {
    gap: 0;
  }
  .ta-nav-item > a { position: relative; font-family: "Roboto", sans-serif; font-style: italic;
    font-weight: 900; font-size: 14px; letter-spacing: normal; color: #262626; padding: 0 20px;
    line-height: 30px; text-decoration: none; }
  .ta-nav-item > a:hover { text-decoration: none; background: rgb(109, 109, 109); }
  .ta-has-sub > a::after { display: none; }                 /* Ronneby's bar carries no chevron */
  .ta-nav-item.current-menu-item > a { text-decoration: none; }
  .ta-nav-item.current-menu-item > a::before { content: ""; position: absolute; top: -20px; left: 0;
    right: 0; height: 3px; background: #b38c73; }

  /* The hover dropdown: Ronneby's own grey/Raleway popup, not the block theme's white rounded card.
     Measured width of Ronneby's own longest item ("Terapia de Casal para o Tratamento da
     Depressão"), unwrapped, on /terapia-de-casal/: 405px - round 1's 18rem (288px) wrapped it. */
  .ta-submenu { background: rgb(109, 109, 109); border: 0; border-radius: 0; box-shadow: none;
    padding: 0; min-width: 25rem; }
  .ta-submenu a { font-family: "Raleway", sans-serif; font-style: normal; font-weight: 600;
    font-size: 13px; color: #262626; padding: 5px 45px 5px 20px; line-height: 26px; }
  .ta-submenu a:hover { text-decoration: underline; }
}

@media only screen and (max-width: 1100.98px) {
  /* Ronneby's own header is back in the document flow below 1101px, white, with a hairline border -
     already close to what the block pages had (113-115px either way); this just matches the colour
     and the border. */
  header.wp-block-template-part { position: relative; background: #fff;
    border-bottom: 1px solid rgba(40, 38, 43, .1); }
  header.wp-block-template-part .wp-block-site-logo img { width: 148px; height: auto; }
}
@media only screen and (max-width: 600px) {
  /* Ronneby's own .header-col-left{max-width:120px!important} step for a phone-width logo. */
  header.wp-block-template-part .wp-block-site-logo img { width: 120px; height: auto; }
}

/* The open panel: a 260px dark slide-in from the left over a dimmed backdrop, like #sidr, instead
   of a full-screen white sheet. This reuses the THREE WRAPPER ELEMENTS WordPress already renders
   around the menu (.responsive-close and .responsive-dialog become the 260px column,
   .responsive-container-content fills it) - nothing is added to or removed from the markup, only
   their box. Because the outer .is-menu-open element is left as the full-viewport backdrop and
   nothing else now covers that space, restore-nav.js's existing `e.target === panel` backdrop-click
   check keeps working unchanged. */
.wp-block-navigation__responsive-container.is-menu-open { background: rgba(0, 0, 0, .55);
  padding: 0; overflow: hidden; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
  position: absolute; top: 0; left: 0; height: 100%; width: 260px; max-width: 84vw; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
  background: rgb(45, 45, 45); overflow-y: auto; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
  height: auto; overflow: visible; box-sizing: border-box; padding-top: 0; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
  top: 8px; right: 8px; color: #fff; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg {
  fill: currentColor; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { margin-top: 0; }
.is-menu-open .ta-nav-item { border-bottom: 0; }
.is-menu-open .ta-nav-item > a { font-family: "Roboto", sans-serif; font-style: normal;
  font-weight: 400; font-size: 13px; color: rgba(255, 255, 255, .5) !important; padding: 0 25px;
  line-height: 48px; }
.is-menu-open .ta-submenu { background: rgb(37, 37, 37); padding: 0; }
.is-menu-open .ta-submenu a { font-family: "Roboto", sans-serif; font-style: normal;
  font-weight: 400; font-size: 15px; color: rgba(255, 255, 255, .5) !important; padding: 15px 25px;
  line-height: normal; }
/* `!important` on both colors above (round 2 addendum): the product/category pages carry a core
   WP chunk index.html does not - `.wp-block-navigation-item__content.wp-block-navigation-item__
   content{color:inherit}` (the class doubled on purpose, a specificity trick) plus `.wp-block-
   navigation:not(.has-text-color) .wp-block-navigation__responsive-container.is-menu-open{color:
   #000}` on the panel itself - which together forced the link text to black on those pages only.
   Screenshot proof: computed color measured rgb(0,0,0) on the backlink page's panel, rgba(255,
   255,255,.5) on the home page's, before this fix. Same family of bug as the gap/alignment fix
   above (a page-dependent inline core-CSS chunk, not a whim), so grouped with it. */
/* ---- end owner-request header restyle ---- */

/* ================================================================================================
   OWNER REQUEST, ROUND 2, 2026-09-16: the three things the first pass named and deliberately left
   ("NOT TOUCHED, on purpose") - the burger's own SVG glyph, the panel's missing logo header, and
   the panel listing every child instead of hiding it behind Ronneby's own "..." affordance. The
   owner opened both headers at 390 and asked for the burger, the panel and its items to match, not
   just the closed 1440 bar. Menu items/targets untouched again - look only, same as round 1.

   1. THE BURGER GLYPH. Replaces WP core's 2-rect SVG (present, styled, but a different mark) with
      Ronneby's own 3-span glyph, same markup and same classnames as /terapia-de-casal/'s
      `<a id="mobile-menu" class="dl-trigger icon-mobile-menu dfd-vertical-aligned">`: three
      `<span class="icon-wrap ...">` bars of different widths, left-anchored in a 40x40 box. Values
      below are copied verbatim from css/app-a374573c.css `.icon-mobile-menu` and its three
      `span.icon-wrap` rules (not loaded on the 28 block pages - see the "WHY THIS STAYS CSS-ONLY"
      note above - so the handful of declarations actually used are duplicated here instead of
      linking the 590KB sheet). Bar colour rgb(40,38,43) is #28262b, read with getComputedStyle() on
      the live Ronneby glyph, not the visually-similar #262626 used for the nav text. The button
      itself carried `padding:10px` from round 1 (turning a 24px SVG into a 44x44 box); that padding
      is removed here so the box is 40x40 like Ronneby's, not 60x60. The round-1 tap-target rule
      ("3. TAP TARGETS", `.wp-block-navigation__responsive-container-open{min-width/min-height:44px}`)
      would otherwise clamp it straight back to 44 - Ronneby's own `#mobile-menu` was never in that
      accessibility pass, so `.icon-mobile-menu` is excluded here too, the same way, for true parity.
      Measured after: home burger box 40x40 centred at (350.5, ~50) at 390 vs Ronneby's own 40x40
      centred at (350, 57) on /terapia-de-casal/ - the 7px y difference is the two headers' own
      heights (100px block vs 115px Ronneby at this width), already measured and accepted in round
      1; nothing here changes header height. */
.wp-block-navigation__responsive-container-open.icon-mobile-menu {
  padding: 0; width: 40px; height: 40px; min-width: 40px; min-height: 40px; position: relative;
  display: inline-block; background: transparent; text-indent: -900em; z-index: 2;
}
.icon-mobile-menu span.icon-wrap { display: block; width: 20px; height: 1px; position: absolute;
  top: 50%; left: 0; background: #28262b; }
.icon-mobile-menu span.icon-wrap.dfd-middle-line { width: 20px; }
.icon-mobile-menu span.icon-wrap.dfd-top-line { width: 25px; margin-top: -5px; }
.icon-mobile-menu span.icon-wrap.dfd-bottom-line { width: 31px; margin-top: 5px; }

/* 2. THE OPEN PANEL'S LOGO HEADER. Ronneby's #sidr opens on `.sidr-top` - the same logo the page's
      own header carries, floated left in a `padding:20px 50px 20px 20px` box (values read with
      getComputedStyle() on the live panel). The block panel has no separate "mobile" logo asset to
      restore (grep: logo-mobile-f5b25b22.png, the file #sidr actually uses, is not linked from any
      of the 28 block pages - only logo-v2-67c932df.png and its srcset are, in the header and the
      hero), so THE LOGO IMAGE THE PAGE ALREADY CARRIES is reused rather than wiring in a file the
      block generation never referenced. Same ~2:1 aspect as Ronneby's mobile crop, so at the same
      190px content width it renders ~95px tall, matching Ronneby's measured 189.97x95.34 almost
      exactly. The dialog itself now scrolls as one column (like #sidr, whose logo scrolls away with
      the list rather than staying pinned) instead of only its content div, so the logo doesn't get
      clipped by a fixed-height inner scroller; see the `.responsive-dialog`/`.responsive-container-
      content` overflow rule above, changed for this reason. */
/* Hidden by default: at >=1101px the block theme's own container is never display:none (it IS the
   desktop nav bar, in-flow, not a modal), so an unscoped rule here would render the logo inline
   before the <ul>, pushing the whole desktop menu row down - caught on a live 1440 screenshot
   (items measured at y=240 instead of inside the 70px bar) before this scoping rule was added. */
.ta-panel-logo { display: none; }
.wp-block-navigation__responsive-container.is-menu-open .ta-panel-logo {
  display: block; padding: 20px 50px 20px 20px; overflow: hidden; }
.ta-panel-logo img { display: block; max-width: 100%; height: auto; }
.ta-panel-logo a { display: block; }

/* 3. THE ITEM LIST HIDES CHILDREN BEHIND RONNEBY'S OWN "..." AFFORDANCE. Ronneby's plugins.min.js
      appends `<i class="sidr-dropdown-toggler">` inside each parent link that has children; CSS
      paints it as three 2px dots (one `content:""` dot plus two more drawn with `box-shadow`, the
      theme's own technique, copied verbatim from `.sidr-dropdown-toggler:before` in
      css/app-a374573c.css) in a 48px square hit target, right:0, vertically centred. The block
      panel's markup gets the same `<i class="ta-dropdown-toggler">` inside the same four items that
      already carry `.ta-has-sub` on both generations (Terapias, Encontros, Perguntas Frequentes,
      Serviços - the exact four the owner named), added once to the 28 HTML files, hidden above
      1100px with `display:none` so it never appears in the desktop hover dropdown. `.ta-submenu` is
      display:none by default inside the open panel and shown only on `.ta-has-sub.ta-open` -
      js/restore-nav.js's new `panelParentTapOpensSubmenu` adds/removes that class, generalised from
      the existing `sidrParentTapOpensSubmenu` (round 1) rather than a second copy of the same idea:
      tapping the dots, or a first tap anywhere else on a CLOSED parent's label, opens the submenu;
      a second tap on an OPEN parent's label follows the link, same two-step as the Ronneby panel
      already had. HARD REQUIREMENT verified by tapping, not reading the code: every child is
      display:block (reachable, focusable, clickable) once its parent is open - see the VERIFIED
      note below and the qa_visitor_paths run. */
.is-menu-open .ta-has-sub > a.wp-block-navigation-item__content { padding-right: 56px; position: relative; }
.is-menu-open .ta-dropdown-toggler { font-size: 6px; display: block; width: 48px; height: 48px;
  line-height: 48px; text-align: center; position: absolute; right: 0; top: 50%; margin-top: -24px;
  z-index: 999; cursor: pointer; }
.is-menu-open .ta-dropdown-toggler::before { content: ""; display: block; width: 2px; height: 2px;
  position: absolute; top: 50%; left: 50%; margin: -1px 0 0 -1px; background: rgba(255, 255, 255, .5);
  box-shadow: -3px 0 0 0 rgba(255, 255, 255, .5), 3px 0 0 0 rgba(255, 255, 255, .5); }
.is-menu-open .ta-has-sub > a.wp-block-navigation-item__content:hover .ta-dropdown-toggler::before,
.is-menu-open .ta-has-sub.ta-open > a.wp-block-navigation-item__content .ta-dropdown-toggler::before {
  background: #fff; box-shadow: -3px 0 0 0 #fff, 3px 0 0 0 #fff; }
.is-menu-open .ta-submenu { display: none; }
.is-menu-open .ta-has-sub.ta-open > .ta-submenu { display: block; }
@media (min-width: 1101px) { .ta-dropdown-toggler { display: none; } }

/* FOUND WHILE VERIFYING THE ABOVE, NOT REQUESTED BY NAME BUT SAME "PANEL" SCOPE: on the backlink
   page (screenshot proof - the panel read as a spread-out, right-aligned list, nothing like the
   home page's) the open panel's item list was gapped ~20px apart and right-aligned, unlike the
   home page where it is tight and left-aligned. Cause: WordPress inlines a per-page copy of the
   core navigation block's own CSS, and 26 of the 28 pages carry a chunk index.html does not
   (`grep -c wp-block-navigation__container` is 1 on index.html, 2 on the product/category pages) -
   `.wp-block-navigation-item{display:flex;flex-direction:column;align-items:var(--navigation-
   layout-justification-setting,initial)}` and `.wp-block-navigation__container{gap:inherit}`, both
   four classes deep, beat round 1's three-class `gap:0` and `.ta-nav-item{display:block}` by
   specificity alone wherever that chunk is present - which is why the drift never showed on the
   page this whole restyle was proofed against. `!important` here, not higher selectors, because
   the WP variable's resolved value differs per page and is not worth reverse-engineering. */
.is-menu-open .ta-nav-item { display: block !important; }
.is-menu-open .wp-block-navigation__container { align-items: stretch !important; }
/* ---- end owner-request header restyle, round 2 ---- */
