/**
 * Main Stylesheet - Dr. coog's Clone Theme
 * BEM Methodology: Block__Element--Modifier
 *
 * @package Coog
 */

/* ============================================
   VARIABLES & SETTINGS
   ============================================ */

:root {
	/* Colors - Dr. coog's Inspired Palette */
	--color-primary: #003d66;        /* Navy Blue - Main brand color */
	--color-secondary: #172857;     /* Lighter Navy - Secondary */
	--color-accent: #d32f2f;        /* Red - Call-to-action buttons */
	--color-success: #2e7d32;       /* Green - Success messages */
	--color-warning: #f57c00;       /* Orange - Warnings */
	--color-error: #c62828;         /* Dark Red - Errors */

	--color-background: #ffffff;    /* White background */
	--color-surface: #f9f9f9;       /* Light gray surfaces */
	--color-border: #d0d0d0;        /* Gray borders */
	--color-text: #181c78;          /* Dark text */
	--color-text-light: #666666;    /* Medium gray text */
	--color-text-lighter: #999999;  /* Light gray text */

	--site-header: #FFD601;
	--hover-yellow: #E6C409;

	/* Typography - System fonts for better performance */
	--font-primary: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	--font-secondary: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

	--font-size-base: 16px;
	--font-size-sm: 14px;
	--font-size-lg: 18px;
	--font-size-xl: 24px;
	--font-size-2xl: 32px;

	--line-height-base: 1.6;
	--line-height-heading: 1.2;

	--font-weight-normal: 400;
	--font-weight-medium: 600;
	--font-weight-bold: 700;

	/* Spacing */
	--spacing-xs: 8px;
	--spacing-sm: 12px;
	--spacing-md: 16px;
	--spacing-lg: 24px;
	--spacing-xl: 32px;
	--spacing-2xl: 48px;

	/* Border Radius */
	--radius-sm: 4px;
	--radius-md: 8px;
	--radius-lg: 12px;

	/* Shadows */
	--shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.1);
	--shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
	--shadow-lg: 0 10px 20px rgba(0, 0, 0, 0.15);

	/* Transitions - Optimized para CWV */
	--transition-fast: 150ms ease-in-out;
	--transition-base: 300ms ease-in-out;
	--transition-slow: 500ms ease-in-out;

	/* Breakpoints */
	--breakpoint-mobile: 480px;
	--breakpoint-tablet: 768px;
	--breakpoint-desktop: 1024px;
	--breakpoint-wide: 1280px;

	/* Color Scheme */
	color-scheme: light;
}


/* ============================================
   RESET & BASE STYLES
   ============================================ */

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	font-size: var(--font-size-base);
	scroll-behavior: smooth;
	/* Improve performance */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

body {
	font-family: var(--font-primary);
	font-size: var(--font-size-base);
	line-height: var(--line-height-base);
	color: var(--color-text);
	background-color: var(--color-background);
	/* Optimize Core Web Vitals */
	scroll-behavior: smooth;
}

main {
	display: block;
}

.text-center {
    text-align: center;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-primary);
	font-weight: var(--font-weight-bold);
	line-height: var(--line-height-heading);
	margin-bottom: var(--spacing-md);
}

h1 { font-size: var(--font-size-2xl); }
h2 { font-size: var(--font-size-xl); }
h3 { font-size: var(--font-size-lg); }
h4, h5, h6 { font-size: var(--font-size-base); }

p {
	margin-bottom: var(--spacing-md);
}

a {
	color: var(--color-secondary);
	text-decoration: none;
	transition: color var(--transition-base);
}

a:hover {
	color: var(--color-accent);
	text-decoration: underline;
}

/* Lists */
ul, ol {
	margin-bottom: var(--spacing-md);
	margin-left: var(--spacing-lg);
}

li {
	margin-bottom: var(--spacing-sm);
}

/* ============================================
   LAYOUT & GRID
   ============================================ */

.container {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 var(--spacing-md);
}

@media (max-width: 768px) {
	.container {
		padding: 0 10px;
	}
}

/* ============================================
   HEADER & NAVIGATION
   ============================================ */

.site-header {
	background: #FFD601;
    background: linear-gradient(180deg, rgba(255, 214, 1, 1) 80%, rgba(255, 165, 0, 1) 100%);
	border-bottom: 2px solid var(--site-header);
	position: sticky;
	top: 0;
	z-index: 100;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.site-header__container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 0;
	gap: var(--spacing-lg);
}

.site-header__logo {
	flex-shrink: 0;
}

.site-logo {
	display: inline-block;
	max-height: 60px;
}

.site-logo__image {
	display: block;
    height: 62px;
    padding-left: 20px;
    width: 156px;
    transition: height var(--transition-base);
}

.site-branding__text {
	font-size: var(--font-size-xl);
	font-weight: var(--font-weight-bold);
	color: var(--color-primary);
	text-decoration: none;
}

.site-header__nav {
	flex: 1;
}

.primary-nav__list {
	display: flex;
	list-style: none;
	margin: 0;
	gap: var(--spacing-lg);
}

.primary-nav__list > li > a {
	display: block;
	padding: 20px 14px;
	color: var(--color-text);
	font-weight: var(--font-weight-medium);
	font-size: var(--font-size-sm);
	text-transform: uppercase;
	letter-spacing: 0.5px;
	position: relative;
	transition: color var(--transition-base);
}

