/**
 * SIMEC AquaFish — base front-end styles.
 * theme.json carries the tokens; this carries component + layout behavior
 * that theme.json cannot express. Everything is logical-property based so
 * Arabic (RTL, default) and English (LTR) share one codebase.
 */

/* ---------- Root helpers ---------- */
:root {
	--simec-radius: 4px;
	--simec-radius-lg: 8px;
	--simec-shadow: 0 16px 32px rgba(0, 31, 62, 0.08);
	--simec-container: 1200px;
	/* Marine palette — global tokens (used by header/footer + every section). */
	--simec-navy: #003462;
	--simec-navy-deep: #001f3e;
	--simec-blue: #12ABE3;
	--simec-blue-light: #45c5fe;
	--simec-orange: #EA872D;
	--simec-green: #76C376;
	--simec-flow: url('../img/flowing-water.svg');
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/* Keyboard focus — accessibility, both directions. */
:where(a, button, input, textarea, select, .wp-block-button__link):focus-visible {
	outline: 3px solid var(--wp--preset--color--secondary);
	outline-offset: 2px;
	border-radius: 2px;
}

/* ---------- Buttons ---------- */
.wp-block-button.is-style-cta .wp-block-button__link {
	background-color: var(--wp--preset--color--accent);
	color: #fff;
}
.wp-block-button.is-style-cta .wp-block-button__link:hover {
	background-color: #cf7622;
}
.wp-block-button.is-style-secondary .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--secondary);
	box-shadow: inset 0 0 0 2px var(--wp--preset--color--secondary);
}
.wp-block-button.is-style-secondary .wp-block-button__link:hover {
	background: var(--wp--preset--color--secondary);
	color: #fff;
}

/* ---------- Site header ---------- */
.simec-header {
	position: sticky; inset-block-start: 0; z-index: 100;
	background: rgba(255, 255, 255, 0.92);
	backdrop-filter: saturate(140%) blur(10px);
	border-block-end: 1px solid var(--wp--preset--color--outline);
	transition: box-shadow .2s ease;
}
.simec-header.is-scrolled { box-shadow: 0 6px 20px rgba(0,31,62,.08); }

