/**
 * PED 2.0 — Estilos públicos globais
 * Componentes compartilhados do site público (botões, cards, seções).
 * As páginas montadas no Elementor usam estas classes através dos widgets PED.
 */

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
	font-family: var(--ped-font-body);
	color: var(--ped-text);
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--ped-font-heading);
	color: var(--ped-navy-900);
	line-height: 1.2;
}

a { transition: color 0.2s var(--ped-ease); }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--ped-cyan-500);
	outline-offset: 3px;
}

::selection { background: var(--ped-cyan-500); color: #fff; }

/* ---------- Botões ---------- */
.ped-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-family: var(--ped-font-heading);
	font-weight: 700;
	font-size: 16px;
	line-height: 1;
	padding: 16px 32px;
	border-radius: var(--ped-radius-pill);
	border: 2px solid transparent;
	cursor: pointer;
	text-decoration: none !important;
	transition: transform 0.2s var(--ped-ease), box-shadow 0.2s var(--ped-ease), background 0.2s var(--ped-ease), color 0.2s var(--ped-ease);
}
.ped-btn:hover { transform: translateY(-2px); }
.ped-btn:active { transform: translateY(0); }
.ped-btn:disabled,
.ped-btn[aria-busy="true"] { cursor: wait; opacity: 0.68; transform: none; box-shadow: none; }

