/*
Theme Name: Cultivado em Casa
Theme URI: https://www.estudiogrampo.com.br/
Description: Block theme for Cultivado em Casa. Frost-style minimal base (theme.json driven, no bundled templates); pages are composed from core blocks plus a few ACF blocks in /acf-custom-blocks/.
Author: Estudio Grampo
Author URI: https://www.estudiogrampo.com.br/
Version: 0.2.0
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cultivadoemcasa
*/

/* Design tokens (colors, type scale, spacing) live in theme.json. This file: resets + component CSS. */

/* ------------------------------------------------------------------ Reset */

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

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

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

img,
video,
svg {
	max-width: 100%;
	height: auto;
}

p {
	margin-block: 0;
}

.wp-site-blocks > * + * {
	margin-block-start: 0;
}

/* Buttons/links that have no destination (empty bound field) stay hidden. */
.wp-block-button__link:not([href]),
.wp-block-button__link:empty {
	display: none;
}

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

/* ----------------------------------------------------------------- Header */

.cec-header {
	background: #fff;
}

.cec-header .wp-block-site-logo img {
	display: block;
	width: 87px;
	height: 87px;
	object-fit: cover;
}

.cec-nav .wp-block-navigation__container {
	align-items: center;
}

.cec-nav .wp-block-navigation-item__content {
	display: block;
	line-height: 1;
}

.cec-nav .wp-block-navigation-item__label {
	display: block;
	line-height: 1;
}

.cec-nav .wp-block-navigation-item__description {
	display: block;
	margin-top: 2px;
	font-size: 14px;
	font-style: italic;
	line-height: 1.1;
}

/* Desktop nav spacing scales with the viewport (48px at 1440). */
.wp-block-navigation.cec-nav,
.wp-block-navigation.cec-nav .wp-block-navigation__container {
	gap: clamp(16px, 3.4vw, 48px);
}

/* Desktop nav: labels shrink fluidly (32px at 1440) so the row never wraps between 600px and 1440px. */
.wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation-item__label {
	font-size: clamp(19px, 2.6vw, 32px);
}

.cec-nav .cec-nav-faq .wp-block-navigation-item__label,
.wp-block-navigation__responsive-container:not(.is-menu-open) .cec-nav-faq .wp-block-navigation-item__label {
	font-size: clamp(16px, 1.4vw, 20px);
}

.cec-nav .wp-block-navigation-item__description {
	font-size: clamp(12px, 1vw, 14px);
}

.cec-nav .cec-nav-home {
	display: none;
}

/* Mobile overlay (the core Navigation block collapses under 600px). */
.wp-block-navigation__responsive-container-open {
	width: 38px;
	height: 14px;
	padding: 0;
	border: 2px solid currentColor;
	border-radius: 14px;
}

.wp-block-navigation__responsive-container-open svg {
	display: none;
}

.wp-block-navigation__responsive-container.is-menu-open {
	--navigation-layout-align: flex-start;
	--navigation-layout-justification-setting: flex-start;
	padding: 40px 20px;
	text-align: left;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	align-items: flex-start;
	padding-inline: 30px;
}

/* The nav is right-justified on desktop; in the overlay everything hugs the left edge. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	align-items: flex-start !important;
	justify-content: flex-start !important;
	text-align: left;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: flex-start;
	gap: 22px;
}

.wp-block-navigation__responsive-container.is-menu-open .cec-nav-home {
	display: block;
	order: 0;
}

.wp-block-navigation__responsive-container.is-menu-open .cec-nav-loja { order: 1; }
.wp-block-navigation__responsive-container.is-menu-open .cec-nav-sobre { order: 2; }
.wp-block-navigation__responsive-container.is-menu-open .cec-nav-produtos { order: 3; }
.wp-block-navigation__responsive-container.is-menu-open .cec-nav-colecoes { order: 4; }
.wp-block-navigation__responsive-container.is-menu-open .cec-nav-fale { order: 5; }
.wp-block-navigation__responsive-container.is-menu-open .cec-nav-faq { order: 6; margin-top: 40px; }

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__label {
	font-size: 24px;
}

/* ----------------------------------------------------------------- Footer */