.primary-nav__list > li > a:hover,
.primary-nav__list > li.current-menu-item > a {
	color: var(--color-secondary);
}

.primary-nav__list > li > a:hover::after,
.primary-nav__list > li.current-menu-item > a::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 14px;
	right: 14px;
	height: 3px;
	background-color: var(--site-header);
	border-radius: 2px;
}

.site-header__actions {
	display: flex;
	align-items: center;
	gap: var(--spacing-sm);
	flex-shrink: 0;
}

.site-header__search-toggle {
	background: none;
	border: none;
	cursor: pointer;
	padding: 8px;
	color: var(--color-text);
	border-radius: 50%;
	transition: color var(--transition-base), background-color var(--transition-base);
}

.site-header__search-toggle:hover {
	color: var(--color-secondary);
	background-color: var(--hover-yellow);
}

.icon {
	width: 24px;
	height: 24px;
}

.site-header__search-bar {
	background-color: var(--site-header);
	border-top: 1px solid var(--hover-yellow);
	padding: var(--spacing-xs) 0;
	padding-left: 5px;
	padding-right: 5px;
	display: none;
}

.site-header__search-bar--active {
	display: block;
}

/* Mobile Navigation - see responsive.css */

/* ============================================
   SEARCH FORM
   ============================================ */

.search-form {
	display: flex;
	gap: var(--spacing-sm);
}

.search-form__input {
	flex: 1;
	padding: var(--spacing-sm) var(--spacing-md);
	border: none;
	border-radius: var(--radius-md);
	font-family: var(--font-primary);
	font-size: var(--font-size-base);
	background-color: var(--hover-yellow);
}

.search-form__input:focus {
	outline: none;
	border-color: var(--color-secondary);
	box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.1);
}

.search-form__button {
	padding: var(--spacing-sm) var(--spacing-lg);
	background-color: var(--color-secondary);
	color: white;
	border: none;
	border-radius: var(--radius-md);
	cursor: pointer;
	font-weight: var(--font-weight-medium);
	transition: background-color var(--transition-base);
}

.search-form__button:hover {
	background-color: var(--color-primary);
}

/* ============================================
   MAIN CONTENT
   ============================================ */

.site-main {
	min-height: 60vh;
	padding: var(--spacing-lg) 0;
}

.site-main.page-main--home {
	padding: 0;
}

.site-content {
	display: grid;
	grid-template-columns: 1fr 300px;
	gap: var(--spacing-2xl);
}

@media (max-width: 768px) {
	.site-content {
		grid-template-columns: 1fr;
	}
}

.site-content__primary {
	padding: var(--spacing-xs);
	flex: 1;
}

.site-content__sidebar {
	width: 300px;
}

@media (max-width: 768px) {
	.site-content__sidebar {
		width: 100%;
	}
}

/* ============================================
   ARCHIVE / POSTS LIST
   ============================================ */

.post-entry {
	background-color: var(--color-surface);
	border-radius: var(--radius-md);
	overflow: hidden;
	margin-bottom: var(--spacing-lg);
	box-shadow: var(--shadow-sm);
	transition: box-shadow var(--transition-base), transform var(--transition-base);
}

.post-entry:hover {
	box-shadow: var(--shadow-md);
	transform: translateY(-2px);
}

.post-entry__inner {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.post-entry__thumbnail {
	position: relative;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	background-color: var(--color-border);
}

.post-entry__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--transition-base);
}

.post-entry:hover .post-entry__image {
	transform: scale(1.05);
}

.post-entry__content {
	padding: var(--spacing-lg);
	flex: 1;
	display: flex;
	flex-direction: column;
}

.post-entry__title {
	font-size: var(--font-size-lg);
	margin-bottom: var(--spacing-sm);
}

.post-entry__link {
	color: var(--color-text);
	text-decoration: none;
}

.post-entry__link:hover {
	color: var(--color-secondary);
}

.post-entry__meta {
	font-size: var(--font-size-sm);
	color: var(--color-text-light);
	margin-bottom: var(--spacing-md);
}

.post-entry__date {
	display: inline-block;
}

.post-entry__excerpt {
	color: var(--color-text-light);
	margin-bottom: var(--spacing-md);
	flex: 1;
}

.post-entry__read-more {
	display: inline-block;
	color: var(--color-secondary);
	font-weight: var(--font-weight-medium);
	padding: var(--spacing-sm) var(--spacing-md);
	border: 1px solid var(--color-secondary);
	border-radius: var(--radius-md);
	transition: all var(--transition-base);
}

.post-entry__read-more:hover {
	background-color: var(--color-secondary);
	color: white;
	text-decoration: none;
}

/* Pagination */
.pagination {
	display: flex;
	justify-content: center;
	gap: var(--spacing-sm);
	margin-top: var(--spacing-2xl);
	list-style: none;
}

.pagination__item {
	display: inline-block;
}

.pagination__link {
	display: block;
	padding: var(--spacing-sm) var(--spacing-md);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	transition: all var(--transition-base);
}

.pagination__link:hover,
.pagination__item.current .pagination__link {
	background-color: var(--color-secondary);
	color: white;
	border-color: var(--color-secondary);
	text-decoration: none;
}

