.jo-fs33-promo,
.jo-fs33-promo * { box-sizing: border-box; }
.jo-fs33-promo {
	position: relative;
	width: 100%;
	border-bottom: 1px solid rgba(125, 211, 252, .3);
	isolation: isolate;
	background: #0a0f1a;
	color: #f0f9ff;
}
.jo-fs33-promo::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background-image: linear-gradient(rgba(10, 15, 26, .15), rgba(10, 15, 26, .15)), url('../images/optimized/shipibo-pattern.webp');
	background-position: center, center top;
	background-size: auto, 360px auto;
	background-repeat: no-repeat, repeat;
	filter: brightness(1.4);
}
.jo-fs33-promo[hidden] { display: none !important; }
.jo-fs33-promo__inner {
	position: relative;
	width: min(1440px, 100%);
	max-width: 1440px;
	min-height: 64px;
	margin: 0 auto;
	padding: 12px clamp(52px, 5vw, 76px) 12px clamp(18px, 4vw, 52px);
}
.jo-fs33-promo__content {
	text-align: center;
	font-size: 14px;
	line-height: 1.6;
	overflow-wrap: anywhere;
}
.jo-fs33-promo__content p { margin: 0; }
.jo-fs33-promo__content a { color: #f0f9ff; text-decoration: none; }
.jo-fs33-promo__content a:hover { color: #7dd3fc; text-decoration: underline; }
.jo-fs33-promo__content strong,
.jo-fs33-promo__content a span { color: #7dd3fc; font-weight: 800; }
.jo-fs33-promo .jo-fs33-promo__close {
	position: absolute;
	top: 50%;
	right: clamp(12px, 2.4vw, 34px);
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	min-width: 0;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 6px;
	background: transparent;
	box-shadow: none;
	color: #f0f9ff;
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
}
.jo-fs33-promo .jo-fs33-promo__close:hover { background: rgba(125, 211, 252, .12); }
.jo-fs33-promo :is(a, button):focus-visible { outline: 2px solid #7dd3fc; outline-offset: 2px; }
@media (max-width: 600px) {
	.jo-fs33-promo__inner { padding-left: 16px; padding-right: 58px; }
	.jo-fs33-promo__content { font-size: 12px; }
}

.jo-fs33-promo__content .jo-fs33-promo__offer {
	width: 100%;
	max-width: none;
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	align-items: center;
	gap: clamp(18px, 3vw, 42px);
	text-align: center;
	text-decoration: none;
}
.jo-fs33-promo__offer .jo-fs33-promo__brand {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	min-width: 0;
}
.jo-fs33-promo__offer .jo-fs33-promo__logo {
	width: 64px;
	height: 64px;
	object-fit: contain;
	border-radius: 14px;
}
.jo-fs33-promo__offer .jo-fs33-promo__copy { display: grid; gap: 4px; min-width: 0; }
.jo-fs33-promo__offer .jo-fs33-promo__headline {
	color: #f0f9ff;
	font-size: clamp(24px, 2.5vw, 32px);
	font-weight: 900;
	line-height: 1.15;
}
.jo-fs33-promo__offer .jo-fs33-promo__description { color: #b8ccdc; font-size: 16px; font-weight: 500; line-height: 1.4; }
.jo-fs33-promo__offer .jo-fs33-promo__address { color: #7dd3fc; font-size: clamp(24px, 2.3vw, 30px); font-weight: 900; white-space: nowrap; }
.jo-fs33-promo__offer:hover .jo-fs33-promo__address { color: #f0f9ff; }
@media (max-width: 900px) {
	.jo-fs33-promo__content .jo-fs33-promo__offer { grid-template-columns: minmax(0, 1fr); gap: 8px; }
	.jo-fs33-promo__offer .jo-fs33-promo__logo { width: 44px; height: 44px; border-radius: 10px; }
	.jo-fs33-promo__offer .jo-fs33-promo__headline { font-size: 23px; }
	.jo-fs33-promo__offer .jo-fs33-promo__description { font-size: 12px; }
	.jo-fs33-promo__offer .jo-fs33-promo__address { font-size: 23px; }
}
@media (max-width: 640px) {
	.jo-fs33-promo__inner { padding: 10px 50px 11px 14px; }
	.jo-fs33-promo__content .jo-fs33-promo__offer { text-align: left; }
	.jo-fs33-promo__offer .jo-fs33-promo__brand { justify-content: flex-start; }
	.jo-fs33-promo .jo-fs33-promo__close { right: 10px; }
}

/* Slides share a grid cell, reserving the tallest slide's height to avoid page jumps. */
.jo-promo-slides { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; min-width: 0; }
.jo-promo-slide { grid-area: 1 / 1; width: 100%; max-width: none; justify-self: stretch; min-width: 0; visibility: hidden; pointer-events: none; align-self: center; }
.jo-promo-slide.is-active { visibility: visible; pointer-events: auto; }
/* Descendant styles must never expose an inactive slide in the shared grid cell. */
.jo-promo-slide:not(.is-active),
.jo-promo-slide:not(.is-active) * { visibility: hidden !important; }
.jo-promo-slides { isolation: isolate; }
.jo-fs33-promo[data-style="morning"] { background: linear-gradient(110deg, #102117, #0b1a13 52%, #102b20); border-bottom-color: rgba(201,162,39,.48); }
.jo-fs33-promo[data-style="morning"]::before { background: radial-gradient(circle at 12% 0%, rgba(201,162,39,.18), transparent 34%); filter: none; }
.jo-fs33-promo__offer .jo-promo-morning-brand { display: grid; justify-items: center; gap: 5px; }
.jo-fs33-promo__offer .jo-promo-morning-brand strong { font-size: clamp(16px, 1.5vw, 21px); color: #fff4d6; }
.jo-promo-morning-brand .jo-promo-morning-time { padding: 4px 12px; border-radius: 999px; background: linear-gradient(135deg, #ffeab4, #c9a227); color: #102117; font-size: 14px; }
.jo-fs33-promo[data-style="morning"] .jo-fs33-promo__copy > span:last-child { color: #f5d56d; font-size: 14px; }
.jo-promo-controls { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 4px; color: #f0f9ff; font-size: 11px; line-height: 1; }
.jo-promo-controls button { display: inline-flex; align-items: center; justify-content: center; padding: 0; margin: 0; width: 28px; height: 24px; min-width: 0; border: 1px solid rgba(255,255,255,.3); border-radius: 5px; background: rgba(0,0,0,.2); color: #f0f9ff; font-size: 16px; line-height: 1; box-shadow: none; cursor: pointer; }
.jo-promo-controls button:hover { background: rgba(255,255,255,.15); }
@media (max-width: 640px) { .jo-fs33-promo__offer .jo-promo-morning-brand { justify-items: start; } }
@media (prefers-reduced-motion: reduce) { .jo-promo-slide.is-active { animation: none; } }

/* Compact viewport-bottom placement. The measured spacer keeps the footer reachable. */
.jo-fs33-promo {
	position: fixed;
	inset: auto 0 0;
	z-index: 950;
	border-top: 1px solid rgba(125, 211, 252, .3);
	border-bottom: 0;
	padding-bottom: env(safe-area-inset-bottom, 0px);
	box-shadow: 0 -6px 24px rgba(0, 0, 0, .18);
	max-height: 40vh;
	overflow-y: auto;
}
.jo-fs33-promo[data-style="morning"] { border-top-color: rgba(201,162,39,.48); }
.jo-fs33-promo .jo-fs33-promo__inner { min-height: 78px; padding: 10px 200px 10px 28px; }
.jo-fs33-promo .jo-fs33-promo__offer { gap: 20px; }
.jo-fs33-promo .jo-fs33-promo__logo { width: 52px; height: 52px; }
.jo-fs33-promo .jo-fs33-promo__headline { font-size: clamp(20px, 2vw, 26px); }
.jo-fs33-promo .jo-fs33-promo__description { font-size: 13px; }
.jo-fs33-promo .jo-fs33-promo__address { font-size: 25px; }
.jo-fs33-promo .jo-fs33-promo__close { right: 8px; }
.jo-fs33-promo .jo-promo-controls { position: absolute; right: 60px; top: 50%; transform: translateY(-50%); margin: 0; gap: 5px; }
.jo-promo-bottom-spacer { width: 100%; pointer-events: none; }
html.jo-promo-bottom-visible { scroll-padding-bottom: calc(var(--jo-promo-bottom-height, 0px) + 16px); }
html.jo-promo-bottom-visible #scroll_up { bottom: calc(var(--jo-promo-bottom-height, 0px) + 16px) !important; }
@media (max-width: 900px) {
	.jo-fs33-promo .jo-fs33-promo__inner { min-height: 74px; padding: 8px 50px 32px 14px; }
	.jo-fs33-promo .jo-fs33-promo__offer { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 12px; }
	.jo-fs33-promo .jo-fs33-promo__logo { display: none; }
	.jo-fs33-promo .jo-fs33-promo__brand { justify-content: center; gap: 3px; }
	.jo-fs33-promo .jo-fs33-promo__headline { font-size: 17px; }
	.jo-fs33-promo .jo-fs33-promo__address { font-size: 22px; }
	.jo-fs33-promo .jo-fs33-promo__description { display: none; }
	.jo-fs33-promo .jo-promo-morning-brand strong { font-size: 12px; }
	.jo-fs33-promo .jo-promo-morning-time { font-size: 10px; padding: 3px 6px; }
	.jo-fs33-promo[data-style="morning"] .jo-fs33-promo__copy > span:last-child { font-size: 11px; }
	.jo-fs33-promo .jo-promo-controls { top: auto; bottom: 4px; right: 50%; transform: translateX(50%); }
}

.jo-fs33-promo .jo-fs33-promo__products { display: flex; align-items: center; gap: 5px; }
.jo-fs33-promo__products img { display: block; flex: 0 0 44px; width: 44px; height: 52px; object-fit: contain; border-radius: 6px; border: 0; }
.jo-fs33-promo__products img[src*="fs33-promo-palo"] { order: 2; }
.jo-fs33-promo__products img[src*="fs33-promo-sage"] { order: 3; }
.jo-fs33-promo__products img[src*="fs33-promo-agua"] { order: 1; object-fit: contain; background: transparent; }

/* Morning campaign: warm gold, a sunrise seal and editorial type. */
.jo-fs33-promo[data-style="morning"] { background: #102d27; border-top-color: #c7a469; }
.jo-fs33-promo[data-style="morning"]::before { background: radial-gradient(ellipse at 8% 100%, #b58b3940, transparent 38%), linear-gradient(110deg, #183b30, #0c2622 70%); }
.jo-fs33-promo .jo-promo-morning { grid-template-columns: 64px minmax(170px, 1.2fr) auto minmax(170px, 1fr) auto; gap: 20px; min-height: 70px; text-align: left; }
.jo-fs33-promo .jo-promo-morning:is(:link, :visited, :hover, :focus, :active) { color: #fff6e4; text-decoration: none; }
.jo-fs33-promo .jo-promo-morning:is(:hover, :focus-visible) { text-decoration-line: underline; text-decoration-color: #d9b978; text-decoration-thickness: 1px; text-underline-offset: 4px; text-decoration-skip-ink: auto; }
.jo-fs33-promo[data-style="morning"] .jo-fs33-promo__close:hover { background: #e5c78b1f; color: #f1d59a; }
.jo-fs33-promo[data-style="morning"] .jo-promo-controls button:hover { background: #e5c78b1f; color: #f1d59a; border-color: #e5c78b70; }
.jo-promo-morning .jo-promo-morning__sun { position: relative; display: block; width: 64px; height: 64px; border: 1px solid #dfbc7440; border-radius: 50%; background: repeating-radial-gradient(circle at 50% 60%, transparent 0 9px, #e8c98414 10px 11px, transparent 12px 16px); }
.jo-promo-morning__sun::before { content: ""; position: absolute; inset: 17px 17px 26px; border-radius: 30px 30px 0 0; background: linear-gradient(#ffe9af, #d9a357); box-shadow: 0 -5px 22px #ebba5350; }
.jo-promo-morning__sun::after { content: ""; position: absolute; top: 39px; left: 12px; width: 38px; height: 1px; background: #e7c888; box-shadow: 0 5px 0 #e7c88850, 0 10px 0 #e7c88820; }
.jo-fs33-promo .jo-promo-morning .jo-promo-morning-brand { justify-items: start; justify-content: start; gap: 4px; }
.jo-promo-morning .jo-promo-morning__eyebrow { color: #d1bb90; font-size: 9px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.jo-fs33-promo .jo-promo-morning .jo-promo-morning-brand strong { color: #fff6e4; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(22px, 2vw, 29px); font-weight: 400; line-height: 1.05; letter-spacing: -.035em; }
.jo-promo-morning-brand em { display: block; color: #edcc8f; font-weight: 400; }
.jo-promo-morning .jo-promo-morning__schedule { display: grid; gap: 4px; padding: 0 20px; border-inline: 1px solid #e5c78b30; text-align: center; }
.jo-promo-morning .jo-promo-morning__hour { color: #f1d59a; font-size: 38px; font-weight: 500; line-height: 1; letter-spacing: -.06em; font-variant-numeric: tabular-nums; }
.jo-promo-morning .jo-promo-morning__daily { color: #cfdbcd; font-size: 10px; font-weight: 500; white-space: nowrap; }
.jo-fs33-promo .jo-promo-morning .jo-fs33-promo__headline { color: #fff6e4; font-size: 17px; font-weight: 600; line-height: 1.3; }
.jo-fs33-promo .jo-promo-morning .jo-fs33-promo__description { color: #bfcec4; font-size: 12px; font-weight: 400; }
.jo-promo-morning .jo-promo-morning__cta { display: inline-flex; align-items: center; justify-content: center; gap: 16px; min-height: 44px; padding: 10px 18px; border: 1px solid var(--jo-button-border, rgba(255, 255, 255, .38)); border-radius: 7px; background: var(--jo-button-gold-gradient, linear-gradient(180deg, #FFEAB4 0%, #C9A227 54%, #A98113 100%)); box-shadow: 0 3px 16px #0003, inset 0 1px 0 #fff8; color: var(--jo-button-color, #fff); font-size: 12px; font-weight: 800; white-space: nowrap; transition: transform .2s ease, box-shadow .2s ease; }
.jo-promo-morning__cta span { color: inherit !important; font-size: 20px; line-height: 1; }
.jo-promo-morning:is(:hover, :focus-visible) .jo-promo-morning__cta { transform: translateY(-2px); box-shadow: 0 5px 24px #c9a22755, inset 0 1px 0 #fff8; }
.jo-fs33-promo[data-style="morning"] :is(a, button):focus-visible { outline-color: #f1d59a; }
.jo-fs33-promo[data-style="morning"] .jo-promo-controls { color: #d7c59e; }
.jo-fs33-promo[data-style="morning"] .jo-promo-controls button { color: #eddbb7; border-color: #e5c78b30; }
@media (max-width: 1200px) {
	.jo-fs33-promo .jo-promo-morning { grid-template-columns: minmax(160px, 1fr) auto auto; }
	.jo-promo-morning .jo-promo-morning__sun, .jo-promo-morning .jo-fs33-promo__copy { display: none; }
}
@media (max-width: 600px) {
	.jo-fs33-promo .jo-promo-morning { grid-template-columns: minmax(0, 1fr) auto; gap: 10px 14px; padding-block: 4px; }
	.jo-promo-morning .jo-promo-morning__eyebrow { font-size: 8px; letter-spacing: .1em; }
	.jo-fs33-promo .jo-promo-morning .jo-promo-morning-brand strong { font-size: 24px; }
	.jo-promo-morning .jo-promo-morning__schedule { padding: 0 0 0 12px; border-right: 0; }
	.jo-promo-morning .jo-promo-morning__hour { font-size: 34px; }
	.jo-promo-morning .jo-promo-morning__daily { max-width: 95px; white-space: normal; font-size: 10px; line-height: 1.4; }
	.jo-promo-morning .jo-promo-morning__cta { grid-column: 1 / -1; min-height: 36px; padding: 5px 14px; }
}
@media (prefers-reduced-motion: reduce) {
	.jo-promo-morning .jo-promo-morning__cta { transition: none; }
	.jo-promo-morning:is(:hover, :focus-visible) .jo-promo-morning__cta { transform: none; }
}
@media (max-width: 1200px) { .jo-fs33-promo .jo-fs33-promo__products { display: none; } }
@media (max-width: 900px) {
	.jo-fs33-promo[data-style="shipibo"] .jo-fs33-promo__description { display: block; font-size: 11px; line-height: 1.25; }
}

/* Third sticky slide: YouTube channel launch. */
.jo-fs33-promo[data-style="youtube"] { background: #101c2b; border-top-color: #c9a22780; }
.jo-fs33-promo[data-style="youtube"]::before { background: radial-gradient(ellipse at 0 0, #c9a22725, transparent 65%); filter: none; }
.jo-fs33-promo .jo-promo-youtube { grid-template-columns: 64px minmax(0, 1fr) auto auto; gap: 20px; text-align: left; min-height: 70px; }
.jo-promo-youtube__portrait img { display: block; width: 64px; height: 64px; object-fit: cover; border: 2px solid #c9a227; border-radius: 50%; }
.jo-promo-youtube__eyebrow { color: #e5c875; font-size: 11px; font-weight: 700; }
.jo-fs33-promo .jo-promo-youtube .jo-fs33-promo__headline { color: #fff; }
.jo-promo-youtube__subscribe { min-width: 125px; min-height: 28px; }
.jo-fs33-promo .jo-promo-youtube__cta { display: inline-flex; justify-content: center; align-items: center; min-height: 42px; padding: 8px 16px; border: 1px solid #ffeab480; border-radius: 7px; background: linear-gradient(180deg, #ffeab4, #c9a227 54%, #a98113); color: #fff; font-weight: 800; font-size: 12px; white-space: nowrap; }
.jo-fs33-promo .jo-promo-youtube__cta:hover { color: #fff; }
@media (max-width: 1100px) {
 .jo-fs33-promo .jo-promo-youtube { grid-template-columns: 52px minmax(0, 1fr) auto; gap: 10px; }
 .jo-promo-youtube__portrait img { width: 52px; height: 52px; }
 .jo-promo-youtube__subscribe { grid-column: 2; grid-row: 2; }
 .jo-promo-youtube__cta { grid-column: 3; grid-row: 1 / 3; }
}
@media (max-width: 600px) {
 .jo-fs33-promo .jo-promo-youtube { grid-template-columns: 46px minmax(0, 1fr); gap: 6px 12px; }
 .jo-promo-youtube__portrait img { width: 46px; height: 46px; }
 .jo-promo-youtube__eyebrow { font-size: 10px; }
 .jo-promo-youtube__subscribe { grid-column: 1 / -1; grid-row: 2; justify-self: center; }
 .jo-fs33-promo .jo-promo-youtube__cta { grid-column: 1 / -1; grid-row: 3; min-height: 32px; padding: 4px 12px; }
}