.cec-footer {
	margin-block-start: 0;
}

.cec-footer .cec-footer__brand {
	text-transform: uppercase;
}

.cec-footer .cec-footer__c svg {
	display: block;
	width: 33px;
	height: 36px;
}

.cec-footer .wp-block-separator {
	margin-block: 20px 9px;
	border-color: currentColor;
	opacity: 1;
}

.cec-contact p {
	font-size: 14px;
	line-height: 1.2;
}

.cec-contact p:first-child {
	font-weight: 500;
}

.cec-contact p:first-child em {
	font-weight: 500;
}

.cec-contact p:last-child {
	font-weight: 400;
}

@media (max-width: 599px) {
	.cec-footer .cec-contact {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
	}
}

/* ------------------------------------------------------------ Page title */

.cec-page-title h1,
.cec-page-title p {
	margin: 0;
}

/* -------------------------------------------------- Grid of cards (Query) */

.wp-block-post-template.cec-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 25px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cec-grid > li {
	grid-column: span 3;
	margin: 0;
}

/* Large cards ("Tamanho na grade" = grande) only exist where the design uses them: the collections page,
   the products of a collection and the list grouped by collection. Flat lists (home selector, "todos
   produtos") are plain rows of equal cards, so a large card can never break a row there. */
.cec-grid.cec-sizes > li.cec-tamanho-grande,
.cec-grid.cec-query-colecao > li.cec-tamanho-grande,
.cec-grid.cec-query-agrupado > li.cec-tamanho-grande {
	grid-column: span 6;
}

@media (min-width: 782px) {
	.cec-grid > li {
		grid-column: span 2;
	}

	.cec-grid.cec-sizes > li.cec-tamanho-grande,
	.cec-grid.cec-query-colecao > li.cec-tamanho-grande,
	.cec-grid.cec-query-agrupado > li.cec-tamanho-grande {
		grid-column: span 3;
	}
}

/* Grouped lists: the first product of each collection starts a new row. */
.cec-grid > li.cec-group-start {
	grid-column: 1 / span 3;
}

.cec-grid > li.cec-group-start.cec-tamanho-grande {
	grid-column: 1 / span 6;
}

@media (min-width: 782px) {
	.cec-grid > li.cec-group-start {
		grid-column: 1 / span 2;
	}

	.cec-grid > li.cec-group-start.cec-tamanho-grande {
		grid-column: 1 / span 3;
	}
}

.cec-card .wp-block-post-featured-image {
	margin: 0;
	background: #f2f2f2;
}

.cec-card .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
}

.cec-card__meta {
	margin-top: 5px;
}

.cec-card__meta p {
	margin: 0;
	line-height: 1.2;
}

.cec-grid + .cec-load-more,
.cec-load-more {
	display: block;
	margin-top: 20px;
}

.cec-load-more .wp-block-query-pagination-next {
	display: block;
	margin: 0;
	padding: 20px 10px;
	border: 2px solid currentColor;
	font-size: 24px;
	font-weight: 400;
	text-align: center;
	text-decoration: none;
}

.cec-load-more .wp-block-query-pagination-next:hover {
	background: #000;
	color: #fff;
}

/* ------------------------------------------------------------ Home tabs */

.cec-tabs {
	max-width: 700px;
	margin-inline: auto;
	padding-block: 40px;
}

.cec-tab {
	width: 285px;
	max-width: 48%;
	margin: 0;
	padding: 6px 20px;
	border: 2px solid transparent;
	line-height: 1.2;
}

.cec-tab.is-active {
	border-color: currentColor;
}

.cec-tab a {
	display: block;
	text-decoration: none;
}

.cec-tab em {
	display: block;
	font-size: 14px;
}

.cec-tab:last-child {
	text-align: right;
}

.cec-js-tabs .cec-tab-panel {
	display: none;
}

.cec-js-tabs .cec-tab-panel.is-active {
	display: block;
}

/* ------------------------------------------------ Single: hero & content */

.cec-arch .wp-block-post-featured-image,
.cec-arch {
	margin: 0;
}