/* ============================================
   SINGLE POST
   ============================================ */

.post-single__header {
	margin-bottom: var(--spacing-2xl);
	text-align: center;
}

.post-single__title {
	font-size: var(--font-size-2xl);
	margin-bottom: var(--spacing-md);
}

.post-single__meta {
	color: var(--color-text-light);
	font-size: var(--font-size-sm);
}

.post-single__date,
.post-single__author {
	display: inline-block;
	margin-right: var(--spacing-lg);
}

.post-single__thumbnail {
	margin-bottom: var(--spacing-2xl);
	border-radius: var(--radius-lg);
	overflow: hidden;
}

.post-single__thumbnail img {
	width: 100%;
	height: auto;
	display: block;
}

.post-single__content {
	margin-bottom: var(--spacing-2xl);
	font-size: var(--font-size-lg);
	line-height: 1.8;
}

.post-single__content p {
	margin-bottom: var(--spacing-lg);
}

.post-single__footer {
	padding-top: var(--spacing-lg);
	border-top: 1px solid var(--color-border);
}

.post-tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--spacing-sm);
}

.post-tag {
	display: inline-block;
	padding: var(--spacing-sm) var(--spacing-md);
	background-color: var(--color-surface);
	border-radius: var(--radius-md);
	font-size: var(--font-size-sm);
	color: var(--color-text);
	text-decoration: none;
	transition: all var(--transition-base);
}

.post-tag:hover {
	background-color: var(--color-secondary);
	color: white;
}

/* ============================================
   PAGE ARTICLE
   ============================================ */

.page-article__header {
	text-align: center;
	/*margin-bottom: var(--spacing-2xl);*/
}

.page-article__title {
	font-size: var(--font-size-2xl);
}

.page-article__thumbnail {
	margin-bottom: var(--spacing-2xl);
	border-radius: var(--radius-lg);
	overflow: hidden;
}

.page-article__thumbnail img {
	width: 100%;
	height: auto;
	display: block;
}

.page-article__content {
	font-size: var(--font-size-lg);
	line-height: 1.8;
}

.page-content {
	padding:20px;
}

/* ============================================
   WIDGETS
   ============================================ */

.widget {
	background-color: var(--color-surface);
	padding: var(--spacing-lg);
	border-radius: var(--radius-md);
	margin-bottom: var(--spacing-lg);
}

.widget__title {
	font-size: var(--font-size-lg);
	margin-bottom: var(--spacing-md);
	padding-bottom: var(--spacing-md);
	border-bottom: 2px solid var(--color-secondary);
}

.widget ul {
	list-style: none;
	margin-left: 0;
}

.widget li {
	margin-bottom: var(--spacing-sm);
}

.widget a {
	display: block;
	padding: var(--spacing-sm) 0;
	color: var(--color-secondary);
	text-decoration: none;
}

.widget a:hover {
	color: var(--color-accent);
}

/* Sidebar: Latest Posts block override */
.widget .wp-block-latest-posts__list {
	width: auto;
	position: static;
	left: auto;
	margin-left: 0;
	max-width: 100%;
	padding: 0;
}

.widget .wp-block-latest-posts__list li {
	overflow: hidden;
	text-overflow: ellipsis;
}

.widget .wp-block-latest-posts__list a {
	word-wrap: break-word;
	overflow-wrap: break-word;
}

/* ============================================
   FOOTER
   ============================================ */

.site-footer {
	background: #0063a6;
	background: linear-gradient(180deg,rgba(0, 99, 166, 1) 0%, rgba(0, 61, 102, 1) 100%);
	color: var(--color-surface);
}

.site-footer__main {
	padding: var(--spacing-2xl) 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.site-footer__widgets {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: var(--spacing-lg);
}

@media (max-width: 768px) {
	.site-footer__widgets {
		grid-template-columns: 1fr;
	}
}

.footer-widget {
	color: var(--color-surface);
}

.footer-widget__title {
	font-size: var(--font-size-lg);
	margin-bottom: var(--spacing-md);
	color: white;
}

.footer-widget a {
	color: var(--color-surface);
	transition: color var(--transition-base);
}

.footer-widget a:hover {
	color: var(--color-accent);
	text-decoration: underline;
}

.site-footer__bottom {
	padding: var(--spacing-lg) 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--spacing-lg);
}

.site-footer__copyright {
	font-size: var(--font-size-sm);
	color: rgba(255, 255, 255, 0.7);
}

.site-footer__nav {
	margin-left: auto;
}

.footer-nav__list {
	display: flex;
	list-style: none;
	gap: var(--spacing-lg);
	margin: 0;
}

.footer-nav__list a {
	color: rgba(255, 255, 255, 0.7);
	text-decoration: none;
	transition: color var(--transition-base);
}

.footer-nav__list a:hover {
	color: var(--color-accent);
}

/* ============================================
   BUTTONS
   ============================================ */

.button,
button,
input[type="button"],
input[type="submit"] {
	padding: var(--spacing-sm) var(--spacing-lg);
	background-color: var(--color-secondary);
	color: white;
	border: none;
	border-radius: var(--radius-md);
	font-family: var(--font-primary);
	font-weight: var(--font-weight-medium);
	cursor: pointer;
	transition: all var(--transition-base);
	text-decoration: none;
	display: inline-block;
}

