/**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/
/**
 * Astra sizes .alignfull sections at 100vw, which counts the scrollbar, and
 * centres them on a container that does not. Every full-bleed section ends up
 * ~8px wider than the visible area and the page can be dragged sideways.
 *
 * clip, not hidden: hidden would turn this into a scroll container and break
 * the sticky header. clip only trims the overflow.
 */
html {
	overflow-x: clip;
}

/**
 * Astra prints the page title as an h1 above the content. Our pages open with
 * a hero that carries its own h1, so the page ends up with two — which is a
 * duplicate, not just a stray heading.
 *
 * Tied to the hero on purpose: pages still running on Astra's default layout
 * keep their title, because hiding it there would leave them with no h1 at all.
 */
body:has(.unei-hero, .unei-sshero, .unei-hiport) .entry-header {
	display: none;
}

/**
 * The history page opens straight under the header, as the Lovable prototype
 * does: Astra's 4em margin above and below #primary would leave white bands
 * around the full-bleed sections.
 */
body.ast-plain-container.ast-no-sidebar:has(.unei-hiport) #primary {
	margin-top: 0;
	margin-bottom: 0;
}

/**
 * Astra underlines every link inside .entry-content — and it adds the
 * .ast-single-post class to pages too, not just posts. That rule scores 0,2,1
 * and beats block-level selectors, so links in UNEI blocks are cleared here once.
 */
.ast-single-post .entry-content a[class*="unei-"] {
	text-decoration: none;
}

/**
 * Sticky header: Astra Addon paints the menu hover with --ast-global-color-0
 * (#046bd2, its default blue) while the transparent header is already yellow.
 * The class is doubled so this beats the addon's rule whatever the load order.
 */
.ast-sticky-active.ast-sticky-active .main-header-menu .menu-link:hover,
.ast-sticky-active.ast-sticky-active .main-header-menu .menu-item:hover > .menu-link,
.ast-sticky-active.ast-sticky-active .main-header-menu .menu-item.focus > .menu-link,
.ast-sticky-active.ast-sticky-active .main-header-menu .ast-menu-toggle:hover,
.ast-sticky-active.ast-sticky-active .main-header-menu .menu-item:hover > .ast-menu-toggle {
	color: #fcba24;
}

/**
 * Sticky header under the admin bar: Astra Addon's script sets an inline top
 * 10px short of the admin bar (22 for 32, 36 for 46), so the bar jumped up
 * for logged-in users. Up to 600px the admin bar scrolls away and 0 is right.
 */
@media (min-width: 783px) {
	.admin-bar .ast-primary-header-bar.ast-sticky-active {
		top: 32px !important;
	}
}

@media (min-width: 601px) and (max-width: 782px) {
	.admin-bar .ast-primary-header-bar.ast-sticky-active {
		top: 46px !important;
	}
}

/**
 * Full-bleed sections: the width of the window, minus its scrollbar.
 *
 * Astra breaks .alignfull out of the rail with `calc(50% - 50vw)`, and 100vw
 * counts the scrollbar. On a 1440 window with 1425 of usable width every
 * section came out 15 too wide and sat 7 to the left; on a phone that is 4% of
 * the screen and it showed. Container units measure the container, not the
 * viewport, so .ast-container becomes the yardstick and the scrollbar drops
 * out of the sum. The blocks read the same 100cqw for their rails.
 *
 * Astra puts .ast-plain-container and .ast-no-sidebar on the body itself, so
 * the selector has to hang off it — `body .ast-plain-container` asks for a
 * descendant that does not exist and matches nothing at all. .alignfull is
 * doubled to outscore both Astra's four classes and each block's own reset.
 */
/*
 * On .site-content, not .ast-container: container units measure the content
 * box, and .ast-container carries 20 of side padding, so 100cqw came out as
 * the 335 of the rail instead of the 375 the window really has — and the
 * bleed computed to exactly zero. .site-content has no padding of its own.
 */
.site-content {
	container-type: inline-size;
}

body.ast-plain-container.ast-no-sidebar .entry-content > .alignfull.alignfull,
body.ast-page-builder-template .ast-no-sidebar .entry-content > .alignfull.alignfull {
	width: auto;
	max-width: none;
	margin-left: calc(50% - 50cqw);
	margin-right: calc(50% - 50cqw);
}

/**
 * Buttons on a phone.
 *
 * Every block draws its call to action at the size the 1200 rail asks for —
 * 24 of type on 24 of padding in the widest of them. On a 390 screen that is a
 * slab: the same button takes a third of the width it does on a desktop, which
 * is the opposite of the proportion the design keeps. One rule brings them all
 * down, since they are the same shape everywhere.
 */