/* Transparent overlay header on the homepage; turns solid on scroll. */
.simec-header--overlay { position: fixed; inset-block-start: 0; inset-inline: 0; background: linear-gradient(180deg, rgba(0,16,34,.72) 0%, rgba(0,16,34,.34) 55%, rgba(0,16,34,0) 100%); border-block-end: 1px solid rgba(255,255,255,.12); backdrop-filter: none; }
.simec-header--overlay .simec-brand__word { color: #9fd8ff; }
.simec-header--overlay .simec-brand__mark, .simec-header--overlay .simec-lang a { text-shadow: 0 1px 8px rgba(0,20,40,.5); }
.simec-header--overlay .simec-brand__mark { color: #fff; }
.simec-header--overlay .simec-brand__word { color: #79d1ff; }
.simec-header--overlay .simec-nav__menu a { color: rgba(255,255,255,.9); }
.simec-header--overlay .simec-nav__menu a:hover, .simec-header--overlay .simec-nav__menu .current-menu-item > a { color: #fff; background: rgba(255,255,255,.14); }
.simec-header--overlay .simec-lang a { color: rgba(255,255,255,.8); }
.simec-header--overlay .simec-lang .current-lang a, .simec-header--overlay .simec-lang a:hover { color: #fff; }
.simec-header--overlay .simec-nav__toggle span { background: #fff; }
.simec-header--overlay.is-scrolled { position: fixed; background: rgba(255,255,255,.96); backdrop-filter: saturate(140%) blur(10px); border-block-end: 1px solid var(--wp--preset--color--outline); box-shadow: 0 6px 20px rgba(0,31,62,.1); }
.simec-header--overlay.is-scrolled .simec-brand__mark { color: var(--wp--preset--color--primary); }
.simec-header--overlay.is-scrolled .simec-brand__word { color: var(--wp--preset--color--secondary); }
.simec-header--overlay.is-scrolled .simec-nav__menu a { color: var(--wp--preset--color--on-surface-variant); }
.simec-header--overlay.is-scrolled .simec-lang a { color: var(--wp--preset--color--on-surface-variant); }
.simec-header--overlay.is-scrolled .simec-nav__toggle span { background: var(--wp--preset--color--primary); }
.simec-header__in { max-inline-size: 1360px; margin-inline: auto; display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.6rem clamp(1rem, 3vw, 2.5rem); }
.simec-brand { display: inline-flex; align-items: baseline; gap: 0.4rem; text-decoration: none; }
/* Custom logo (image) in the header — navy asset, sized to the header. */
.simec-brand--logo { display: inline-flex; align-items: center; }
.simec-brand--logo .custom-logo-link { display: inline-flex; align-items: center; line-height: 0; }
.simec-brand--logo .custom-logo { max-block-size: 40px; max-inline-size: min(280px, 46vw); inline-size: auto; block-size: auto; }
@media (max-width: 600px) { .simec-brand--logo .custom-logo { max-block-size: 32px; max-inline-size: 190px; } }
/* On the transparent header over the hero (dark), flip the navy logo to white;
   once scrolled (solid header) it returns to navy. */
.simec-header--overlay .simec-brand--logo .custom-logo { filter: brightness(0) invert(1); }
.simec-header--overlay.is-scrolled .simec-brand--logo .custom-logo { filter: none; }
.simec-brand__mark { font-family: var(--wp--preset--font-family--heading); font-weight: 800; font-size: 1.35rem; color: var(--wp--preset--color--primary); letter-spacing: 0.02em; }
.simec-brand__word { font-family: var(--wp--preset--font-family--heading); font-weight: 600; font-size: 1.1rem; color: var(--wp--preset--color--secondary); }
.simec-brand img { block-size: 48px; inline-size: auto; }

.simec-nav { display: flex; align-items: center; gap: 0.7rem; }
.simec-nav__menu { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 0.1rem; }
.simec-nav__menu a { display: block; font-family: var(--wp--preset--font-family--heading); font-weight: 600; font-size: 0.83rem; white-space: nowrap; color: var(--wp--preset--color--on-surface-variant); text-decoration: none; padding: 0.45rem 0.42rem; border-radius: 4px; transition: color .15s ease, background .15s ease; }
.simec-nav__menu a:hover, .simec-nav__menu .current-menu-item > a { color: var(--wp--preset--color--primary); background: var(--wp--preset--color--surface-container); }
.simec-nav__actions { display: flex; align-items: center; gap: 0.5rem; }
.simec-lang { list-style: none; display: flex; gap: 0.25rem; margin: 0; padding: 0; text-transform: uppercase; font-size: 0.78rem; font-weight: 700; }
.simec-lang li { line-height: 1; }
.simec-lang a { display: inline-flex; align-items: center; gap: 0.25rem; color: var(--wp--preset--color--on-surface-variant); text-decoration: none; padding: 0.35rem 0.6rem; border: 1px solid var(--wp--preset--color--outline, #d6dbe1); border-radius: 999px; white-space: nowrap; text-transform: none; }
.simec-lang__switch a::before { content: "\1F310"; font-size: 0.9em; }
.simec-lang .current-lang a, .simec-lang a:hover { color: var(--wp--preset--color--primary); }
.simec-btn--sm { padding: 0.48rem 0.8rem; font-size: 0.78rem; white-space: nowrap; }
/* Dropdown sub-menus (grouped primary nav: Exhibition ▸, Visitors ▸, …) */
.simec-nav__menu .menu-item-has-children { position: relative; }
.simec-nav__menu .menu-item-has-children > a { display: inline-flex; align-items: center; gap: 0.3em; }
.simec-nav__menu .menu-item-has-children > a::after { content: ""; inline-size: 0.4em; block-size: 0.4em; border-inline-end: 1.5px solid currentColor; border-block-end: 1.5px solid currentColor; transform: translateY(-1px) rotate(45deg); opacity: .55; transition: transform .2s ease, opacity .2s ease; }
.simec-nav__menu .menu-item-has-children:hover > a::after, .simec-nav__menu .menu-item-has-children:focus-within > a::after { transform: translateY(1px) rotate(225deg); opacity: 1; }
.simec-nav__menu .sub-menu { list-style: none; margin: 0; padding: 0.4rem; position: absolute; inset-block-start: calc(100% + 8px); inset-inline-start: 0; min-inline-size: 224px; background: #fff; border: 1px solid var(--wp--preset--color--outline, #e2e7ec); border-radius: 12px; box-shadow: 0 20px 44px rgba(0,31,62,.18); display: grid; gap: 2px; opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .18s ease, transform .18s ease, visibility .18s; z-index: 60; }
.simec-nav__menu .sub-menu::before { content: ""; position: absolute; inset-block-end: 100%; inset-inline-start: 0; inline-size: 100%; block-size: 8px; }
.simec-nav__menu .menu-item-has-children:hover > .sub-menu, .simec-nav__menu .menu-item-has-children:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.simec-nav__menu .sub-menu a { color: var(--wp--preset--color--on-surface-variant); white-space: nowrap; font-size: 0.82rem; padding: 0.5rem 0.7rem; border-radius: 7px; }
.simec-nav__menu .sub-menu a:hover, .simec-nav__menu .sub-menu .current-menu-item > a { color: var(--wp--preset--color--primary); background: var(--wp--preset--color--surface-container, #eef3f7); }
/* On the transparent front-page header, top items are white but the dropdown is a solid light card → keep dark ink inside it. */
.simec-header--overlay .simec-nav__menu .sub-menu a { color: var(--wp--preset--color--on-surface-variant); text-shadow: none; }
.simec-header--overlay .simec-nav__menu .sub-menu a:hover { color: var(--wp--preset--color--primary); background: var(--wp--preset--color--surface-container, #eef3f7); }

.simec-nav__toggle { display: none; flex-direction: column; gap: 5px; background: none; border: 0; cursor: pointer; padding: 0.5rem; }
.simec-nav__toggle span { inline-size: 24px; block-size: 2px; background: var(--wp--preset--color--primary); transition: transform .2s ease, opacity .2s ease; }

/* ---------- Footer ---------- */
/* Kill the FSE default block-gap that left a white strip between the final CTA
   and the footer — the footer must sit flush against the content above it. */
.wp-site-blocks > footer, .wp-site-blocks > .wp-block-template-part, .wp-site-blocks > main + * { margin-block-start: 0 !important; }
main.wp-block-group { margin-block-end: 0 !important; }
.simec-footer { position: relative; overflow: hidden; margin-block-start: 0 !important; }
.simec-footer__cta { position: relative; z-index: 2; border-block-end: 1px solid rgba(255,255,255,.12); }
.simec-footer__cta-in { display: flex; flex-wrap: wrap; gap: 1.5rem 2rem; align-items: center; justify-content: space-between; padding-block: clamp(2.5rem, 5vw, 4rem); padding-inline: clamp(1rem, 5vw, 4rem); }
.simec-footer__cta .simec-h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); color: #fff; }
.simec-footer__grid { position: relative; z-index: 2; display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 2.5rem; padding-block: clamp(3rem, 6vw, 5rem); padding-inline: clamp(1rem, 5vw, 4rem); }
.simec-footer__brand p { color: rgba(255,255,255,.72); line-height: 1.6; margin: 0.75rem 0 0; max-inline-size: 42ch; }
.simec-footer__event { font-size: 0.9rem; color: rgba(255,255,255,.55) !important; }
.simec-brand--footer .simec-brand__mark { color: #fff; }
.simec-brand--footer .simec-brand__word { color: #79d1ff; }
.simec-footer__col h4 { font-family: var(--wp--preset--font-family--heading); font-size: 0.8rem; letter-spacing: 0.12em; text-transform: uppercase; color: #79d1ff; margin: 0 0 1rem; }
.simec-footer__col ul, .simec-fnav { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.6rem; }
.simec-footer__col a { color: rgba(255,255,255,.75); text-decoration: none; }
.simec-footer__col a:hover { color: #79d1ff; }
.simec-footer__social { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-block-start: 1rem; }
.simec-footer__social a { inline-size: 40px; block-size: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); transition: background .2s ease, border-color .2s ease, transform .2s ease; }
.simec-footer__social a:hover { background: var(--simec-blue); border-color: var(--simec-blue); transform: translateY(-2px); }
.simec-footer__social a svg { inline-size: 19px; block-size: 19px; }
.simec-footer__handle { color: rgba(255,255,255,.55); }
.simec-footer__logo { max-block-size: 56px; max-inline-size: 220px; inline-size: auto; block-size: auto; object-fit: contain; }
.simec-brand--footer .custom-logo { max-block-size: 56px; inline-size: auto; }
.simec-footer__bar { position: relative; z-index: 2; text-align: center; padding: 1.25rem; border-block-start: 1px solid rgba(255,255,255,.15); color: rgba(255,255,255,.5); font-size: 0.85rem; }

/* small inline icons */
/* (Section-specific icon sizing lives inside each section's HTML widget.) */

@media (max-width: 1120px) {
	.simec-nav__toggle { display: flex; }
	.simec-nav { position: fixed; inset-block-start: 64px; inset-inline: 0; background: #fff; flex-direction: column; align-items: stretch; gap: 0; padding: 1rem clamp(1rem,5vw,4rem) 1.5rem; border-block-end: 1px solid var(--wp--preset--color--outline); transform: translateY(-140%); transition: transform .25s ease; box-shadow: 0 20px 40px rgba(0,31,62,.12); }
	.simec-nav.is-open { transform: translateY(0); }
	.simec-nav__menu { flex-direction: column; align-items: stretch; gap: 0.1rem; }
	.simec-nav__menu a { padding: 0.75rem 0.5rem; }
	.simec-nav__actions { margin-block-start: 0.75rem; flex-wrap: wrap; }
	.simec-footer__grid { grid-template-columns: 1fr; gap: 2rem; }
	/* Mobile: the nav panel is a white sheet, so force dark ink even on the overlay header, and render sub-menus as indented static lists (no hover dropdown on touch). */
	.simec-header--overlay .simec-nav__menu a { color: var(--wp--preset--color--on-surface-variant); text-shadow: none; }
	.simec-header--overlay .simec-nav__menu a:hover, .simec-header--overlay .simec-nav__menu .current-menu-item > a { color: var(--wp--preset--color--primary); }
	.simec-nav__menu .menu-item-has-children > a::after { display: none; }
	.simec-nav__menu .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; background: transparent; padding: 0 0 0.35rem; min-inline-size: 0; display: block; }
	.simec-nav__menu .sub-menu a { padding-inline-start: 1.5rem; font-size: 0.9rem; opacity: .9; }
}

/* ---------- Mobile navigation open state (progressive) ---------- */

/* ---------- Institutional cards ---------- */
.simec-card {
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--outline);
	border-radius: var(--simec-radius-lg);
	padding: var(--wp--preset--spacing--50);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.simec-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--simec-shadow);
}

/* Sector cards carry an inline-start accent bar driven by a per-sector var. */
.simec-sector-card {
	--sector-color: var(--wp--preset--color--primary);
	border-inline-start: 4px solid var(--sector-color);
}
.simec-sector-card--aquaculture { --sector-color: #003462; }
.simec-sector-card--fisheries   { --sector-color: #12ABE3; }
.simec-sector-card--seafood     { --sector-color: #EA872D; }
.simec-sector-card--algae       { --sector-color: #76C376; }

/* ---------- Flowing-water motif (footer + hero) ---------- */
.simec-flow {
	position: relative;
	background-color: var(--wp--preset--color--primary-strong);
	background-image: url('../img/flowing-water.svg');
	background-size: 1200px auto;
	background-repeat: repeat-x;
	background-position: center bottom;
	color: #fff;
}

/* ---------- Coming-soon / TBA state ---------- */
.simec-coming-soon {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 1rem;
	border: 1px dashed var(--wp--preset--color--outline);
	border-radius: var(--simec-radius);
	color: var(--wp--preset--color--on-surface-variant);
	background: var(--wp--preset--color--surface-container);
	font-size: var(--wp--preset--font-size--sm);
	font-family: var(--wp--preset--font-family--heading);
	letter-spacing: 0.03em;
}
.simec-coming-soon__dot {
	inline-size: 8px;
	block-size: 8px;
	border-radius: 50%;
	background: var(--wp--preset--color--accent);
	animation: simec-pulse 1.8s ease-in-out infinite;
}
@keyframes simec-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50% { opacity: 0.4; transform: scale(0.7); }
}
@media (prefers-reduced-motion: reduce) {
	.simec-coming-soon__dot { animation: none; }
	.simec-card { transition: none; }
}

/* ---------- Meter bars (geo participation) ---------- */
.simec-meter {
	inline-size: 100%;
	block-size: 8px;
	background: var(--wp--preset--color--surface-container);
	border-radius: var(--simec-radius-lg);
	overflow: hidden;
}
.simec-meter span {
	display: block;
	block-size: 100%;
	background: linear-gradient(90deg, var(--wp--preset--color--primary), var(--wp--preset--color--secondary));
	border-radius: inherit;
}
.rtl .simec-meter span {
	background: linear-gradient(270deg, var(--wp--preset--color--primary), var(--wp--preset--color--secondary));
}

/* ---------- Mobile navigation open state (progressive) ---------- */
.simec-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--primary-strong);
}

/* ==========================================================================
   SHARED SECTION FOUNDATION (global, loads on every page)
   Section-specific styling lives INSIDE each Elementor HTML widget/pattern.
   Only genuinely shared scaffolding + reused components live here.
   ========================================================================== */

/* ---------- Elementor integration: SIMEC sections go full-bleed ---------- */
.elementor-section .elementor-container { max-width: 100% !important; }
[class*="elementor-widget-simec_"] .elementor-widget-container { padding: 0 !important; margin: 0 !important; }
[class*="elementor-widget-simec_"] { width: 100% !important; }
.elementor .elementor-widget-wrap { padding: 0 !important; }
.elementor-element.elementor-element .elementor-column-gap-default > .elementor-column > .elementor-widget-wrap { padding: 0 !important; }
.elementor-widget:not(:last-child) { margin-block-end: 0 !important; }

/* ---------- Section scaffolding (shared) ---------- */
/* ---------- Section rhythm system (one continuous premium page) ---------- */
/* Controlled, consistent vertical padding; adjacent sections butt together so
   background transitions — not empty white gaps — define the boundaries. */
.simec-sec { padding-block: clamp(3.25rem, 6vw, 5.5rem); padding-inline: clamp(1rem, 5vw, 4rem); position: relative; }
.simec-sec--tight { padding-block: clamp(2.5rem, 4.5vw, 4rem); }
/* Kill Elementor's inter-widget spacing so the section shortcodes stack seamlessly. */
.elementor-widget-html, .elementor-widget-html .elementor-widget-container { margin: 0 !important; padding: 0 !important; }
.elementor-widget-html + .elementor-widget-html { margin-block-start: 0 !important; }
/* Background treatments for visual rhythm (dark → tint → dark → light → …). */
.simec-sec--tint { background:
	linear-gradient(180deg, #eef6fb 0%, #f4fafd 100%); }
.simec-sec--tint2 { background:
	radial-gradient(120% 80% at 85% -10%, #e3f1fa 0%, rgba(227,241,250,0) 55%),
	linear-gradient(180deg, #f6fbfd 0%, #eef6fb 100%); }
.simec-sec--white { background: #fff; }
/* Very subtle marine wave/contour pattern for light sections (never competes with text). */
.simec-sec--waves::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	background-image: var(--simec-flow); background-repeat: repeat-x; background-position: center bottom;
	background-size: 1200px auto; opacity: 0.05; }
/* A hairline seam where two light sections meet, so they read as connected, not floating. */
.simec-sec--seam { border-block-start: 1px solid rgba(0,52,98,.06); }
.simec-wrap { max-inline-size: 1240px; margin-inline: auto; position: relative; z-index: 2; }
.simec-dark { background: var(--simec-navy); color: #fff; position: relative; overflow: hidden; }
.simec-dark--deep { background: radial-gradient(120% 120% at 50% 0%, #04568a 0%, var(--simec-navy) 45%, var(--simec-navy-deep) 100%); }
/* Navy CONTENT sections (why-attend, market) get controlled monochrome depth:
   a single-hue navy field (lighter at one corner → deep) plus the marine flow
   texture and a faint deep-sea vignette. This is a restrained brand-colour field,
   not a multi-hue "AI" gradient. Photo-backed dark sections don't use .simec-pattern. */
.simec-dark.simec-pattern { background: radial-gradient(130% 120% at 82% -25%, #0a5589 0%, #013a6b 46%, var(--simec-navy-deep) 100%); box-shadow: inset 0 -110px 130px -70px rgba(0,12,26,.5); }
.simec-pattern::before { content: ""; position: absolute; inset: 0; background-image: var(--simec-flow); background-repeat: repeat; background-size: 1000px auto; opacity: 0.16; pointer-events: none; mix-blend-mode: screen; }
.simec-dark .simec-eyebrow, .simec-dark h2, .simec-dark h3 { color: #fff; }

.simec-eyebrow { display: inline-flex; align-items: center; gap: 0.7rem; font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 0.82rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--simec-orange); margin-block-end: 0.6rem; }
.simec-eyebrow::before { content: ""; inline-size: 2.2rem; block-size: 2px; background: currentColor; }
.simec-h2 { font-family: var(--wp--preset--font-family--heading); font-weight: 800; font-size: clamp(2.1rem, 4.8vw, 3.4rem); line-height: 1.1; letter-spacing: -0.01em; margin: 0 0 0.6em; }
.simec-lead { font-size: clamp(1.05rem, 2vw, 1.35rem); line-height: 1.65; opacity: 0.9; max-inline-size: 52ch; }

/* ---------- Unified button system (shared) ---------- */
.simec-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.55rem; font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 0.95rem; line-height: 1; padding: 0.95rem 1.9rem; border-radius: 4px; text-decoration: none; transition: transform .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease; border: 2px solid transparent; cursor: pointer; }
.simec-btn svg { inline-size: 18px; block-size: 18px; }
.rtl .simec-btn svg { transform: scaleX(-1); }
.simec-btn:hover { transform: translateY(-2px); }
.simec-btn--lg { padding: 1.1rem 2.3rem; font-size: 1rem; }
.simec-btn--cta { background: var(--simec-orange); color: #fff; box-shadow: 0 10px 24px rgba(234,135,45,.28); }
.simec-btn--cta:hover { background: #d67620; box-shadow: 0 14px 30px rgba(234,135,45,.36); }
.simec-btn--ghost { background: transparent; border-color: var(--simec-blue); color: var(--simec-blue); }
.simec-btn--ghost:hover { background: var(--simec-blue); color: #fff; }
.simec-btn--light { background: #fff; color: var(--simec-navy); }
.simec-btn--light:hover { background: #eaf3fb; }
.simec-btn--glass { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.55); color: #fff; backdrop-filter: blur(6px); }
.simec-btn--glass:hover { background: #fff; color: var(--simec-navy); border-color: #fff; }
.simec-btn--outline-light { background: transparent; border-color: rgba(255,255,255,.6); color: #fff; }
.simec-btn--outline-light:hover { background: #fff; color: var(--simec-navy); }

/* ---------- Inline link (shared: About, Previews, …) ---------- */
.simec-link { display: inline-flex; align-items: center; gap: 0.45rem; font-family: var(--wp--preset--font-family--heading); font-weight: 700; color: var(--simec-navy); text-decoration: none; }
.simec-link svg { inline-size: 18px; block-size: 18px; transition: transform .2s ease; }
.rtl .simec-link svg { transform: scaleX(-1); }
.simec-link:hover { color: var(--simec-blue); }
.simec-link:hover svg { transform: translateX(4px); }
.rtl .simec-link:hover svg { transform: scaleX(-1) translateX(4px); }

/* ---------- Stat band (shared: Event snapshot + Market opportunity) ---------- */
.simec-stats__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-block-start: 0; }
.simec-stat { text-align: center; padding: 1.25rem 1rem; border-inline-start: 1px solid var(--wp--preset--color--outline-variant, #c3c6d0); }
.simec-stat:first-child { border-inline-start: 0; }
.simec-stat b { display: block; font-family: var(--wp--preset--font-family--heading); font-weight: 800; font-size: clamp(2.4rem, 5vw, 3.25rem); color: var(--simec-blue); line-height: 1; letter-spacing: -0.02em; }
.simec-stat .lab { display: block; margin-block-start: 0.6rem; font-weight: 700; color: var(--simec-navy); font-size: 1.05rem; }
.simec-stat .sub { display: block; color: var(--wp--preset--color--on-surface-variant); font-size: 0.88rem; margin-block-start: 0.1rem; }
@media (max-width: 900px) {
	.simec-stats__grid { grid-template-columns: repeat(2, 1fr); gap: 0.5rem 0; }
	.simec-stat:nth-child(3) { border-inline-start: 0; }
}
@media (max-width: 560px) {
	.simec-stats__grid { grid-template-columns: 1fr 1fr; }
}

/* ---------- Coming-soon chip (shared utility) ---------- */
.simec-coming-soon { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.95rem; border: 1px dashed var(--wp--preset--color--outline-variant, #c3c6d0); border-radius: 999px; color: var(--wp--preset--color--on-surface-variant); background: var(--wp--preset--color--surface-container, #eceef0); font-size: 0.78rem; font-family: var(--wp--preset--font-family--heading); font-weight: 700; letter-spacing: .03em; }
.simec-coming-soon__dot { inline-size: 8px; block-size: 8px; border-radius: 50%; background: var(--simec-orange); animation: simec-pulse 1.8s ease-in-out infinite; }
.simec-dark .simec-coming-soon { color: #cfe6fb; background: rgba(0,31,62,.4); border-color: rgba(121,209,255,.3); }

/* ---------- Meter (shared utility) ---------- */
.simec-meter { inline-size: 100%; block-size: 8px; background: rgba(255,255,255,.15); border-radius: 8px; overflow: hidden; }
.simec-meter span { display: block; block-size: 100%; background: linear-gradient(90deg, var(--simec-navy), var(--simec-blue)); }

/* ---------- Shared keyframe (pulse: hero badge + coming-soon dot) ---------- */
@keyframes simec-pulse { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .5; transform: scale(.75); } }

@media (prefers-reduced-motion: reduce) {
	.simec-coming-soon__dot { animation: none; }
	.simec-btn:hover { transform: none; }
}

/* ==========================================================================
   FORMS (Fluent Forms) — global brand styling (shared component)
   ========================================================================== */
.fluentform .ff-el-group { margin-block-end: 1.1rem; }
.fluentform .ff-el-input--label label,
.fluentform label { font-family: var(--wp--preset--font-family--heading); font-weight: 600; color: var(--simec-navy); font-size: 0.92rem; margin-block-end: 0.4rem; }
.fluentform input[type=text], .fluentform input[type=email], .fluentform input[type=tel],
.fluentform input[type=url], .fluentform input[type=number], .fluentform select, .fluentform textarea {
	inline-size: 100%; padding: 0.85rem 1rem; font-size: 1rem; line-height: 1.4;
	color: var(--simec-navy); background: var(--wp--preset--color--surface, #f6f8fa);
	border: 1px solid var(--wp--preset--color--outline-variant, #d6dbe1); border-radius: 10px;
	transition: border-color .15s ease, box-shadow .15s ease, background .15s ease; box-sizing: border-box;
}
.fluentform textarea { min-block-size: 130px; resize: vertical; }
.fluentform input:focus, .fluentform select:focus, .fluentform textarea:focus {
	outline: none; border-color: var(--simec-blue); background: #fff;
	box-shadow: 0 0 0 3px rgba(18,171,227,.15);
}
.fluentform input::placeholder, .fluentform textarea::placeholder { color: var(--wp--preset--color--on-surface-variant, #7b828c); }
.fluentform .ff-el-form-control.ff-has-error, .fluentform .has-error .ff-el-form-control { border-color: #d64545; }
.fluentform .error, .fluentform .text-danger, .fluentform .ff-el-is-error { color: #d64545; font-size: 0.82rem; margin-block-start: 0.3rem; }
.fluentform .ff-el-group.ff-name-field-wrapper .ff-t-container { display: flex; gap: 0.85rem; flex-wrap: wrap; }
.fluentform .ff-el-group.ff-name-field-wrapper .ff-t-container > div { flex: 1 1 45%; }
.fluentform .ff-btn-submit, .fluentform button[type=submit] {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
	font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 0.98rem;
	padding: 0.95rem 2rem; border: 0; border-radius: 6px; cursor: pointer; color: #fff;
	background: var(--simec-orange); box-shadow: 0 10px 24px rgba(234,135,45,.28);
	transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}
.fluentform .ff-btn-submit:hover, .fluentform button[type=submit]:hover { transform: translateY(-2px); background: #d67620; }
.fluentform .ff-message-success, .ff-message-success {
	background: rgba(118,195,118,.12); border: 1px solid rgba(118,195,118,.5); color: #2f7a4a;
	padding: 1rem 1.25rem; border-radius: 10px; font-weight: 600;
}
.rtl .fluentform label, .rtl .fluentform input, .rtl .fluentform textarea, .rtl .fluentform select { font-family: 'Loew Next Arabic', 'IBM Plex Sans Arabic', 'Tajawal', sans-serif; }
@media (max-width: 480px) { .fluentform .ff-el-group.ff-name-field-wrapper .ff-t-container > div { flex: 1 1 100%; } }

/* Footer sits a shade deeper than the CTA band so the two never merge. */
.simec-footer.simec-dark { background: var(--simec-navy-deep); }
/* Official Batreen marine-topographic footer texture (navy). A gentle overlay
   keeps text contrast without washing out the pattern. */
.simec-footer--tex { background-color: var(--simec-navy-deep); background-size: cover; background-position: center; background-repeat: no-repeat; }
.simec-footer--tex::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(1,26,48,.45) 0%, rgba(0,14,30,.72) 100%); }
.simec-footer::before { content: ""; position: absolute; inset-inline: 0; inset-block-start: 0; block-size: 1px; background: rgba(255,255,255,.08); }

/* REMOVE-EYEBROWS (site-wide, per client) */
.simec-eyebrow{display:none!important;}







/* SIMEC-PAGES-CSS */

/* ================= SIMEC content pages (market gateway) ================= */
.simec-page{--y20:#0b4a86;--y30:#1f9d57;color:var(--simec-navy);}
.simec-page-hero{position:relative;overflow:hidden;background:radial-gradient(130% 130% at 50% -20%,#0a5589 0%,#013a6b 46%,var(--simec-navy-deep) 100%);color:#fff;text-align:center;padding:clamp(3.2rem,8vw,5.5rem) 1.25rem clamp(2.8rem,6vw,4.2rem);}
.simec-page-hero::before{content:"";position:absolute;inset:0;background-image:var(--simec-flow);background-repeat:repeat;background-size:1000px auto;opacity:.14;mix-blend-mode:screen;pointer-events:none;}
.simec-page-hero__in{position:relative;max-inline-size:840px;margin-inline:auto;}
.simec-ph__kicker{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--wp--preset--font-family--heading);font-weight:700;font-size:.8rem;letter-spacing:.18em;color:var(--simec-blue-light);margin-block-end:.9rem;}
.simec-ph__kicker::before{content:"";inline-size:26px;block-size:2px;background:var(--simec-orange);border-radius:2px;}
.simec-page-hero h1{font-family:var(--wp--preset--font-family--heading);font-weight:800;font-size:clamp(2rem,4.8vw,3.1rem);line-height:1.16;margin:0;letter-spacing:-.01em;}
.simec-page-hero p.lead{margin:1.15rem auto 0;max-inline-size:660px;font-size:clamp(1rem,1.6vw,1.14rem);line-height:1.85;color:rgba(255,255,255,.88);}

.simec-page-body{max-inline-size:min(940px,92vw);margin-inline:auto;padding-block:clamp(2.6rem,6vw,4.5rem);}
.simec-page-body--wide{max-inline-size:min(1140px,94vw);}
.simec-prose p{font-size:clamp(1rem,1.5vw,1.08rem);line-height:1.95;color:#26415c;margin:0 0 1.15em;text-align:start;}
.simec-prose h2{font-family:var(--wp--preset--font-family--heading);font-weight:800;font-size:clamp(1.4rem,3vw,1.95rem);color:var(--simec-navy);margin:2.4rem 0 1rem;line-height:1.25;}
.simec-prose h2:first-child{margin-block-start:0;}
.simec-prose h2::after{content:"";display:block;inline-size:56px;block-size:4px;border-radius:3px;background:var(--simec-orange);margin-block-start:.7rem;}
.simec-hr{border:0;block-size:1px;background:linear-gradient(90deg,transparent,#d6dfea,transparent);margin:2.4rem 0;}
.simec-figure{margin:2.2rem 0;border-radius:var(--simec-radius-lg);overflow:hidden;box-shadow:var(--simec-shadow);}
.simec-figure img{display:block;inline-size:100%;height:auto;}

/* Royal quote cards */
.simec-quotes{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin:0 0 2.6rem;}
.simec-quote{background:#fff;border:1px solid #e6ebf2;border-radius:var(--simec-radius-lg);box-shadow:var(--simec-shadow);padding:1.8rem 1.6rem;display:flex;flex-direction:column;align-items:center;text-align:center;}
.simec-quote img{inline-size:124px;block-size:154px;object-fit:cover;border-radius:12px;box-shadow:0 10px 24px rgba(0,31,62,.20);}
.simec-quote__text{margin:1.2rem 0 1rem;font-size:1rem;line-height:1.9;color:#26415c;}
.simec-quote__name{display:block;font-family:var(--wp--preset--font-family--heading);font-weight:800;color:var(--simec-navy);font-size:1.04rem;line-height:1.5;}
.simec-quote__role{display:block;font-size:.86rem;color:#6b7c90;margin-block-start:.3rem;}

/* Stats (2020 baseline -> 2030 target) */
.simec-legend{display:flex;gap:1.4rem;justify-content:center;flex-wrap:wrap;margin:0 0 1.8rem;font-family:var(--wp--preset--font-family--heading);font-weight:700;font-size:.85rem;}
.simec-legend span{display:inline-flex;align-items:center;gap:.5rem;color:var(--simec-navy);}
.simec-legend i{inline-size:12px;block-size:12px;border-radius:3px;display:inline-block;}
.simec-legend .i20{background:var(--y20);} .simec-legend .i30{background:var(--y30);}
.simec-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1.15rem;}
.simec-statc{background:#fff;border:1px solid #e6ebf2;border-radius:var(--simec-radius-lg);box-shadow:var(--simec-shadow);padding:1.35rem 1.3rem;display:flex;flex-direction:column;}
.simec-statc__lab{font-family:var(--wp--preset--font-family--heading);font-weight:700;color:var(--simec-navy);font-size:.95rem;line-height:1.55;}
.simec-statc__row{display:flex;align-items:flex-end;justify-content:space-between;gap:.5rem;margin-block-start:auto;padding-block-start:1.1rem;}
.simec-yr{display:flex;flex-direction:column;gap:.2rem;}
.simec-yr b{font-family:var(--wp--preset--font-family--heading);font-weight:800;font-size:1.6rem;line-height:1;letter-spacing:-.01em;}
.simec-yr span{font-size:.76rem;font-weight:700;letter-spacing:.04em;}
.simec-yr--20 b,.simec-yr--20 span{color:var(--y20);}
.simec-yr--30 b,.simec-yr--30 span{color:var(--y30);}
.simec-statc__arrow{color:#b3c2d1;margin-block-end:.35rem;flex:0 0 auto;}
.simec-statc__arrow svg{inline-size:22px;block-size:22px;}
[dir="rtl"] .simec-statc__arrow svg{transform:scaleX(-1);}

/* Objectives */
.simec-objs{display:grid;grid-template-columns:repeat(3,1fr);gap:1.15rem;margin-block-start:1.6rem;}
.simec-obj{background:#fff;border:1px solid #e6ebf2;border-radius:var(--simec-radius-lg);box-shadow:var(--simec-shadow);padding:1.7rem 1.35rem;text-align:center;}
.simec-obj__ic{inline-size:58px;block-size:58px;margin-inline:auto;display:flex;align-items:center;justify-content:center;border-radius:15px;background:linear-gradient(160deg,#eaf6fd,#d7eefb);color:var(--simec-navy);margin-block-end:1rem;}
.simec-obj__ic svg{inline-size:28px;block-size:28px;}
.simec-obj p{margin:0;font-weight:700;color:var(--simec-navy);line-height:1.65;font-size:1rem;}

/* Projects list */
.simec-projs{list-style:none;margin:1.6rem 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.85rem;}
.simec-projs li{position:relative;background:#fff;border:1px solid #e6ebf2;border-radius:var(--simec-radius);box-shadow:0 8px 20px rgba(0,31,62,.06);padding:1.05rem 3rem 1.05rem 1.1rem;font-size:.98rem;line-height:1.7;color:#26415c;}
.simec-projs li::before{content:"";position:absolute;inset-block-start:1.15rem;inset-inline-end:1.05rem;inline-size:20px;block-size:20px;border-radius:50%;background:var(--simec-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l4 4 10-10'/%3E%3C/svg%3E") center/12px no-repeat;}

@media(max-width:820px){.simec-stats,.simec-objs{grid-template-columns:1fr 1fr;}.simec-quotes,.simec-projs{grid-template-columns:1fr;}}
@media(max-width:520px){.simec-stats,.simec-objs{grid-template-columns:1fr;}}

/* ================= Fluent Forms: placeholder-only + directional select arrow ================= */
/* Hide field labels visually but keep them for screen readers */
.fluentform .ff-el-input--label{position:absolute!important;width:1px;height:1px;padding:0!important;margin:-1px!important;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.fluentform input::placeholder,.fluentform textarea::placeholder{color:#8a93a0;opacity:1;}
/* Custom, direction-aware select chevron (override plugin default which stays on the right in RTL) */
.fluentform select{
  appearance:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23003462' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;background-size:18px 18px!important;
  background-position:right 0.95rem center!important;   /* LTR: arrow on the right */
  padding-right:2.6rem!important;padding-left:0.95rem!important;
}
/* RTL (Arabic): arrow on the LEFT */
.rtl .fluentform select,[dir="rtl"] .fluentform select{
  background-position:left 0.95rem center!important;
  padding-left:2.6rem!important;padding-right:0.95rem!important;
}

/* Dial-code + phone side by side (Fluent Forms container classes) */
.fluentform .ff-el-group.ff-dc{display:inline-block;width:34%;vertical-align:top;}
.fluentform .ff-el-group.ff-ph{display:inline-block;width:63%;margin-inline-start:3%;vertical-align:top;}
@media(max-width:560px){.fluentform .ff-el-group.ff-dc,.fluentform .ff-el-group.ff-ph{display:block;width:100%;margin-inline-start:0;}}
/* Dial-code select + phone input exactly equal height */
.fluentform .ff-dc select, .fluentform .ff-ph .ff-el-form-control{block-size:3.25rem;}

/* Select2 (searchable country dropdown): match form inputs + direction-aware arrow */
.fluentform .select2-container{inline-size:100%!important;}
.fluentform .select2-container--default .select2-selection--single{block-size:3.25rem;display:flex;align-items:center;padding:0 .95rem;border:1px solid var(--wp--preset--color--outline-variant,#d6dbe1)!important;border-radius:10px;background:var(--wp--preset--color--surface,#f6f8fa)!important;}
.fluentform .select2-container--default .select2-selection--single .select2-selection__rendered{color:var(--simec-navy)!important;line-height:1.4!important;padding-inline-start:.1rem!important;padding-inline-end:1.7rem!important;}
.fluentform .select2-container--default .select2-selection--single .select2-selection__arrow{block-size:100%!important;inset-block-start:0!important;inset-inline-end:.7rem!important;inset-inline-start:auto!important;right:auto!important;left:auto!important;}
.fluentform .select2-container--default .select2-selection--single .select2-selection__arrow b{border-color:var(--simec-navy) transparent transparent transparent!important;}
.fluentform .select2-dropdown{border-color:var(--simec-blue)!important;border-radius:10px;}
.fluentform .select2-container--default .select2-search--dropdown .select2-search__field{border-radius:8px;}
.rtl .fluentform .select2-selection__rendered,[dir="rtl"] .fluentform .select2-selection__rendered{text-align:right;}

/* Choices.js searchable dropdowns (country + dial code): arrow on the far side,
   opposite the value — so in Arabic it sits on the LEFT, clear of the name. */
.frm-fluent-form .choices[data-type*=select-one]:after{right:12px!important;left:auto!important;}
.frm-fluent-form .choices[data-type*=select-one] .choices__list--single{padding-block:4px;padding-inline-start:4px;padding-inline-end:20px;}
.rtl .frm-fluent-form .choices[data-type*=select-one]:after,[dir="rtl"] .frm-fluent-form .choices[data-type*=select-one]:after{left:12px!important;right:auto!important;}
.rtl .frm-fluent-form .choices[data-type*=select-one] .choices__list--single,[dir="rtl"] .frm-fluent-form .choices[data-type*=select-one] .choices__list--single{text-align:right;}

/* ================= Header layout: logo (start) · nav menu (centered) · language + CTAs (end) ================= */
/* Desktop only — the ≤1120px hamburger panel keeps its stacked layout untouched. */
@media (min-width:1121px){
  .simec-nav{flex:1 1 auto;}
  .simec-nav__menu{flex:1 1 auto;justify-content:center;}
}

/* Remove the page-hero kicker/eyebrow from every internal page (Vision, Market Study,
   National Program, Investment Opportunities — baked in page content). */
.simec-ph__kicker{display:none!important;}
/* Page-hero title stays white on its dark gradient background. */
.simec-page-hero h1{color:#fff!important;}

/* Contact "Email" card: keep the address on ONE line (home + contact page). */
a.simec-ct__val[href^="mailto:"],.simec-ct__val[href^="mailto:"]{white-space:nowrap;word-break:normal;overflow-wrap:normal;font-size:clamp(.72rem,1.25vw,.92rem);letter-spacing:0;}

/* Investment Opportunities list (.simec-projs): the check-icon sits at the TOP of the
   START side — top-right in Arabic, top-left in English — with the text padded away
   from it on that same side. base.css mixed logical inset with physical padding, which
   put the icon over the text in RTL; force both to the start side here. */
.simec-projs li{padding-block:1.05rem;padding-inline-start:3rem;padding-inline-end:1.1rem;}
.simec-projs li::before{inset-inline-start:1.05rem;inset-inline-end:auto;}

/* Sponsors: place "National industry sponsor" + "Funding sponsor" side by side. */
.simec-ptn__pair{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(1.5rem,4vw,3rem);}
.simec-ptn__pair>.simec-ptn__tier{flex:1 1 300px;max-inline-size:520px;margin-block-end:0;}
@media(max-width:600px){.simec-ptn__pair>.simec-ptn__tier{flex-basis:100%;}}