.button:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
	background-color: var(--hover-yellow);
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

.button--secondary {
	background-color: var(--color-accent);
}

.button--secondary:hover {
	background-color: #e55a2a;
}

/* ============================================
   FORMS
   ============================================ */

.form-group {
	margin-bottom: var(--spacing-lg);
}

label {
	display: block;
	margin-bottom: var(--spacing-sm);
	font-weight: var(--font-weight-medium);
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
textarea,
select {
	width: 100%;
	padding: var(--spacing-sm) var(--spacing-md);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	font-family: var(--font-primary);
	font-size: var(--font-size-base);
	transition: border-color var(--transition-base);
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
textarea:focus,
select:focus {
	outline: none;
	border-color: var(--color-secondary);
	box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.1);
}

textarea {
	resize: vertical;
	min-height: 150px;
}

/* ============================================
   COMMENTS
   ============================================ */

.comments-area {
	margin-top: var(--spacing-2xl);
	padding-top: var(--spacing-2xl);
	border-top: 1px solid var(--color-border);
}

.comment-respond {
	margin-bottom: var(--spacing-lg);
}

.comment-form {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--spacing-md);
}

.comment-form > p:nth-child(3),
.comment-form > p:nth-child(4) {
	grid-column: 1 / -1;
}

.comment-form textarea {
	grid-column: 1 / -1;
}

.form-submit {
	grid-column: 1 / -1;
}

.comment-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.comment {
	margin-bottom: var(--spacing-lg);
	padding-bottom: var(--spacing-lg);
	border-bottom: 1px solid var(--color-border);
}

.comment__meta {
	font-size: var(--font-size-sm);
	margin-bottom: var(--spacing-md);
}

.comment__author {
	font-weight: var(--font-weight-medium);
	color: var(--color-text);
}

/* ============================================
   GUTENBERG BLOCKS
   ============================================ */

.wp-block-image {
	margin-bottom: var(--spacing-lg);
}

.wp-block-image img {
	max-width: 100%;
	height: auto;
	border-radius: var(--radius-md);
}

.wp-block-quote {
	padding: var(--spacing-lg) var(--spacing-xl);
	border-left: 4px solid var(--color-secondary);
	background-color: var(--color-surface);
	border-radius: var(--radius-md);
	margin: var(--spacing-lg) 0;
	font-style: italic;
	color: var(--color-text-light);
}

.wp-block-button__link {
	background-color: var(--color-secondary);
	color: white;
	padding: var(--spacing-sm) var(--spacing-lg);
	border-radius: var(--radius-md);
	text-decoration: none;
	display: inline-block;
	transition: all var(--transition-base);
}

.wp-block-button__link:hover {
	background-color: var(--color-primary);
}

/* Latest Posts Block - Full Width bg, content aligned to container */
.wp-block-latest-posts__list {
	width: 100vw;
	position: relative;
	left: 50%;
	margin-left: -50vw;
	max-width: none;
	list-style: none;
	box-sizing: border-box;
	padding: var(--space-2xl) max(var(--space-lg), calc((100vw - 1280px) / 2 + var(--space-lg)));
}

/* Grid layout via CSS Grid (overrides WP default flexbox) */
.wp-block-latest-posts__list.is-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-xl);
}

@media (max-width: 768px) {
	.wp-block-latest-posts__list.is-grid {
		grid-template-columns: 1fr;
	}
}

.wp-block-latest-posts__list.is-grid li {
	margin: 0;
	width: auto;
	padding-top: 53px;
}

/* Card styling */
.wp-block-latest-posts__featured-image {
	margin-bottom: var(--space-md);
	border-radius: var(--radius-md);
	overflow: hidden;
}

.wp-block-latest-posts__featured-image img {
	width: 80% !important;
	max-width: none;
	max-height: none;
	height: auto;
	display: block;
	margin: auto;
	border-radius: var(--radius-md);
}

.wp-block-latest-posts__post-title {
	display: block;
	color: var(--coog-blue);
	font-weight: var(--font-weight-semibold);
	font-size: var(--font-size-md);
	text-decoration: none;
	margin-bottom: var(--space-sm);
	transition: color var(--transition-fast);
}

.wp-block-latest-posts__post-title:hover {
	color: var(--coog-yellow-hover);
}

.wp-block-latest-posts__post-excerpt {
	font-size: var(--font-size-sm);
	color: var(--coog-text-light);
	line-height: var(--line-height-base);
}

.wp-block-latest-posts__post-date {
	font-size: var(--font-size-xs);
	color: var(--coog-gray);
}

/* ============================================
   COMPRE POR CATEGORIA - coog Style
   Uso: adicionar classe "coog-categories" a um
   bloco Latest Posts ou Colunas no Gutenberg
   ============================================ */

/* ---- Base: full-width background, content aligned ---- */
.coog-categories {
	width: 100vw;
	position: relative;
	left: 50%;
	margin-left: -50vw;
	padding: var(--space-3xl) max(var(--space-lg), calc((100vw - 1280px) / 2 + var(--space-lg)));
	box-sizing: border-box;
	text-align: center;
}

/* ---- When used on Latest Posts block ---- */
ul.coog-categories {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-xl);
	list-style: none;
}