.ped-btn--primary {
	background: var(--ped-gradient-cyan);
	color: #fff !important;
	box-shadow: var(--ped-shadow-cyan);
}
.ped-btn--primary:hover { box-shadow: 0 12px 32px rgba(0, 181, 229, 0.45); color: #fff !important; }

.ped-btn--navy {
	background: var(--ped-navy-900);
	color: #fff !important;
	box-shadow: var(--ped-shadow);
}
.ped-btn--navy:hover { background: var(--ped-navy-800); color: #fff !important; }

.ped-btn--outline {
	background: transparent;
	border-color: var(--ped-cyan-500);
	color: var(--ped-cyan-600) !important;
}
.ped-btn--outline:hover { background: var(--ped-cyan-050); }

.ped-btn--outline-light {
	background: rgba(255, 255, 255, 0.06);
	border-color: rgba(255, 255, 255, 0.35);
	color: #fff !important;
	backdrop-filter: blur(4px);
}
.ped-btn--outline-light:hover { background: rgba(255, 255, 255, 0.14); border-color: #fff; }

.ped-btn--sm { padding: 11px 22px; font-size: 14px; }
.ped-btn--lg { padding: 19px 40px; font-size: 17px; }
.ped-btn--block { width: 100%; }

/* ---------- Chips / badges ---------- */
.ped-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--ped-font-heading);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 6px 14px;
	border-radius: var(--ped-radius-pill);
}
.ped-badge--cyan { background: var(--ped-cyan-050); color: var(--ped-cyan-600); }
.ped-badge--navy { background: var(--ped-navy-900); color: #fff; }
.ped-badge--red { background: var(--ped-danger-050); color: var(--ped-red-600); }
.ped-badge--green { background: var(--ped-success-050); color: var(--ped-success-600); }
.ped-badge--glass { background: rgba(255, 255, 255, 0.12); color: #fff; backdrop-filter: blur(4px); }

/* ---------- Card base ---------- */
.ped-card {
	background: #fff;
	border: 1px solid var(--ped-border-soft);
	border-radius: var(--ped-radius-lg);
	box-shadow: var(--ped-shadow-sm);
	transition: transform 0.25s var(--ped-ease), box-shadow 0.25s var(--ped-ease);
}
.ped-card--hover:hover { transform: translateY(-4px); box-shadow: var(--ped-shadow-lg); }

/* ---------- Cabeçalhos de seção ---------- */
.ped-section-head { max-width: 640px; margin: 0 auto 48px; text-align: center; }
.ped-section-head .ped-badge { margin-bottom: 14px; }
.ped-section-head h2 {
	font-size: clamp(28px, 4vw, 40px);
	font-weight: 800;
	margin: 0 0 12px;
}
.ped-section-head p { color: var(--ped-text-soft); font-size: 17px; margin: 0; }
.ped-section-head--light h2 { color: #fff; }
.ped-section-head--light p { color: rgba(255, 255, 255, 0.75); }
.ped-section-head--left { margin-left: 0; text-align: left; }

/* ---------- Formulários ---------- */
.ped-input,
.ped-select,
.ped-textarea {
	width: 100%;
	font-family: var(--ped-font-body);
	font-size: 15px;
	color: var(--ped-text);
	background: #fff;
	border: 1.5px solid var(--ped-border);
	border-radius: var(--ped-radius-sm);
	padding: 12px 16px;
	transition: border-color 0.2s var(--ped-ease), box-shadow 0.2s var(--ped-ease);
}
.ped-input:focus,
.ped-select:focus,
.ped-textarea:focus {
	outline: none;
	border-color: var(--ped-cyan-500);
	box-shadow: 0 0 0 3px rgba(0, 181, 229, 0.18);
}
.ped-textarea { min-height: 120px; resize: vertical; }
.ped-field { margin-bottom: 18px; }
.ped-field > label {
	display: block;
	font-family: var(--ped-font-heading);
	font-size: 13px;
	font-weight: 700;
	color: var(--ped-navy-900);
	margin-bottom: 6px;
}

/* ---------- Barra de progresso (uso geral) ---------- */
.ped-progress {
	--ped-progress-value: 0%;
	position: relative;
	height: 8px;
	background: var(--ped-bg-soft);
	border-radius: var(--ped-radius-pill);
	overflow: hidden;
}
.ped-progress__bar {
	position: absolute;
	inset: 0 auto 0 0;
	width: var(--ped-progress-value);
	background: var(--ped-gradient-cyan);
	border-radius: var(--ped-radius-pill);
	transition: width 0.5s var(--ped-ease);
}
.ped-progress--navy .ped-progress__bar { background: var(--ped-navy-900); }

/* ---------- Utilidades ---------- */
.ped-container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.ped-hide { display: none !important; }
.ped-sr-only {
	position: absolute;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* ---------- WooCommerce: aparência alinhada à marca ---------- */
.woocommerce .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
	font-family: var(--ped-font-heading);
	font-weight: 700;
	border-radius: var(--ped-radius-pill);
	background: var(--ped-gradient-cyan);
	color: #fff;
	padding: 14px 28px;
	transition: box-shadow 0.2s var(--ped-ease), transform 0.2s var(--ped-ease);
}
.woocommerce .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
	background: var(--ped-gradient-cyan);
	color: #fff;
	transform: translateY(-1px);
	box-shadow: var(--ped-shadow-cyan);
}
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #place_order {
	background: var(--ped-navy-900);
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce #place_order:hover { background: var(--ped-navy-800); }

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
	border: 1.5px solid var(--ped-border);
	border-radius: var(--ped-radius-sm);
	padding: 11px 14px;
}

/* Texturas sutis das heroes internas. A imagem fica isolada do conteúdo para
 * que somente ela receba opacidade, sem reduzir o contraste do texto. */
body.post-type-archive-lms_course { --ped-internal-hero-texture: url("../img/internal-heroes/cursos.webp"); }
body.page-id-25 { --ped-internal-hero-texture: url("../img/internal-heroes/sobre-o-ped.webp"); }
body.blog { --ped-internal-hero-texture: url("../img/internal-heroes/blog.webp"); }
body.page-id-26 { --ped-internal-hero-texture: url("../img/internal-heroes/contato.webp"); }

body.post-type-archive-lms_course .ped-page-hero,
body.blog .ped-page-hero,
body.page-id-25 .ped-internal-hero,
body.page-id-26 .ped-internal-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
}

body.post-type-archive-lms_course .ped-page-hero::before,
body.blog .ped-page-hero::before,
body.page-id-25 .ped-internal-hero::before,
body.page-id-26 .ped-internal-hero::before {
	position: absolute;
	z-index: 0;
	inset: 0;
	background-image: var(--ped-internal-hero-texture);
	background-position: right center;
	background-size: cover;
	background-repeat: no-repeat;
	content: "";
	opacity: .3;
	pointer-events: none;
}

body.post-type-archive-lms_course .ped-page-hero > *,
body.blog .ped-page-hero > *,
body.page-id-25 .ped-internal-hero > *,
body.page-id-26 .ped-internal-hero > * {
	position: relative;
	z-index: 1;
}

/* Responsivo base */
@media (max-width: 767px) {
	.ped-btn { padding: 14px 26px; font-size: 15px; }
	.ped-section-head { margin-bottom: 32px; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		scroll-behavior: auto !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* Página Sobre o PED ------------------------------------------------------ */
.ped-about-heading { max-width: 720px; margin: 0 auto 42px; text-align: center; }
.ped-about-heading--left { margin-left: 0; text-align: left; }
.ped-about-heading h2 { margin: 16px 0 12px; color: var(--ped-navy-900); font: 800 clamp(2rem, 4vw, 3rem)/1.08 var(--ped-font-heading); letter-spacing: -.04em; }
.ped-about-heading p { margin: 0; color: var(--ped-text-soft); font-size: 1.05rem; line-height: 1.7; }
.ped-about-story__grid { display: block; }
.ped-about-story__copy p { margin: 0 0 20px; color: var(--ped-text); font-size: 1.02rem; line-height: 1.8; }
.ped-about-story__image { position: relative; margin: 0; }
.ped-about-story__image::before { position: absolute; inset: 22px -18px -18px 22px; border-radius: 28px; background: linear-gradient(135deg, var(--ped-cyan-500), var(--ped-blue-700)); content: ""; opacity: .18; }
.ped-about-story__image img { position: relative; display: block; width: 100%; min-height: 480px; border-radius: 28px; object-fit: cover; box-shadow: 0 24px 60px rgba(10,16,69,.16); }
.ped-about-pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.ped-about-pillars article { padding: 30px; border: 1px solid rgba(10,16,69,.1); border-radius: 22px; background: #fff; box-shadow: 0 12px 36px rgba(10,16,69,.06); }
.ped-about-pillars article > span { color: var(--ped-cyan-500); font: 800 .82rem/1 var(--ped-font-heading); letter-spacing: .12em; }
.ped-about-pillars h3 { margin: 18px 0 12px; color: var(--ped-navy-900); font: 750 1.3rem/1.2 var(--ped-font-heading); }
.ped-about-pillars p { margin: 0; color: var(--ped-text-soft); line-height: 1.7; }
.ped-about-numbers { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr); gap: 60px; align-items: center; padding: 64px max(24px, calc((100vw - 1152px)/2)); background: linear-gradient(135deg, var(--ped-navy-900), var(--ped-blue-700)); color: #fff; }
.ped-about-numbers h2 { max-width: 520px; margin: 18px 0 0; color: #fff; font: 800 clamp(1.8rem, 3.2vw, 2.7rem)/1.12 var(--ped-font-heading); letter-spacing: -.035em; }
.ped-about-numbers dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 0; }
.ped-about-numbers dl div { padding: 26px 18px; border: 1px solid rgba(255,255,255,.16); border-radius: 18px; background: rgba(255,255,255,.08); text-align: center; backdrop-filter: blur(8px); }
.ped-about-numbers dt { color: var(--ped-cyan-500); font: 800 clamp(2rem, 4vw, 3.2rem)/1 var(--ped-font-heading); }
.ped-about-numbers dd { margin: 9px 0 0; color: rgba(255,255,255,.82); font-size: .88rem; line-height: 1.35; }
.ped-about-team__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.ped-teacher-card { overflow: hidden; border: 1px solid rgba(10,16,69,.09); border-radius: 20px; background: #fff; box-shadow: 0 10px 32px rgba(10,16,69,.07); }
.ped-teacher-card > img { display: block; width: 100%; height: 260px; object-fit: cover; object-position: center top; background: #eef1f8; }
.ped-teacher-card__photo-placeholder { display: grid; width: 100%; height: 260px; place-items: center; background: linear-gradient(135deg, var(--ped-navy-900), var(--ped-blue-700)); color: #fff; font: 800 4rem/1 var(--ped-font-heading); }
.ped-teacher-card__body { padding: 22px; }
.ped-teacher-card h3 { margin: 0; color: var(--ped-navy-900); font: 750 1.08rem/1.3 var(--ped-font-heading); }
.ped-teacher-card__area { min-height: 2.7em; margin: 8px 0 0; color: var(--ped-blue-700); font-size: .88rem; font-weight: 700; line-height: 1.45; }
.ped-teacher-card details { margin-top: 17px; padding-top: 15px; border-top: 1px solid rgba(10,16,69,.09); }
.ped-teacher-card summary { color: var(--ped-navy-900); font-size: .86rem; font-weight: 700; cursor: pointer; }
.ped-teacher-card details p { margin: 13px 0 0; color: var(--ped-text-soft); font-size: .88rem; line-height: 1.65; }
@media (max-width: 900px) {
  .ped-about-story__grid, .ped-about-numbers { grid-template-columns: 1fr; }
  .ped-about-pillars { grid-template-columns: 1fr; }
  .ped-about-team__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ped-about-numbers { gap: 34px; }
}
@media (min-width: 901px) and (max-width: 1120px) {
  .ped-about-team__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .ped-about-story__image img { min-height: 340px; }
  .ped-about-numbers dl, .ped-about-team__grid { grid-template-columns: 1fr; }
  .ped-about-numbers dl { gap: 12px; }
  .ped-teacher-card { display: grid; grid-template-columns: 112px 1fr; }
  .ped-teacher-card > img { height: 100%; min-height: 180px; }
  .ped-teacher-card__area { min-height: 0; }
}