/* Double class = higher specificity than core's ".wp-block-image img { height: auto }". */
.cec-foto.cec-arch img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1400 / 742; /* Figma: the 751px arch is clipped to its 742px frame */
	object-fit: cover;
	border-radius: 1000px 1000px 0 0;
	background: #f2f2f2;
}

.cec-foto.cec-hero img {
	display: block;
	width: 100%;
	height: min(742px, 60vw);
	min-height: 320px;
	object-fit: cover;
}

.cec-colecao-title {
	text-transform: uppercase;
	line-height: 1;
}

.cec-single-head {
	text-align: center;
}

.cec-single-head p {
	margin: 0;
}

/* Label + value pairs (medidas, materiais, cores, valor, prazo...) */
.cec-info-row {
	justify-content: center;
	gap: 18px 100px;
}

.cec-info {
	width: 195px;
	max-width: 100%;
	font-size: 16px;
}

.cec-info p {
	margin: 0;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.2;
	white-space: pre-line;
}

.cec-info p:first-child {
	font-weight: 500;
}

.cec-info:has(.cec-info__value:empty) {
	display: none;
}

.cec-info a {
	text-decoration: underline;
}

.cec-desc-pt {
	font-weight: 300;
	white-space: pre-line; /* keeps paragraph breaks typed in the description field */
}

.cec-desc-en {
	font-style: italic;
	white-space: pre-line;
}

/* Gallery inside post content */
.entry-content .wp-block-gallery,
.wp-block-post-content .wp-block-gallery {
	gap: 20px;
}

/* 20px between photos of a page body: product and collection pages only (other pages set their own spacing). */
.single-produtos .wp-block-post-content > * + *,
.single-colecoes .wp-block-post-content > * + * {
	margin-block-start: 20px;
}

.wp-block-post-content figure {
	margin: 0;
}

@media (max-width: 781px) {
	.cec-info-row {
		flex-direction: column;
		align-items: center;
		gap: 14px;
	}
}

/* --------------------------------------------------------- Contact page */

.cec-contact-list p:first-child {
	font-size: 20px;
}

.cec-contact-list p:last-child {
	font-size: 40px;
}

@media (max-width: 781px) {
	.cec-contact-list p:last-child {
		font-size: 24px;
	}
}

/* Hero image of single pages (filled from the "Foto principal" field, see inc/bindings.php). */
.cec-foto {
	margin: 0;
}

.cec-foto img {
	display: block;
	width: 100%;
}

/* ------------------------------------------------------------ Accessibility */

a:focus-visible,
button:focus-visible,
.wp-block-navigation-item__content:focus-visible,
.wp-block-navigation__responsive-container-open:focus-visible,
.wp-block-navigation__responsive-container-close:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

.cec-tab a:focus-visible {
	outline-offset: -2px;
}

/* ---- Klavika weights from the Adobe Fonts kit ----------------------------------------------------
   The design uses Klavika Basic Light 300 / Regular 400 / Medium 500. The kit (crs5vwc) has Klavika Web
   400/700 and a Display cut 200/800, no Light or Medium. Closest match, tested against Figma:
     Light 300   -> klavika-web-display 200   (body, headings, nav: the default, set in theme.json)
     Regular 400 -> klavika-web 400           (rules below)
     Medium 500  -> klavika-web 700           (labels and bold names, rules below)
   If the real Klavika Basic files are uploaded to the Font Library, delete this whole block. */

/* Regular (400): anything that sets weight 400 in the design */
[style*="font-weight:400"],
.wp-element-button,
.wp-block-button__link,
.cec-tab,
.cec-load-more .wp-block-query-pagination-next,
.cec-info p,
.cec-medidas__valor,
.cec-contact p {
	font-family: var(--wp--preset--font-family--klavika-text);
	font-weight: 400;
}

/* Medium (500): labels and bold names, shown with the kit's Bold */
[style*="font-weight:500"],
.cec-info p:first-child,
.cec-medidas__nome,
.cec-contact p:first-child,
.cec-contact p:first-child em,
strong,
b {
	font-family: var(--wp--preset--font-family--klavika-text);
	font-weight: 700;
}

/* ============ Design pass: values measured from the approved Figma frames (1440px) ============ */

