/* ==========================================================================
   Ferran Leiva — estils principals · Revisió visual 1.1 «Premium corporatiu»
   Mobile-first. Colors, fonts i mides: theme.json (variables --wp--preset--*).
   Els prototips de /prototypes/v1.1 carreguen aquest mateix fitxer.
   (La versió 1.0 està congelada a /prototypes/v1.0/assets/main-v1.0.css.)
   ========================================================================== */

:root {
	--fl-radius-s: 6px;
	--fl-radius-m: 10px;
	--fl-radius-l: 16px;
	--fl-header-h: 76px;
	--fl-bar-h: 64px;
	--fl-ease: cubic-bezier(.2, .7, .2, 1);
	--fl-t: 220ms var(--fl-ease);
	--fl-gutter: clamp(1.25rem, 4vw, 2.5rem);
	--fl-wide: 1240px;
	--c-base: var(--wp--preset--color--base, #fff);
	--c-surface: var(--wp--preset--color--surface, #F4F6F9);
	--c-line: var(--wp--preset--color--line, #E2E7EE);
	--c-muted: var(--wp--preset--color--muted, #566273);
	--c-ink: var(--wp--preset--color--ink, #0E1B2B);
	--c-navy: #0B1828;
	--c-primary: var(--wp--preset--color--primary, #1F5EFF);
	--c-primary-dark: var(--wp--preset--color--primary-dark, #1442C2);
	--c-primary-soft: var(--wp--preset--color--primary-soft, #EAF0FF);
	--c-accent: var(--wp--preset--color--accent, #00A3A3);
	--c-wa: var(--wp--preset--color--whatsapp, #177C42);
	--c-kd: #C8102E;
	--f-body: var(--wp--preset--font-family--body, Inter, system-ui, sans-serif);
	--f-head: var(--wp--preset--font-family--heading, Manrope, Inter, system-ui, sans-serif);
	--shadow-soft: 0 1px 2px rgba(11, 24, 40, .04), 0 12px 32px -12px rgba(11, 24, 40, .12);
	--shadow-float: 0 24px 60px -24px rgba(11, 24, 40, .35);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--fl-header-h) + 1rem); }
body { margin: 0; background: var(--c-base); color: var(--c-ink); font: 400 1.0625rem/1.7 var(--f-body); text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; overflow-x: clip; }
img, svg, video { max-width: 100%; height: auto; display: block; }
h1, h2, h3, h4 { font-family: var(--f-head); color: var(--c-ink); line-height: 1.12; margin: 0 0 .55em; text-wrap: balance; letter-spacing: -0.022em; font-weight: 700; }
p { margin: 0 0 1em; text-wrap: pretty; }
a { color: var(--c-primary); text-underline-offset: .2em; text-decoration-thickness: 1px; }
a:hover { color: var(--c-primary-dark); }
:focus-visible { outline: 2px solid var(--c-primary); outline-offset: 3px; border-radius: 4px; }
::selection { background: var(--c-primary); color: #fff; }
.screen-reader-text, .fl-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.fl-skip { position: absolute; left: 1rem; top: -100px; z-index: 100; background: var(--c-ink); color: #fff; padding: .7rem 1rem; border-radius: var(--fl-radius-s); }
.fl-skip:focus { top: 1rem; color: #fff; }

/* ---------- Layout ---------- */
.fl-container { width: min(100% - 2 * var(--fl-gutter), var(--fl-wide)); margin-inline: auto; }
.fl-section { padding-block: clamp(4.5rem, 10vw, 8.5rem); }
.fl-section--tight { padding-block: clamp(2.5rem, 6vw, 4rem); }
.fl-section--surface { background: var(--c-surface); }
.fl-section--dark { background: var(--c-navy); color: #B9C4D3; }
.fl-section--dark h2, .fl-section--dark h3 { color: #fff; }
.fl-section__head { max-width: 44rem; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.fl-section__head--center { margin-inline: auto; text-align: center; }
.fl-section__head--row { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.5rem 3rem; max-width: none; }
.fl-section__head--row > div { max-width: 40rem; }
.fl-section__head h2, .fl-h2 { font-size: clamp(2rem, 1.35rem + 2.4vw, 3.1rem); margin-bottom: .45em; }
.fl-section__head p:not(.fl-eyebrow), .fl-lead { color: var(--c-muted); font-size: clamp(1.06rem, 1rem + .3vw, 1.2rem); line-height: 1.65; margin: 0; }
.fl-section--dark .fl-section__head p:not(.fl-eyebrow), .fl-section--dark .fl-lead { color: #AAB6C6; }
.fl-eyebrow { display: inline-block; font: 600 .78rem/1 var(--f-head); letter-spacing: .16em; text-transform: uppercase; color: var(--c-primary); margin: 0 0 1.25rem; }
.fl-section--dark .fl-eyebrow { color: #8FB0FF; }
.fl-split { display: grid; gap: clamp(2.5rem, 6vw, 6rem); align-items: center; }
@media (min-width: 960px) { .fl-split { grid-template-columns: 1fr 1fr; } .fl-split--5-7 { grid-template-columns: 5fr 7fr; } .fl-split--reverse > :first-child { order: 2; } }
.fl-grid { display: grid; gap: clamp(1rem, 2.4vw, 2rem); grid-template-columns: 1fr; }
@media (min-width: 640px) { .fl-grid--2, .fl-grid--3, .fl-grid--4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .fl-grid--3 { grid-template-columns: repeat(3, 1fr); } .fl-grid--4 { grid-template-columns: repeat(4, 1fr); } }

/* ---------- Buttons ---------- */
.fl-btn, .wp-element-button, .wp-block-button__link {
	display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
	min-height: 52px; padding: .85rem 1.6rem; border-radius: 999px; border: 1px solid transparent;
	font: 600 1rem/1.1 var(--f-head); letter-spacing: -0.005em; text-decoration: none; cursor: pointer; white-space: nowrap;
	transition: background var(--fl-t), color var(--fl-t), border-color var(--fl-t), transform var(--fl-t), box-shadow var(--fl-t);
}
.fl-btn svg { width: 1.1em; height: 1.1em; flex: none; }
.fl-btn--primary, .wp-element-button, .wp-block-button__link { background: var(--c-primary); color: #fff; }
.fl-btn--primary:hover, .wp-element-button:hover, .wp-block-button__link:hover { background: var(--c-primary-dark); color: #fff; box-shadow: 0 10px 24px -12px rgba(31, 94, 255, .7); transform: translateY(-1px); }
.fl-btn--ghost, .is-style-outline > .wp-block-button__link { background: transparent; color: var(--c-ink); border-color: #C9D1DC; box-shadow: none; }
.fl-btn--ghost:hover, .is-style-outline > .wp-block-button__link:hover { background: transparent; color: var(--c-ink); border-color: var(--c-ink); transform: none; box-shadow: none; }
.fl-btn--light { background: #fff; color: var(--c-ink); }
.fl-btn--light:hover { background: #E9EEF6; color: var(--c-ink); }
.fl-btn--outline-light { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .32); }
.fl-btn--outline-light:hover { border-color: #fff; color: #fff; }
.fl-btn--whatsapp { background: var(--c-wa); color: #fff; }
.fl-btn--whatsapp:hover { background: #12643A; color: #fff; }
.fl-btn--sm { min-height: 42px; padding: .6rem 1.15rem; font-size: .92rem; }
.fl-btn--block { width: 100%; }
.fl-btn[aria-disabled="true"] { opacity: .55; pointer-events: none; }
.fl-link-arrow { display: inline-flex; align-items: center; gap: .45rem; font: 600 .97rem/1.2 var(--f-head); color: var(--c-ink); text-decoration: none; }
.fl-link-arrow::after { content: ""; width: .95em; height: .95em; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; transition: transform var(--fl-t); }
.fl-link-arrow:hover, a:hover .fl-link-arrow, .fl-card--link:hover .fl-link-arrow { color: var(--c-primary); }
.fl-link-arrow:hover::after, a:hover .fl-link-arrow::after, .fl-card--link:hover .fl-link-arrow::after { transform: translateX(4px); }
.fl-section--dark .fl-link-arrow { color: #fff; }

/* ---------- Provisional markers ---------- */
.fl-pending { display: inline-flex; align-items: center; gap: .35rem; font: 600 .7rem/1.25 var(--f-body); letter-spacing: .01em; color: #7A5200; background: #FFF5DA; border: 1px dashed #E2B65A; padding: .22rem .5rem; border-radius: 5px; vertical-align: middle; }
.fl-pending::before { content: "⚑"; }
.fl-section--dark .fl-pending { color: #FFD98A; background: rgba(255, 217, 138, .08); border-color: rgba(255, 217, 138, .35); }
.fl-tag { display: inline-flex; align-items: center; font: 600 .68rem/1 var(--f-head); letter-spacing: .08em; text-transform: uppercase; padding: .35rem .55rem; border-radius: 4px; background: var(--c-surface); color: var(--c-muted); }

/* ---------- Photography (real images or high-quality placeholders) ---------- */
.fl-photo { position: relative; overflow: hidden; border-radius: var(--fl-radius-l); background: #16263A; isolation: isolate; }
.fl-photo > img, .fl-photo > picture, .fl-photo > picture img { width: 100%; height: 100%; object-fit: cover; }
.fl-photo--placeholder { background:
	radial-gradient(90% 70% at 72% 28%, rgba(120, 150, 190, .38), transparent 60%),
	radial-gradient(70% 60% at 18% 90%, rgba(31, 94, 255, .22), transparent 65%),
	linear-gradient(160deg, #26384F 0%, #15243A 55%, #0C1726 100%); }
.fl-photo--placeholder::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .22; mix-blend-mode: overlay; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.fl-photo--placeholder.fl-photo--studio { background:
	radial-gradient(60% 18% at 50% 86%, rgba(11, 24, 40, .14), transparent 70%),
	radial-gradient(80% 70% at 50% 30%, #FFFFFF 0%, #EEF1F5 60%, #E3E8EF 100%); }
.fl-photo--placeholder.fl-photo--studio::before { opacity: .12; mix-blend-mode: multiply; }
.fl-photo__brief { position: absolute; inset: auto 1rem 1rem 1rem; display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; font: 500 .74rem/1.35 var(--f-body); color: rgba(255, 255, 255, .78); }
.fl-photo__brief strong { font-weight: 600; color: #fff; }
.fl-photo__brief .fl-pending { color: #FFE2A3; background: rgba(0, 0, 0, .25); border-color: rgba(255, 226, 163, .45); }
.fl-photo--studio .fl-photo__brief { color: #5B6878; }
.fl-photo--studio .fl-photo__brief strong { color: var(--c-ink); }
.fl-photo--studio .fl-photo__brief .fl-pending { color: #7A5200; background: #FFF5DA; border-color: #E2B65A; }
.fl-photo__mark { position: absolute; inset: 0; display: grid; place-items: center; z-index: -1; color: rgba(255, 255, 255, .07); }
.fl-photo__mark svg { width: 34%; max-width: 220px; }
.fl-photo--studio .fl-photo__mark { color: rgba(11, 24, 40, .07); }

/* Fotografia de producte sobre fons d'estudi (imatges reals amb fons blanc o transparent).
   mix-blend-mode: multiply fa desaparèixer el blanc dels JPG sense modificar l'original. */
.fl-photo--product { display: block; background: radial-gradient(80% 70% at 50% 35%, #FFFFFF 0%, #F1F4F7 55%, #E6EBF1 100%); }
.fl-photo--product > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 9%; mix-blend-mode: multiply; transition: transform 900ms var(--fl-ease); }
.fl-photo--product .fl-photo__brief { color: #5B6878; }
.fl-photo--product .fl-photo__brief strong { color: var(--c-ink); }
.fl-photo--product .fl-photo__brief .fl-pending { color: #7A5200; background: #FFF5DA; border-color: #E2B65A; }
.fl-photo__label { position: absolute; left: 1.25rem; bottom: 1.25rem; font: 600 .78rem/1.3 var(--f-head); letter-spacing: .04em; color: #5B6878; }
.fl-hero__media.fl-photo--product > img { padding: 11% 14% 14%; }
@media (max-width: 639px) { .fl-hero .fl-hero__media .fl-hero__caption { display: none; } }

/* Marca: logotip real (ràster provisional) */
.fl-brand__logo { display: block; height: 44px; width: auto; }
.fl-footer .fl-brand__logo { height: 48px; }

/* ---------- Top utility row (desktop) ---------- */
.fl-topbar { display: none; background: var(--c-base); color: var(--c-muted); font-size: .82rem; border-bottom: 1px solid var(--c-line); }
.fl-topbar .fl-container { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 38px; }
.fl-topbar a { color: var(--c-muted); text-decoration: none; }
.fl-topbar a:hover { color: var(--c-ink); }
.fl-topbar__group { display: flex; align-items: center; gap: 1.5rem; }
.fl-topbar__item { display: inline-flex; align-items: center; gap: .45rem; }
.fl-topbar__item svg { width: 14px; height: 14px; }
.fl-topbar__soon { color: #8B97A7; }
.fl-topbar__soon small { font-size: .7rem; letter-spacing: .04em; text-transform: uppercase; margin-left: .2rem; }
@media (min-width: 1100px) { .fl-topbar { display: block; } }

/* ---------- Header (semi-fixed: hides on scroll down, returns on scroll up) ---------- */
.fl-header { position: sticky; top: 0; z-index: 50; background: transparent; border-bottom: 1px solid transparent; transition: transform 320ms var(--fl-ease), border-color var(--fl-t); }
/* El desenfocament va en una capa a part: si el posem a .fl-header, el panel fix del menú mòbil queda retallat
   (backdrop-filter crea un nou bloc contenidor per als elements position:fixed). */
.fl-header::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(255, 255, 255, .94); -webkit-backdrop-filter: saturate(180%) blur(16px); backdrop-filter: saturate(180%) blur(16px); }
.fl-header.is-scrolled { border-bottom-color: var(--c-line); }
.fl-header.is-hidden { transform: translateY(-100%); }
.fl-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: var(--fl-header-h); }
.fl-header__actions { display: flex; align-items: center; gap: 1.25rem; }
.fl-header__cta { display: none; }
@media (min-width: 1100px) { .fl-header__cta { display: inline-flex; } }
.fl-header__brand { display: flex; align-items: center; gap: .7rem; }
.fl-header__brand .wp-block-site-title { font: 700 1.05rem/1.1 var(--f-head); margin: 0; }
.fl-header__brand .wp-block-site-title a { color: var(--c-ink); text-decoration: none; }
.fl-header .fl-header__inner > *, .fl-header .fl-header__actions > *, .fl-header .fl-header__brand > *,
.fl-topbar .fl-container > *, .fl-footer .fl-footer__bottom > *, .fl-mobilebar > * { margin-block: 0; }

.fl-brand { display: inline-flex; align-items: center; gap: .75rem; text-decoration: none; color: var(--c-ink); }
.fl-brand__mark { width: 38px; height: 38px; border-radius: 9px; display: grid; place-items: center; background: var(--c-navy); color: #fff; font: 700 .9rem/1 var(--f-head); letter-spacing: .02em; }
.fl-brand__text { display: flex; flex-direction: column; line-height: 1.05; }
.fl-brand__name { font: 700 1rem/1.1 var(--f-head); letter-spacing: .06em; }
.fl-brand__tag { font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; color: var(--c-muted); margin-top: .3rem; }
.fl-brand__provisional { position: relative; }
.fl-brand__provisional::after { content: "LOGO PROVISIONAL"; position: absolute; left: 0; top: calc(100% + 3px); font: 700 .52rem/1 var(--f-body); letter-spacing: .1em; color: #7A5200; background: #FFF5DA; padding: 2px 4px; border-radius: 3px; white-space: nowrap; }

/* ---------- Navigation (mobile-first) ---------- */
.fl-nav__toggle { display: inline-flex; align-items: center; gap: .6rem; min-height: 44px; padding: .5rem .2rem .5rem .8rem; border: 0; background: none; color: var(--c-ink); font: 600 .95rem/1 var(--f-head); cursor: pointer; }
.fl-nav__bars, .fl-nav__bars::before, .fl-nav__bars::after { display: block; width: 20px; height: 1.5px; border-radius: 2px; background: currentColor; transition: transform var(--fl-t), background var(--fl-t); }
.fl-nav__bars { position: relative; }
.fl-nav__bars::before, .fl-nav__bars::after { content: ""; position: absolute; left: 0; }
.fl-nav__bars::before { top: -6px; }
.fl-nav__bars::after { top: 6px; }
.fl-nav__toggle[aria-expanded="true"] .fl-nav__bars { background: transparent; }
.fl-nav__toggle[aria-expanded="true"] .fl-nav__bars::before { transform: translateY(6px) rotate(45deg); }
.fl-nav__toggle[aria-expanded="true"] .fl-nav__bars::after { transform: translateY(-6px) rotate(-45deg); }

.fl-nav__panel { position: fixed; inset: var(--fl-header-h) 0 0 0; background: #fff; padding: .5rem var(--fl-gutter) calc(var(--fl-bar-h) + 2.5rem + env(safe-area-inset-bottom)); overflow-y: auto; overscroll-behavior: contain; visibility: hidden; opacity: 0; transform: translateY(-6px); transition: opacity var(--fl-t), transform var(--fl-t), visibility 0s linear 220ms; }
.fl-nav.is-open .fl-nav__panel { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
.fl-nav__list, .fl-nav__list ul { list-style: none; margin: 0; padding: 0; }
.fl-nav__list > li { border-bottom: 1px solid var(--c-line); }
.fl-nav__list a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 58px; color: var(--c-ink); text-decoration: none; font: 600 1.2rem/1.2 var(--f-head); letter-spacing: -0.01em; }
.fl-nav__list a[aria-current="page"], .fl-nav__list .current-menu-item > a { color: var(--c-primary); }
.fl-nav__list .sub-menu { padding: 0 0 1rem; }
.fl-nav__list .sub-menu a { min-height: 44px; font: 500 1rem/1.3 var(--f-body); color: var(--c-muted); }
.fl-nav__desc { display: none; }
.fl-nav__list .is-kd > a::after, .fl-nav__list .is-highlight > a::after { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--c-kd); flex: none; }
.fl-nav__extra { display: grid; gap: .75rem; margin-top: 1.75rem; }
.fl-nav__extra .fl-lang { justify-self: start; }
.fl-nav__extra .fl-nav__soon { font-size: .9rem; color: var(--c-muted); }
body.fl-menu-open { overflow: hidden; }

@media (min-width: 1100px) {
	.fl-nav__toggle, .fl-nav__extra { display: none; }
	.fl-nav__panel { position: static; inset: auto; padding: 0; background: none; overflow: visible; visibility: visible; opacity: 1; transform: none; }
	.fl-nav__list { display: flex; align-items: center; gap: .15rem; }
	.fl-nav__list > li { border: 0; position: relative; }
	.fl-nav__list > li > a { position: relative; min-height: var(--fl-header-h); padding: 0 .85rem; font: 500 .95rem/1 var(--f-body); letter-spacing: 0; color: #2A3646; justify-content: flex-start; gap: .4rem; }
	.fl-nav__list > li > a::before { content: ""; position: absolute; left: .85rem; right: .85rem; bottom: 22px; height: 1.5px; background: var(--c-primary); transform: scaleX(0); transform-origin: left; transition: transform var(--fl-t); }
	.fl-nav__list > li > a:hover, .fl-nav__list > li:focus-within > a { color: var(--c-ink); }
	.fl-nav__list > li > a:hover::before, .fl-nav__list > li.current-menu-item > a::before, .fl-nav__list > li > a[aria-current="page"]::before { transform: scaleX(1); }
	.fl-nav__list > .menu-item-has-children > a::after { content: ""; width: 8px; height: 8px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); opacity: .6; }
	.fl-nav__list .sub-menu { position: absolute; top: calc(100% - 8px); left: -.5rem; min-width: 300px; padding: .75rem; background: #fff; border: 1px solid var(--c-line); border-radius: var(--fl-radius-l); box-shadow: var(--shadow-float); opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity var(--fl-t), transform var(--fl-t), visibility 0s linear 220ms; }
	.fl-nav__list li:hover > .sub-menu, .fl-nav__list li:focus-within > .sub-menu, .fl-nav__list li.is-open > .sub-menu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
	.fl-nav__list .sub-menu a { display: grid; gap: .2rem; min-height: 0; padding: .75rem .9rem; border-radius: var(--fl-radius-m); font: 600 .95rem/1.25 var(--f-head); color: var(--c-ink); }
	.fl-nav__list .sub-menu a:hover { background: var(--c-surface); }
	.fl-nav__desc { display: block; font: 400 .83rem/1.4 var(--f-body); color: var(--c-muted); }
	.fl-nav__list .is-mega > .sub-menu { display: grid; grid-template-columns: 1fr 1fr; min-width: 620px; }
	.fl-nav__list .is-mega > .sub-menu > li.fl-nav__all { grid-column: 1 / -1; border-top: 1px solid var(--c-line); margin-top: .4rem; padding-top: .4rem; }
	.fl-nav__list .fl-nav__all a { color: var(--c-primary); }
	.fl-nav__list .is-kd > a::after, .fl-nav__list .is-highlight > a::after { order: -1; width: 6px; height: 6px; }
}

/* ---------- Language switcher ---------- */
.fl-lang { display: inline-flex; align-items: center; gap: .1rem; list-style: none; margin: 0; padding: 0; }
.fl-lang li + li::before { content: "/"; margin: 0 .3rem; color: #B5BFCC; }
.fl-lang a { display: inline-grid; place-items: center; min-width: 24px; min-height: 24px; font: 600 .78rem/1 var(--f-head); letter-spacing: .06em; color: var(--c-muted); text-decoration: none; }
.fl-lang a[aria-current="true"] { color: var(--c-ink); }
.fl-nav__extra .fl-lang a { min-width: 44px; min-height: 44px; font-size: .95rem; }

/* ---------- Hero ---------- */
.fl-hero { padding-block: clamp(2.5rem, 6vw, 5rem) clamp(3rem, 7vw, 6rem); }
.fl-hero__grid { display: grid; gap: clamp(2.25rem, 5vw, 5rem); align-items: center; }
@media (min-width: 1024px) { .fl-hero__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); } }
.fl-hero h1 { font-size: clamp(2.5rem, 1.5rem + 4.2vw, 4.6rem); font-weight: 700; letter-spacing: -0.035em; line-height: 1.04; margin-bottom: .5em; }
.fl-hero h1 em { font-style: normal; color: var(--c-primary); }
.fl-hero__lead { font-size: clamp(1.08rem, 1rem + .4vw, 1.28rem); line-height: 1.6; color: var(--c-muted); max-width: 34rem; margin-bottom: 2.25rem; }
.fl-hero__actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.fl-hero__actions > * { margin-block: 0 !important; }
.wp-block-buttons.fl-hero__actions { gap: .75rem; }
@media (max-width: 479px) { .fl-hero__actions .fl-btn, .fl-hero__actions .wp-block-button__link { flex: 1 1 100%; } }
.fl-hero__media { aspect-ratio: 4 / 5; box-shadow: var(--shadow-soft); }
@media (min-width: 1024px) { .fl-hero__media { aspect-ratio: 5 / 5.6; } }
.fl-hero__media.fl-photo--placeholder { min-height: 360px; }
.fl-hero__caption { position: absolute; left: 1.25rem; top: 1.25rem; display: inline-flex; align-items: center; gap: .6rem; padding: .55rem .8rem; border-radius: 999px; background: rgba(255, 255, 255, .92); color: var(--c-ink); font: 600 .8rem/1 var(--f-head); box-shadow: var(--shadow-soft); }
.fl-hero__caption span { width: 7px; height: 7px; border-radius: 50%; background: #22C55E; box-shadow: 0 0 0 4px rgba(34, 197, 94, .18); }

/* ---------- Trust strip (sober, no cards) ---------- */
.fl-trust { border-block: 1px solid var(--c-line); }
.fl-trust__list { display: grid; grid-template-columns: 1fr 1fr; list-style: none; margin: 0; padding: 0; }
@media (min-width: 1024px) { .fl-trust__list { grid-template-columns: repeat(4, 1fr); } }
.fl-trust__item { padding: 1.6rem 1.25rem 1.6rem 0; display: grid; gap: .3rem; align-content: start; }
.fl-trust__item:nth-child(n+3) { border-top: 1px solid var(--c-line); }
@media (min-width: 1024px) { .fl-trust__item:nth-child(n+3) { border-top: 0; } .fl-trust__item + .fl-trust__item { border-left: 1px solid var(--c-line); padding-left: 1.75rem; } }
@media (max-width: 1023px) { .fl-trust__item:nth-child(even) { border-left: 1px solid var(--c-line); padding-left: 1.25rem; } }
.fl-trust__title { font: 700 clamp(1.05rem, 1rem + .3vw, 1.25rem)/1.2 var(--f-head); letter-spacing: -0.01em; color: var(--c-ink); }
.fl-trust__text { font-size: .9rem; line-height: 1.45; color: var(--c-muted); }
.fl-trust__icon { display: none; }

/* ---------- Generic cards (lighter) ---------- */
.fl-card { position: relative; display: flex; flex-direction: column; gap: .5rem; padding: clamp(1.4rem, 2.6vw, 2rem); background: #fff; border: 1px solid var(--c-line); border-radius: var(--fl-radius-l); transition: transform var(--fl-t), box-shadow var(--fl-t), border-color var(--fl-t); }
.fl-card--link:hover { border-color: #CED6E1; box-shadow: var(--shadow-soft); }
.fl-card--link a.fl-card__cover::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.fl-card__icon { width: 44px; height: 44px; border-radius: 10px; display: grid; place-items: center; background: var(--c-primary-soft); color: var(--c-primary); margin-bottom: .25rem; }
.fl-card__icon svg { width: 22px; height: 22px; }
.fl-card__title { display: block; font: 700 1.2rem/1.25 var(--f-head); letter-spacing: -0.015em; color: var(--c-ink); margin: 0; }
.fl-card__title a, .fl-product__title a { color: inherit; text-decoration: none; }
.fl-card--link:hover .fl-card__title a, .fl-card--link:hover .fl-product__title a { color: var(--c-primary); }
.fl-card__text { color: var(--c-muted); margin: 0; font-size: .98rem; line-height: 1.6; }
.fl-card__more { margin-top: auto; padding-top: .75rem; }
.fl-card__list { list-style: none; margin: .25rem 0 0; padding: 0; display: grid; gap: .45rem; font-size: .96rem; color: var(--c-muted); }
.fl-card__list li { display: flex; gap: .65rem; }
.fl-card__list li::before { content: ""; flex: none; width: 5px; height: 5px; margin-top: .65em; border-radius: 50%; background: var(--c-primary); }

/* ---------- Sectors (photo-led) ---------- */
.fl-sectors { display: grid; gap: clamp(1rem, 2vw, 1.5rem); }
@media (min-width: 800px) { .fl-sectors { grid-template-columns: repeat(3, 1fr); } }
.fl-sector { position: relative; display: block; color: #fff; text-decoration: none; border-radius: var(--fl-radius-l); overflow: hidden; }
.fl-sector .fl-photo { aspect-ratio: 4 / 3; border-radius: 0; }
@media (min-width: 800px) { .fl-sector .fl-photo { aspect-ratio: 4 / 5.2; } }
.fl-sector .fl-photo > img, .fl-sector .fl-photo__mark { transition: transform 900ms var(--fl-ease); }
.fl-sector:hover .fl-photo > img, .fl-sector:hover .fl-photo__mark { transform: scale(1.035); }
.fl-sector::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8, 17, 29, 0) 35%, rgba(8, 17, 29, .82) 100%); pointer-events: none; }
.fl-sector__body { position: absolute; z-index: 1; inset: auto 0 0 0; padding: clamp(1.25rem, 2.5vw, 2rem); display: grid; gap: .4rem; }
.fl-sector__body h3 { color: #fff; font-size: clamp(1.4rem, 1.2rem + .8vw, 1.8rem); margin: 0; }
.fl-sector__body p { color: rgba(255, 255, 255, .82); font-size: .97rem; line-height: 1.55; margin: 0; max-width: 30rem; }
.fl-sector__body .fl-link-arrow { color: #fff; margin-top: .4rem; }
.fl-sector .fl-photo__brief { inset: 1rem 1rem auto 1rem; }
/* Variant amb foto de producte (mentre no hi hagi fotos d'ambient): text a sota, en tinta. */
.fl-sector--product { color: var(--c-ink); background: #fff; border: 1px solid var(--c-line); display: flex; flex-direction: column; }
.fl-sector--product::after { display: none; }
.fl-sector--product .fl-photo { aspect-ratio: 4 / 3.4; }
.fl-sector--product:hover .fl-photo > img { transform: scale(1.04); }
.fl-sector--product .fl-sector__body { position: static; padding: 1.4rem 1.6rem 1.7rem; }
.fl-sector--product .fl-sector__body h3 { color: var(--c-ink); }
.fl-sector--product .fl-sector__body p { color: var(--c-muted); }
.fl-sector--product .fl-sector__body .fl-link-arrow { color: var(--c-ink); }
.fl-sector--product:hover .fl-link-arrow { color: var(--c-primary); }

/* ---------- Catalogue categories (B2B index) ---------- */
.fl-cats { display: grid; grid-template-columns: 1fr; border-top: 1px solid var(--c-line); }
@media (min-width: 720px) { .fl-cats { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .fl-cats { grid-template-columns: repeat(3, 1fr); } }
.fl-cat { position: relative; display: grid; grid-template-columns: auto 1fr; gap: .25rem 1rem; padding: 1.75rem 1.5rem 1.75rem 0; border-bottom: 1px solid var(--c-line); text-decoration: none; color: inherit; transition: background var(--fl-t); }
@media (min-width: 720px) { .fl-cat:nth-child(odd) { padding-right: 2rem; } }
.fl-cat__num { grid-row: span 2; font: 600 .8rem/1.6 var(--f-head); color: #9AA6B6; letter-spacing: .06em; min-width: 1.75rem; }
.fl-cat__title { font: 700 1.2rem/1.3 var(--f-head); letter-spacing: -0.015em; color: var(--c-ink); display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.fl-cat__title::after { content: "→"; font-weight: 500; color: #9AA6B6; transition: transform var(--fl-t), color var(--fl-t); }
.fl-cat__text { font-size: .95rem; line-height: 1.55; color: var(--c-muted); }
.fl-cat:hover .fl-cat__title { color: var(--c-primary); }
.fl-cat:hover .fl-cat__title::after { transform: translateX(4px); color: var(--c-primary); }
.fl-cat svg { display: none; }

/* ---------- Products ---------- */
.fl-products { display: grid; gap: clamp(1.25rem, 2.4vw, 2rem); grid-template-columns: 1fr; }
/* Mòbil: carrusel horitzontal amb scroll-snap (sense JavaScript); deixa veure el producte següent. */
@media (max-width: 639px) {
	.fl-products { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--fl-gutter); margin-inline: calc(-1 * var(--fl-gutter)); padding: 0 var(--fl-gutter) .75rem; scrollbar-width: none; }
	.fl-products::-webkit-scrollbar { display: none; }
	.fl-products > * { scroll-snap-align: start; }
}
@media (min-width: 640px) { .fl-products { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .fl-products { grid-template-columns: repeat(4, 1fr); } }
.fl-product { position: relative; display: flex; flex-direction: column; gap: 0; padding: 0; border: 0; background: none; }
.fl-product__media { position: relative; aspect-ratio: 1 / 1; border-radius: var(--fl-radius-l); overflow: hidden; background: var(--c-surface); display: grid; place-items: center; }
.fl-product__media img { width: 100%; height: 100%; object-fit: contain; padding: 8%; transition: transform 700ms var(--fl-ease); }
.fl-product:hover .fl-product__media img, .fl-product:hover .fl-photo__mark { transform: scale(1.03); }
.fl-product__media.fl-photo { border-radius: var(--fl-radius-l); }
.fl-product__media > .fl-tag { position: absolute; top: .9rem; left: .9rem; background: #fff; }
.fl-product__body { padding: 1.25rem .25rem 0; display: flex; flex-direction: column; gap: .35rem; flex: 1; }
.fl-product__brand { font: 600 .74rem/1 var(--f-head); letter-spacing: .14em; text-transform: uppercase; color: var(--c-muted); text-decoration: none; }
.fl-product__title { font: 700 1.25rem/1.25 var(--f-head); letter-spacing: -0.015em; margin: 0; }
.fl-product__specs, .fl-product__chips { list-style: none; margin: .35rem 0 .9rem; padding: 0; display: grid; gap: .25rem; font-size: .9rem; color: var(--c-muted); }
.fl-product__specs li, .fl-product__chips li { display: flex; gap: .55rem; }
.fl-product__specs li::before, .fl-product__chips li::before { content: "—"; color: #B5BFCC; }
.fl-chip { background: none; border: 0; padding: 0; font-size: .9rem; color: var(--c-muted); }
.fl-product__actions { margin-top: auto; display: flex; gap: .5rem; flex-wrap: wrap; }
.fl-product.fl-card { border: 0; padding: 0; }

/* ---------- Software ---------- */
.fl-soft { display: grid; gap: 0; border-top: 1px solid var(--c-line); }
.fl-soft__group { display: grid; gap: .75rem 2rem; padding: 1.75rem 0; border-bottom: 1px solid var(--c-line); }
@media (min-width: 800px) { .fl-soft__group { grid-template-columns: 13rem 1fr; } }
.fl-soft__label { font: 600 .76rem/1.5 var(--f-head); letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); padding-top: .2rem; }
.fl-soft__items { display: grid; gap: 1.25rem; }
@media (min-width: 640px) { .fl-soft__items--2 { grid-template-columns: 1fr 1fr; } }
.fl-soft__item h3 { font-size: 1.15rem; margin: 0 0 .3rem; }
.fl-soft__item p { font-size: .95rem; color: var(--c-muted); margin: 0; line-height: 1.6; }

/* ---------- Technical service (navy) ---------- */
.fl-service__grid { display: grid; grid-template-columns: 1fr; border-top: 1px solid rgba(255, 255, 255, .1); }
@media (min-width: 640px) { .fl-service__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .fl-service__grid { grid-template-columns: repeat(3, 1fr); } }
.fl-service__item { padding: 1.75rem 1.5rem 1.75rem 0; border-bottom: 1px solid rgba(255, 255, 255, .1); background: none; border-radius: 0; }
@media (min-width: 640px) { .fl-service__item { padding-right: 2rem; } }
.fl-service__item h3 { font-size: 1.12rem; margin: .9rem 0 .35rem; color: #fff; }
.fl-service__item p { font-size: .94rem; color: #9EABBC; margin: 0; line-height: 1.6; }
.fl-service__item svg { width: 26px; height: 26px; color: #8FB0FF; }
.fl-service__lead { display: grid; gap: 2rem; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
@media (min-width: 1024px) { .fl-service__lead { grid-template-columns: 1.2fr 1fr; align-items: end; } }

/* ---------- Brands ---------- */
.fl-brands { display: grid; grid-template-columns: repeat(2, 1fr); list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--c-line); border-left: 1px solid var(--c-line); }
@media (min-width: 640px) { .fl-brands { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .fl-brands { grid-template-columns: repeat(5, 1fr); } }
.fl-brands li { display: grid; place-items: center; min-height: 110px; padding: 1rem; border-right: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); font: 700 1.05rem/1 var(--f-head); letter-spacing: .14em; color: #8693A4; transition: color var(--fl-t); }
.fl-brands li:hover { color: var(--c-ink); }
.fl-brands img { max-height: 36px; width: auto; filter: grayscale(1); opacity: .7; transition: filter var(--fl-t), opacity var(--fl-t); }
.fl-brands li:hover img { filter: none; opacity: 1; }

/* ---------- Brand logos grouped by category (no boxes) ----------
   Els logotips es mostren SENSE modificar: només s'ajusta l'alçada de visualització
   (--h) per equilibrar-los òpticament. */
.fl-logos { display: grid; border-top: 1px solid var(--c-line); }
.fl-logos__group { display: grid; gap: 1.25rem 2.5rem; padding: 2rem 0; border-bottom: 1px solid var(--c-line); align-items: center; }
@media (min-width: 900px) { .fl-logos__group { grid-template-columns: 15rem 1fr; } }
.fl-logos__label { font: 600 .76rem/1.5 var(--f-head); letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); }
.fl-logos__list { display: flex; flex-wrap: wrap; align-items: center; gap: 1.75rem 3.25rem; list-style: none; margin: 0; padding: 0; }
.fl-logos__item { display: flex; align-items: center; min-height: 48px; }
.fl-logos__item img { display: block; height: var(--h, 32px); width: auto; max-width: 180px; object-fit: contain; }
.fl-logos__item--dark { padding: .55rem .9rem; border-radius: 8px; background: var(--c-navy); }
.fl-logos__item--text { font: 700 1rem/1 var(--f-head); letter-spacing: .12em; color: #8693A4; gap: .6rem; }
.fl-logos__item--sunmi { color: #000; }
.fl-logos__item--sunmi svg { height: var(--h, 24px); width: auto; display: block; }
.fl-logos__stamp { display: inline-flex; align-items: center; gap: .5rem; font: 700 .72rem/1.4 var(--f-head); letter-spacing: .1em; text-transform: uppercase; color: #8A1C1C; background: #FDEDED; border: 1px dashed #E5A3A3; padding: .45rem .7rem; border-radius: 6px; }

/* ---------- Kit Digital (official identity, original content) ---------- */
.fl-kit { position: relative; display: grid; gap: clamp(1.75rem, 4vw, 3.5rem); align-items: center; padding: clamp(1.75rem, 4vw, 3.5rem); background: #fff; border: 1px solid var(--c-line); border-radius: var(--fl-radius-l); overflow: hidden; }
.fl-kit::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, #C8102E, #E8853B); }
@media (min-width: 960px) { .fl-kit { grid-template-columns: 1.1fr 1fr; } }
.fl-kit__logos { margin: 0; background: #fff; border-radius: var(--fl-radius-m); }
.fl-kit__logos img { width: 100%; height: auto; aspect-ratio: 1024 / 305; }
.fl-kit h2 { font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.4rem); }
.fl-kit p { color: #3A4757; }
.fl-kit__badge { display: none; }

.fl-kd-hero { padding-block: clamp(2.5rem, 6vw, 5rem); border-bottom: 1px solid var(--c-line); }
.fl-kd-hero h1 { font-size: clamp(2.5rem, 1.6rem + 3.6vw, 4.2rem); letter-spacing: -0.03em; }
.fl-kd-hero__img { border-radius: var(--fl-radius-l); overflow: hidden; border: 1px solid var(--c-line); background: #fff; }
.fl-kd-segments { display: grid; gap: 0; border-top: 1px solid var(--c-line); }
@media (min-width: 800px) { .fl-kd-segments { grid-template-columns: repeat(3, 1fr); } }
.fl-kd-seg { padding: 1.75rem 1.5rem 1.75rem 0; border-bottom: 1px solid var(--c-line); display: flex; flex-direction: column; gap: 1rem; }
@media (min-width: 800px) { .fl-kd-seg + .fl-kd-seg { border-left: 1px solid var(--c-line); padding-left: 1.75rem; } }
.fl-kd-seg p { margin: 0; }
.fl-kd-seg__amount { margin-top: auto; font-size: .95rem; color: var(--c-muted); }
.fl-kd-seg__amount strong { display: block; margin-top: .2rem; font: 700 clamp(1.8rem, 1.5rem + 1vw, 2.3rem)/1.1 var(--f-head); letter-spacing: -0.02em; color: var(--c-ink); }
.fl-kd-solutions { display: grid; gap: 1.25rem; }
.fl-kd-sol { border: 1px solid var(--c-line); border-radius: var(--fl-radius-l); background: #fff; overflow: hidden; }
.fl-kd-sol__head { padding: 1.4rem 1.75rem; border-bottom: 1px solid var(--c-line); }
.fl-kd-sol__head h3 { margin: 0; font-size: 1.35rem; }
.fl-kd-sol__body { display: grid; gap: 1.5rem; padding: 1.75rem; }
.fl-kd-sol__body h4 { margin: 0 0 .5rem; font-size: 1.1rem; }
.fl-kd-sol__sub + .fl-kd-sol__sub { border-top: 1px solid var(--c-line); padding-top: 1.5rem; }
.fl-kd-figures { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 1.25rem 0; background: var(--c-line); border: 1px solid var(--c-line); border-radius: var(--fl-radius-m); overflow: hidden; }
.fl-kd-fig { padding: 1rem 1.15rem; background: var(--c-surface); }
.fl-kd-fig .fl-kd-fig__label, .fl-kd-fig h5 { margin: 0 0 .35rem; font: 500 .8rem/1.3 var(--f-body); color: var(--c-muted); }
.fl-kd-fig .fl-kd-fig__value { margin: 0; font: 700 1.15rem/1.25 var(--f-head); color: var(--c-ink); }
.fl-kd-list { margin: .25rem 0 0; padding: 0; list-style: none; display: grid; gap: .35rem; color: #3A4757; }
@media (min-width: 640px) { .fl-kd-list { grid-template-columns: 1fr 1fr; column-gap: 2rem; } }

/* ---------- Contact & forms ---------- */
.fl-contact { display: grid; gap: clamp(2rem, 5vw, 5rem); }
@media (min-width: 1024px) { .fl-contact { grid-template-columns: 5fr 7fr; align-items: start; } }
.fl-form { display: grid; gap: 1.25rem; padding: clamp(1.5rem, 3.5vw, 2.75rem); background: #fff; border: 1px solid var(--c-line); border-radius: var(--fl-radius-l); }
.fl-form__row { display: grid; gap: 1.25rem; }
@media (min-width: 640px) { .fl-form__row--2 { grid-template-columns: 1fr 1fr; } }
.fl-field { display: grid; gap: .45rem; }
.fl-field label { font: 600 .9rem/1.3 var(--f-body); color: var(--c-ink); }
.fl-field .fl-req { color: #B42318; }
.fl-field input, .fl-field textarea, .fl-field select { width: 100%; min-height: 54px; padding: .85rem 1rem; font: 400 1rem/1.4 var(--f-body); color: var(--c-ink); background: #fff; border: 1px solid #C9D1DC; border-radius: var(--fl-radius-m); transition: border-color var(--fl-t), box-shadow var(--fl-t); }
.fl-field textarea { min-height: 150px; resize: vertical; }
.fl-field input:hover, .fl-field textarea:hover { border-color: #9EAABB; }
.fl-field input:focus, .fl-field textarea:focus, .fl-field select:focus { outline: none; border-color: var(--c-primary); box-shadow: 0 0 0 4px rgba(31, 94, 255, .14); }
.fl-field__hint { font-size: .84rem; line-height: 1.55; color: var(--c-muted); margin: 0; }
.fl-field--product { display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem .6rem; padding: 1rem 1.15rem; border-radius: var(--fl-radius-m); background: var(--c-primary-soft); border: 0; }
.fl-field--product span { font-size: .88rem; color: #3A4757; }
.fl-field--product strong { font: 700 1.05rem/1.3 var(--f-head); color: var(--c-ink); }
.fl-check { display: flex; gap: .7rem; align-items: flex-start; font-size: .9rem; color: #3A4757; }
.fl-check input { width: 20px; height: 20px; margin-top: .2rem; accent-color: var(--c-primary); flex: none; }
.fl-form button[type="submit"] { justify-self: start; min-width: 14rem; }
@media (max-width: 639px) { .fl-form button[type="submit"] { justify-self: stretch; } }
.fl-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.fl-notice { padding: 1rem 1.15rem; border-radius: var(--fl-radius-m); font-size: .95rem; }
.fl-notice--ok { background: #E8F7EE; color: #145A31; }
.fl-notice--error { background: #FDECEC; color: #8F1D1D; }
.fl-info { display: grid; gap: 0; align-content: start; }
.fl-info__card, .fl-info__list { display: grid; }
.fl-info__row { display: grid; grid-template-columns: 22px 1fr; gap: 1rem; align-items: start; padding: 1.15rem 0; border-bottom: 1px solid var(--c-line); }
.fl-info__row:first-child { border-top: 1px solid var(--c-line); }
.fl-info__row svg { width: 20px; height: 20px; color: var(--c-muted); margin-top: .15rem; }
.fl-info__label { display: block; font: 600 .72rem/1.4 var(--f-head); letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); margin-bottom: .2rem; }
.fl-info__value { font: 600 1.05rem/1.4 var(--f-head); color: var(--c-ink); text-decoration: none; }
a.fl-info__value:hover { color: var(--c-primary); }
.fl-map { margin-top: 1.5rem; padding: 1.25rem; border-radius: var(--fl-radius-l); background: var(--c-surface); font-size: .9rem; color: var(--c-muted); display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: center; justify-content: space-between; }
.fl-map p { margin: 0; max-width: 24rem; }

/* ---------- CTA band ---------- */
.fl-cta { display: grid; gap: 1.5rem; align-items: center; padding: clamp(2rem, 5vw, 3.5rem); border-radius: var(--fl-radius-l); background: var(--c-navy); color: #B9C4D3; }
.fl-cta h2 { color: #fff; margin: 0 0 .3em; font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.2rem); }
.fl-cta p { margin: 0; }
@media (min-width: 900px) { .fl-cta { grid-template-columns: 1fr auto; } }
.fl-cta__actions { display: flex; flex-wrap: wrap; gap: .75rem; }

/* ---------- Footer ---------- */
.fl-footer { background: var(--c-navy); color: #9EABBC; padding-top: clamp(3.5rem, 8vw, 6rem); font-size: .95rem; }
.fl-footer a { color: #D5DDE8; text-decoration: none; }
.fl-footer a:hover { color: #fff; }
.fl-footer__top { display: grid; gap: 2rem; padding-bottom: clamp(2.5rem, 5vw, 3.5rem); border-bottom: 1px solid rgba(255, 255, 255, .1); }
@media (min-width: 900px) { .fl-footer__top { grid-template-columns: 1fr auto; align-items: end; } }
.fl-footer__claim { font: 700 clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem)/1.2 var(--f-head); letter-spacing: -0.02em; color: #fff; max-width: 26ch; margin: 1.5rem 0 0; }
.fl-footer__grid { display: grid; gap: 2rem 2.5rem; padding-block: clamp(2.5rem, 5vw, 3.5rem); grid-template-columns: 1fr 1fr; }
@media (min-width: 900px) { .fl-footer__grid { grid-template-columns: repeat(4, 1fr); } }
.fl-footer h2, .fl-footer__title { font: 600 .74rem/1 var(--f-head); letter-spacing: .14em; text-transform: uppercase; color: #6F7E92; margin: 0 0 1.1rem; }
.fl-footer .fl-brand { color: #fff; }
.fl-footer .fl-brand__mark { background: #fff; color: var(--c-navy); }
.fl-footer .fl-brand__tag { color: #7D8BA0; }
.fl-linklist, .fl-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .65rem; }
.fl-footer__soon { color: #6F7E92; }
.fl-footer__bottom { border-top: 1px solid rgba(255, 255, 255, .1); padding-block: 1.5rem; display: flex; flex-wrap: wrap; gap: .75rem 2rem; justify-content: space-between; align-items: center; font-size: .85rem; }
.fl-footer__bottom ul { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; }
.fl-footer .fl-btn--light, .fl-footer .fl-btn--light:hover { color: var(--c-ink); }
.fl-footer .fl-lang, .fl-footer__bottom .fl-lang { display: inline-flex; gap: .1rem; }
.fl-footer .fl-lang a { color: #7D8BA0; }
.fl-footer .fl-lang a[aria-current="true"] { color: #fff; }

/* ---------- Mobile action bar ---------- */
.fl-mobilebar { position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; display: flex; gap: .5rem; padding: .5rem .75rem calc(.5rem + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .97); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-top: 1px solid var(--c-line); transition: transform 280ms var(--fl-ease); }
.fl-mobilebar a { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .25rem; min-height: 48px; border-radius: 12px; font: 600 .74rem/1 var(--f-head); text-decoration: none; color: var(--c-ink); }
.fl-mobilebar a svg { width: 20px; height: 20px; }
.fl-mobilebar__wa { color: var(--c-wa) !important; }
.fl-mobilebar__quote { flex: 1.3 1 0 !important; flex-direction: row !important; background: var(--c-primary); color: #fff !important; font-size: .88rem !important; }
.fl-mobilebar.is-hidden { transform: translateY(110%); }
body.has-mobilebar { padding-bottom: calc(var(--fl-bar-h) + env(safe-area-inset-bottom)); }
body.fl-menu-open .fl-mobilebar { transform: translateY(110%); }
@media (min-width: 960px) { .fl-mobilebar { display: none; } body.has-mobilebar { padding-bottom: 0; } }

/* ---------- Breadcrumbs ---------- */
.fl-crumbs { font-size: .85rem; color: var(--c-muted); }
.fl-crumbs ol { display: flex; flex-wrap: wrap; gap: .4rem; list-style: none; margin: 0; padding: 0; }
.fl-crumbs li + li::before { content: "/"; margin-right: .4rem; color: #B5BFCC; }
.fl-crumbs a { color: var(--c-muted); text-decoration: none; }
.fl-crumbs a:hover { color: var(--c-ink); text-decoration: underline; }

/* ---------- Product page ---------- */
.fl-pdp .fl-crumbs { margin-bottom: 2rem; }
.fl-pdp__main { aspect-ratio: 1 / 1; border-radius: var(--fl-radius-l); overflow: hidden; background: var(--c-surface); }
.fl-pdp__main img { width: 100%; height: 100%; object-fit: contain; padding: 6%; }
.fl-pdp__thumbs { display: flex; gap: .6rem; list-style: none; margin: .9rem 0 0; padding: 0; overflow-x: auto; }
.fl-pdp__thumbs img { width: 76px; height: 76px; object-fit: cover; border-radius: var(--fl-radius-m); background: var(--c-surface); }
.fl-pdp__summary h1 { font-size: clamp(2rem, 1.4rem + 2.4vw, 3.2rem); margin-top: .5rem; }
.fl-pdp__ref { color: var(--c-muted); font-size: .92rem; }
.fl-pdp-specs { display: grid; gap: 3rem; margin-top: 2rem; }
.fl-pdp-specs h2 { font-size: 1.6rem; }
.fl-specs { width: 100%; border-collapse: collapse; font-size: .97rem; }
.fl-specs th, .fl-specs td { text-align: left; padding: 1rem 0; border-bottom: 1px solid var(--c-line); vertical-align: top; }
.fl-specs th { width: 40%; padding-right: 1.5rem; font-weight: 500; color: var(--c-muted); }
.fl-docs { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .6rem; }
.fl-docs__size { font-weight: 500; color: var(--c-muted); font-size: .85em; }
.fl-related { list-style: none; margin: 0; padding: 0; }

/* ---------- Motion (subtle, premium) ---------- */
@media (prefers-reduced-motion: no-preference) {
	.fl-js .fl-reveal { opacity: 0; transform: translateY(16px); transition: opacity 700ms var(--fl-ease), transform 700ms var(--fl-ease); }
	.fl-js .fl-reveal.is-visible { opacity: 1; transform: none; }
	.fl-js .fl-reveal-stagger > * { opacity: 0; transform: translateY(14px); transition: opacity 700ms var(--fl-ease), transform 700ms var(--fl-ease); }
	.fl-js .fl-reveal-stagger.is-visible > * { opacity: 1; transform: none; }
	.fl-js .fl-reveal-stagger.is-visible > :nth-child(2) { transition-delay: 80ms; }
	.fl-js .fl-reveal-stagger.is-visible > :nth-child(3) { transition-delay: 160ms; }
	.fl-js .fl-reveal-stagger.is-visible > :nth-child(4) { transition-delay: 240ms; }
	.fl-js .fl-reveal-stagger.is-visible > :nth-child(n+5) { transition-delay: 300ms; }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
	.fl-header.is-hidden { transform: none; }
}

/* ==========================================================================
   WordPress · adaptació de l'estructura de blocs (Fase 2 · entrega 1)
   ========================================================================== */

/* Els grups de WordPress afegeixen marge entre fills (layout «flow»); als contenidors de disseny no el volem. */
body :is(.wp-block-post-content, .fl-hero__grid, .fl-hero__actions, .fl-trust__list, .fl-trust__item, .fl-sectors, .fl-sector, .fl-sector__body, .fl-section__head--row, .fl-split, .fl-soft, .fl-soft__group, .fl-soft__items, .fl-service__lead, .fl-service__grid, .fl-contact, .fl-kit, .fl-footer__top, .fl-footer__grid, .fl-footer__bottom, .fl-topbar__group, .fl-photo, .fl-header__brand, .fl-logos-wrap) > * { margin-block-start: 0; }
body .fl-main--home .wp-block-post-content > * { margin-block: 0; }
.fl-section__head > :last-child, .fl-sector__body p, .fl-soft__item p, .fl-service__item p { margin-bottom: 0; }

/* Mode revisió: marcadors només per a editors amb sessió (classe fl-review al body). */
.fl-review-only { display: none !important; }
body.fl-review .fl-review-only { display: inline-flex !important; }
body.fl-review p.fl-review-only:not(.fl-pending) { display: block !important; }

/* Logotip (Identitat del lloc). */
.fl-header__brand { position: relative; }
.fl-brand-logo img, .wp-block-site-logo img { height: 44px !important; width: auto !important; }
.fl-brand-provisional { position: absolute; left: 0; top: calc(100% + 2px); margin: 0; font: 700 .52rem/1 var(--f-body); letter-spacing: .1em; color: #7A5200; background: #FFF5DA; padding: 2px 4px; border-radius: 3px; white-space: nowrap; }
.fl-header__brand .wp-block-site-title { margin: 0; }

/* Barra superior. */
.fl-topbar .fl-container > .fl-topbar__group:last-child, .fl-topbar__group { display: flex; align-items: center; gap: 1.5rem; }

/* Hero amb imatge de la biblioteca de mitjans. */
.fl-photo--product > figure { position: absolute; inset: 0; margin: 0; }
.fl-photo--product figure img, .fl-photo--product > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 9%; mix-blend-mode: multiply; transition: transform 900ms var(--fl-ease); }
.fl-hero__media.fl-photo--product figure img { padding: 11% 14% 14%; }
.fl-sector--product:hover .fl-photo img, .fl-product:hover .fl-photo img { transform: scale(1.035); }
p.fl-hero__caption { margin: 0; z-index: 1; }
p.fl-hero__caption::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #22C55E; box-shadow: 0 0 0 4px rgba(34, 197, 94, .18); }
p.fl-photo__label { margin: 0; z-index: 1; }
.fl-photo > .fl-pending { position: absolute; z-index: 1; top: 1.25rem; right: 1.25rem; margin: 0; }
.fl-sector .fl-photo > .fl-pending { top: 1rem; right: auto; left: 1rem; }
@media (max-width: 639px) { .fl-hero .fl-hero__media p.fl-hero__caption { display: none; } }

/* Targeta de sector: el títol enllaçat cobreix tota la targeta. */
.fl-sector { position: relative; }
.fl-sector h3 a { color: inherit; text-decoration: none; }
.fl-sector h3 a::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.fl-sector--product:hover h3 a { color: var(--c-primary); }
.fl-sector__body p.fl-link-arrow { margin-top: .4rem; }

/* Franja de confiança (grups en lloc de llista). */
.fl-trust__item p { margin: 0; }
.fl-trust__item .fl-pending { margin-top: .35rem; }

/* Programari. */
.fl-split--top { align-items: start; }
p.fl-soft__label { margin: 0; }
.fl-soft__item h3 { font-size: 1.15rem; margin: 0 0 .3rem; }

/* Servei tècnic: icones per classe (fl-ico-*), editables sense codi. */
.fl-service__item::before { content: ""; display: block; width: 26px; height: 26px; background: #8FB0FF; -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
.fl-ico-install { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='12' rx='2'/%3E%3Cpath d='M8 20h8M12 16v4M9 10l2 2 4-4'/%3E%3C/svg%3E"); }
.fl-ico-power { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M12 3v9M6.3 7.3a8 8 0 1 0 11.4 0'/%3E%3C/svg%3E"); }
.fl-ico-cycle { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 0 0-14.9-3M4 13a8 8 0 0 0 14.9 3M4 4v4h4M20 20v-4h-4'/%3E%3C/svg%3E"); }
.fl-ico-tool { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0 5 5L21 13l-8 8-3-3 8-8-1.3-1.3a4 4 0 0 0-5-5L14 5zM3 21l6-6'/%3E%3C/svg%3E"); }
.fl-ico-chat { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-11.6 7.1L4 20l1-4.6A8 8 0 1 1 21 12z'/%3E%3C/svg%3E"); }
.fl-ico-learn { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 9 10-5 10 5-10 5zM6 11v5c3 2 9 2 12 0v-5'/%3E%3C/svg%3E"); }
.fl-section--dark > .fl-container > .fl-pending { margin-top: 1.5rem; }
.fl-service__lead .fl-cta__actions { margin-top: 1.75rem; }

/* Capçaleres de secció amb text a la dreta. */
.fl-section__head--row > .fl-lead { max-width: 27rem; }
.fl-section__head--row > p.fl-link-arrow { margin: 0; }
.fl-section__head--row > p.fl-link-arrow a { color: inherit; text-decoration: none; }

/* Marques (bloc dinàmic). */
.fl-logos-wrap .fl-logos__stamp { margin: 0 0 1.5rem; }
.fl-logos__item--preview { outline: 1px dashed #E2B65A; outline-offset: 8px; border-radius: 4px; }
.fl-logos__item--dark.fl-logos__item--preview { outline-offset: 4px; }

/* Contacte. */
.fl-contact .fl-info__card { margin-top: 2rem; }

/* Peu. */
.fl-footer__logo { margin: 0; }
.fl-footer__logo img { height: 48px; width: auto !important; }
p.fl-footer__claim { margin: 1.5rem 0 0; }
.fl-footer .fl-info__list .fl-info__row { border-color: rgba(255, 255, 255, .1); padding: .6rem 0; }
.fl-footer .fl-info__list .fl-info__row:first-child { border-top: 0; padding-top: 0; }
.fl-footer .fl-info__list svg { color: #6F7E92; }
.fl-footer .fl-info__label { color: #6F7E92; }
.fl-footer .fl-info__value { color: #D5DDE8; font-weight: 500; }
.fl-footer .fl-footer__soon { display: block; margin-top: .65rem; color: #6F7E92; }
.fl-footer .fl-footer__soon svg { display: none; }
.fl-footer__bottom p { margin: 0; }

/* Menú mòbil: accions extra. */
.fl-nav__extra-actions { display: grid; gap: .75rem; }

/* Franja de confiança: es reparteix entre els elements visibles (els «fl-review-only» no ocupen lloc al públic). */
@media (min-width: 1024px) { .fl-trust__list { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 1fr; } }
body.fl-review div.fl-review-only { display: grid !important; }

/* Imatge destacada a les pàgines (p. ex. la imatge original de Kit Digital). */
.fl-page-featured { margin: 1.5rem 0 0; max-width: 760px; border-radius: var(--fl-radius-l); overflow: hidden; border: 1px solid var(--c-line); background: #fff; }
.fl-page-featured img { width: 100%; height: auto; }
.fl-kd-original { padding-top: clamp(2rem, 5vw, 3.5rem); }

/* ===== Entrega 2 · components de pàgina (generat per tools/build-css-entrega2.py) ===== */
/* Els contenidors flex/grid no han de rebre el marge de «flow» que WordPress posa entre blocs germans. */
body :is(.fl-phero__grid, .fl-phero__text, .fl-phero__media, .fl-features, .fl-feature, .fl-flow, .fl-flow__step, .fl-xlinks, .fl-xlink, .fl-tiles, .fl-tile, .fl-tile__body, .fl-chat, .fl-chatpanel, .fl-faq, .fl-screen, .fl-screens, .fl-showcases, .fl-showcase, .fl-softbar, .fl-servicebar, .fl-cta, .fl-split > div) > * { margin-block-start: 0; }

:root { --ord-navy: #0B2233; --ord-navy-2: #0F2D43; --ord-teal: #1BC5B4; --ord-teal-soft: rgba(27, 197, 180, .14); }

/* Botons de bloc addicionals */
.wp-block-button.fl-b-light > .wp-block-button__link { background: #fff; color: var(--c-ink); }
.wp-block-button.fl-b-light > .wp-block-button__link:hover { background: #E9EEF6; color: var(--c-ink); box-shadow: none; }
.wp-block-button.fl-b-outline-light > .wp-block-button__link { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .35); }
.wp-block-button.fl-b-outline-light > .wp-block-button__link:hover { border-color: #fff; color: #fff; }
.wp-block-buttons.fl-center { justify-content: center; margin-top: 2rem; }

/* Icones per classe: qualsevol .fl-ico-* defineix --ico */
.fl-feature::before, .fl-xlink::before, .fl-servicebar::before { content: ""; display: block; width: 28px; height: 28px; background: var(--c-primary); -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }

/* Capçalera de pàgina interior */
.fl-phero { padding-block: clamp(2rem, 5vw, 4rem) clamp(3rem, 7vw, 6rem); background: linear-gradient(180deg, var(--c-surface), var(--c-base)); }
.fl-phero__crumbs { font-size: .875rem; color: var(--c-muted); margin: 0 0 clamp(1.5rem, 4vw, 3rem); }
.fl-phero__crumbs a { color: inherit; text-decoration: none; }
.fl-phero__crumbs a:hover { color: var(--c-primary); }
.fl-crumbs__sep { opacity: .45; margin-inline: .35rem; }
.fl-phero__grid { display: grid; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
@media (min-width: 1024px) { .fl-phero__grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); } .fl-phero__grid--solo { grid-template-columns: minmax(0, 52rem); } }
h1.fl-phero__title { font-size: clamp(2.2rem, 1.45rem + 3vw, 3.75rem); line-height: 1.06; letter-spacing: -0.03em; margin: 0 0 .45em; }
.fl-phero__lead { max-width: 40rem; }
.fl-phero .fl-phero__actions { margin-top: 1.75rem; gap: .75rem; }
.fl-phero__media { position: relative; border-radius: var(--fl-radius-l); background: linear-gradient(145deg, #fff, var(--c-surface)); box-shadow: var(--shadow-soft); padding: clamp(1rem, 3vw, 2rem); }
.fl-phero__media .wp-block-image { margin: 0; }
.fl-phero__media img { display: block; width: 100%; max-height: 440px; object-fit: contain; mix-blend-mode: multiply; }
.fl-phero__media > .fl-pending { position: absolute; top: .75rem; right: .75rem; margin: 0; }
.fl-phero__contact { margin-top: 2rem; max-width: 30rem; }
.fl-phero--ordely { background: radial-gradient(120% 90% at 85% 10%, var(--ord-navy-2), var(--ord-navy)); color: #B8C7D4; }
.fl-phero--ordely h1, .fl-phero--ordely .fl-phero__crumbs span[aria-current] { color: #fff; }
.fl-phero--ordely .fl-eyebrow { color: var(--ord-teal); }
.fl-phero--ordely .fl-lead { color: #B8C7D4; }
.fl-phero--ordely .fl-phero__crumbs { color: #8FA3B5; }
.fl-phero--ordely .fl-phero__media { background: transparent; box-shadow: none; padding: 0; }
.fl-phero--ia { background: radial-gradient(90% 80% at 90% 0%, var(--c-primary-soft), var(--c-base) 70%); }
.fl-phero--ia .fl-phero__media { background: #fff; }

/* Rejilla de funcions */
.fl-features { display: grid; gap: 1rem; }
@media (min-width: 640px) { .fl-features { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .fl-features--3 { grid-template-columns: repeat(3, 1fr); } .fl-features--4 { grid-template-columns: repeat(4, 1fr); } }
.fl-feature { display: flex; flex-direction: column; gap: .2rem; padding: 1.5rem; background: var(--c-base); border: 1px solid var(--c-line); border-radius: var(--fl-radius-m); transition: border-color var(--fl-t), box-shadow var(--fl-t); }
.fl-section--surface .fl-feature { border-color: transparent; }
.fl-feature:hover { border-color: #C9D6EE; box-shadow: var(--shadow-soft); }
.fl-feature::before { margin-bottom: .9rem; }
.fl-feature h3 { font-size: 1.12rem; margin: 0 0 .3rem; }
.fl-feature p { margin: 0; color: var(--c-muted); font-size: .98rem; line-height: 1.6; }
.fl-feature p a { white-space: nowrap; font-weight: 600; text-decoration: none; }
.fl-feature .fl-pending { margin-top: .6rem; align-self: flex-start; }
.fl-features--compact .fl-feature { padding: 1.25rem; }
.fl-features + .fl-features { margin-top: 1rem; }

/* Procés en passos */
.fl-flow { display: grid; gap: 0; counter-reset: flow; margin: 0 auto; }
.fl-flow__step { position: relative; padding: 0 0 1.75rem 3.75rem; }
.fl-flow__step::before { content: ""; position: absolute; left: 1.2rem; top: 2.6rem; bottom: .4rem; width: 2px; background: var(--c-line); }
.fl-flow__step:last-child::before { display: none; }
p.fl-flow__num { position: absolute; left: 0; top: 0; width: 2.5rem; height: 2.5rem; display: grid; place-items: center; margin: 0; border-radius: 50%; background: var(--c-primary-soft); color: var(--c-primary); font: 700 .85rem/1 var(--f-head); }
.fl-flow__step h3 { font-size: 1.15rem; margin: .35rem 0 .25rem; }
.fl-flow__step p:not(.fl-flow__num) { margin: 0; color: var(--c-muted); font-size: .98rem; }
@media (min-width: 900px) {
	.fl-flow { grid-auto-flow: column; grid-auto-columns: 1fr; gap: 1.25rem; }
	.fl-flow__step { padding: 3.75rem 0 0; }
	.fl-flow__step::before { left: 3.25rem; right: -1rem; top: 1.2rem; bottom: auto; width: auto; height: 2px; }
	.fl-flow__step::after { content: ""; position: absolute; top: calc(1.2rem - 4px); right: -1rem; width: 8px; height: 8px; border-top: 2px solid var(--c-line); border-right: 2px solid var(--c-line); transform: rotate(45deg); }
	.fl-flow__step:last-child::after { display: none; }
}
.fl-flow--dark p.fl-flow__num { background: rgba(143, 176, 255, .14); color: #8FB0FF; }
.fl-flow--dark .fl-flow__step::before, .fl-flow--dark .fl-flow__step::after { background-color: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .25); }
.fl-flow--dark .fl-flow__step::after { background: none; }
.fl-flow--dark h3 { color: #fff; }
.fl-flow--dark .fl-flow__step p:not(.fl-flow__num) { color: #AAB6C6; }
.fl-flow--ordely p.fl-flow__num { background: var(--ord-navy); color: var(--ord-teal); }
.fl-flow--compact .fl-flow__step { padding-bottom: 1.1rem; }
.fl-flow--compact h3 { font-size: 1rem; }
.fl-section--dark .fl-section__head + .fl-flow, .fl-service__lead + .fl-flow { margin-top: .5rem; }
.fl-service__lead + .fl-flow { margin-top: clamp(2.5rem, 5vw, 4rem); }

/* Targetes enllaçades */
.fl-xlinks { display: grid; gap: 1rem; }
@media (min-width: 640px) { .fl-xlinks { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .fl-xlinks { grid-template-columns: repeat(3, 1fr); } .fl-xlinks--4 { grid-template-columns: repeat(4, 1fr); } .fl-xlinks--5 { grid-template-columns: repeat(5, 1fr); } }
.fl-xlink { position: relative; padding: 1.5rem; background: var(--c-base); border: 1px solid var(--c-line); border-radius: var(--fl-radius-m); transition: transform var(--fl-t), box-shadow var(--fl-t), border-color var(--fl-t); }
.fl-section--surface .fl-xlink { border-color: transparent; }
.fl-xlink::before { margin-bottom: 1rem; }
.fl-xlink h3 { font-size: 1.12rem; margin: 0 0 .35rem; }
.fl-xlink h3 a { color: var(--c-ink); text-decoration: none; }
.fl-xlink h3 a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.fl-xlink h3 a::before { content: "→"; float: right; color: var(--c-primary); transition: transform var(--fl-t); }
.fl-xlink:has(a):hover { transform: translateY(-2px); box-shadow: var(--shadow-soft); border-color: #C9D6EE; }
.fl-xlink:has(a):hover h3 a::before { transform: translateX(3px); }
.fl-xlink p { margin: 0; color: var(--c-muted); font-size: .96rem; line-height: 1.55; }

/* Rajoles amb foto */
.fl-tiles { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); }
@media (min-width: 1024px) { .fl-tiles { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } }
.fl-tile { display: flex; flex-direction: column; background: var(--c-base); border-radius: var(--fl-radius-m); overflow: hidden; border: 1px solid var(--c-line); }
.fl-section--surface .fl-tile { border-color: transparent; }
.fl-tile__media { aspect-ratio: 4 / 3; background: linear-gradient(160deg, #fff, var(--c-surface)); display: grid; place-items: center; padding: 1.25rem; }
.fl-tile__media .wp-block-image { margin: 0; height: 100%; width: 100%; }
.fl-tile__media img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.fl-tile__body { padding: 1.1rem 1.25rem 1.35rem; }
.fl-tile__body h3 { font-size: 1.06rem; margin: 0 0 .25rem; }
.fl-tile__body p { margin: 0; color: var(--c-muted); font-size: .95rem; }
.fl-tiles + .fl-features { margin-top: 1rem; }

/* Llista de comprovació */
ul.fl-checklist { list-style: none; padding: 0; margin: 1.5rem 0 2rem; display: grid; gap: .65rem; }
ul.fl-checklist li { position: relative; padding-left: 1.9rem; }
ul.fl-checklist li::before { content: ""; position: absolute; left: 0; top: .3em; width: 1.15rem; height: 1.15rem; border-radius: 50%; background: var(--c-primary-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F5EFF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12l4 4 8-8'/%3E%3C/svg%3E") center / 70% no-repeat; }
.fl-split--center { align-items: center; }
.fl-split > div > p + p { margin-top: 1rem; }
.fl-split .wp-block-buttons { margin-top: 1.75rem; gap: .65rem; }
.fl-section__head .fl-lead { max-width: 40rem; }

/* Avís */
p.fl-note { margin: 2rem 0 0; padding: 1rem 1.25rem; border-left: 3px solid var(--c-primary); background: var(--c-primary-soft); border-radius: 0 var(--fl-radius-s) var(--fl-radius-s) 0; color: var(--c-ink); font-size: .96rem; }
p.fl-note--dark { background: rgba(143, 176, 255, .1); border-left-color: #8FB0FF; color: #D7DFEA; }
p.fl-note--dark strong { color: #fff; }

/* Preguntes d'exemple (IA) */
.fl-chat { display: grid; gap: .6rem; }
p.fl-chat__q { position: relative; justify-self: start; margin: 0; padding: .7rem 1rem .7rem 2.6rem; background: #fff; border: 1px solid var(--c-line); border-radius: 14px 14px 14px 4px; font-weight: 500; color: var(--c-ink); box-shadow: 0 1px 2px rgba(11, 24, 40, .04); }
p.fl-chat__q::before { content: ""; position: absolute; left: .9rem; top: 50%; width: 1.1rem; height: 1.1rem; transform: translateY(-50%); background: var(--c-primary); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.8 4.7L18.5 9.5l-4.7 1.8L12 16l-1.8-4.7L5.5 9.5l4.7-1.8z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.8 4.7L18.5 9.5l-4.7 1.8L12 16l-1.8-4.7L5.5 9.5l4.7-1.8z'/%3E%3C/svg%3E") center / contain no-repeat; }
.fl-chat p.fl-chat__q:nth-child(even) { justify-self: end; }
.fl-chatpanel { display: grid; gap: 1rem; }
p.fl-chatpanel__label { margin: 0; font: 600 .78rem/1 var(--f-head); letter-spacing: .14em; text-transform: uppercase; color: var(--c-muted); }

/* Preguntes freqüents */
.fl-faq { max-width: 52rem; border-top: 1px solid var(--c-line); }
.fl-faq .wp-block-details { border-bottom: 1px solid var(--c-line); padding: 0; margin: 0; }
.fl-faq summary { cursor: pointer; list-style: none; position: relative; padding: 1.2rem 2.5rem 1.2rem 0; font: 600 1.08rem/1.4 var(--f-head); color: var(--c-ink); }
.fl-faq summary::-webkit-details-marker { display: none; }
.fl-faq summary::after { content: "+"; position: absolute; right: .25rem; top: 50%; transform: translateY(-50%); font: 400 1.6rem/1 var(--f-body); color: var(--c-primary); transition: transform var(--fl-t); }
.fl-faq details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.fl-faq details p { margin: 0 0 1.3rem; color: var(--c-muted); max-width: 46rem; }

/* Marc de captura de pantalla */
.fl-screen { position: relative; border-radius: 12px; overflow: hidden; background: #fff; box-shadow: var(--shadow-float); border: 1px solid rgba(11, 24, 40, .08); }
p.fl-screen__bar { display: flex; gap: 6px; margin: 0; padding: 10px 12px; background: #EEF2F6; border-bottom: 1px solid var(--c-line); }
p.fl-screen__bar span { width: 9px; height: 9px; border-radius: 50%; background: #CBD3DD; }
.fl-screen__body { aspect-ratio: 16 / 10; background:
	linear-gradient(var(--ord-navy), var(--ord-navy)) 0 0 / 22% 100% no-repeat,
	linear-gradient(90deg, var(--ord-teal-soft), var(--ord-teal-soft)) 28% 10% / 20% 18% no-repeat,
	linear-gradient(90deg, #EEF2F6, #EEF2F6) 52% 10% / 20% 18% no-repeat,
	linear-gradient(90deg, #EEF2F6, #EEF2F6) 76% 10% / 20% 18% no-repeat,
	repeating-linear-gradient(180deg, #F4F6F9 0 10%, #fff 10% 13%) 62% 82% / 70% 52% no-repeat,
	#fff; }
.fl-screen > .fl-pending { position: absolute; left: 50%; bottom: 1rem; transform: translateX(-50%); margin: 0; width: max-content; max-width: 90%; }
.fl-screens { display: grid; gap: 1.25rem; }
@media (min-width: 900px) { .fl-screens { grid-template-columns: repeat(3, 1fr); } }

/* Secció ORDELY (identitat blau fosc + turquesa) */
.fl-section--ordely { background: radial-gradient(100% 120% at 0% 0%, var(--ord-navy-2), var(--ord-navy)); color: #B8C7D4; }
.fl-section--ordely h2, .fl-section--ordely h3, .fl-section--ordely strong { color: #fff; }
.fl-section--ordely .fl-eyebrow { color: var(--ord-teal); }
.fl-section--ordely .fl-lead { color: #C9D5E0; }
.fl-section--ordely ul.fl-checklist li::before { background-color: var(--ord-teal-soft); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231BC5B4' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12l4 4 8-8'/%3E%3C/svg%3E"); }

/* Destacats ORDELY / IA */
.fl-showcases { display: grid; gap: 1.25rem; }
@media (min-width: 960px) { .fl-showcases { grid-template-columns: 1fr 1fr; } }
.fl-showcase { display: flex; flex-direction: column; gap: .4rem; padding: clamp(1.75rem, 4vw, 2.75rem); border-radius: var(--fl-radius-l); }
.fl-showcase h3 { font-size: clamp(1.35rem, 1.1rem + .9vw, 1.75rem); margin: 0 0 .35rem; }
.fl-showcase > p { margin: 0 0 .75rem; }
.fl-showcase .wp-block-buttons { margin-top: auto; padding-top: 1.25rem; gap: .65rem; }
p.fl-showcase__brand { margin: 0 0 .75rem; font: 800 .82rem/1 var(--f-head); letter-spacing: .18em; text-transform: uppercase; }
.fl-showcase--ordely { background: radial-gradient(120% 120% at 100% 0%, var(--ord-navy-2), var(--ord-navy)); color: #B8C7D4; }
.fl-showcase--ordely h3 { color: #fff; }
.fl-showcase--ordely p.fl-showcase__brand { font-size: 1.6rem; letter-spacing: .08em; color: var(--ord-teal); }
.fl-showcase--ia { background: #fff; border: 1px solid var(--c-line); box-shadow: var(--shadow-soft); }
.fl-showcase--ia p.fl-showcase__brand { color: var(--c-primary); }
.fl-showcase--ia > p:not(.fl-showcase__brand) { color: var(--c-muted); }
.fl-showcase .fl-chat { margin: .25rem 0 .5rem; }
ul.fl-showcase__flow { list-style: none; padding: 0; margin: .25rem 0 .5rem; }
ul.fl-showcase__flow li { display: inline-block; padding: .45rem .8rem; border-radius: 999px; background: var(--ord-teal-soft); color: #CFF5F0; font-size: .9rem; font-weight: 600; }

/* Barra de programari de tercers (portada) */
.fl-softbar { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.5rem; padding: 1.1rem 1.5rem; margin-bottom: 1.25rem; background: #fff; border-radius: var(--fl-radius-m); }
p.fl-softbar__label { margin: 0; font: 600 .78rem/1 var(--f-head); letter-spacing: .14em; text-transform: uppercase; color: var(--c-muted); }
ul.fl-softbar__list { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; }
ul.fl-softbar__list li { padding: .45rem .9rem; border: 1px solid var(--c-line); border-radius: 999px; font: 700 .95rem/1 var(--f-head); color: var(--c-ink); }
p.fl-softbar__more { margin: 0 0 0 auto; }
p.fl-softbar__more a { font-weight: 600; text-decoration: none; }

/* Franja de servei a les fitxes de producte */
.fl-servicebar { display: grid; gap: 1rem 1.5rem; align-items: center; padding: 1.5rem; border: 1px solid var(--c-line); border-radius: var(--fl-radius-m); }
@media (min-width: 800px) { .fl-servicebar { grid-template-columns: auto 1fr auto; } }
.fl-servicebar h3 { font-size: 1.12rem; margin: 0 0 .2rem; }
.fl-servicebar p { margin: 0; color: var(--c-muted); }

/* Icones */
.fl-ico-pos { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='12' rx='2'/%3E%3Cpath d='M8 21h8M12 15v6M7 7h6'/%3E%3C/svg%3E"); }
.fl-ico-software { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Cpath d='M3 9h18M8 13l-2 2 2 2M12 17h4'/%3E%3C/svg%3E"); }
.fl-ico-tablet { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='2' width='14' height='20' rx='2'/%3E%3Cpath d='M11 18h2'/%3E%3C/svg%3E"); }
.fl-ico-tablet-pay { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='2' width='12' height='18' rx='2'/%3E%3Cpath d='M8 16h2'/%3E%3Crect x='13' y='11' width='8' height='6' rx='1'/%3E%3Cpath d='M13 13h8'/%3E%3C/svg%3E"); }
.fl-ico-printer { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9V3h12v6'/%3E%3Crect x='3' y='9' width='18' height='8' rx='2'/%3E%3Cpath d='M6 14h12v7H6z'/%3E%3C/svg%3E"); }
.fl-ico-screen { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='13' rx='2'/%3E%3Cpath d='M8 21h8M6 8h5M6 11h8M15 8h3'/%3E%3C/svg%3E"); }
.fl-ico-card { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='2'/%3E%3Cpath d='M2 10h20M6 15h4'/%3E%3C/svg%3E"); }
.fl-ico-cash { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='6' width='20' height='12' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2.5'/%3E%3Cpath d='M6 12h.01M18 12h.01'/%3E%3C/svg%3E"); }
.fl-ico-table { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8h18M5 8v10M19 8v10M8 8l-1-4h10l-1 4'/%3E%3C/svg%3E"); }
.fl-ico-network { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='2' width='6' height='5' rx='1'/%3E%3Crect x='2' y='17' width='6' height='5' rx='1'/%3E%3Crect x='16' y='17' width='6' height='5' rx='1'/%3E%3Cpath d='M12 7v5M5 17v-3h14v3'/%3E%3C/svg%3E"); }
.fl-ico-ai { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.8 4.7L18.5 9.5l-4.7 1.8L12 16l-1.8-4.7L5.5 9.5l4.7-1.8z'/%3E%3Cpath d='M19 15l.8 2.2L22 18l-2.2.8L19 21l-.8-2.2L16 18l2.2-.8z'/%3E%3C/svg%3E"); }
.fl-ico-tool { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0 5 5L21 13l-8 8-3-3 8-8-1.3-1.3a4 4 0 0 0-5-5L14 5zM3 21l6-6'/%3E%3C/svg%3E"); }
.fl-ico-install { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='12' rx='2'/%3E%3Cpath d='M8 20h8M12 16v4M9 10l2 2 4-4'/%3E%3C/svg%3E"); }
.fl-ico-power { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v9M6.3 7.3a8 8 0 1 0 11.4 0'/%3E%3C/svg%3E"); }
.fl-ico-cycle { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 0 0-14.9-3M4 13a8 8 0 0 0 14.9 3M4 4v4h4M20 20v-4h-4'/%3E%3C/svg%3E"); }
.fl-ico-chat { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-11.6 7.1L4 20l1-4.6A8 8 0 1 1 21 12z'/%3E%3C/svg%3E"); }
.fl-ico-learn { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 9 10-5 10 5-10 5zM6 11v5c3 2 9 2 12 0v-5'/%3E%3C/svg%3E"); }
.fl-ico-meat { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 4c3 0 5 2 5 5 0 4-4 8-8 8-1.5 0-2.5-.5-3.3-1.3L5 19l-2-2 3.3-3.7C5.5 12.5 5 11.5 5 10c0-3 4-6 10-6z'/%3E%3Ccircle cx='14' cy='9' r='1.5'/%3E%3C/svg%3E"); }
.fl-ico-bread { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12a4 4 0 0 1 0-8h16a4 4 0 0 1 0 8v7a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1z'/%3E%3Cpath d='M9 8v8M15 8v8'/%3E%3C/svg%3E"); }
.fl-ico-cake { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V12h16v9M2 21h20M4 16c2 1.5 4 1.5 6 0s4-1.5 6 0 4 1.5 4 0M12 12V8M12 5v.01'/%3E%3C/svg%3E"); }
.fl-ico-cart { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.5'/%3E%3Ccircle cx='18' cy='20' r='1.5'/%3E%3Cpath d='M2 3h3l2.5 12h11.5l2-8H6.2'/%3E%3C/svg%3E"); }
.fl-ico-store { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l1.5-5h15L21 9M3 9v11h18V9M3 9h18M9 20v-6h6v6'/%3E%3C/svg%3E"); }
.fl-ico-scale { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 20h14l-2-9H7z'/%3E%3Cpath d='M12 11V7M8 7h8'/%3E%3Ccircle cx='12' cy='15.5' r='1.5'/%3E%3C/svg%3E"); }
.fl-ico-label { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12V4h8l10 10-8 8z'/%3E%3Ccircle cx='7.5' cy='8.5' r='1.5'/%3E%3C/svg%3E"); }
.fl-ico-barcode { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5v14M7 5v14M10 5v14M14 5v14M16 5v14M20 5v14'/%3E%3C/svg%3E"); }
.fl-ico-burger { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10a8 5 0 0 1 16 0zM3 14h18M4 17h16a2 2 0 0 1-2 3H6a2 2 0 0 1-2-3z'/%3E%3C/svg%3E"); }
.fl-ico-box { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8l-9-5-9 5v8l9 5 9-5zM3 8l9 5 9-5M12 13v8'/%3E%3C/svg%3E"); }
.fl-ico-plus { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 8v8M8 12h8'/%3E%3C/svg%3E"); }
.fl-ico-platform { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 17l3-6h14l3 6zM2 17v2h20v-2'/%3E%3Cpath d='M12 11V5M9 5h6'/%3E%3C/svg%3E"); }
.fl-ico-gauge { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='12' rx='2'/%3E%3Cpath d='M7 9h10v4H7zM8 21h8M12 17v4'/%3E%3C/svg%3E"); }
.fl-ico-plug { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 2v6M15 2v6M6 8h12v4a6 6 0 0 1-12 0zM12 18v4'/%3E%3C/svg%3E"); }
.fl-ico-catalog { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h7v7H4zM13 4h7v7h-7zM4 13h7v7H4zM13 13h7v7h-7z'/%3E%3C/svg%3E"); }
.fl-ico-list { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6h12M9 12h12M9 18h12M4 6h.01M4 12h.01M4 18h.01'/%3E%3C/svg%3E"); }
.fl-ico-note { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h16v12l-4 4H4z'/%3E%3Cpath d='M16 20v-4h4M8 9h8M8 13h5'/%3E%3C/svg%3E"); }
.fl-ico-calendar { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4M12 14v3l2 1'/%3E%3C/svg%3E"); }
.fl-ico-dashboard { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='8' height='9' rx='1'/%3E%3Crect x='13' y='3' width='8' height='5' rx='1'/%3E%3Crect x='13' y='10' width='8' height='11' rx='1'/%3E%3Crect x='3' y='14' width='8' height='7' rx='1'/%3E%3C/svg%3E"); }
.fl-ico-factory { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 21V10l6 4V10l6 4V6h3l1 15zM2 21h20'/%3E%3C/svg%3E"); }
.fl-ico-check { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12l3 3 5-6'/%3E%3C/svg%3E"); }
.fl-ico-stock { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21V9l9-6 9 6v12M7 21v-8h10v8M7 17h10'/%3E%3C/svg%3E"); }
.fl-ico-chart { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18M7 15l4-4 3 3 6-7'/%3E%3C/svg%3E"); }
.fl-ico-user { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E"); }
.fl-ico-pc { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='13' rx='2'/%3E%3Cpath d='M8 21h8M12 17v4'/%3E%3C/svg%3E"); }
/* ===== /Entrega 2 ===== */

/* ===== Entrega 2b · ORDELY amb captures reals ===== */
body :is(.fl-shot, .fl-roles, .fl-role, .fl-role__menu, .fl-role__body, .fl-ordely-wide) > * { margin-block-start: 0; }

/* Captura real dins d'un marc de finestra */
.fl-shot { position: relative; margin: 0; border-radius: 14px; overflow: hidden; background: #fff; border: 1px solid rgba(11, 24, 40, .08); box-shadow: 0 1px 2px rgba(11, 24, 40, .05), 0 24px 60px -24px rgba(11, 24, 40, .35); }
.fl-shot figure.wp-block-image { margin: 0; }
.fl-shot img { display: block; width: 100%; height: auto; }
p.fl-shot__cap { margin: 0; padding: .55rem 1rem; font-size: .78rem; line-height: 1.4; color: var(--c-muted); background: #fff; border-top: 1px solid var(--c-line); }
.fl-shot--dark { border-color: rgba(27, 197, 180, .22); box-shadow: 0 0 0 1px rgba(255, 255, 255, .04), 0 40px 90px -30px rgba(0, 0, 0, .7); }
.fl-shot--dark p.fl-screen__bar { background: #102B40; border-bottom-color: rgba(255, 255, 255, .06); }
.fl-shot--dark p.fl-screen__bar span { background: #2B4A62; }
.fl-shot--dark p.fl-screen__bar span:first-child { background: var(--ord-teal); }
.fl-shot--dark p.fl-shot__cap { background: #0F2537; color: #8FA3B5; border-top-color: rgba(255, 255, 255, .06); }
@media (min-width: 1100px) {
	.fl-shot--hero { transform: perspective(1800px) rotateY(-7deg) rotateX(2deg); transform-origin: left center; }
}
.fl-ordely-wide { margin-top: clamp(2.5rem, 5vw, 4rem); }
@media (min-width: 960px) { .fl-split--5-7.fl-split--reverse { grid-template-columns: 7fr 5fr; } }
.fl-split .fl-lead + ul.fl-checklist { margin-top: 1.4rem; }
.fl-phero__media .fl-shot img { mix-blend-mode: normal; }
.fl-ordely-gap { height: clamp(3rem, 7vw, 6rem); }

/* Perfils: «Cada treballador, les eines que necessita» */
.fl-roles { display: grid; gap: 1.25rem; margin-top: clamp(2rem, 4vw, 3rem); }
@media (min-width: 1000px) { .fl-roles { grid-template-columns: repeat(3, 1fr); } }
.fl-role { display: grid; grid-template-columns: 124px 1fr; border-radius: 18px; overflow: hidden; background: #fff; border: 1px solid var(--c-line); box-shadow: 0 1px 2px rgba(11, 24, 40, .04), 0 18px 40px -26px rgba(11, 24, 40, .3); transition: transform .25s ease, box-shadow .25s ease; }
.fl-role:hover { transform: translateY(-3px); box-shadow: 0 1px 2px rgba(11, 24, 40, .04), 0 26px 50px -24px rgba(11, 24, 40, .35); }
.fl-role__menu { background: linear-gradient(180deg, #0F2D43, var(--ord-navy)); padding-top: .5rem; }
.fl-role__menu figure.wp-block-image { margin: 0; }
.fl-role__menu img { display: block; width: 100%; height: auto; -webkit-mask-image: linear-gradient(#000 82%, transparent); mask-image: linear-gradient(#000 82%, transparent); }
.fl-role__body { padding: 1.35rem 1.35rem 1.5rem; }
p.fl-role__tag { display: inline-block; margin: 0 0 .8rem; padding: .25rem .7rem; border-radius: 999px; background: var(--ord-teal-soft); color: #0B7E73; font-size: .74rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.fl-role h3 { margin: 0 0 .35rem; font-size: 1.2rem; }
.fl-role__body > p:not(.fl-role__tag):not(.fl-role__no) { margin: 0; font-size: .95rem; color: var(--c-muted); }
ul.fl-role__can { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .5rem; font-size: .93rem; line-height: 1.4; }
ul.fl-role__can li { position: relative; padding-left: 1.6rem; margin: 0; }
ul.fl-role__can li::before { content: ""; position: absolute; left: 0; top: .1rem; width: 1.1rem; height: 1.1rem; border-radius: 50%; background: var(--ord-teal-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B7E73' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12l4 4 8-8'/%3E%3C/svg%3E") center / 70% no-repeat; }
p.fl-role__no { margin: 1rem 0 0; padding-top: .85rem; border-top: 1px dashed var(--c-line); font-size: .84rem; line-height: 1.45; color: var(--c-muted); }
@media (max-width: 420px) { .fl-role { grid-template-columns: 96px 1fr; } .fl-role__body { padding: 1.1rem; } }

/* Integracions sobre fons ORDELY */
.fl-section--ordely .fl-section__head h2 { color: #fff; }
.fl-section--ordely .fl-section__head p.fl-lead { color: #AFC0CE; }
.fl-section--ordely .fl-feature { background: rgba(255, 255, 255, .04); border-color: rgba(255, 255, 255, .08); }
.fl-section--ordely .fl-feature p { color: #AFC0CE; }
.fl-section--ordely .fl-feature::before { background-color: var(--ord-teal); }
/* ===== /Entrega 2b ===== */

/* ===== 0.4.0b · Millores visuals finals ===== */
body :is(.fl-integs, .fl-integ, .fl-gains, .fl-gain, .fl-qcats, .fl-qcat) > * { margin-block-start: 0; }

/* 1 · Logotip una mica més present (proporcions intactes) */
.fl-brand-logo img, .wp-block-site-logo img { height: 48px !important; }
@media (min-width: 960px) { .fl-brand-logo img, .wp-block-site-logo img { height: 54px !important; } }
.fl-footer__logo img { height: 62px; }

/* 2 · Portada: no només venem equips */
p.fl-hero__services-label { margin: 1.75rem 0 .6rem; font: 600 .78rem/1.3 var(--f-head); letter-spacing: .1em; text-transform: uppercase; color: var(--c-muted); }
ul.fl-hero__services { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
ul.fl-hero__services li { margin: 0; display: inline-flex; align-items: center; gap: .45rem; padding: .45rem .8rem .45rem .6rem; border-radius: 999px; background: var(--c-primary-soft); color: var(--c-primary-dark); font: 600 .88rem/1.2 var(--f-head); }
ul.fl-hero__services li::before { content: ""; width: 1rem; height: 1rem; border-radius: 50%; flex: none; background: var(--c-primary) 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='M6 12l4 4 8-8'/%3E%3C/svg%3E") center / 70% no-repeat; }
.fl-flow--service .fl-flow__step p:not(.fl-flow__num) { font-size: .9rem; line-height: 1.5; margin-top: .3rem; }

/* 3 · Separacions verticals més contingudes a escriptori */
.fl-section { padding-block: clamp(4rem, 7vw, 6.5rem); }
.fl-section__head { margin-bottom: clamp(2rem, 4vw, 3.25rem); }
.fl-ordely-gap { height: clamp(2.5rem, 5vw, 4.5rem); }
.fl-ordely-wide { margin-top: clamp(2rem, 4vw, 3rem); }

/* 4 · Captures d'ORDELY: retall de detall a mòbil, ampliació visible i nítida */
.fl-shot--art .fl-shot__m { display: none; }
@media (max-width: 700px) {
	.fl-shot--art .fl-shot__d { display: none; }
	.fl-shot--art .fl-shot__m { display: block; }
	.fl-shot { margin-inline: calc(var(--fl-gutter) * -.5); border-radius: 12px; }
	p.fl-shot__cap { font-size: .74rem; }
}
.fl-shot img { cursor: zoom-in; }
.fl-shot .wp-block-image.wp-lightbox-container button.lightbox-trigger { opacity: 1 !important; background-color: rgba(11, 34, 51, .78) !important; width: 36px; height: 36px; top: 12px; right: 12px; border-radius: 10px; background: rgba(11, 34, 51, .78); border: 1px solid rgba(255, 255, 255, .25); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.fl-shot .wp-block-image.wp-lightbox-container button.lightbox-trigger svg { fill: #fff !important; }
@media (hover: none) {
	html[lang^="ca"] p.fl-shot__cap::after { content: " · Toca per ampliar"; color: #0B7E73; font-weight: 600; }
	html[lang^="es"] p.fl-shot__cap::after { content: " · Toca para ampliar"; color: #0B7E73; font-weight: 600; }
}

/* 5 · ORDELY: integracions i diversos locals */
ul.fl-ord-badges { list-style: none; margin: 1.5rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
ul.fl-ord-badges li { margin: 0; padding: .4rem .8rem; border-radius: 999px; border: 1px solid rgba(27, 197, 180, .45); background: rgba(27, 197, 180, .1); color: #CFF5F0; font: 600 .82rem/1.2 var(--f-head); }
.fl-integs { display: grid; gap: 1.25rem; }
@media (min-width: 900px) { .fl-integs { grid-template-columns: 1fr 1fr 1.25fr; } }
.fl-integ { position: relative; padding: clamp(1.5rem, 3vw, 2rem); border-radius: 20px; background: rgba(255, 255, 255, .045); border: 1px solid rgba(255, 255, 255, .1); }
.fl-integ--wide { background: linear-gradient(160deg, rgba(27, 197, 180, .16), rgba(27, 197, 180, .04)); border-color: rgba(27, 197, 180, .4); }
p.fl-integ__tag { display: inline-block; margin: 0 0 1rem; padding: .25rem .65rem; border-radius: 999px; background: var(--ord-teal-soft); color: var(--ord-teal); font: 700 .7rem/1.3 var(--f-head); letter-spacing: .1em; text-transform: uppercase; }
.fl-section--ordely h3.fl-integ__name { margin: 0 0 .35rem; font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.1rem); letter-spacing: -.02em; color: #fff; }
.fl-integ > p:not(.fl-integ__tag) { margin: 0; color: #AFC0CE; }
.fl-integ ul.fl-checklist { margin-top: 1.1rem; display: grid; gap: .55rem; font-size: .95rem; color: #DCE6EE; }
p.fl-integs__note { display: flex; gap: .75rem; align-items: flex-start; margin: 1.5rem 0 0; padding: 1rem 1.25rem; border-radius: 14px; background: rgba(255, 255, 255, .04); color: #AFC0CE; font-size: .95rem; }
p.fl-integs__note::before { content: ""; flex: none; width: 22px; height: 22px; background: var(--ord-teal); -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }

/* 6 · Marques: jerarquia clara, noms en text */
.fl-logos { border-top: 0; display: grid; gap: .75rem; }
.fl-logos__group { padding: 1.25rem 1.5rem; border: 1px solid var(--c-line); border-radius: 16px; background: #fff; gap: 1rem 2rem; }
@media (min-width: 900px) { .fl-logos__group { grid-template-columns: 14rem 1fr; } }
.fl-logos__label { font: 700 .95rem/1.35 var(--f-head); letter-spacing: 0; text-transform: none; color: var(--c-ink); }
.fl-logos__list { gap: .6rem; }
.fl-logos__item { min-height: 0; }
.fl-logos__item--text { padding: .55rem .95rem; border-radius: 10px; background: var(--c-surface); border: 1px solid transparent; font: 700 .9rem/1.2 var(--f-head); letter-spacing: .06em; color: #3A4757; transition: border-color var(--fl-t), color var(--fl-t); }
.fl-logos__item--text:hover { border-color: var(--c-line); color: var(--c-ink); }

/* 7 · IA: què obté el client */
.fl-gains { display: grid; gap: 1rem; }
@media (min-width: 800px) { .fl-gains { grid-template-columns: repeat(3, 1fr); } }
.fl-gain { padding: 1.5rem; border-radius: 18px; background: var(--c-surface); }
p.fl-gain__ico { width: 44px; height: 44px; margin: 0 0 1rem; border-radius: 12px; background: var(--c-primary-soft); position: relative; }
p.fl-gain__ico::before { content: ""; position: absolute; inset: 11px; background: var(--c-primary); -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
.fl-gain h3 { font-size: 1.1rem; margin: 0 0 .35rem; }
.fl-gain p:not(.fl-gain__ico) { margin: 0; color: var(--c-muted); font-size: .95rem; }
.fl-qcats { display: grid; gap: 1rem; margin-top: clamp(1.5rem, 3vw, 2.25rem); }
@media (min-width: 640px) { .fl-qcats { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .fl-qcats { grid-template-columns: repeat(4, 1fr); } }
.fl-qcat { display: grid; align-content: start; gap: .6rem; padding: 1.25rem; border-radius: 18px; border: 1px solid var(--c-line); background: linear-gradient(180deg, #fff, var(--c-surface)); }
p.fl-qcat__title { display: flex; align-items: center; gap: .55rem; margin: 0 0 .25rem; font: 700 .8rem/1.2 var(--f-head); letter-spacing: .1em; text-transform: uppercase; color: var(--c-primary); }
p.fl-qcat__title::before { content: ""; width: 20px; height: 20px; flex: none; background: var(--c-primary); -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
.fl-qcat p.fl-chat__q { justify-self: stretch; font-size: .93rem; }
p.fl-qcats__note { margin: 1.25rem auto 0; max-width: 44rem; text-align: center; font-size: .88rem; color: var(--c-muted); }

/* 8 · Peu i navegació mòbil sense espais sobrers */
@media (max-width: 959px) {
	body.has-mobilebar { padding-bottom: 0; }
	body.has-mobilebar .fl-footer { padding-bottom: calc(var(--fl-bar-h) + env(safe-area-inset-bottom)); }
}
@media (max-width: 899px) { .fl-footer__grid > :last-child { grid-column: 1 / -1; } }
.fl-footer .fl-footer__soon { margin-top: .4rem; }
@media (max-width: 1099px) {
	.fl-nav__panel { padding-bottom: calc(1.5rem + env(safe-area-inset-bottom)); }
	.fl-nav__list a { min-height: 54px; }
	.fl-nav__list .sub-menu { padding-bottom: .6rem; }
	.fl-nav__list .sub-menu a { min-height: 40px; }
	.fl-nav__extra { margin-top: 1.25rem; }
}
/* ===== /0.4.0b ===== */

/* ===== Fase final · 1 · Catàleg per famílies ===== */
body :is(.fl-fams, .fl-fam, .fl-fam__body, .fl-fam__media, .fl-gallery, .fl-brandnames, .fl-fam-hero__ico) > * { margin-block-start: 0; }

/* Targetes de famílies (índex i portada) */
.fl-fams { display: grid; gap: 1rem; }
@media (min-width: 600px) { .fl-fams { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .fl-fams { grid-template-columns: repeat(4, 1fr); } }
.fl-fam { position: relative; display: flex; flex-direction: column; border-radius: 18px; overflow: hidden; background: #fff; border: 1px solid var(--c-line); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.fl-fam:hover { transform: translateY(-3px); border-color: transparent; box-shadow: 0 1px 2px rgba(11, 24, 40, .05), 0 22px 44px -26px rgba(11, 24, 40, .35); }
.fl-fam__media { aspect-ratio: 4 / 3; display: grid; place-items: center; background: linear-gradient(180deg, #F4F6F9, #E9EEF4); overflow: hidden; }
.fl-fam__media figure { margin: 0; width: 100%; height: 100%; display: grid; place-items: center; }
.fl-fam__media img { width: 78%; height: 78%; object-fit: contain; mix-blend-mode: multiply; transition: transform .6s var(--fl-ease); }
.fl-fam:hover .fl-fam__media img { transform: scale(1.04); }
p.fl-fam__ico { margin: 0; width: 64px; height: 64px; border-radius: 18px; background: var(--c-primary-soft); position: relative; }
p.fl-fam__ico::before { content: ""; position: absolute; inset: 16px; background: var(--c-primary); -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
.fl-fam__body { padding: 1.1rem 1.25rem 1.35rem; display: grid; gap: .35rem; }
.fl-fam__body h3 { margin: 0; font-size: 1.08rem; line-height: 1.25; }
.fl-fam__body h3 a { color: var(--c-ink); text-decoration: none; }
.fl-fam__body h3 a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.fl-fam__body p { margin: 0; font-size: .92rem; line-height: 1.5; color: var(--c-muted); }

/* Capçalera de família sense foto */
.fl-fam-hero__ico { display: grid; place-items: center; aspect-ratio: 4 / 3; border-radius: var(--fl-radius-l); background: linear-gradient(160deg, #EAF0FF, #F4F6F9); }
.fl-fam-hero__ico p.fl-fam__ico { width: 120px; height: 120px; border-radius: 32px; }
.fl-fam-hero__ico p.fl-fam__ico::before { inset: 30px; }

/* Galeria */
.fl-gallery { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 800px) { .fl-gallery { grid-template-columns: repeat(3, 1fr); } .fl-gallery--2 { grid-template-columns: repeat(2, 1fr); } .fl-gallery--4 { grid-template-columns: repeat(4, 1fr); } .fl-gallery--5 { grid-template-columns: repeat(5, 1fr); } }
.fl-gallery figure.fl-gallery__item { margin: 0; aspect-ratio: 1; display: grid; place-items: center; border-radius: 16px; background: #fff; overflow: hidden; }
.fl-section--surface .fl-gallery figure.fl-gallery__item { background: #fff; }
.fl-gallery figure.fl-gallery__item img { width: 82%; height: 82%; object-fit: contain; }

/* Marques en text */
.fl-brandnames { display: flex; flex-wrap: wrap; gap: .6rem; }
p.fl-brandname { margin: 0; padding: .75rem 1.15rem; border-radius: 12px; background: var(--c-surface); border: 1px solid var(--c-line); font: 700 1rem/1.2 var(--f-head); letter-spacing: .06em; color: #2A3646; }
/* Foto de producte dins d'un bloc Imatge (capçaleres de família) */
.fl-phero__media .fl-photo--product { aspect-ratio: 4 / 3; }
.fl-photo--product > figure.wp-block-image { position: absolute; inset: 0; margin: 0; }
.fl-photo--product > figure.wp-block-image img { width: 100%; height: 100%; object-fit: contain; padding: 10%; mix-blend-mode: multiply; }
/* ===== /Fase final · 1 ===== */