/* =============================================================================
   ORIII — Base: reset leve, tipografia, botões, elementos comuns
   ========================================================================== */

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

html { -webkit-text-size-adjust: 100%; }

body.oriii {
	margin: 0;
	background-color: var(--color-background-primary);
	color: var(--color-text-primary);
	font-family: var(--font-body);
	font-size: var(--fs-body-md);
	line-height: var(--lh-body);
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

/* --- Títulos ------------------------------------------------------------- */
.oriii h1, .oriii h2, .oriii h3, .oriii h4, .oriii h5, .oriii h6 {
	font-family: var(--font-display);
	color: var(--color-text-primary);
	font-weight: 600;
	line-height: var(--lh-heading);
	letter-spacing: 0.02em;
	margin: 0 0 var(--space-4);
}

.oriii h1 { font-size: var(--fs-heading-xl); line-height: var(--lh-display); }
.oriii h2 { font-size: var(--fs-heading-lg); }
.oriii h3 { font-size: var(--fs-heading-md); }
.oriii h4 { font-size: var(--fs-heading-sm); }
.oriii h5 { font-size: var(--fs-body-lg); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
.oriii h6 { font-size: var(--fs-body-sm); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--color-text-secondary); }

.oriii p { margin: 0 0 var(--space-5); }
.oriii p:last-child { margin-bottom: 0; }

.oriii a {
	color: var(--color-text-primary);
	text-decoration: none;
	transition: color var(--duration-fast) var(--ease),
	            opacity var(--duration-fast) var(--ease);
}
.oriii a:hover { color: var(--color-accent); }

.oriii strong, .oriii b { font-weight: 600; }

.oriii img { max-width: 100%; height: auto; display: block; }

.oriii hr {
	border: 0;
	border-top: 1px solid var(--color-border-subtle);
	margin: var(--space-8) 0;
}

::selection { background: var(--color-brand-sand); color: var(--color-brand-navy); }

/* --- Tipos utilitárias da marca --------------------------------------------- */
.oriii .eyebrow {
	font-family: var(--font-body);
	font-size: var(--fs-caption);
	font-weight: 600;
	letter-spacing: var(--tracking-eyebrow);
	text-transform: uppercase;
	color: var(--color-accent);
	margin: 0 0 var(--space-4);
	display: block;
}

.oriii .editorial {
	font-family: var(--font-editorial);
	font-size: var(--fs-body-lg);
	line-height: 1.6;
	color: var(--color-text-secondary);
}

.oriii .display {
	font-family: var(--font-display);
	font-size: clamp(2.25rem, 1.4rem + 3.6vw, var(--fs-display-lg));
	line-height: var(--lh-display);
	letter-spacing: var(--tracking-display);
	font-weight: 600;
}

/* --- Divisor editorial (estrela ORIII · seção 12) --------------------------- */
.oriii .rule-star {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-4);
	color: var(--color-accent);
	margin: var(--space-7) 0;
}
.oriii .rule-star::before,
.oriii .rule-star::after {
	content: "";
	height: 1px;
	flex: 1 1 auto;
	max-width: 96px;
	background: var(--color-border-subtle);
}
.oriii .rule-star span { font-size: var(--fs-caption); letter-spacing: 0.3em; }

/* --- Container ------------------------------------------------------------- */
.oriii .container,
.oriii .site-main > .ast-container,
.oriii .o-container {
	width: 100%;
	max-width: var(--container-max);
	margin-inline: auto;
	padding-inline: var(--gutter);
}
.oriii .o-container--wide { max-width: var(--container-wide); }

/* Faixa de borda a borda — ocupa 100% da largura da tela, só com um
   respiro lateral pequeno. Usada no cabeçalho, barra de anúncio e rodapé. */
.oriii .o-edge {
	width: 100%;
	max-width: none;
	margin-inline: 0;
	padding-inline: clamp(16px, 3vw, 48px);
}
.oriii .o-container--text { max-width: var(--container-text); }

/* =============================================================================
   Botões
   ========================================================================== */