/* Klavika's "normal" line-height in Figma is 1.2 (20px -> 24, 24px -> 29, 40px -> 48). */
body { line-height: 1.2; }

/* Cards: rows sit 5px apart (caption + 5px), columns 25px; image 450x453.33 (3 across), 687.5x690 (2 across). */
.wp-block-post-template.cec-grid { gap: 5px 25px; }
.cec-card .wp-block-post-featured-image img { aspect-ratio: 450 / 453.33 !important; }
.cec-grid.cec-sizes > li.cec-tamanho-grande .wp-block-post-featured-image img,
.cec-grid.cec-query-colecao > li.cec-tamanho-grande .wp-block-post-featured-image img,
.cec-grid.cec-query-agrupado > li.cec-tamanho-grande .wp-block-post-featured-image img { aspect-ratio: 687.5 / 690 !important; }

/* Buttons: outlined = 20px padding inside a 2px stroke (69px tall); black "compre" = 10px inside the stroke. */
.wp-block-button .wp-block-button__link { padding: 18px 8px; }
.wp-block-button .wp-block-button__link.has-black-background-color { padding-block: 8px; }
.cec-load-more .wp-block-query-pagination-next { padding-block: 18px; }

/* Footer: line 20px above the row gap, info starts 18px under the line (footer = 189px tall). */
.cec-footer .wp-block-separator { margin-block: 20px 18px; }

/* A rule inside page content (about page contact strip): 20px block, line in the middle. */
.wp-block-post-content > .wp-block-separator { margin-block: 10px 18px; }
.wp-block-post-content > .wp-block-image { margin-block: 0; }

/* Page titles (produtos, coleções): 80px block, title 40px + subtitle 16px overlapping by 7px. */
.cec-page-title { height: 80px; }
.cec-page-title h1 { margin: 0; line-height: 1.2; }
.cec-page-title p { margin: -7px 0 0; line-height: 1.2; }

/* Home selector: 700px block, 285x52 boxes at x=22 and x=392 (85px apart), 40px above and below. */
.wp-block-group.cec-tabs {
	box-sizing: border-box;
	width: 700px;
	max-width: 100%;
	height: 142px;
	margin-inline: auto;
	padding: 40px 0 40px 22px;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 85px;
}

.cec-tab {
	box-sizing: border-box;
	width: 285px;
	max-width: none;
	height: 52px;
	margin: 6px 0 0;
	padding: 5px 25px 0 21px;
	border: 2px solid transparent;
}

