.elementor-790 .elementor-element.elementor-element-mhdr001{--display:flex;}.elementor-790 .elementor-element.elementor-element-mhdr002{--display:flex;--align-items:stretch;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-790 .elementor-element.elementor-element-mhdr003{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;--gap:24px 24px;--row-gap:24px;--column-gap:24px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-theme-site-logo .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), system-ui, -apple-system, "Segoe UI", sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-790 .elementor-element.elementor-element-mhdr004{margin:4px 0px calc(var(--kit-widget-spacing, 0px) + -4px) 0px;}.elementor-790 .elementor-element.elementor-element-mhdr007{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:24px 24px;--row-gap:24px;--column-gap:24px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), system-ui, -apple-system, "Segoe UI", sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before,
					.elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), system-ui, -apple-system, "Segoe UI", sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-790 .elementor-element.elementor-element-mhdr005 .elementor-menu-toggle{margin:0 auto;}.elementor-790 .elementor-element.elementor-element-mhdr009{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:-24px;--margin-right:0px;}.elementor-790 .elementor-element.elementor-element-mhdr009.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), system-ui, -apple-system, "Segoe UI", sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-790 .elementor-element.elementor-element-83ba939{color:#2C336000;}.elementor-790 .elementor-element.elementor-element-mhdr008{--grid-template-columns:repeat(0, auto);text-align:left;--icon-size:20px;--grid-column-gap:8px;--grid-row-gap:0px;}.elementor-790 .elementor-element.elementor-element-mhdr008 .elementor-social-icon{background-color:transparent;--icon-padding:0.35em;}.elementor-790 .elementor-element.elementor-element-mhdr008 .elementor-social-icon i{color:var( --e-global-color-mbginvert );}.elementor-790 .elementor-element.elementor-element-mhdr008 .elementor-social-icon svg{fill:var( --e-global-color-mbginvert );}.elementor-790 .elementor-element.elementor-element-mhdr008 .elementor-social-icon:hover i{color:#DB8A1E;}.elementor-790 .elementor-element.elementor-element-mhdr008 .elementor-social-icon:hover svg{fill:#DB8A1E;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), system-ui, -apple-system, "Segoe UI", sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:900px){.elementor-790 .elementor-element.elementor-element-e75dcc3.elementor-element{--flex-grow:0;--flex-shrink:0;}}@media(min-width:761px){.elementor-790 .elementor-element.elementor-element-mhdr007{--width:auto;}.elementor-790 .elementor-element.elementor-element-mhdr009{--width:21.897%;}}@media(max-width:900px) and (min-width:761px){.elementor-790 .elementor-element.elementor-element-mhdr007{--width:auto;}}@media(max-width:760px){.elementor-790 .elementor-element.elementor-element-mhdr001{--min-height:5px;}.elementor-790 .elementor-element.elementor-element-mhdr001.e-con{--align-self:flex-start;}.elementor-790 .elementor-element.elementor-element-mhdr002{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-790 .elementor-element.elementor-element-mhdr007{--width:auto;}.elementor-790 .elementor-element.elementor-element-mhdr005 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown, .elementor-790 .elementor-element.elementor-element-mhdr005 .elementor-nav-menu__container.elementor-nav-menu--dropdown{margin-top:-11px !important;}}/* Start custom CSS for container, class: .elementor-element-mhdr007 *//* === Header Right (mhdr007) row overflow, 901-937px column-gap fix (2026-09-08) ===
   Measured (Pixun's session): mhdr007's row (nav + spacer + socials + CTA,
   flex-shrink:0 on each, nowrap) needs more width than the column has
   between 901 and 937px -- up to 29.7px short at 901px, tapering to 0 by
   937px. Applies whenever this row is at its "wide" state: always on inner
   pages (wordmark not gated to body.home there, so the logo never
   collapses), and on the home page once .is-scrolled reopens the logo --
   hence no body.home / .is-scrolled condition here, this rule is
   unconditional within the width band.

   VERIFIED LIVE (not assumed from the brief): this container carries
   e-con-full, not e-con-inner, so the applicable core-Elementor rule is
   .elementor-element:where(.e-con-full,.elementor-widget){gap:var(--row-gap)
   var(--column-gap)} -- it reads --row-gap/--column-gap, NOT the --gap
   shorthand the panel also emits. Overriding --gap here would be a dead
   variable for this container type; --column-gap is the one the render
   path actually consumes for this row (flex-direction:row, nowrap, so only
   the column axis is in play). Written as a custom property, never a
   literal `gap:` or `column-gap:` declaration, so the panel's own Gap
   control on Header Right keeps governing outside this narrow band and
   nothing here shadows a choice Pixun can make in the panel. */
@media (min-width: 901px) and (max-width: 937px) {
  .elementor-790 .elementor-element.elementor-element-mhdr007 { --column-gap: clamp(14px, calc(14px + (100vw - 901px) * 0.28), 24px); }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-mhdr002 *//* === Header row stabilization (>=901px), SITE-WIDE ===
   The parent theme's own header-footer.css sets
   .site-header .header-inner { flex-wrap: wrap; } unconditionally -- not an
   Elementor panel control, so nothing here shadows a choice Pixun made.
   Elementor's own nav-menu widget CSS carries the same latent
   flex-wrap:wrap on its <ul> (widget-nav-menu.min.css,
   .elementor-nav-menu--layout-horizontal .elementor-nav-menu), and its base
   rule defaults every element to flex-shrink:1 (.elementor-element{
   flex-shrink:var(--flex-shrink,1)}). None of that is a panel choice either.

   CORRECTED 2026-09-08: this block was briefly scoped to body.home while
   gating the scroll effect to the home page (see the block below), on the
   assumption it only existed to serve that effect. MEASURED WRONG: on an
   inner page (logo always visible, nothing collapsing) the row still wraps
   without it -- CDP on /qui-som/ at 1440px showed .header-inner switching
   to two lines (height 166px instead of 84, social icons stacked vertically
   34px apart instead of level 42px apart) the moment this stopped applying
   there. That is a genuine site-wide row-stability fix, unrelated to the
   scroll effect, and it stays site-wide. */
@media (min-width: 901px) {
  .elementor-790 .elementor-element.elementor-element-mhdr002 .header-inner {
    flex-wrap: nowrap;
  }
  .elementor-790 .elementor-element.elementor-element-mhdr002 .primary-nav {
    flex-shrink: 0;
  }
  .elementor-790 .elementor-element.elementor-element-mhdr002 .primary-nav .elementor-nav-menu {
    flex-wrap: nowrap;
  }
  .elementor-790 .elementor-element.elementor-element-mhdr002 .header-socials,
  .elementor-790 .elementor-element.elementor-element-mhdr002 .header-cta {
    flex-shrink: 0;
    flex-basis: auto;
  }
  /* Inert on every page except while traveling on home (see below); pinning
     its basis to 0 site-wide keeps it from ever claiming stray width of its
     own, home or not. */
  .elementor-790 .elementor-element.elementor-element-mhdr002 .header-nav-spacer {
    flex-basis: 0;
  }
}

/* === Header logo reveal + nav travel on scroll -- HOME PAGE ONLY ===
   masana.js toggles .is-scrolled on THIS element past 8px of scroll
   (assets/js/masana.js, ~L209). No Elementor control reaches a scroll-state
   condition, so per CLAUDE.md C-2 this lives here, scoped with ".elementor-790 .elementor-element.elementor-element-mhdr002"
   (Elementor replaces it with .elementor-element.elementor-element-mhdr002 --
   this exact header instance only). Desktop/tablet only: the <=900px
   hamburger header (logo + burger) is untouched.

   HOME PAGE ONLY (2026-09-08): Pixun, having seen it live -- "el efecto del
   header ... solamente debe aplicarse a la home, para evitar que se vea el
   logo dos veces". masana.js toggles .is-scrolled on EVERY page (it carries
   no page check -- masana.js ~L205-217 targets ".site-header" unconditionally)
   but the effect this class drives must not. show_on_front=page with
   page_on_front=767 makes WordPress put body class "home" on the real front
   page only, so every .elementor-790 .elementor-element.elementor-element-mhdr002 in THIS block (and the two blocks below it)
   is prefixed "body.home " ahead of the ".elementor-790 .elementor-element.elementor-element-mhdr002" token Elementor
   substitutes. Off the front page .is-scrolled still toggles (harmless --
   nothing here reads it there) and the header falls back to the theme/
   Elementor default plus the site-wide stabilization block above: logo
   visible from the top, nav in its normal position, no transition, no
   movement.
   TRAP: this scoping is by body class, not by post ID. If the Spanish site
   (Polylang, currently hidden) is ever switched back on, its home page 1036
   carries body class "page-id-1036", NOT "home" -- WordPress only assigns
   "home" to the one page registered as show_on_front, which is 767. The
   effect would silently not apply to the Spanish home if it goes live
   unchanged. Flagged, not fixed -- out of scope for this ticket. */
@media (min-width: 901px) {

  /* Logo: collapses to 0 width by default (page load / before scrolling);
     opens on .is-scrolled. margin-right:-24px cancels this row's own 24px
     gap (--sp-6 on .header-inner) so the nav lands flush on the header's
     left edge instead of 24px short of it. 300px clears every responsive
     logo width (190/158/138px) -- it only has to be *finite* so the
     transition can interpolate; browsers cannot tween to/from `none`. */
  body.home .elementor-790 .elementor-element.elementor-element-mhdr002 .wordmark {
    max-width: 0;
    opacity: 0;
    margin-right: -24px;
    overflow: hidden;
    transition: max-width var(--dur-mid) var(--ease-smooth),
                opacity var(--dur-mid) var(--ease-smooth),
                margin-right var(--dur-mid) var(--ease-smooth);
  }
  body.home .elementor-790 .elementor-element.elementor-element-mhdr002.is-scrolled .wordmark {
    max-width: 300px;
    opacity: 1;
    margin-right: 0;
  }

  /* Nav travel: .header-right grows to fill the space the logo vacated, and
     the spacer between the nav and the social icons grows with it -- so the
     nav lands at the header's true left edge while the icons/CTA stay
     pinned right. Collapsing both back to flex-grow:0 on .is-scrolled
     reproduces today's cluster exactly.
     NOTE: this is a direct `flex-grow`, not Elementor's own `--flex-grow`
     custom property. No panel control expresses a scroll condition, and
     neither element carries a panel Size/Flex-Grow choice today, so this
     shadows no choice Pixun made. If Flex Grow is ever set from the panel
     on Header Right or this spacer, it will govern the SCROLLED state only
     -- the pre-scroll state stays hardcoded to 1/0, flagged here rather
     than hidden. */
  body.home .elementor-790 .elementor-element.elementor-element-mhdr002 .header-right,
  body.home .elementor-790 .elementor-element.elementor-element-mhdr002 .header-nav-spacer {
    flex-grow: 1;
    transition: flex-grow var(--dur-mid) var(--ease-smooth);
  }
  body.home .elementor-790 .elementor-element.elementor-element-mhdr002.is-scrolled .header-right,
  body.home .elementor-790 .elementor-element.elementor-element-mhdr002.is-scrolled .header-nav-spacer {
    flex-grow: 0;
  }

  @media (prefers-reduced-motion: reduce) {
    body.home .elementor-790 .elementor-element.elementor-element-mhdr002 .wordmark,
    body.home .elementor-790 .elementor-element.elementor-element-mhdr002 .header-right,
    body.home .elementor-790 .elementor-element.elementor-element-mhdr002 .header-nav-spacer {
      transition: none;
    }
  }
}

/* === Header row 901-944px scrolled-state overflow fix -- HOME PAGE ONLY (2026-09-08) ===
   MEASURED (CDP, real chromium, .header-inner scrollWidth - clientWidth):
     901px scrolled = 15px over | 905 = 11 | 910 = 7 | 915 = 3 | 918 = 0 | >=919 = 0
   Only the SCROLLED state overflows -- at top of page the header logo is
   collapsed to 0 width (see .wordmark rule above) so there is always slack.
   Once scrolled, the logo reopens and needs ~15px more than the row has at
   901px. This exists only where the logo actually collapses/reopens, i.e.
   the home page -- prefixed body.home for the same reason as the block
   above.

   ROOT CAUSE, not a guess -- checked live via CDP.getMatchedStylesForNode:
   .header-inner's actual `gap` does NOT come from Elementor's own
   `--row-gap`/`--column-gap` variables (the ones this container's own Gap
   panel control writes). The theme's own assets/css/masana.css carries
   `.header-inner { gap: var(--sp-6); }` (masana.css ~L295-299) -- a literal,
   non-var `gap` declaration at the SAME specificity as Elementor's own
   `.elementor-element:where(.e-con-full,...){gap:var(--row-gap) var(--column-gap)}`,
   and masana.css loads later in the document, so it wins by source order.
   Practical effect: THE PANEL'S GAP CONTROL ON THIS CONTAINER IS ALREADY
   DEAD -- changing "Gap" in Style > Layout for Header Inner does nothing,
   because nothing reads --column-gap/--row-gap here. That is a pre-existing
   condition, not introduced by this fix, and it is flagged rather than
   quietly worked around -- it is a candidate for a real fix (retire the
   `.header-inner{gap:...}` line from masana.css and let the panel govern)
   but that is a separate, wider change and not this ticket.

   Because the property this element actually obeys is a literal `gap`
   (not a variable), overriding --column-gap here (the "correct", panel-safe
   lever) has zero effect -- verified: it changes the custom property's own
   cascaded value but the winning `gap` declaration never reads it. The only
   working lever is the same kind of literal, scoped override the site-wide
   stabilization block above already uses for the same reason (nowrap,
   flex-shrink) -- a widget/theme default, not a panel choice, per
   CLAUDE.md's own C-2 exception.

   Scoped three ways, deliberately narrow:
   - .is-scrolled only -- the top state never overflows, so it is untouched.
   - min-width:901 / max-width:944 -- Pixun's own boundary: "nothing may
     change at >=945px". Proved by CDP measurement: nav-first-item-x and
     the CTA's right edge are pixel-identical before/after at 945/1024/1440.
   - column-gap only (not the `gap` shorthand) -- row-gap is untouched.

   clamp(6px, calc(100vw - 895px), 24px) is linear across the band: 6px at
   901 (recovers 18px against a measured 15px shortfall -- 3px slack), rising
   1:1 with viewport width, reaching 24px (today's unchanged value) by 919px
   and clamped there for the rest of the band. No hard jump at either edge:
   901 ties smoothly into the .is-scrolled entry state, and by 944/945 the
   value already equals masana.css's own 24px, so the media-query boundary
   is invisible. */
@media (min-width: 901px) and (max-width: 944px) {
  body.home .elementor-element.elementor-element-mhdr002.is-scrolled .header-inner {
    column-gap: clamp(6px, calc(100vw - 895px), 24px);
  }
}

/* === Language switcher hidden, scrolled state, 901-1024px -- HOME PAGE ONLY (2026-09-08) ===
   The two rules above already tuned this row to the pixel for its EXISTING
   content (nav+socials+CTA) at 901-944px scrolled, with as little as 3px of
   slack (see the fix immediately above). The language switcher
   ([masana_lang_switcher], widget mhdr010) is new content this budget was
   never measured against.

   MEASURED, not guessed: with the switcher present, 901/920/944px scrolled
   overflow by 21-22px (Catalan) that did not exist before it was added.
   Removing the switcher's own width cannot be recovered from elsewhere in
   this row — every other child is already pinned flex-shrink:0 by the
   site-wide stabilization block above, on purpose, so the deficit has
   nowhere else to go. Hiding the switcher in exactly this band/state is the
   only change that adds no risk to the pixel-identical-at->=945px guarantee
   measured for this header.

   The TOP (unscrolled) state is untouched: header-right inherits the space
   the collapsed logo frees up there, and the switcher simply shrinks inside
   it (flex-shrink:1, no override) rather than overflowing, so it stays
   visible and reachable before the visitor scrolls.

   HOME PAGE ONLY, same as the two blocks above (2026-09-08): this
   .is-scrolled state, and the overflow it causes, only exists on the home
   page now.

   NOT FIXED HERE, flagged instead: the Spanish nav ("¿Quiénes somos?" etc.)
   is measurably wider than the Catalan nav this row was tuned against, and
   overflows this same 901-1024px scrolled band by 89-108px WITH THE
   SWITCHER REMOVED ENTIRELY — a pre-existing gap this ticket exposed by
   wiring the Spanish menu into this header, not one it created. Redoing
   this row's scroll-width budget for variable-length nav text is a wider
   change than one shortcode widget's visibility and needs its own
   CDP-measured pass, the same way the 901-944px fix above got one. */
@media (min-width: 901px) and (max-width: 1024px) {
  body.home .elementor-790 .elementor-element.elementor-element-mhdr002.is-scrolled .lang-switcher {
    display: none;
  }
}/* End custom CSS */