@media ( max-width: 640px ) {
	.entry-content [class*="unei-"][class*="__btn"],
	.entry-content [class*="unei-"][class*="__boton"] {
		padding: 12px 18px;
		font-size: 15px;
		line-height: 20px;
	}

	.entry-content [class*="unei-"][class*="__btn"] svg {
		width: 18px;
		height: 18px;
	}

	.entry-content input[type="submit"] {
		padding: 14px 48px 14px 18px;
		font-size: 15px;
		line-height: 20px;
		background-position: right 18px center;
	}
}

/* Pie en móvil ------------------------------------------------------------ */

/*
 * The footer's own styles live in the customizer's Additional CSS, which loads
 * after this file, so every rule here is written one class heavier than the one
 * it overrides — that is what the doubled class names are for, not decoration.
 *
 * On a phone the footer was 1811px tall: more than two full screens of links
 * under a page that had already ended. Four stacked columns became two, the
 * seals shrank to one row and the air between everything came down. It now
 * measures 1279 — still long, because there are twenty links in it, but it is
 * a footer again instead of a second page.
 */
@media ( max-width: 640px ) {
	.site-above-footer-wrap.site-above-footer-wrap {
		padding: 40px 0 24px;
	}

	.site-above-footer-wrap .site-above-footer-inner-wrap.site-above-footer-inner-wrap {
		grid-template-columns: 1fr 1fr;
		gap: 32px 24px;
	}

	/* Address, mail, phone and the social row need the whole width. */
	.site-above-footer-wrap .site-footer-above-section-1 {
		grid-column: 1 / -1;
	}

	.site-above-footer-wrap .footer-widget-area.widget-area .widget-title {
		margin-bottom: 10px;
		font-size: 15px;
	}

	.site-above-footer-wrap .footer-widget-area.widget-area li.menu-item {
		margin-bottom: 8px;
	}

	.site-above-footer-wrap .unei-fbrand__logo img {
		width: 140px;
		height: 33px;
	}

	.site-above-footer-wrap .unei-fbrand__addr {
		margin-top: 16px;
		font-size: 15px;
	}

	.site-above-footer-wrap .unei-fbrand__mail {
		margin-top: 8px;
		font-size: 15px;
	}

	.site-above-footer-wrap .unei-fbrand__tel {
		margin-top: 6px;
		font-size: 15px;
	}

	.site-above-footer-wrap .unei-fbrand ul.unei-fsocial.unei-fsocial {
		margin-top: 20px;
		gap: 12px;
	}

	.site-above-footer-wrap .unei-fsocial svg {
		width: 24px;
		height: 24px;
	}

	.site-primary-footer-wrap.site-primary-footer-wrap {
		padding: 16px 0 20px;
	}

	/*
	 * The four seals at their design width wrapped into three rows, 175px of
	 * certificates. Scaled to 66% they sit on one line with room to spare.
	 */
	.site-primary-footer-wrap .unei-fseals {
		gap: 16px;
	}

	.site-primary-footer-wrap .unei-fseals img[alt="AENOR"] {
		width: 84px;
	}

	.site-primary-footer-wrap .unei-fseals img[alt="ISO 9001:2015"] {
		width: 48px;
	}

	.site-primary-footer-wrap .unei-fseals img[alt="ISO 14001:2015"] {
		width: 49px;
	}

	.site-primary-footer-wrap .unei-fseals img[alt^="EFQM"] {
		width: 31px;
	}

	.site-below-footer-wrap .site-below-footer-inner-wrap.site-below-footer-inner-wrap {
		padding: 14px 0;
	}
}

/*
 * The four legal links: two and two. They were laid out with flex-wrap, and
 * «Política de Cookies» plus «Política de Calidad» came to 337 against a 327
 * rail — ten pixels over, so each one dropped onto a line of its own and the
 * row read as 2, 1, 1. A grid of two columns settles it whatever the labels
 * end up saying.
 *
 * The id is not decoration either: Astra's footer menu is styled through
 * #astra-footer-menu in the customizer, and no class selector outranks an id.
 */
@media ( max-width: 640px ) {
	.site-below-footer-wrap #astra-footer-menu {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px 0;
	}

	.site-below-footer-wrap #astra-footer-menu > li {
		text-align: center;
	}

	.site-below-footer-wrap #astra-footer-menu .menu-link {
		padding: 0 8px;
	}
}

/* Breadcrumbs.
   Astra hands over its own trail markup; this only parks it under the hero,
   on the same 900px column and 24px gutter the content blocks use. */