.cec-tab.is-active { border-color: #000; }
.cec-tab:last-child { text-align: right; }

/* Collection page header: 26 | title block 138 (title 124 - 15 overlap + subtitle 29) | 26 | description | 26 | rule + measures | 29 */
.cec-col-head { padding-top: 26px; text-align: center; }
.cec-colecao-title {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	height: 124px;
	margin: 0 0 -15px;
	line-height: 1.2;
}
.cec-col-head .cec-subtitle { margin: 0; line-height: 1.2; }
.cec-col-desc { margin-top: 26px; }
.cec-col-desc p { margin: 0; }
.cec-col-desc .cec-desc-en { margin-top: 9px; }
.cec-col-data { margin-top: 26px; padding-block: 9.5px 29px; } /* 9.5px = half of the 20px rule block (padding, so the margin cannot collapse) */
.cec-col-data > .wp-block-separator { margin-block: 0 18.5px; }

/* Product page: 20 | title 64px (-8 overlap) + subtitle | 26 | info | 26 | buy button | 20 */
.cec-prod-head { padding-top: 20px; text-align: center; }
.cec-prod-title { margin: 0 0 -8px; line-height: 1.2; }
.cec-prod-head .cec-subtitle { margin: 0; line-height: 1.2; }
.cec-prod-info { margin-top: 26px; }
.cec-prod-info .cec-info-row + .cec-info-row { margin-top: 18px; }
.cec-prod-info > .wp-block-separator { margin-block: 19.5px; }
.cec-prod-info .cec-desc-pt,
.cec-prod-info .cec-desc-en { margin: 0; }
.cec-prod-info .cec-desc-en { margin-top: 9px; }
.cec-prod-buy { margin-top: 26px; padding-bottom: 20px; }

/* Gallery, style "Justificada" (products): photos share each row's height and fill 1340px, like the design. */
.wp-block-gallery.has-nested-images.is-style-cec-justified {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	max-width: 1340px;
	margin-inline: auto;
}

.wp-block-gallery.has-nested-images.is-style-cec-justified > figure.wp-block-image {
	flex: calc(var(--ar, 1.5) * 100) 1 calc(var(--ar, 1.5) * 500px);
	width: auto;
	margin: 0;
	aspect-ratio: var(--ar, 1.5);
}

.wp-block-gallery.has-nested-images.is-style-cec-justified > figure.wp-block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cec-col-rule { margin-block: 9.5px; }

/* Incomplete last row of small cards: the tail is widened to fill the row (cec-wide); a lone card is centred. */
@media (min-width: 782px) {
	.cec-grid > li.cec-orphan-1 {
		grid-column: 3 / span 2;
	}

	.cec-grid > li.cec-wide {
		grid-column: span 3;
	}
}

/* =====================================================================================================
   Mobile (up to 781px). Values come from the approved mobile frames, drawn on a 700px canvas with 20px
   gutters. --u is one Figma pixel: 1px from 700px up, shrinking with the screen below that, so every
   size in this block is written as "Figma pixels" (calc(48 * var(--u))) and keeps its proportions.
   Text has a floor so it stays readable on small phones.
   ===================================================================================================== */

@media (max-width: 781px) {
	:root {
		--u: min(1px, calc(100vw / 700));
	}

	/* ---- Header: 87px logo + pill menu button, 107px tall */
	.cec-header .wp-block-site-logo img {
		width: max(60px, calc(87 * var(--u))) !important;
		height: max(60px, calc(87 * var(--u))) !important;
	}

	.wp-block-navigation__responsive-container-open {
		box-sizing: border-box;
		width: max(72px, calc(108 * var(--u)));
		height: max(13px, calc(18 * var(--u)));
		border-width: max(3px, calc(5 * var(--u)));
		border-radius: 20px;
	}

	/* ---- Footer: brand + C, rule, three contacts side by side */
	.cec-footer .cec-footer__brand {
		font-size: max(14px, calc(20 * var(--u)));
	}

	.cec-footer .cec-contact {
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: flex-start;
		gap: 12px;
	}

	.cec-footer .cec-contact p {
		font-size: max(11px, calc(14 * var(--u)));
		overflow-wrap: anywhere;
	}

	/* ---- Cards: 3 small per row (206.67 x 247), 2 large per row (320 x 247), 20px between columns */
	.wp-block-post-template.cec-grid {
		gap: 10px 20px;
	}

	.cec-grid > li {
		grid-column: span 2;
	}

	.cec-grid.cec-sizes > li.cec-tamanho-grande,
	.cec-grid.cec-query-colecao > li.cec-tamanho-grande,
	.cec-grid.cec-query-agrupado > li.cec-tamanho-grande,
	.cec-grid > li.cec-wide {
		grid-column: span 3;
	}

	.cec-grid > li.cec-group-start {
		grid-column: 1 / span 2;
	}

	.cec-grid > li.cec-group-start.cec-tamanho-grande,
	.cec-grid > li.cec-group-start.cec-wide {
		grid-column: 1 / span 3;
	}

	.cec-grid > li.cec-orphan-1 {
		grid-column: 3 / span 2;
	}

	.cec-card .wp-block-post-featured-image img {
		aspect-ratio: 206.67 / 247 !important;
	}

	.cec-grid > li.cec-wide .wp-block-post-featured-image img,
	.cec-grid.cec-sizes > li.cec-tamanho-grande .wp-block-post-featured-image img,
	.cec-grid.cec-query-colecao > li.cec-tamanho-grande .wp-block-post-featured-image img {
		aspect-ratio: 320 / 247 !important;
	}

	.cec-grid.cec-query-agrupado > li.cec-tamanho-grande .wp-block-post-featured-image img {
		aspect-ratio: 1 !important;
	}

	.cec-card__meta {
		margin-top: 10px;
	}

	.cec-card .cec-card__meta p,
	.cec-card .cec-card__meta .wp-block-post-title {
		font-size: max(11px, calc(13 * var(--u))) !important;
	}

	/* Collection page: products sit 20px apart and the caption is 5px under the photo. */
	.wp-block-post-template.cec-grid.cec-query-colecao {
		row-gap: 20px;
	}

	.cec-query-colecao .cec-card__meta {
		margin-top: 5px;
	}

	/* Collections page: one 660 x 405 photo per row, 40px between them. */
	.wp-block-post-template.cec-grid.cec-sizes {
		grid-template-columns: minmax(0, 1fr);
		row-gap: calc(40 * var(--u));
	}

	.cec-grid.cec-sizes > li {
		grid-column: 1 !important;
	}

	.cec-grid.cec-sizes .wp-block-post-featured-image img {
		aspect-ratio: 660 / 405 !important;
	}

	.cec-grid.cec-sizes .cec-card .cec-card__meta p,
	.cec-grid.cec-sizes .cec-card .cec-card__meta .wp-block-post-title {
		font-size: max(15px, calc(20 * var(--u))) !important;
	}

	/* ---- Buttons: 88px tall, 24px text (outlined and black) */
	.wp-block-button .wp-block-button__link,
	.wp-block-button .wp-block-button__link.has-black-background-color,
	.cec-load-more .wp-block-query-pagination-next {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: max(56px, calc(88 * var(--u)));
		padding-block: 0;
		font-size: max(15px, calc(24 * var(--u)));
		text-align: center;
	}

	/* ---- Page titles (produtos, coleções): 80px block, 48px title with the subtitle tucked under it */
	.cec-page-title h1 {
		font-size: max(30px, calc(48 * var(--u))) !important;
	}

	.cec-page-title p {
		margin-top: calc(-5 * var(--u));
		font-size: max(12px, calc(16 * var(--u))) !important;
	}

	.wp-block-post-template.cec-grid.cec-sizes {
		margin-top: 14px;
	}

	.wp-block-post-template.cec-grid.cec-query-agrupado {
		margin-top: 4px;
	}

	/* ---- Home selector: 285 x 52 boxes scale with the screen */
	.wp-block-group.cec-tabs {
		height: auto;
		padding: calc(40 * var(--u)) 0 calc(40 * var(--u)) calc(22 * var(--u));
		gap: calc(85 * var(--u));
	}

	.cec-tab {
		width: calc(285 * var(--u));
		height: auto;
		min-height: max(40px, calc(52 * var(--u)));
		padding: 4px calc(21 * var(--u));
		font-size: max(14px, calc(20 * var(--u)));
	}

	.cec-tab em {
		font-size: max(11px, calc(14 * var(--u)));
	}

	/* ---- Pages: hero photos and text sizes */
	.wp-block-post-content > .wp-block-cover {
		min-height: 0 !important;
		aspect-ratio: 700 / 840 !important;
	}

	.home .wp-block-post-content > .wp-block-cover {
		aspect-ratio: 700 / 1180 !important;
	}

	.home .wp-block-post-content > .wp-block-cover .wp-block-cover__image-background {
		object-position: 18.6% 50%;
	}

	.page-slug-fale-conosco .wp-block-post-content > .wp-block-cover {
		aspect-ratio: 700 / 658 !important;
	}

	.wp-block-post-content p.has-4-xl-font-size {
		font-size: max(26px, calc(48 * var(--u))) !important;
	}

	.wp-block-post-content p.has-l-font-size {
		font-size: max(14px, calc(20 * var(--u))) !important;
	}

	.home .wp-block-post-content > .wp-block-group:not(.cec-tabs):not(.cec-tab-panel) {
		padding: calc(29 * var(--u)) 20px 10px !important;
	}

	.home .wp-block-post-content > .wp-block-group > p.has-4-xl-font-size {
		line-height: 0.9134 !important;
	}

	.home .wp-block-post-content > .wp-block-group:not(.cec-tabs) > p + p {
		margin-top: calc(26 * var(--u));
	}

	.cec-contact-list p:first-child {
		font-size: max(14px, calc(20 * var(--u))) !important;
	}

	.cec-contact-list p:last-child,
	.cec-contact-list p.has-3-xl-font-size {
		font-size: max(24px, calc(40 * var(--u))) !important;
	}

	.page-slug-fale-conosco .wp-block-post-content > .wp-block-group {
		padding-inline: calc(40 * var(--u)) !important;
	}

	/* ---- Single product: rounded photo inside the gutters (660 x 415), 64px title, three info columns */
	.cec-foto.cec-arch {
		margin-inline: 20px;
	}

	.cec-foto.cec-arch img {
		aspect-ratio: 660 / 415;
	}

	.cec-prod-title.has-5-xl-font-size {
		font-size: max(34px, calc(64 * var(--u))) !important;
	}

	.cec-prod-head .cec-subtitle {
		font-size: max(15px, calc(24 * var(--u))) !important;
	}

	.cec-prod-info .cec-info-row {
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: flex-start;
		justify-content: space-between;
		gap: 12px;
	}

	.cec-prod-info .cec-info {
		flex: 1 1 0;
		width: auto;
		min-width: 0;
	}

	.cec-prod-info .cec-info:first-child {
		flex: 0 0 23.3%;
	}

	.cec-prod-info .cec-info p {
		font-size: max(11px, calc(16 * var(--u)));
		overflow-wrap: anywhere;
	}

	/* Collection and product descriptions: 24px light + 16px italic */
	.cec-desc-pt.has-xl-font-size {
		font-size: max(16px, calc(24 * var(--u))) !important;
	}

	.cec-desc-en.has-m-font-size {
		font-size: max(12px, calc(16 * var(--u))) !important;
	}

	/* ---- Single collection: 700 x 840 photo, 120px name, measures in one wrapped row */
	.cec-foto.cec-hero img {
		height: auto;
		min-height: 0;
		aspect-ratio: 700 / 840;
	}

	.cec-colecao-title.has-6-xl-font-size {
		height: max(60px, calc(124 * var(--u)));
		margin-bottom: calc(-15 * var(--u));
		font-size: max(52px, calc(120 * var(--u))) !important;
	}

	.cec-col-head .cec-subtitle {
		font-size: max(14px, calc(24 * var(--u))) !important;
	}

	.cec-medidas {
		gap: 14px 20px;
		font-size: max(12px, calc(16 * var(--u)));
	}

	/* ---- Photo galleries: one photo per row, full width, 20px apart */
	.wp-block-gallery.has-nested-images.is-style-cec-justified {
		gap: 20px;
	}

	.wp-block-gallery.has-nested-images.is-style-cec-justified > figure.wp-block-image {
		flex: 0 0 100%;
		width: 100%;
	}

	.wp-block-post-content .wp-block-gallery {
		gap: 20px;
	}
}

/* Mobile menu from 600 to 781px too: the design uses the pill button on the whole 700px frame. */
@media (min-width: 600px) and (max-width: 781px) {
	.wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none !important;
	}

	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
	}
}

