/*
 * Homepage (and blog listing cards)
 * Figma: Home (1793:3841). Spec: openspec/changes/home-page.
 * Sections are built in UX Builder; styles target the bb-home-* classes on sections/cols.
 * Tokens only.
 */

/* ---------- Sections ---------- */
/* Flatsome writes section padding in an inline #section_x rule, so !important is needed here. */
section.bb-home-section {
	padding-top: var(--bb-space-2xl) !important;
	padding-bottom: var(--bb-space-2xl) !important;
}

@media (min-width: 850px) {
	section.bb-home-section {
		padding-top: var(--bb-space-3xl) !important;
		padding-bottom: var(--bb-space-3xl) !important;
	}
}

section.bb-home-hero {
	padding-top: var(--bb-space-xl) !important;
}

.bb-home-editorial,
.bb-home-guide {
	background: var(--bb-color-bg-canvas);
}

.bb-home-eyebrow {
	margin: 0 0 var(--bb-space-sm);
	color: var(--bb-color-text-support);
	font-size: 12px;
	font-weight: var(--bb-font-weight-bold);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* ---------- Section heads: title + "Ver todos" + lead ---------- */
.bb-home-head .col {
	padding-bottom: var(--bb-space-lg);
}

.bb-home-head .section-title-container {
	margin-bottom: var(--bb-space-xs);
	padding: 0;
}

.bb-home-head .section-title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--bb-space-lg);
	margin: 0;
	border: 0;
	color: var(--bb-color-text-primary);
	font-size: var(--bb-h3-size);
	line-height: var(--bb-h3-line);
	letter-spacing: var(--bb-h3-tracking);
	text-transform: none;
}

.bb-home-head .section-title b {
	display: none;
}

.bb-home-head .section-title-main {
	padding: 0;
	border: 0;
	text-transform: none;
}

.bb-home-head .section-title a {
	margin-left: auto;
	color: var(--bb-color-text-link);
	font-size: var(--bb-body-sm-size);
	font-weight: var(--bb-font-weight-bold);
	letter-spacing: 0;
	white-space: nowrap;
}

.bb-home-head .section-title a:hover {
	color: var(--bb-color-action-primary-hover);
}

/* The link text already has an arrow */
.bb-home-head .section-title a .icon-angle-right {
	display: none;
}

/* Figma: these heads are uppercase, with the link as an outline button */
.bb-home-selector .bb-home-head .section-title-main,
.bb-home-blog .bb-home-head .section-title-main {
	text-transform: uppercase;
}

.bb-home-selector .section-title a {
	padding: var(--bb-space-sm) var(--bb-space-lg);
	border: 1px solid var(--bb-color-border-strong);
	border-radius: var(--bb-radius-md);
	color: var(--bb-color-text-primary);
}

.bb-home-lead p {
	margin: 0;
	color: var(--bb-color-text-secondary);
	font-size: var(--bb-body-sm-size);
}

/* ---------- Hero ---------- */
.bb-home-hero .img-inner,
.bb-home-hero .flickity-viewport {
	border-radius: var(--bb-radius-xl);
	overflow: hidden;
}

.bb-home-hero .flickity-page-dots {
	bottom: var(--bb-space-lg);
}

/* ---------- Explora por Categoria: bubbles ---------- */
.bb-home-bubble .img {
	max-width: 152px;
	margin: 0 auto var(--bb-space-md);
}

