/* EdumoClima — assinatura "airflow + térmico" e detalhes engineered-warmth */

:root { --ec-ease: cubic-bezier(.22,1,.36,1); }

/* ---------- Eyebrow técnico (rótulo com linha + mono) ---------- */
.ec-eyebrow{
	font-family:var(--wp--preset--font-family--mono);
	font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;
	color:var(--wp--preset--color--steel);display:inline-flex;align-items:center;gap:.7rem;
}
.ec-eyebrow::before{content:"";width:2.2rem;height:1px;background:var(--wp--preset--color--amber);display:inline-block}

/* ---------- HERO ---------- */
.ec-hero{position:relative;overflow:clip;isolation:isolate}
.ec-hero .ec-hero__bg{
	position:absolute;inset:0;z-index:-2;
	background:radial-gradient(120% 90% at 85% 10%, rgba(42,110,124,.16), transparent 60%),
	           radial-gradient(80% 70% at 10% 100%, rgba(221,126,46,.12), transparent 55%);
}
/* linhas de fluxo de ar (SVG) */
.ec-airflow{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none;opacity:.5}
.ec-airflow path{
	fill:none;stroke:var(--wp--preset--color--steel);stroke-width:1.1;opacity:.35;
	stroke-dasharray:6 10;animation:ec-flow 9s linear infinite;
}
.ec-airflow path:nth-child(2){stroke:var(--wp--preset--color--amber);opacity:.30;animation-duration:12s;animation-delay:-2s}
.ec-airflow path:nth-child(3){opacity:.18;animation-duration:15s;animation-delay:-5s}
@keyframes ec-flow{to{stroke-dashoffset:-160}}

/* leitura de temperatura (humano + técnico) */
.ec-thermo{
	font-family:var(--wp--preset--font-family--mono);font-size:.82rem;letter-spacing:.04em;
	color:var(--wp--preset--color--muted);display:inline-flex;align-items:center;gap:.55rem;
}
.ec-thermo b{color:var(--wp--preset--color--deep);font-weight:500}
.ec-thermo .dot{width:.5rem;height:.5rem;border-radius:50%;background:var(--wp--preset--color--amber);
	box-shadow:0 0 0 0 rgba(221,126,46,.5);animation:ec-pulse 2.6s var(--ec-ease) infinite}
@keyframes ec-pulse{70%{box-shadow:0 0 0 .5rem rgba(221,126,46,0)}100%{box-shadow:0 0 0 0 rgba(221,126,46,0)}}

/* moldura "device" para a foto real (slot) */
.ec-frame{position:relative;border:1px solid var(--wp--preset--color--line);border-radius:14px;overflow:hidden;
	background:linear-gradient(160deg,var(--wp--preset--color--surface-2),var(--wp--preset--color--surface))}
.ec-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 60%,rgba(221,126,46,.10))}
.ec-frame .wp-block-image,.ec-frame img{margin:0;display:block;width:100%;height:100%;object-fit:cover}
.ec-frame__tag{position:absolute;left:1rem;bottom:1rem;z-index:2;
	font-family:var(--wp--preset--font-family--mono);font-size:.72rem;letter-spacing:.04em;
	background:rgba(12,42,48,.82);color:var(--wp--preset--color--surface);padding:.4rem .7rem;border-radius:6px}

/* ---------- Número de secção gigante (sangrar) ---------- */
.ec-secnum{font-family:var(--wp--preset--font-family--display);font-weight:800;
	font-size:var(--wp--preset--font-size--mega);line-height:.8;color:var(--wp--preset--color--line);
	opacity:.6;letter-spacing:-.04em;user-select:none}

/* ---------- Serviços (lista editorial numerada, NÃO 3 cards iguais) ---------- */
.ec-service{border-top:1px solid var(--wp--preset--color--line);padding-block:clamp(1.4rem,3vw,2.2rem);
	transition:padding-left .4s var(--ec-ease),border-color .4s var(--ec-ease)}
.ec-service:hover{padding-left:.8rem;border-color:var(--wp--preset--color--amber)}
.ec-service .ec-idx{font-family:var(--wp--preset--font-family--mono);color:var(--wp--preset--color--amber);font-size:.85rem}

/* ---------- Secção escura (porquê) ---------- */
.ec-dark{background:var(--wp--preset--gradient--cool-deep);color:var(--wp--preset--color--surface)}
.ec-dark :is(h1,h2,h3){color:var(--wp--preset--color--surface)}
.ec-dark .ec-eyebrow{color:var(--wp--preset--color--amber-soft)}
.ec-check{display:flex;gap:.8rem;align-items:flex-start}
.ec-check::before{content:"";flex:0 0 auto;margin-top:.45rem;width:.7rem;height:.7rem;border-radius:2px;
	background:var(--wp--preset--color--amber);box-shadow:0 0 0 4px rgba(221,126,46,.14)}

/* ---------- CTA térmico ---------- */
.ec-cta{background:var(--wp--preset--gradient--thermal);color:var(--wp--preset--color--surface);border-radius:18px}
.ec-cta :is(h1,h2,h3){color:var(--wp--preset--color--surface)}

/* header / footer */
.ec-nav a{color:var(--wp--preset--color--ink);text-decoration:none;font-weight:500}
.ec-nav a:hover{color:var(--wp--preset--color--steel)}

@media (prefers-reduced-motion: reduce){
	.ec-airflow path,.ec-thermo .dot{animation:none}
	.ec-service{transition:none}
}