/* Overlay menu (Figma "overlay menu"): white screen, one 240px column centred, 48px labels with 24px italic
   translations, close X at the column's top right, f.a.q. set apart at the bottom. */
@media (max-width: 781px) {
	.wp-block-navigation__responsive-container.is-menu-open {
		padding: 0;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		max-width: none;
		min-height: 100%;
		margin: 0;
		padding: 20px;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
		position: relative;
		width: max-content;
		max-width: 100%;
		margin: 0;
		padding-top: calc(78 * var(--u));
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		position: absolute;
		top: calc(12 * var(--u));
		right: 0;
		width: 28px;
		height: 28px;
		padding: 2px;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		padding: 0;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
		gap: calc(30 * var(--u));
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__label {
		font-size: max(30px, calc(48 * var(--u)));
		line-height: 1.2;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__description {
		margin-top: calc(-6 * var(--u));
		font-size: max(16px, calc(24 * var(--u)));
		line-height: 1.2;
	}

	.wp-block-navigation__responsive-container.is-menu-open .cec-nav-faq {
		margin-top: calc(103 * var(--u));
	}

	.wp-block-navigation__responsive-container.is-menu-open .cec-nav-faq .wp-block-navigation-item__label {
		font-size: max(16px, calc(24 * var(--u)));
	}
}

/* ------------------------------------------------------------ F.A.Q. (accordion)
   Core Details blocks: question in light 24px with the English in small italics, "+" / "−" on the right,
   black rules like the rest of the site. */
.cec-faq {
	margin-top: 10px;
	border-bottom: 2px solid #000;
}

.cec-faq .wp-block-details {
	margin: 0;
	border-top: 2px solid #000;
}

.cec-faq .wp-block-details summary {
	position: relative;
	display: block;
	padding: 20px 50px 20px 0;
	font-size: 24px;
	font-weight: 300;
	line-height: 1.2;
	cursor: pointer;
	list-style: none;
}

.cec-faq .wp-block-details summary::-webkit-details-marker {
	display: none;
}

.cec-faq .wp-block-details summary em {
	display: block;
	margin-top: 2px;
	font-size: 16px;
	font-weight: 300;
}

.cec-faq .wp-block-details summary::after {
	content: "+";
	position: absolute;
	top: 18px;
	right: 4px;
	font-size: 36px;
	font-weight: 300;
	line-height: 1;
}

.cec-faq .wp-block-details[open] summary::after {
	content: "\2212";
}

.cec-faq .wp-block-details summary:hover {
	text-decoration: underline;
	text-underline-offset: 4px;
}

.cec-faq .wp-block-details > p {
	max-width: 900px;
	margin: 0 0 20px;
	font-size: 20px;
}

.cec-faq .wp-block-details > p.cec-desc-en {
	margin-top: -8px;
	font-size: 16px;
}

.cec-faq .wp-block-details > p:last-child {
	margin-bottom: 26px;
}

@media (max-width: 781px) {
	.cec-faq .wp-block-details summary {
		padding-block: 16px;
		font-size: max(17px, calc(24 * var(--u)));
	}

	.cec-faq .wp-block-details summary em {
		font-size: max(12px, calc(16 * var(--u)));
	}

	.cec-faq .wp-block-details > p {
		font-size: max(15px, calc(20 * var(--u)));
	}

	.cec-faq .wp-block-details > p.cec-desc-en {
		font-size: max(12px, calc(16 * var(--u)));
	}
}

/* ------------------------------------------------- Search form, search results and 404 */
.cec-search-term {
	margin: 0 0 20px;
	text-align: center;
	font-weight: 300;
}

.cec-search-box {
	display: flex;
	justify-content: center;
	margin-block: 20px 40px;
}

.cec-search {
	width: 100%;
	max-width: 700px;
}

.cec-search .wp-block-search__inside-wrapper {
	gap: 10px;
}

.cec-search .wp-block-search__input {
	min-width: 0;
	height: 52px;
	padding: 0 20px;
	border: 2px solid #000;
	border-radius: 0;
	background: #fff;
	color: #000;
	font-family: var(--wp--preset--font-family--klavika-text);
	font-size: 20px;
}

.cec-search .wp-block-search__input:focus-visible {
	outline: 2px solid #000;
	outline-offset: 3px;
}

.cec-search .wp-block-search__button {
	height: 52px;
	margin: 0;
	padding: 0 24px;
	border: 2px solid #000;
	border-radius: 0;
	background: #000;
	color: #fff;
	font-family: var(--wp--preset--font-family--klavika-text);
	font-size: 20px;
	font-weight: 400;
	cursor: pointer;
}

.cec-search .wp-block-search__button:hover {
	background: #fff;
	color: #000;
}

.error404 .wp-block-buttons,
.search-no-results .wp-block-buttons {
	flex-direction: column;
	gap: 20px;
	margin-top: 20px;
}

.error404 .wp-block-buttons .wp-block-button,
.search-no-results .wp-block-buttons .wp-block-button {
	width: 100%;
}

@media (max-width: 781px) {
	.cec-search .wp-block-search__input,
	.cec-search .wp-block-search__button {
		height: 46px;
		font-size: max(15px, calc(20 * var(--u)));
	}
}

.error404 main > p,
.search-no-results .wp-block-query-no-results > p {
	margin: 0 0 6px;
}

.error404 main > .cec-page-title {
	margin-bottom: 20px;
}