.bb-home-bubble .img-inner {
	aspect-ratio: 1;
	border: 1px solid var(--bb-color-border-default);
	border-radius: var(--bb-radius-full);
	background: var(--bb-color-bg-canvas);
	overflow: hidden;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.bb-home-bubble .img-inner img {
	width: 100%;
	height: 100%;
	padding: 14%;
	object-fit: contain;
}

.bb-home-bubble .img:hover .img-inner,
.bb-home-bubble .img a:focus-visible .img-inner {
	border-color: var(--bb-color-border-support);
	box-shadow: 0 0 0 3px var(--bb-color-bg-support-muted);
}

.bb-home-bubble .text p {
	margin: 0;
	font-size: var(--bb-body-sm-size);
	font-weight: var(--bb-font-weight-bold);
}

.bb-home-bubble .text a {
	color: var(--bb-color-text-primary);
}

.bb-home-bubble .text a:hover {
	color: var(--bb-color-text-link);
}

/* ---------- Escolhe o teu Portátil / Computador: promo block ---------- */
.bb-home-promo .banner {
	border-radius: var(--bb-radius-xl);
	overflow: hidden;
}

.bb-home-promo .text-box h3 {
	margin-bottom: var(--bb-space-xs);
	color: var(--bb-color-text-inverse);
	font-size: 20px;
	line-height: 24px;
	text-transform: uppercase;
}

.bb-home-promo .text-box p {
	margin-bottom: var(--bb-space-md);
	font-size: var(--bb-body-sm-size);
	line-height: var(--bb-body-sm-line);
}

.bb-home-promo .text-box .button {
	margin: 0;
	font-size: 13px;
	letter-spacing: 0;
	text-transform: none;
}

/* ---------- Banner editorial ---------- */
.bb-home-editorial__text h2 {
	margin-bottom: var(--bb-space-md);
	color: var(--bb-color-text-primary);
	font-size: var(--bb-h3-size);
	line-height: var(--bb-h3-line);
}

.bb-home-editorial__text p:last-child {
	color: var(--bb-color-text-secondary);
	font-size: var(--bb-body-sm-size);
}

.bb-home-editorial__media .banner {
	border-radius: var(--bb-radius-xl);
	overflow: hidden;
}

/* ---------- Blog cards (homepage section and blog listing) ---------- */
.bb-home-blog .post-item .box,
body.blog .post-item .box {
	height: 100%;
	background: var(--bb-color-bg-canvas);
	border: 1px solid var(--bb-color-border-default);
	border-radius: var(--bb-radius-xl);
	overflow: hidden;
	transition: box-shadow 0.2s ease;
}

.bb-home-blog .post-item .box:hover,
body.blog .post-item .box:hover {
	box-shadow: var(--bb-shadow-card);
}

.bb-home-blog .post-item .box-text,
body.blog .post-item .box-text {
	padding: var(--bb-space-lg);
}

.bb-home-blog .post-item .post-title,
body.blog .post-item .post-title {
	margin: 0;
	color: var(--bb-color-text-primary);
	font-size: 15px;
	line-height: 20px;
	font-weight: var(--bb-font-weight-bold);
}

.bb-home-blog .post-item .is-divider,
body.blog .post-item .is-divider {
	display: none;
}

/* ---------- Guia de escolha ---------- */
.bb-home-guide__lead > .col-inner {
	height: 100%;
	padding: var(--bb-space-2xl);
	border-radius: 20px;
	background: var(--bb-color-bg-brand);
	color: var(--bb-color-text-inverse);
}

.bb-home-guide__lead .bb-home-eyebrow {
	color: var(--bb-brand-200);
}

.bb-home-guide__lead h2 {
	margin-bottom: var(--bb-space-md);
	color: var(--bb-color-text-inverse);
	font-size: var(--bb-h3-size);
	line-height: var(--bb-h3-line);
}

.bb-home-guide__lead p {
	color: var(--bb-brand-100);
	font-size: var(--bb-body-sm-size);
}

.bb-home-guide__lead .button {
	margin: var(--bb-space-sm) 0 0;
	color: var(--bb-color-action-primary);
	letter-spacing: 0;
	text-transform: none;
}

.bb-home-guide__card > .col-inner {
	position: relative;
	height: 100%;
	padding: var(--bb-space-xl);
	border: 1px solid var(--bb-color-border-default);
	border-radius: var(--bb-radius-xl);
	background: var(--bb-color-bg-canvas);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.bb-home-guide__card > .col-inner:hover {
	border-color: var(--bb-color-border-support);
	box-shadow: var(--bb-shadow-card);
}

.bb-home-guide__num {
	display: block;
	margin-bottom: var(--bb-space-lg);
	color: var(--bb-color-text-support);
	font-size: 13px;
	font-weight: var(--bb-font-weight-bold);
}

.bb-home-guide__card h3 {
	margin-bottom: var(--bb-space-sm);
	font-size: 18px;
	line-height: 24px;
}

.bb-home-guide__card p {
	margin: 0;
	color: var(--bb-color-text-secondary);
	font-size: var(--bb-body-sm-size);
}

/* Whole card is the link */
.bb-home-guide__link {
	color: var(--bb-color-text-primary);
}

.bb-home-guide__link::after {
	content: "";
	position: absolute;
	inset: 0;
}

.bb-home-guide__link:focus-visible {
	outline: none;
}

.bb-home-guide__link:focus-visible::after {
	outline: 2px solid var(--bb-color-focus-ring);
	outline-offset: -2px;
	border-radius: var(--bb-radius-xl);
}

/* ---------- Mobile ---------- */
@media (max-width: 849px) {
	.bb-home-guide__lead {
		margin-bottom: var(--bb-space-lg);
	}
}

@media (max-width: 549px) {
	.bb-home-head .section-title {
		font-size: 22px;
		line-height: 28px;
	}

	.bb-home-bubble .img {
		max-width: 96px;
	}

	.bb-home-guide__lead > .col-inner {
		padding: var(--bb-space-xl);
	}
}

@media (prefers-reduced-motion: reduce) {
	.bb-home-bubble .img-inner,
	.bb-home-guide__card > .col-inner,
	.bb-home-blog .post-item .box {
		transition: none;
	}
}

/* ---------- Blog listing header (/blog/) ---------- */
.bb-blog-header {
	padding-top: var(--bb-space-2xl);
}

.bb-blog-header__title {
	margin-bottom: var(--bb-space-xs);
	color: var(--bb-color-text-primary);
	font-size: var(--bb-h2-size);
	line-height: var(--bb-h2-line);
	letter-spacing: var(--bb-h2-tracking);
	text-transform: uppercase;
}

.bb-blog-header__lead {
	margin: 0;
	color: var(--bb-color-text-secondary);
	font-size: var(--bb-body-sm-size);
}

@media (max-width: 549px) {
	.bb-blog-header__title {
		font-size: var(--bb-h3-size);
		line-height: var(--bb-h3-line);
	}
}


/* =====================================================================
 * Tiago's home revision (2026-10), moved from page 21 and Additional CSS
 * (openspec: home-tiago-merge). Loaded after the rules above on purpose:
 * where both set the same property, these values are the current design.
 * ===================================================================== */

/* ---------- Hero, first banner ("reference") ---------- */
/* Primeiro banner apenas. Imagem, textos, botões e alturas continuam no UX Builder. */
.gf-bb-hero-reference .banner-layers { max-width: none; width: 100%; }
.gf-bb-hero-reference .banner-bg .overlay {
  background-image: linear-gradient(90deg, rgba(3,12,10,.97) 0%, rgba(3,12,10,.91) 30%, rgba(3,12,10,.55) 54%, rgba(3,12,10,.06) 78%);
}
.gf-bb-hero-reference .gf-bb-hero-reference-content .text-inner { padding: 0; }
.gf-bb-hero-reference .gf-bb-hero-reference-eyebrow { margin-bottom: 18px; }
.gf-bb-hero-reference .gf-bb-hero-reference-eyebrow p {
  display: flex; align-items: center; gap: 12px; margin: 0; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
}
.gf-bb-hero-reference .gf-bb-hero-reference-eyebrow p::before { content: ""; width: 28px; height: 1px; background: currentColor; flex: 0 0 28px; }
.gf-bb-hero-reference .gf-bb-hero-reference-title { margin-bottom: 18px; }
.gf-bb-hero-reference .gf-bb-hero-reference-title h1 { font-size: inherit; line-height: inherit; margin: 0; letter-spacing: -.015em; }
.gf-bb-hero-reference .gf-bb-hero-reference-description { max-width: 580px; margin-bottom: 26px; }
.gf-bb-hero-reference .gf-bb-hero-reference-description p { margin: 0; }
.gf-bb-hero-reference .gf-bb-hero-reference-primary,
.gf-bb-hero-reference .gf-bb-hero-reference-secondary {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px;
  min-width: 180px; margin: 0 14px 0 0; font-size: 16px; font-weight: 700; line-height: 1.25; letter-spacing: 0; text-transform: none;
  border-radius: 6px !important; white-space: nowrap;
}
.gf-bb-hero-reference .gf-bb-hero-reference-primary { background: var(--primary-color, #028543); border-color: var(--primary-color, #028543); color: #fff; }
.gf-bb-hero-reference .gf-bb-hero-reference-primary i { margin: 0; font-size: 20px; }
.gf-bb-hero-reference .gf-bb-hero-reference-secondary { background: transparent; border: 1px solid rgba(255,255,255,.7); color: #fff; margin-right: 0; }
.gf-bb-hero-reference .gf-bb-hero-reference-primary:hover { background: #01713a; border-color: #01713a; color: #fff; }
.gf-bb-hero-reference .gf-bb-hero-reference-secondary:hover { background: rgba(255,255,255,.12); border-color: #fff; color: #fff; }
.gf-bb-hero-reference a:focus-visible { outline: 2px solid #43e6aa; outline-offset: 4px; }
.gf-bb-hero-reference .gf-bb-hero-reference-trust { max-width: 590px; margin-top: 34px; }
.gf-bb-hero-reference .gf-bb-hero-reference-trust ul { display: flex; align-items: center; margin: 0; padding: 0; list-style: none; }
.gf-bb-hero-reference .gf-bb-hero-reference-trust li { display: flex; align-items: center; gap: 12px; flex: 1 1 0; margin: 0; padding: 0 20px; }
.gf-bb-hero-reference .gf-bb-hero-reference-trust li:first-child { padding-left: 0; }
.gf-bb-hero-reference .gf-bb-hero-reference-trust li:last-child { padding-right: 0; }
.gf-bb-hero-reference .gf-bb-hero-reference-trust li + li { border-left: 1px solid rgba(67,230,170,.24); }
.gf-bb-hero-reference .gf-bb-hero-reference-trust a { display: flex; align-items: center; gap: 12px; color: #fff; }
.gf-bb-hero-reference .gf-bb-hero-reference-trust a:hover { color: #43e6aa; }
.gf-bb-hero-reference .gf-bb-hero-reference-icon { display: block; width: 30px; height: 30px; flex: 0 0 30px; background-color: #43e6aa; -webkit-mask: var(--gf-bb-hero-icon) center / contain no-repeat; mask: var(--gf-bb-hero-icon) center / contain no-repeat; }
.gf-bb-hero-reference .gf-bb-hero-reference-icon-guarantee { --gf-bb-hero-icon: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciDQoJIHZpZXdCb3g9IjAgMCAyNCAyNCI+DQo8Zz4NCgk8cGF0aCBmaWxsPSJjdXJyZW50Q29sb3IiIGQ9Ik0yLDIyaDV2LTJINFY3aDVWMmg4djE4aC0zLjAwMnYySDE5VjBINi41ODZMMiw0LjU4NlYyMnogTTcsMi40MTRWNUg0LjQxNEw3LDIuNDE0eiIvPg0KCTxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZD0iTTEwLjUsMjEuNUwxMywyNHYtNC43NjJjMS4yMDUtMC44MDksMi0yLjE4MiwyLTMuNzM4YzAtMi40ODEtMi4wMTktNC41LTQuNS00LjVTNiwxMy4wMTksNiwxNS41DQoJCWMwLDEuNTU3LDAuNzk1LDIuOTMsMiwzLjczOFYyNEwxMC41LDIxLjV6IE0xMC41LDEzYzEuMzc5LDAsMi41LDEuMTIxLDIuNSwyLjVTMTEuODc5LDE4LDEwLjUsMThTOCwxNi44NzksOCwxNS41DQoJCVM5LjEyMSwxMywxMC41LDEzeiIvPg0KPC9nPg0KPC9zdmc+"); }
.gf-bb-hero-reference .gf-bb-hero-reference-icon-quality { --gf-bb-hero-icon: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciDQoJIHZpZXdCb3g9IjAgMCAyNCAyNCI+DQo8Zz4NCgk8cG9seWdvbiBmaWxsPSJjdXJyZW50Q29sb3IiIHBvaW50cz0iOSwxNC41ODYgNi43MDcsMTIuMjkzIDUuMjkzLDEzLjcwNyA5LDE3LjQxNCAxOC43MDcsNy43MDcgMTcuMjkzLDYuMjkzIAkiLz4NCgk8cGF0aCBmaWxsPSJjdXJyZW50Q29sb3IiIGQ9Ik0xMiwwQzUuMzgzLDAsMCw1LjM4MywwLDEyczUuMzgzLDEyLDEyLDEyczEyLTUuMzgzLDEyLTEyUzE4LjYxNywwLDEyLDB6IE0xMiwyMkM2LjQ4NiwyMiwyLDE3LjUxNSwyLDEyDQoJCUMyLDYuNDg2LDYuNDg2LDIsMTIsMnMxMCw0LjQ4NiwxMCwxMEMyMiwxNy41MTUsMTcuNTE0LDIyLDEyLDIyeiIvPg0KPC9nPg0KPC9zdmc+"); }
.gf-bb-hero-reference .gf-bb-hero-reference-icon-return { --gf-bb-hero-icon: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciDQoJIHZpZXdCb3g9IjAgMCAyNCAyNCI+DQo8cGF0aCBmaWxsPSJjdXJyZW50Q29sb3IiIGQ9Ik0xMiwyM2M1LjUxNCwwLDEwLTQuNDg1LDEwLTEwYzAtNS4wNjYtMy43OTEtOS4yNTUtOC42ODMtOS45MDNsMS4zOS0xLjM5MWwtMS40MTQtMS40MTRMOS41ODYsNA0KCWwzLjcwNywzLjcwN2wxLjQxNC0xLjQxNGwtMS4xMzYtMS4xMzZDMTcuMjMyLDUuODg5LDIwLDkuMTI2LDIwLDEzYzAsNC40MTEtMy41ODksOC04LDhzLTgtMy41ODktOC04SDJDMiwxOC41MTUsNi40ODYsMjMsMTIsMjN6Ig0KCS8+DQo8L3N2Zz4="); }
@media (min-width: 550px) and (max-width: 849.98px) {
  .gf-bb-hero-reference .gf-bb-hero-reference-content { width: 74%; }
  .gf-bb-hero-reference .banner-bg .overlay { background-image: linear-gradient(90deg, rgba(3,12,10,.97), rgba(3,12,10,.86) 50%, rgba(3,12,10,.36)); }
  .gf-bb-hero-reference .gf-bb-hero-reference-description { margin-bottom: 22px; }
  .gf-bb-hero-reference .gf-bb-hero-reference-trust { margin-top: 28px; }
  .gf-bb-hero-reference .gf-bb-hero-reference-trust li { padding: 0 12px; gap: 8px; }
  .gf-bb-hero-reference .gf-bb-hero-reference-trust a { gap: 8px; }
  .gf-bb-hero-reference .gf-bb-hero-reference-primary,
  .gf-bb-hero-reference .gf-bb-hero-reference-secondary { min-width: 160px; }
}
@media (min-width: 550px) and (max-width: 699.98px) {
  .gf-bb-hero-reference .gf-bb-hero-reference-trust li,
  .gf-bb-hero-reference .gf-bb-hero-reference-trust a { flex-direction: column; gap: 7px; text-align: center; }
  .gf-bb-hero-reference .gf-bb-hero-reference-trust li { padding: 0 8px; }
  .gf-bb-hero-reference .gf-bb-hero-reference-trust { font-size: 12px; }
}
@media (max-width: 549.98px) {
  .gf-bb-hero-reference .banner-bg .overlay { background-image: linear-gradient(180deg, rgba(3,12,10,.89), rgba(3,12,10,.84) 65%, rgba(3,12,10,.94)); }
  .gf-bb-hero-reference .gf-bb-hero-reference-eyebrow { margin-bottom: 14px; }
  .gf-bb-hero-reference .gf-bb-hero-reference-eyebrow p { gap: 8px; letter-spacing: .055em; }
  .gf-bb-hero-reference .gf-bb-hero-reference-eyebrow p::before { width: 20px; flex-basis: 20px; }
  .gf-bb-hero-reference .gf-bb-hero-reference-title { margin-bottom: 16px; }
  .gf-bb-hero-reference .gf-bb-hero-reference-description { margin-bottom: 20px; }
  .gf-bb-hero-reference .gf-bb-hero-reference-primary,
  .gf-bb-hero-reference .gf-bb-hero-reference-secondary { display: flex; width: 100%; min-width: 0; min-height: 44px; margin: 0 0 10px; font-size: 15px; }
  .gf-bb-hero-reference .gf-bb-hero-reference-trust { margin-top: 20px; }
  .gf-bb-hero-reference .gf-bb-hero-reference-trust ul { align-items: stretch; }
  .gf-bb-hero-reference .gf-bb-hero-reference-trust li { flex-direction: column; justify-content: flex-start; gap: 7px; padding: 0 8px; text-align: center; }
  .gf-bb-hero-reference .gf-bb-hero-reference-trust a { flex-direction: column; gap: 7px; }
  .gf-bb-hero-reference .gf-bb-hero-reference-icon { width: 24px; height: 24px; flex-basis: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .gf-bb-hero-reference .gf-bb-hero-reference-primary,
  .gf-bb-hero-reference .gf-bb-hero-reference-secondary { transition: none; }
}

/* ---------- Hero slider dots: white pills with a larger touch area ---------- */
/* Indicadores do slider do hero. A navegação continua nativa do UX Builder. */
.gf-bb-hero-slider .flickity-page-dots .dot {
  position: relative;
  pointer-events: auto;
  width: 32px;
  height: 8px;
  margin: 0 4px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #fff;
  opacity: .45;
  vertical-align: middle;
  transition: opacity .2s ease;
}
/* A área de toque é maior do que a pill visível. */
.gf-bb-hero-slider .flickity-page-dots .dot::after {
  content: "";
  position: absolute;
  inset: -12px 0;
}
.gf-bb-hero-slider .flickity-page-dots .dot:hover {
  opacity: .75;
}
.gf-bb-hero-slider .flickity-page-dots .dot.is-selected {
  background: #fff;
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .gf-bb-hero-slider .flickity-page-dots .dot { transition: none; }
}

/* ---------- Sections, category bubbles, SEO article, selling points ---------- */
body.home.page .gf-bb-home-heading-row > .col { padding-bottom:12px; }
body.home.page .gf-bb-home-heading h1 { margin:0;font-size:18px;line-height:26px;font-weight:700;letter-spacing:0;text-transform:none; }
body.home.page .gf-bb-home-hero { padding-bottom:16px!important; }
body.home.page .gf-bb-home-categories { padding-top:16px!important; }
body.home.page .gf-bb-home-category-track {
 --gf-bb-bubble-size:104px;--gf-bb-bubble-cell:132px;--gf-bb-bubble-gap:24px;
 display:flex;flex-wrap:nowrap;justify-content:flex-start!important;gap:var(--gf-bb-bubble-gap);
 max-width:1200px;width:calc(100% - 30px);margin-inline:auto;padding:4px 2px 12px;
 overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x proximity;
 scrollbar-width:thin;scrollbar-color:#c6ced3 transparent;
}
body.home.page .gf-bb-home-category-track > .bb-home-bubble {
 flex:0 0 var(--gf-bb-bubble-cell);width:var(--gf-bb-bubble-cell);max-width:none;padding:0;scroll-snap-align:start;
}
body.home.page .gf-bb-home-category-track .img { width:var(--gf-bb-bubble-size);max-width:var(--gf-bb-bubble-size);margin:0 auto 10px; }
body.home.page .gf-bb-home-category-track .text { padding:0; }
body.home.page .gf-bb-home-category-track .text p { font-size:14px;line-height:20px; }
body.home.page .gf-bb-home-category-track a:focus-visible { outline:2px solid var(--bb-color-focus-ring,#029046);outline-offset:2px; }
body.home.page .gf-bb-home-seo-bottom { padding:28px 0 36px!important;background:var(--bb-color-bg-subtle,#f7f8f9); }
body.home.page .gf-bb-home-seo-bottom .col { padding-bottom:0; }
body.home.page .gf-bb-home-seo-article :is(h2,h3) { margin:0 0 8px;color:var(--bb-color-text-primary,#1e2327);font-weight:700;letter-spacing:0;text-transform:none; }
body.home.page .gf-bb-home-seo-article h2 { font-size:18px;line-height:26px; }
body.home.page .gf-bb-home-seo-article h3 { margin-top:20px;font-size:16px;line-height:24px; }
body.home.page .gf-bb-home-seo-article p { margin:0 0 12px;color:var(--bb-color-text-secondary,#66717c);font-size:14px;line-height:1.75; }
body.home.page .gf-bb-home-seo-article p:last-child { margin-bottom:0; }
body.home.page .gf-bb-home-seo-article a { color:var(--bb-brand-900,#01713a);text-decoration:underline;text-underline-offset:3px; }
body.home.page .gf-bb-home-selling-points { padding:32px 0!important;background:var(--bb-color-bg-muted,#f1f3f5); }
body.home.page .gf-bb-home-selling-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;max-width:1000px;width:calc(100% - 30px);margin:0 auto; }
body.home.page .gf-bb-home-selling-grid > .col { min-width:0;width:auto;max-width:none;padding:0; }
body.home.page .gf-bb-home-selling-card > .col-inner { height:100%;padding:22px 20px;background:var(--bb-color-bg-canvas,#fff);border-radius:10px; }
body.home.page .gf-bb-selling-icon { display:flex;align-items:center;justify-content:center;width:34px;height:34px;margin:0 0 14px;border:1px solid var(--bb-color-border-default,#e3e7ea);border-radius:50%;color:var(--bb-color-icon-support,#029046); }
body.home.page .gf-bb-selling-icon svg { display:block;width:20px;height:20px; }
body.home.page .gf-bb-home-selling-card h3 { margin:0 0 7px;color:var(--bb-brand-900,#01713a);font-size:15px;line-height:20px;font-weight:700;letter-spacing:0;text-transform:none; }
body.home.page .gf-bb-home-selling-card p { margin:0;color:var(--bb-color-text-secondary,#66717c);font-size:13px;line-height:19px; }
body.home.page .gf-bb-home-accessible-title { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
body.home.page :is(.gf-bb-home-seo-bottom,.gf-bb-home-selling-points) a:focus-visible { outline:2px solid var(--bb-color-focus-ring,#029046);outline-offset:3px; }
@media(min-width:550px) {
 body.home.page .gf-bb-home-hero > .section-content > .bb-home-hero__row > .col { padding-bottom:0; }
}
@media(max-width:849px) {
 body.home.page .gf-bb-home-seo-bottom { padding:24px 0 28px!important; }
 body.home.page .gf-bb-home-selling-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 body.home.page .gf-bb-home-selling-points { padding:24px 0!important; }
}
@media(min-width:550px) and (max-width:849px) {
 body.home.page .gf-bb-home-category-track { --gf-bb-bubble-size:92px;--gf-bb-bubble-cell:116px;--gf-bb-bubble-gap:20px; }
}
@media(max-width:549px) {
 body.home.page .gf-bb-home-heading h1 { font-size:16px;line-height:23px; }
 body.home.page .gf-bb-home-hero > .section-content > .bb-home-hero__row > .col:last-child { padding-bottom:0; }
 body.home.page .gf-bb-home-category-track { --gf-bb-bubble-size:80px;--gf-bb-bubble-cell:104px;--gf-bb-bubble-gap:16px; }
 body.home.page .gf-bb-home-seo-bottom { padding:20px 0 24px!important; }
 body.home.page .gf-bb-home-seo-article h2 { font-size:17px;line-height:25px; }
 body.home.page .gf-bb-home-selling-grid { gap:12px; }
 body.home.page .gf-bb-home-selling-card > .col-inner { padding:18px 14px; }
 body.home.page .gf-bb-home-selling-card h3 { font-size:14px;line-height:20px; }
}
@media(max-width:359px) {
 body.home.page .gf-bb-home-selling-grid { grid-template-columns:1fr; }
}

/* ---------- Tiago 2026-10-25 (was inline in the home page): category bubbles fill the row from 850px, lowest priority hidden first ---------- */
.home .gf-bb-home-category-track {
  container: gf-bb-home-categories / inline-size;
}
@media (min-width: 850px) {
  .home .gf-bb-home-category-track .text p { white-space: nowrap; }
  .home .gf-bb-home-categories .gf-bb-home-category-track {
    overflow: visible;
  }
  @container gf-bb-home-categories (width < 1536px) {
    .gf-bb-home-category-track > .gf-bb-category-priority-9 { display: none; }
  }
  @container gf-bb-home-categories (width < 1380px) {
    .gf-bb-home-category-track > .gf-bb-category-priority-8 { display: none; }
  }
  @container gf-bb-home-categories (width < 1224px) {
    .gf-bb-home-category-track > .gf-bb-category-priority-7 { display: none; }
  }
  @container gf-bb-home-categories (width < 1068px) {
    .gf-bb-home-category-track > .gf-bb-category-priority-6 { display: none; }
  }
  @container gf-bb-home-categories (width < 912px) {
    .gf-bb-home-category-track > .gf-bb-category-priority-5 { display: none; }
  }
}