.unei-breadcrumbs {
	max-width: 900px;
	margin: 0 auto;
	padding: 20px 24px 0;
}

.unei-breadcrumbs .ast-breadcrumbs-wrapper,
.unei-breadcrumbs .ast-breadcrumbs {
	padding: 0;
	text-align: left;
	font-size: 14px;
}

/* Corporate and compliance links, in the same band as the certification seals.
   The whistleblower channels (Ley 2/2023) and the transparency links live in
   the current unei.com footer and had to survive the redesign; the ones that
   point at pages the new site does not have yet are still pending. */
.site-primary-footer-wrap .unei-fcorp {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 24px;
	margin: 16px 0 0;
	padding: 0;
	list-style: none;
}

.site-primary-footer-wrap .unei-fcorp li {
	margin: 0;
}

.site-primary-footer-wrap .unei-fcorp a {
	color: inherit;
	font-size: 14px;
	line-height: 1.4;
	text-decoration: none;
	opacity: 0.85;
}

.site-primary-footer-wrap .unei-fcorp a:hover,
.site-primary-footer-wrap .unei-fcorp a:focus-visible {
	opacity: 1;
	text-decoration: underline;
}

/* Document pages: Transparencia, Certificados de calidad, Clientes.
 *
 * The client asked for these to stay as close to the live unei.com as
 * possible, so every number below was measured on that site at a 1440
 * viewport, not taken from a screenshot:
 *
 *   accordion   title 26/30 bold, control 40x40, items 85 apart (54 + 31),
 *               no card, no border, content wrap padded 10px 0, links 18/39
 *   certificates 3 columns of 433 inside a 1300 row, rows 132 apart, links 16
 *   clients      2 columns of 650, logo at its own size, two plain centred
 *               links 16px, 36 apart. No buttons.
 *
 * Two deliberate departures: the face is this site's Open Sans, not the old
 * Aeonik, and links take the theme colour rather than the old #6589ed blue,
 * which is not in the new palette.
 */

/* Each panel closes on a 1px rule the width of the column: measured on the
   live site as 16 vc_separator elements, all rgb(247,190,104). */
.entry-content .wp-block-details {
	margin: 0 0 31px;
	padding: 0 0 31px;
	border: 0;
	border-bottom: 1px solid #f7be68;
	border-radius: 0;
	background: none;
}

.entry-content .wp-block-details > summary {
	display: flex;
	align-items: center;
	gap: 18px; /* the control sits 42 left of the title, less its own 24 */
	min-height: 54px;
	cursor: pointer;
	color: #474949;
	font-family: "Open Sans", sans-serif;
	font-size: 26px;
	font-weight: 700;
	line-height: 1.1538; /* 30/26 */
	list-style: none;
}

.entry-content .wp-block-details > summary::-webkit-details-marker {
	display: none;
}

/* The control is a plus to the LEFT of the title, not a chevron to the right,
   and it turns into a minus once the panel is open. */
.entry-content .wp-block-details > summary::before {
	content: "+";
	flex: 0 0 24px;
	width: 24px;
	color: #474949;
	font-size: 26px;
	font-weight: 400;
	line-height: 1;
	text-align: center;
}

.entry-content .wp-block-details[open] > summary::before {
	content: "\2013"; /* en dash, which is what the open state draws */
}

.entry-content .wp-block-details > summary:focus-visible {
	outline: 2px solid #fcba24;
	outline-offset: 4px;
}

/* The old site slid these open in 400ms; a bare <details> snaps. Modern
   engines animate the content box once interpolate-size lets height travel to
   and from auto, with allow-discrete carrying the display flip along. Where
   that is unsupported the panel opens at once, as it did before. */
:root {
	interpolate-size: allow-keywords;
}

.entry-content .wp-block-details::details-content {
	block-size: 0;
	overflow: hidden;
	transition:
		block-size 400ms cubic-bezier(0.4, 0, 0.2, 1),
		content-visibility 400ms allow-discrete;
}

.entry-content .wp-block-details[open]::details-content {
	block-size: auto;
}

.entry-content .wp-block-details ul {
	margin: 0;
	padding: 10px 0;
	list-style: none;
}

.entry-content .wp-block-details li {
	margin: 0;
	font-size: 18px;
	line-height: 2.1667; /* 39/18 */
}

@media ( prefers-reduced-motion: reduce ) {
	.entry-content .wp-block-details::details-content {
		transition: none;
	}
}