ul.coog-categories > li {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

/* Circular image */
ul.coog-categories .wp-block-latest-posts__featured-image {
	width: 180px;
	height: 180px;
	border-radius: 50%;
	overflow: visible;
	margin: 0 auto;
	background-color: var(--coog-off-white);
	border: 3px solid var(--coog-gray-light);
	position: relative;
	transition: border-color var(--transition-base), transform var(--transition-base), box-shadow var(--transition-base);
}

ul.coog-categories li:hover .wp-block-latest-posts__featured-image {
	border-color: var(--coog-yellow);
	transform: translateY(-4px);
	box-shadow: 0 8px 20px rgba(0, 47, 108, 0.12);
}

ul.coog-categories .wp-block-latest-posts__featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
	display: block;
	max-width: none;
	max-height: none;
}

/* Title - black rectangle overlaid on image bottom */
ul.coog-categories .wp-block-latest-posts__post-title {
	position: absolute;
	bottom: 40px;
	left: 50%;
	transform: translateX(-50%);
	background-color: rgba(0, 0, 0, 0.85);
	color: #fff;
	font-family: var(--font-heading);
	font-size: var(--font-size-xs);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 1px;
	line-height: 1;
	padding: 8px 16px;
	white-space: nowrap;
	border-radius: 2px;
	z-index: 2;
	text-decoration: none;
	transition: background-color var(--transition-fast);
}

ul.coog-categories li:hover .wp-block-latest-posts__post-title {
	background-color: rgba(0, 0, 0, 1);
	color: var(--coog-yellow);
}

/* Hide excerpt in category mode */
ul.coog-categories .wp-block-latest-posts__post-excerpt {
	display: none;
}

/* Hide date in category mode */
ul.coog-categories .wp-block-latest-posts__post-date {
	display: none;
}

/* ---- When used on Columns block ---- */
.coog-categories > h2,
.coog-categories > .wp-block-heading {
	font-family: var(--font-heading);
	font-size: var(--font-size-xl);
	font-weight: var(--font-weight-extrabold);
	color: var(--coog-blue);
	text-transform: uppercase;
	letter-spacing: 2px;
	text-align: center;
	margin-bottom: var(--space-2xl);
}

.coog-categories .wp-block-columns {
	gap: var(--space-xl);
	justify-items: center;
	margin-bottom: 0;
}

.coog-categories .wp-block-column {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: var(--space-md);
	position: relative;
}

.coog-categories .wp-block-column .wp-block-image,
.coog-categories .wp-block-column figure {
	width: 180px;
	height: 180px;
	border-radius: 50%;
	overflow: visible;
	margin: 0 auto;
	background-color: var(--coog-off-white);
	border: 3px solid var(--coog-gray-light);
	transition: border-color var(--transition-base), transform var(--transition-base), box-shadow var(--transition-base);
	position: relative;
}

.coog-categories .wp-block-column .wp-block-image img,
.coog-categories .wp-block-column figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	max-width: none;
	max-height: none;
	border-radius: 50%;
}

.coog-categories .wp-block-column:hover .wp-block-image,
.coog-categories .wp-block-column:hover figure {
	border-color: var(--coog-yellow);
	transform: translateY(-4px);
	box-shadow: 0 8px 20px rgba(0, 47, 108, 0.12);
}

.coog-categories .wp-block-column p,
.coog-categories .wp-block-column h3,
.coog-categories .wp-block-column h4,
.coog-categories .wp-block-column .wp-block-heading {
	font-family: var(--font-heading);
	font-size: var(--font-size-xs);
	font-weight: var(--font-weight-bold);
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 1px;
	line-height: 1;
	margin: 0;
	background-color: rgba(0, 0, 0, 0.85);
	padding: 8px 16px;
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
	border-radius: 2px;
	z-index: 2;
	pointer-events: none;
}

.coog-categories .wp-block-column a {
	text-decoration: none;
	color: var(--coog-blue);
	transition: color var(--transition-fast);
}

.coog-categories .wp-block-column a:hover {
	color: var(--coog-yellow-hover);
}

/* ---- Responsive ---- */
@media (max-width: 768px) {
	ul.coog-categories {
		grid-template-columns: repeat(2, 1fr);
	}

	ul.coog-categories .wp-block-latest-posts__featured-image,
	.coog-categories .wp-block-column .wp-block-image,
	.coog-categories .wp-block-column figure {
		width: 140px;
		height: 140px;
	}

	.coog-categories .wp-block-columns {
		flex-wrap: wrap;
		justify-content: center;
	}

	.coog-categories .wp-block-column {
		flex-basis: 45%;
		max-width: 45%;
	}
}

@media (max-width: 480px) {
	ul.coog-categories {
		grid-template-columns: 1fr;
	}

	.coog-categories .wp-block-column {
		flex-basis: 100%;
		max-width: 180px;
	}
}

/* ============================================
   FULL-WIDTH UTILITY
   Uso: adicionar classe "full-width" a qualquer
   bloco Gutenberg via Avançado > Classes CSS
   ============================================ */

.full-width {
	width: 100vw;
	position: relative;
	left: 50%;
	margin-left: -50vw;
	max-width: none;
	box-sizing: border-box;
	padding-left: max(var(--spacing-md), calc((100vw - 1280px) / 2 + var(--spacing-md)));
	padding-right: max(var(--spacing-md), calc((100vw - 1280px) / 2 + var(--spacing-md)));
}