.oriii .button,
.oriii button,
.oriii input[type="button"],
.oriii input[type="submit"],
.oriii .wp-block-button__link,
.oriii .o-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	font-family: var(--font-body);
	font-size: var(--fs-body-sm);
	font-weight: 600;
	letter-spacing: var(--tracking-button);
	text-transform: uppercase;
	line-height: 1;
	padding: var(--space-4) var(--space-6);
	min-height: 48px;
	border-radius: var(--radius-md);
	border: 1px solid var(--color-brand-navy);
	background-color: var(--color-brand-navy);
	color: var(--color-text-inverse);
	cursor: pointer;
	transition: background-color var(--duration-normal) var(--ease),
	            color var(--duration-normal) var(--ease),
	            border-color var(--duration-normal) var(--ease),
	            transform var(--duration-fast) var(--ease);
	text-decoration: none;
}

.oriii .button:hover,
.oriii button:hover,
.oriii input[type="submit"]:hover,
.oriii .wp-block-button__link:hover,
.oriii .o-btn:hover {
	background-color: #0F1922;
	border-color: #0F1922;
	color: var(--color-text-inverse);
	transform: translateY(-1px);
}

.oriii .o-btn--secondary,
.oriii .button.alt.disabled,
.oriii .added_to_cart {
	background-color: transparent;
	color: var(--color-brand-navy);
	border-color: var(--color-brand-navy);
}
.oriii .o-btn--secondary:hover,
.oriii .added_to_cart:hover {
	background-color: var(--color-brand-navy);
	color: var(--color-text-inverse);
}

.oriii .o-btn--accent {
	background-color: var(--color-accent);
	border-color: var(--color-accent);
	color: var(--color-brand-navy);
}
.oriii .o-btn--accent:hover {
	background-color: #A98341;
	border-color: #A98341;
	color: var(--color-brand-navy);
}

.oriii .o-btn--ghost {
	background: transparent;
	border-color: transparent;
	color: var(--color-text-primary);
	padding-inline: 0;
	min-height: auto;
}
.oriii .o-btn--ghost:hover { color: var(--color-accent); transform: none; }

/* Botão sobre fundo escuro (banners navy) */
.oriii .o-btn--on-dark {
	background: transparent;
	border-color: var(--color-brand-ivory);
	color: var(--color-brand-ivory);
}
.oriii .o-btn--on-dark:hover {
	background: var(--color-brand-ivory);
	border-color: var(--color-brand-ivory);
	color: var(--color-brand-navy);
}

.oriii .o-link-underline {
	position: relative;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	font-size: var(--fs-caption);
	padding-bottom: 2px;
	background-image: linear-gradient(currentColor, currentColor);
	background-size: 100% 1px;
	background-repeat: no-repeat;
	background-position: 0 100%;
	transition: background-size var(--duration-normal) var(--ease), color var(--duration-fast) var(--ease);
}
.oriii .o-link-underline:hover { background-size: 0 1px; color: var(--color-accent); }

:where(.oriii) :focus-visible {
	outline: 2px solid var(--color-accent);
	outline-offset: 2px;
}

/* --- Formulários --------------------------------------------------------- */
.oriii input[type="text"],
.oriii input[type="email"],
.oriii input[type="tel"],
.oriii input[type="password"],
.oriii input[type="number"],
.oriii input[type="search"],
.oriii input[type="url"],
.oriii textarea,
.oriii select,
.oriii .select2-container .select2-selection--single {
	width: 100%;
	font-family: var(--font-body);
	font-size: var(--fs-body-md);
	color: var(--color-text-primary);
	background-color: var(--color-surface);
	border: 1px solid var(--color-border-subtle);
	border-radius: var(--radius-md);
	padding: var(--space-3) var(--space-4);
	min-height: 48px;
	transition: border-color var(--duration-fast) var(--ease), box-shadow var(--duration-fast) var(--ease);
}
.oriii textarea { min-height: 120px; padding-top: var(--space-3); }
.oriii input:focus,
.oriii textarea:focus,
.oriii select:focus {
	border-color: var(--color-brand-navy);
	box-shadow: 0 0 0 3px rgba(184, 148, 85, 0.18);
	outline: none;
}
.oriii label { font-size: var(--fs-body-sm); font-weight: 600; color: var(--color-text-primary); }

/* --- Animação de entrada (motion · seção 26) -------------------------------- */
@media (prefers-reduced-motion: no-preference) {
	.oriii .o-reveal {
		opacity: 0;
		transform: translateY(10px);
		transition: opacity var(--duration-slow) var(--ease), transform var(--duration-slow) var(--ease);
	}
	.oriii .o-reveal.is-visible { opacity: 1; transform: none; }
}