/* Transparencia sets the heading against the accordion, two halves of the
   rail, exactly as the live site does. The rows there sit 137 apart. */
.page-id-508 .entry-content > .wp-block-columns {
	margin-bottom: 137px;
	gap: 0;
}

.page .entry-content .wp-block-heading {
	margin: 0 0 24px;
	color: #474949;
	font-family: "Open Sans", sans-serif;
	font-size: 40px;
	font-weight: 700;
	line-height: 1.2;
}

/* The funding notice closes the page across the full rail. */
.page-id-508 .entry-content > p {
	border-top: 1px solid #f7be68;
	padding-top: 56px;
	max-width: none;
	font-size: 16px;
	line-height: 1.65;
}

.unei-ayuda-logos {
	margin: 40px 0 120px;
}

.unei-ayuda-logos img {
	width: 100%;
	max-width: 1250px;
	height: auto;
}

/* Certificates: three across, then down. */
.page-id-173 .entry-content > ul.wp-block-list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 106px 0; /* rows measured 132 apart, less the 26 line box */
	margin: 56px 0 120px;
	padding: 0;
	list-style: none;
}

.page-id-173 .entry-content > ul.wp-block-list li {
	margin: 0;
	font-size: 16px;
	line-height: 1.65; /* 26.4/16 */
}

/* Measured on the live site: these read as plain dark text, not as coloured
   links, and only underline under the cursor. */
.page-id-173 .entry-content > ul.wp-block-list a,
.page-id-509 .entry-content .unei-cliente-enlaces a,
.entry-content .wp-block-details li a {
	color: #474949;
	text-decoration: none;
}

.page-id-173 .entry-content > ul.wp-block-list a:hover,
.page-id-173 .entry-content > ul.wp-block-list a:focus-visible,
.page-id-509 .entry-content .unei-cliente-enlaces a:hover,
.page-id-509 .entry-content .unei-cliente-enlaces a:focus-visible,
.entry-content .wp-block-details li a:hover,
.entry-content .wp-block-details li a:focus-visible {
	text-decoration: underline;
}

/* Clients: logo, name, and two plain links under it. No buttons. */
.page-id-509 .entry-content .wp-block-column {
	text-align: center;
}

.page-id-509 .entry-content .wp-block-column figure {
	display: flex;
	justify-content: center;
	margin: 0 0 40px;
}

.page-id-509 .entry-content .wp-block-column figure img {
	width: auto;
	max-width: 100%;
}

.page-id-509 .entry-content .wp-block-column h3 {
	margin: 0 0 40px;
	color: #474949;
	font-family: "Open Sans", sans-serif;
	font-size: 20px;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.page-id-509 .entry-content .unei-cliente-enlaces p {
	margin: 0 0 17px; /* the two sat 36 apart, less the 19 line box */
	font-size: 16px;
	line-height: 1.2;
}

@media ( max-width: 900px ) {
	.page-id-173 .entry-content > ul.wp-block-list {
		grid-template-columns: 1fr;
		gap: 24px 0;
	}

	.entry-content .wp-block-details > summary {
		font-size: 20px;
	}
}

/* The uneiverso closes the page; give the content above it the same breathing
   room the other inner pages leave. */
.page-id-509 .entry-content > .wp-block-columns {
	margin-bottom: 120px;
}

/* One body font for the whole site.
 *
 * Astra's typography is left at "inherit", so its default is the system
 * stack, and every UNEI block declares Open Sans for itself. That was fine
 * while every page was built from blocks — but the legal texts, Transparencia,
 * Certificados and Clientes are built from core blocks, and they were reading
 * in -apple-system: 77 elements of the privacy policy against 12 in Open Sans.
 *
 * Set here rather than in the Customizer on purpose. Astra's font picker would
 * pull Open Sans from Google, and this theme serves all three faces itself as
 * woff2 with no external request at all. Headings keep whatever the blocks
 * give them; UNEI Namu is declared with enough specificity to win.
 */
body,
button,
input,
select,
optgroup,
textarea,
.entry-content,
.ast-breadcrumbs-wrapper {
	font-family: "Open Sans", sans-serif;
}

/**
 * Astra serves single posts inside its narrow container, which Astra caps at
 * 750px: the article sits on a rail barely half the 1200 one the rest of the
 * site uses. 1400 is the width asked for.
 *
 * Scoped to body.single-post so it beats Astra's own
 * `.ast-narrow-container .site-content > .ast-container` rule on specificity
 * instead of load order, and so the narrow layout keeps its size anywhere
 * else it is used.
 */
body.single-post .site-content > .ast-container {
	max-width: 1400px;
}