/* ============================================
   RESPONSIVE UTILITIES
   ============================================ */

@media (max-width: 768px) {
	html {
		font-size: 14px;
	}

	h1 { font-size: 28px; }
	h2 { font-size: 24px; }
	h3 { font-size: 20px; }
}

@media (max-width: 480px) {
	html {
		font-size: 13px;
	}

	h1 { font-size: 24px; }
	h2 { font-size: 20px; }
	h3 { font-size: 18px; }

	.site-header__container {
		padding: 0;
	}

	.primary-nav__list {
		gap: var(--spacing-md);
	}
}

/* ============================================
   BREADCRUMB - coog Style
   ============================================ */

.breadcrumb-wrapper {
	background-color: var(--coog-off-white);
	border-bottom: 1px solid var(--coog-gray-light);
}

.breadcrumb {
	padding: var(--space-sm) 0;
	font-size: var(--font-size-xs);
	letter-spacing: 0.3px;
}

.breadcrumb__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 0;
}

.breadcrumb__item {
	display: inline-flex;
	align-items: center;
	margin: 0;
	line-height: 1.4;
}

/* Separador via CSS ::after */
.breadcrumb__item:not(.breadcrumb__item--current)::after {
	content: '\203A';
	color: var(--coog-gray);
	font-size: 14px;
	margin: 0 12px;
	user-select: none;
}

.breadcrumb__link {
	color: var(--coog-blue);
	text-decoration: none;
	font-weight: var(--font-weight-normal);
	transition: color var(--transition-fast);
	padding: 2px 0;
}

.breadcrumb__link:hover {
	color: var(--coog-yellow-hover);
	text-decoration: none;
}

.breadcrumb__sep {
	display: none;
}

.breadcrumb__current {
	color: var(--coog-gray-dark);
	font-weight: var(--font-weight-normal);
}

.breadcrumb__item--current {
	max-width: 280px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ============================================
   PRINT STYLES
   ============================================ */

@media print {
	.site-header,
	.site-footer,
	.comments-area,
	.navigation {
		display: none;
	}

	body {
		background: white;
		color: black;
	}

	a {
		text-decoration: underline;
	}
}

/* ============================================
   FALE CONOSCO - Contact Form 7
   ============================================ */

.contact-page {
	max-width: 720px;
	margin: 0 auto;
	padding: var(--spacing-lg) 0 var(--spacing-2xl);
}

.contact-page__intro {
	text-align: center;
	margin-bottom: var(--spacing-2xl);
	color: var(--color-text-light);
	font-size: var(--font-size-lg);
}

.contact-page__intro p {
	margin: 0;
}

.contact-page__notice {
	text-align: center;
	padding: var(--spacing-xl);
	background-color: var(--color-surface);
	border-radius: var(--radius-md);
	color: var(--color-text-light);
	border: 1px dashed var(--color-border);
}

/* CF7 Form Overrides */
.contact-page__form .wpcf7-form {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-lg);
}

.contact-page__form .wpcf7-form p {
	margin: 0;
}

.contact-page__form .wpcf7-form label {
	display: block;
	margin-bottom: var(--spacing-xs);
	font-weight: var(--font-weight-medium);
	color: var(--color-text);
	font-size: var(--font-size-sm);
}

.contact-page__form .wpcf7-form-control:not([type="submit"]) {
	width: 100%;
	padding: var(--spacing-sm) var(--spacing-md);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	font-family: var(--font-primary);
	font-size: var(--font-size-base);
	transition: border-color var(--transition-base), box-shadow var(--transition-base);
	background-color: var(--color-background);
}

.contact-page__form .wpcf7-form-control:not([type="submit"]):focus {
	outline: none;
	border-color: var(--color-secondary);
	box-shadow: 0 0 0 3px rgba(23, 40, 87, 0.1);
}

.contact-page__form .wpcf7-form textarea {
	min-height: 180px;
	resize: vertical;
}

.contact-page__form .wpcf7-form input[type="submit"] {
	align-self: flex-start;
	padding: var(--spacing-sm) var(--spacing-2xl);
	background-color: var(--color-secondary);
	color: white;
	border: none;
	border-radius: var(--radius-md);
	font-family: var(--font-primary);
	font-size: var(--font-size-base);
	font-weight: var(--font-weight-medium);
	cursor: pointer;
	transition: background-color var(--transition-base), transform var(--transition-base), box-shadow var(--transition-base);
}

