/* ==========================================================================
   Projectes Eficients — Estils principals
   Mobile-first. Paleta: blanc trencat, verd profund, grafit, accent controlat.
   ========================================================================== */

:root{
	--pe-white: #FAF9F6;
	--pe-white-soft: #F2F1EC;
	--pe-graphite: #22262A;
	--pe-graphite-soft: #4A5058;
	--pe-green: #1F4D3E;
	--pe-green-dark: #163A2F;
	--pe-green-soft: #E4ECE7;
	--pe-accent: #C98A3A;
	--pe-border: #E1DFD6;
	--pe-danger: #B3423B;

	--pe-font: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	--pe-radius: 10px;
	--pe-radius-lg: 18px;
	--pe-shadow: 0 2px 10px rgba(34,38,42,0.06);
	--pe-shadow-hover: 0 8px 24px rgba(34,38,42,0.10);
	--pe-container: 1200px;
	--pe-header-h: 72px;
}

*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
	margin:0;
	font-family:var(--pe-font);
	color:var(--pe-graphite);
	background:var(--pe-white);
	line-height:1.55;
	-webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-weight:700; line-height:1.2; margin:0 0 0.5em; color:var(--pe-green-dark); }
p{ margin:0 0 1em; }
button{ font-family:inherit; }

.screen-reader-text{ position:absolute; left:-9999px; }
.skip-link:focus{ left:8px; top:8px; position:fixed; background:#fff; padding:10px; z-index:9999; }

.pe-container{ max-width:var(--pe-container); margin:0 auto; padding:0 20px; }
.pe-section{ padding:56px 0; }
.pe-section__title{ font-size:clamp(1.5rem,3vw,2.1rem); text-align:center; margin-bottom:32px; }

/* ---------- Botons ---------- */
.pe-btn{
	display:inline-flex; align-items:center; justify-content:center; gap:8px;
	padding:14px 26px; border-radius:999px; font-weight:600; font-size:0.98rem;
	border:2px solid transparent; cursor:pointer; transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
	white-space:nowrap;
}
.pe-btn--primary{ background:var(--pe-green); color:#fff; }
.pe-btn--primary:hover{ background:var(--pe-green-dark); box-shadow:var(--pe-shadow-hover); transform:translateY(-1px); }
.pe-btn--ghost{ background:transparent; border-color:var(--pe-green); color:var(--pe-green); }
.pe-btn--ghost:hover{ background:var(--pe-green-soft); }
.pe-btn--lg{ padding:16px 32px; font-size:1.05rem; }

/* ---------- Header ---------- */
.pe-header{
	position:sticky; top:0; z-index:100; background:rgba(250,249,246,0.92);
	backdrop-filter:blur(8px); border-bottom:1px solid var(--pe-border);
}
.pe-header__inner{ display:flex; align-items:center; justify-content:space-between; height:var(--pe-header-h); gap:24px; }
.pe-logo__wordmark{ font-size:0.82rem; letter-spacing:0.06em; line-height:1.2; color:var(--pe-green-dark); }
.pe-logo__wordmark strong{ color:var(--pe-green); }
.pe-nav{ display:none; }
.pe-nav__list{ display:flex; gap:28px; }
.pe-nav__list a{ font-weight:500; font-size:0.95rem; }
.pe-nav__list a:hover{ color:var(--pe-green); }
.pe-header__actions{ display:flex; align-items:center; gap:12px; }
.pe-header__cta{ display:none; }
.pe-lang-switch{ display:none; list-style:none; margin:0; padding:0; font-size:0.85rem; gap:6px; }
.pe-lang-switch li{ display:inline-flex; }
.pe-lang-switch a{ font-weight:600; }
.pe-lang-switch .pll-parent-menu-item, .pe-lang-switch .current-lang{ font-weight:700; color:var(--pe-green); }
.pe-nav-toggle{ background:none; border:none; width:34px; height:26px; position:relative; cursor:pointer; }
.pe-nav-toggle span{ position:absolute; left:0; right:0; height:2px; background:var(--pe-graphite); transition:.2s; }
.pe-nav-toggle span:nth-child(1){ top:0; }
.pe-nav-toggle span:nth-child(2){ top:12px; }
.pe-nav-toggle span:nth-child(3){ top:24px; }

.pe-mobile-nav{ display:none; flex-direction:column; gap:10px; padding:16px 20px 24px; border-top:1px solid var(--pe-border); }
.pe-mobile-nav.is-open{ display:flex; }
.pe-mobile-nav__list{ display:flex; flex-direction:column; gap:12px; margin-bottom:12px; }
.pe-mobile-nav__list a{ font-weight:500; font-size:1rem; }

@media(min-width:960px){
	.pe-nav{ display:block; }
	.pe-header__cta{ display:inline-flex; }
	.pe-nav-toggle{ display:none; }
	.pe-lang-switch{ display:flex; }
}

/* ---------- Hero ---------- */
.pe-hero{ padding:48px 0 40px; }
.pe-hero__inner{ display:grid; gap:32px; align-items:center; }
.pe-eyebrow{ text-transform:uppercase; letter-spacing:0.08em; font-size:0.78rem; font-weight:700; color:var(--pe-accent); margin-bottom:10px; }
.pe-hero__title{ font-size:clamp(1.9rem,4.2vw,3rem); margin-bottom:14px; }
.pe-hero__subtitle{ font-size:1.1rem; color:var(--pe-graphite-soft); max-width:52ch; margin-bottom:22px; }
.pe-hero__ctas{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:14px; }
.pe-hero__trust{ font-weight:600; color:var(--pe-green); font-size:0.95rem; }
.pe-hero__media-graphic{
	background: linear-gradient(135deg, var(--pe-green-soft) 0%, var(--pe-white-soft) 60%, var(--pe-green-soft) 100%);
	border-radius:var(--pe-radius-lg);
	min-height:260px;
	position:relative;
	overflow:hidden;
}
.pe-hero__media-graphic::before{
	content:'';
	position:absolute; inset:0;
	background-image:
		linear-gradient(var(--pe-border) 1px, transparent 1px),
		linear-gradient(90deg, var(--pe-border) 1px, transparent 1px);
	background-size:32px 32px;
	opacity:0.35;
}
.pe-hero__media-icon{
	position:relative; z-index:1;
	display:flex; align-items:center; justify-content:center;
	width:100%; height:100%; min-height:260px; color:var(--pe-green);
}
.pe-hero--service{ padding-top:28px; }
.pe-breadcrumbs{ font-size:0.82rem; color:var(--pe-graphite-soft); margin-bottom:14px; }
.pe-breadcrumbs a:hover{ color:var(--pe-green); }

@media(min-width:960px){
	.pe-hero__inner{ grid-template-columns:1.1fr 0.9fr; }
}

/* ---------- Grid de serveis ---------- */
.pe-service-grid{ background:var(--pe-white-soft); }
.pe-service-grid__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.pe-service-card{
	display:flex; flex-direction:column; gap:6px; background:#fff; border:1px solid var(--pe-border);
	border-radius:var(--pe-radius-lg); padding:20px; box-shadow:var(--pe-shadow); transition:.15s ease;
}
.pe-service-card:hover{ box-shadow:var(--pe-shadow-hover); transform:translateY(-2px); border-color:var(--pe-green); }
.pe-service-card__icon{ color:var(--pe-green); display:inline-flex; }
.pe-service-card__title{ font-weight:700; color:var(--pe-green-dark); }
.pe-service-card__subtitle{ font-size:0.85rem; color:var(--pe-graphite-soft); }
.pe-service-grid__more{ text-align:center; margin-top:28px; }
.pe-link-arrow{ font-weight:600; color:var(--pe-green); }

@media(min-width:720px){ .pe-service-grid__grid{ grid-template-columns:repeat(4,1fr); } }

/* ---------- Procés ---------- */
.pe-process__steps{ display:grid; gap:16px; counter-reset:step; }
.pe-process__step{ display:flex; align-items:flex-start; gap:14px; background:#fff; border:1px solid var(--pe-border); border-radius:var(--pe-radius); padding:16px 18px; }
.pe-process__num{ flex:0 0 auto; width:32px; height:32px; border-radius:50%; background:var(--pe-green); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; }
.pe-process__text{ font-weight:500; padding-top:4px; }
@media(min-width:900px){ .pe-process__steps{ grid-template-columns:repeat(3,1fr); } }

/* ---------- Confiança ---------- */
.pe-trust{ background:var(--pe-green-dark); color:#fff; }
.pe-trust__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px; text-align:center; }
.pe-trust__number{ display:block; font-size:2.2rem; font-weight:800; }
.pe-trust__label{ font-size:0.85rem; opacity:0.9; }
.pe-trust__stat--text .pe-trust__label{ font-size:1rem; font-weight:600; opacity:1; }
@media(min-width:720px){ .pe-trust__grid{ grid-template-columns:repeat(4,1fr); } }

/* ---------- Públics ---------- */
.pe-audiences__grid{ display:grid; gap:16px; }
.pe-audience-card{ background:#fff; border:1px solid var(--pe-border); border-radius:var(--pe-radius-lg); padding:22px; }
@media(min-width:900px){ .pe-audiences__grid{ grid-template-columns:repeat(4,1fr); } }

/* ---------- CTA band ---------- */
.pe-cta-band{ background:var(--pe-green-soft); text-align:center; }
.pe-cta-band__inner{ max-width:640px; margin:0 auto; }
.pe-cta-band__text{ font-size:1.15rem; font-weight:600; color:var(--pe-green-dark); }
.pe-cta-band__response{ margin-top:12px; font-size:0.9rem; color:var(--pe-graphite-soft); }

/* ---------- FAQ ---------- */
.pe-faq__inner{ max-width:820px; margin:0 auto; }
.pe-faq__item{ border-bottom:1px solid var(--pe-border); padding:16px 0; }
.pe-faq__question{ cursor:pointer; font-weight:600; list-style:none; display:flex; justify-content:space-between; align-items:center; }
.pe-faq__question::-webkit-details-marker{ display:none; }
.pe-faq__question::after{ content:'+'; font-size:1.3rem; color:var(--pe-green); margin-left:12px; }
details[open] .pe-faq__question::after{ content:'–'; }
.pe-faq__answer{ padding-top:10px; color:var(--pe-graphite-soft); }

/* ---------- Servei body ---------- */
.pe-service-body__grid{ display:grid; gap:32px; }
.pe-service-body__benefits{ background:var(--pe-white-soft); border-radius:var(--pe-radius-lg); padding:24px; align-self:start; }
.pe-service-body__benefits ul{ margin:14px 0 20px; display:grid; gap:10px; }
.pe-service-body__benefits li{ padding-left:22px; position:relative; }
.pe-service-body__benefits li::before{ content:'✓'; position:absolute; left:0; color:var(--pe-green); font-weight:700; }
@media(min-width:960px){ .pe-service-body__grid{ grid-template-columns:1.6fr 1fr; } }

/* ---------- Landing Ads ---------- */
body.pe-landing{ background:var(--pe-white); }
.pe-landing__header{ padding:18px 0; border-bottom:1px solid var(--pe-border); }
.pe-landing__header .pe-container{ display:flex; justify-content:space-between; align-items:center; }
.pe-landing__phone{ font-weight:700; color:var(--pe-green); }
.pe-landing__benefits{ display:grid; gap:10px; max-width:640px; margin:0 auto; }
.pe-landing__benefits li{ padding-left:24px; position:relative; }
.pe-landing__benefits li::before{ content:'✓'; position:absolute; left:0; color:var(--pe-green); font-weight:700; }

/* ---------- Gràcies ---------- */
.pe-gracies__inner{ max-width:560px; margin:0 auto; text-align:center; }
.pe-gracies__lead{ font-size:1.1rem; color:var(--pe-graphite-soft); }
.pe-gracies__checklist{ display:grid; gap:8px; margin:24px 0; font-weight:600; color:var(--pe-green); }

/* ---------- Archive / grids genèrics ---------- */
.pe-archive__grid{ display:grid; gap:16px; grid-template-columns:repeat(2,1fr); }
@media(min-width:720px){ .pe-archive__grid{ grid-template-columns:repeat(3,1fr); } }

/* ---------- Pàgina genèrica ---------- */
.pe-page__inner{ max-width:820px; margin:0 auto; }
.pe-page__content :is(h2,h3){ margin-top:1.4em; }
.pe-contact-list{ margin-top:24px; display:grid; gap:10px; font-weight:600; }
.pe-contact-list a{ color:var(--pe-green); }
.pe-contact-list__trust{ color:var(--pe-graphite-soft); font-weight:600; }

/* ---------- 404 ---------- */
.pe-404__inner{ text-align:center; max-width:520px; margin:0 auto; }

/* ---------- Footer ---------- */
.pe-footer{ background:var(--pe-graphite); color:#D9DBD8; padding:52px 0 24px; margin-top:24px; }
.pe-footer__grid{ display:grid; gap:32px; }
.pe-footer h3{ color:#fff; font-size:0.95rem; margin-bottom:14px; }
.pe-footer a{ color:#C7CBC6; }
.pe-footer a:hover{ color:#fff; }
.pe-footer ul{ display:grid; gap:8px; font-size:0.9rem; }
.pe-footer__brand p{ font-size:0.88rem; color:#B7BBB4; max-width:36ch; }
.pe-footer__bottom{ margin-top:36px; padding-top:20px; border-top:1px solid rgba(255,255,255,0.12); display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; font-size:0.82rem; color:#9AA09A; }
.pe-footer__legal{ display:flex; gap:16px; }
@media(min-width:900px){ .pe-footer__grid{ grid-template-columns:2fr 1fr 1fr 1fr; } }

/* ---------- WhatsApp flotant ---------- */
.pe-whatsapp-float{
	position:fixed; right:18px; bottom:86px; z-index:90;
	width:52px; height:52px; border-radius:50%; background:#25D366; color:#fff;
	display:flex; align-items:center; justify-content:center; box-shadow:0 6px 18px rgba(0,0,0,0.22);
	transition:transform .15s ease;
}
.pe-whatsapp-float:hover{ transform:scale(1.06); }
@media(min-width:960px){ .pe-whatsapp-float{ bottom:24px; } }

/* ---------- Barra sticky mòbil ---------- */
.pe-mobile-sticky{
	position:fixed; left:0; right:0; bottom:0; z-index:95; display:flex; gap:10px;
	padding:10px 14px; background:#fff; border-top:1px solid var(--pe-border);
	box-shadow:0 -4px 16px rgba(0,0,0,0.06);
}
.pe-mobile-sticky__cta{ flex:1; }
.pe-mobile-sticky__wa{ flex:0 0 auto; width:48px; height:48px; border-radius:50%; background:#25D366; color:#fff; display:flex; align-items:center; justify-content:center; }
@media(min-width:960px){ .pe-mobile-sticky{ display:none; } }

/* ---------- Formulari multipaso ---------- */
.pe-form-page__inner{ max-width:720px; margin:0 auto; }
.pe-form-page__intro{ text-align:center; margin-bottom:28px; }
.pe-multistep__progress{ height:6px; background:var(--pe-border); border-radius:999px; overflow:hidden; margin-bottom:10px; }
.pe-multistep__progress-bar{ height:100%; width:33%; background:var(--pe-green); transition:width .25s ease; }
.pe-multistep__step-label{ text-align:center; font-size:0.82rem; color:var(--pe-graphite-soft); font-weight:600; margin-bottom:18px; }
.pe-multistep__response{ text-align:center; font-size:0.85rem; color:var(--pe-graphite-soft); margin-top:12px; }
.pe-field__filehint{ font-size:0.78rem; color:var(--pe-graphite-soft); margin-top:4px; }
.pe-section--tight{ padding-top:0; padding-bottom:0; }
.pe-form-page--landing{ padding-top:8px; }
.pe-step__title{ text-align:center; margin-bottom:22px; font-size:1.3rem; }
.pe-step1-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.pe-step1-card{
	display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center;
	background:#fff; border:2px solid var(--pe-border); border-radius:var(--pe-radius-lg); padding:18px 10px;
	cursor:pointer; transition:.15s ease; font-weight:600; font-size:0.9rem;
}
.pe-step1-card:hover{ border-color:var(--pe-green); }
.pe-step1-card.is-selected{ border-color:var(--pe-green); background:var(--pe-green-soft); }
.pe-step1-card__icon{ color:var(--pe-green); display:inline-flex; }
@media(min-width:640px){ .pe-step1-grid{ grid-template-columns:repeat(3,1fr); } }

.pe-field{ margin-bottom:16px; display:flex; flex-direction:column; gap:6px; }
.pe-field label{ font-weight:600; font-size:0.92rem; }
.pe-field input, .pe-field select, .pe-field textarea{
	padding:12px 14px; border:1px solid var(--pe-border); border-radius:var(--pe-radius); font-family:inherit; font-size:1rem; background:#fff;
}
.pe-field input:focus, .pe-field select:focus, .pe-field textarea:focus{ outline:2px solid var(--pe-green); outline-offset:1px; }
.pe-field__hint{ font-size:0.82rem; color:var(--pe-graphite-soft); margin-top:-8px; margin-bottom:16px; }
.pe-field-row{ display:grid; gap:12px; }
@media(min-width:640px){ .pe-field-row{ grid-template-columns:1fr 1fr; } }

.pe-checkbox{ display:flex; align-items:flex-start; gap:10px; font-size:0.88rem; margin-bottom:12px; cursor:pointer; }
.pe-checkbox input{ margin-top:3px; }

.pe-honeypot{ position:absolute !important; left:-9999px !important; width:1px; height:1px; opacity:0; }

.pe-multistep__nav{ display:flex; justify-content:space-between; gap:12px; margin-top:24px; }
.pe-form-error{ color:var(--pe-danger); font-weight:600; margin-top:14px; text-align:center; }
.pe-form-success{ text-align:center; padding:32px 0; }
.pe-form-success h2{ color:var(--pe-green); }