.contact-page__form .wpcf7-form input[type="submit"]:hover {
	background-color: var(--hover-yellow);
	color: var(--color-text);
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

/* CF7 Validation Messages */
.contact-page__form .wpcf7-not-valid-tip {
	color: var(--color-error);
	font-size: var(--font-size-sm);
	margin-top: var(--spacing-xs);
}

.contact-page__form .wpcf7-not-valid {
	border-color: var(--color-error);
}

.contact-page__form .wpcf7-response-output {
	padding: var(--spacing-md);
	border-radius: var(--radius-md);
	font-size: var(--font-size-sm);
	text-align: center;
	margin: var(--spacing-md) 0 0;
}

.contact-page__form .wpcf7-mail-sent-ok {
	background-color: rgba(46, 125, 50, 0.1);
	border-color: var(--color-success);
	color: var(--color-success);
}

.contact-page__form .wpcf7-validation-errors,
.contact-page__form .wpcf7-spam-blocked {
	background-color: rgba(198, 40, 40, 0.1);
	border-color: var(--color-error);
	color: var(--color-error);
}

/* CF7 Spinner */
.contact-page__form .wpcf7-spinner {
	margin: var(--spacing-sm) 0;
}

@media (max-width: 768px) {
	.contact-page {
		padding: var(--spacing-md) 0 var(--spacing-xl);
	}

	.contact-page__form .wpcf7-form input[type="submit"] {
		width: 100%;
		text-align: center;
	}
}

/* ============================================
   GUTENBERG EDITOR COLOR PALETTE
   ============================================ */

.has-primary-color { color: var(--color-primary); }
.has-secondary-color { color: var(--color-secondary); }
.has-accent-color { color: var(--color-accent); }
.has-white-color { color: #ffffff; }
.has-black-color { color: #1a1a1a; }
.has-light-gray-color { color: #f5f5f5; }
.has-yellow-color { color: var(--site-header); }

.has-primary-background-color { background-color: var(--color-primary); }
.has-secondary-background-color { background-color: var(--color-secondary); }
.has-accent-background-color { background-color: var(--color-accent); }
.has-white-background-color { background-color: #ffffff; }
.has-black-background-color { background-color: #1a1a1a; }
.has-light-gray-background-color { background-color: #f5f5f5; }
.has-yellow-background-color { background-color: var(--site-header); }

/* ============================================
   ABOUT / INSTITUTIONAL PAGE BLOCKS
   ============================================ */

/* Cover block - hero section */
.page-article__content .wp-block-cover {
	border-radius: var(--radius-lg);
	overflow: hidden;
	background-color: var(--color-secondary);
}

.page-article__content .wp-block-cover .wp-block-cover__background {
	background-color: var(--color-secondary);
}

.page-article__content .wp-block-cover h1 {
	color: var(--color-text);
	font-family: var(--font-primary);
	font-weight: var(--font-weight-bold);
}

.page-article__content .wp-block-cover p {
	color: var(--color-text);
}

/* Separator */
.page-article__content .wp-block-separator {
	border: none;
	border-top: 3px solid var(--site-header);
	width: 80px;
	margin: var(--spacing-md) 0 var(--spacing-xl);
	opacity: 1;
}

.page-article__content .wp-block-separator.is-style-wide {
	width: 100%;
	border-top-width: 2px;
	border-color: var(--color-border);
}

/* Columns layout */
.page-article__content .wp-block-columns {
	gap: var(--spacing-xl);
}

/* Timeline list styling */
.page-article__content .wp-block-columns ul {
	list-style: none;
	margin-left: 0;
	padding-left: var(--spacing-lg);
	border-left: 3px solid var(--site-header);
}

.page-article__content .wp-block-columns ul li {
	position: relative;
	padding-left: var(--spacing-md);
	margin-bottom: var(--spacing-md);
	line-height: 1.8;
}

.page-article__content .wp-block-columns ul li::before {
	content: '';
	position: absolute;
	left: calc(-1 * var(--spacing-lg) - 6px);
	top: 10px;
	width: 10px;
	height: 10px;
	background-color: var(--site-header);
	border-radius: 50%;
	border: 2px solid #fff;
}

.page-article__content .wp-block-columns ul li strong {
	color: var(--color-secondary);
}

/* Value cards - groups with light-gray bg */
.page-article__content .wp-block-group.has-light-gray-background-color {
	transition: box-shadow var(--transition-base), transform var(--transition-base);
}

.page-article__content .wp-block-columns .wp-block-column > .wp-block-group.has-light-gray-background-color {
	box-shadow: var(--shadow-sm);
	transition: box-shadow var(--transition-base), transform var(--transition-base);
}

.page-article__content .wp-block-columns .wp-block-column > .wp-block-group.has-light-gray-background-color:hover {
	box-shadow: var(--shadow-md);
	transform: translateY(-3px);
}

.page-article__content .wp-block-columns .wp-block-column > .wp-block-group.has-light-gray-background-color h3 {
	color: var(--color-secondary);
	margin-bottom: var(--spacing-sm);
}

.page-article__content .wp-block-columns .wp-block-column > .wp-block-group.has-light-gray-background-color p {
	color: var(--color-text-light);
	font-size: var(--font-size-sm);
	margin-bottom: 0;
}

.page-article__content .wp-block-columns .wp-block-column > .wp-block-group.has-light-gray-background-color ul {
	border-left: none;
	padding-left: var(--spacing-md);
	margin-bottom: 0;
}

.page-article__content .wp-block-columns .wp-block-column > .wp-block-group.has-light-gray-background-color ul li::before {
	display: none;
}

.page-article__content .wp-block-columns .wp-block-column > .wp-block-group.has-light-gray-background-color ul li {
	padding-left: 0;
	color: var(--color-text-light);
	font-size: var(--font-size-sm);
	list-style: disc inside;
}

/* CTA block - dark background */
.page-article__content .wp-block-group.has-black-background-color {
	box-shadow: var(--shadow-lg);
	transition: transform var(--transition-base);
}

.page-article__content .wp-block-group.has-black-background-color:hover {
	transform: translateY(-2px);
}

.page-article__content .wp-block-group.has-black-background-color h2 {
	color: #ffffff;
	margin-bottom: var(--spacing-lg);
}

.page-article__content .wp-block-group.has-black-background-color p {
	color: rgba(255, 255, 255, 0.85);
}

/* Mission/Vision section */
.page-article__content > .wp-block-group.has-light-gray-background-color {
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-sm);
}

.page-article__content > .wp-block-group.has-light-gray-background-color h2 {
	color: var(--color-secondary);
	position: relative;
	padding-bottom: var(--spacing-sm);
}

.page-article__content > .wp-block-group.has-light-gray-background-color h2::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 50px;
	height: 3px;
	background-color: var(--site-header);
	border-radius: 2px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
	.page-article__content .wp-block-cover {
		min-height: 300px !important;
	}

	.page-article__content .wp-block-cover h1 {
		font-size: var(--font-size-xl) !important;
	}

	.page-article__content .wp-block-group.has-black-background-color h2 {
		font-size: var(--font-size-xl) !important;
	}

	.page-article__content .wp-block-columns {
		flex-direction: column;
	}

	.page-article__content .wp-block-column {
		flex-basis: 100% !important;
	}
}

/* ============================================
   PRODUCT PAGE
   ============================================ */

.product-page {
	padding: var(--spacing-xl) 0 var(--spacing-2xl);
}

/* Hero: image left + info right */
.product-page__hero {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--spacing-2xl);
	align-items: start;
}

/* Gallery / Image */
.product-page__gallery {
	position: sticky;
	top: calc(100px + var(--spacing-lg));
}

.product-page__image {
	width: 100%;
	height: auto;
	display: block;
	border-radius: var(--radius-lg);
	object-fit: cover;
	box-shadow: var(--shadow-md);
}

.product-page__image-placeholder {
	width: 100%;
	aspect-ratio: 1;
	background-color: var(--color-surface);
	border: 2px dashed var(--color-border);
	border-radius: var(--radius-lg);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-text-lighter);
	font-size: var(--font-size-lg);
}

/* Info */
.product-page__subtitle {
	display: inline-block;
	font-size: var(--font-size-sm);
	text-transform: uppercase;
	letter-spacing: 2px;
	color: var(--color-text-light);
	margin-bottom: var(--spacing-sm);
}

.product-page__title {
	font-size: 36px;
	line-height: 1.2;
	color: var(--color-secondary);
	margin-bottom: var(--spacing-lg);
}

.product-page__description {
	font-size: var(--font-size-base);
	line-height: 1.8;
	color: var(--color-text-light);
	margin-bottom: var(--spacing-xl);
}

.product-page__description p:last-child {
	margin-bottom: 0;
}

/* Pricing */
.product-page__pricing {
	display: flex;
	align-items: baseline;
	gap: var(--spacing-md);
	margin-bottom: var(--spacing-xl);
}

.product-page__price {
	font-size: 32px;
	font-weight: var(--font-weight-bold);
	color: var(--color-secondary);
}

.product-page__price-old {
	font-size: var(--font-size-lg);
	color: var(--color-text-lighter);
	text-decoration: line-through;
}

/* CTA Button */
.product-page__cta {
	display: inline-block;
	padding: var(--spacing-md) var(--spacing-2xl);
	background-color: var(--site-header);
	color: var(--color-text);
	font-weight: var(--font-weight-bold);
	font-size: var(--font-size-base);
	border-radius: var(--radius-md);
	text-decoration: none;
	text-align: center;
	transition: background-color var(--transition-base), transform var(--transition-base), box-shadow var(--transition-base);
}

.product-page__cta:hover {
	background-color: var(--hover-yellow);
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
	text-decoration: none;
	color: var(--color-text);
}

/* Specs - single row */
.product-page__specs {
	display: flex;
	gap: 0;
	margin-top: var(--spacing-2xl);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	overflow: hidden;
	background-color: var(--color-surface);
}

.product-page__spec-item {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: var(--spacing-lg) var(--spacing-md);
	border-right: 1px solid var(--color-border);
}

.product-page__spec-item:last-child {
	border-right: none;
}

.product-page__spec-label {
	font-size: var(--font-size-sm);
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--color-text-lighter);
	margin-bottom: var(--spacing-xs);
	font-weight: var(--font-weight-medium);
}

.product-page__spec-value {
	font-size: var(--font-size-lg);
	font-weight: var(--font-weight-bold);
	color: var(--color-secondary);
}

/* Responsive */
@media (max-width: 768px) {
	.product-page__hero {
		grid-template-columns: 1fr;
		gap: var(--spacing-xl);
	}

	.product-page__gallery {
		position: static;
	}

	.product-page__title {
		font-size: 28px;
	}

	.product-page__price {
		font-size: 28px;
	}

	.product-page__cta {
		display: block;
		width: 100%;
	}

	.product-page__specs {
		flex-wrap: wrap;
	}

	.product-page__spec-item {
		flex: 1 1 50%;
		border-right: none;
		border-bottom: 1px solid var(--color-border);
	}

	.product-page__spec-item:nth-child(odd) {
		border-right: 1px solid var(--color-border);
	}

	.product-page__spec-item:last-child,
	.product-page__spec-item:nth-last-child(2):nth-child(odd) ~ .product-page__spec-item {
		border-bottom: none;
	}
}