@charset "UTF-8";
/* B27 brand tokens — see design-reference/palette.md for contrast evidence. */
:root {
	--b27-pink: #FEBCC0;    /* backgrounds only */
	--b27-peach: #FFD3BE;   /* backgrounds only */
	--b27-blush: #FFF4F2;   /* light section background */
	--b27-ink: #000000;
	--b27-surface: #FFFFFF;
	--b27-action: #C2185B;  /* links, buttons, focus — AA on white (5.9:1) and on the light pinks (5.3:1); client list 1/10, item 7 */
	--b27-action-dark: #7E0D3B;
	--b27-radius: 16px;
	--b27-radius-pill: 999px;
}

/* Keep focused/anchored elements clear of the sticky header (WCAG 2.4.11). */
html { scroll-padding-top: 140px; }
@media (max-width: 1024px) { html { scroll-padding-top: 110px; } }

/* Visible focus everywhere (WCAG 2.4.7 / 2.4.11). */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--b27-action);
	outline-offset: 2px;
	box-shadow: 0 0 0 5px var(--b27-surface);
}

/* Pill buttons with brand action colour. */
.button, button:not(.drawer-toggle):not(.menu-toggle-open):not(.search-toggle-open):not(.kadence-menu-mobile-toggle),
.wp-block-button__link, input[type="submit"],
.woocommerce a.button, .woocommerce button.button {
	border-radius: var(--b27-radius-pill);
}

/* ------------------------------------------------------------------ */
/* Header — follows the design reference: white bar, thin icons, logo  */
/* on a pink tile (the white «B27» wordmark needs pink behind it).     */
/* ------------------------------------------------------------------ */
.site-branding a.brand {
	display: inline-flex;
	align-items: flex-end;   /* the illustration «sits» on the tile's bottom edge */
	justify-content: center;
	width: 68px;
	height: 68px;
	padding: 0;
	overflow: hidden;
	border-radius: 18px;
	background: var(--b27-pink);
	box-shadow: 0 6px 16px rgba(168, 18, 79, 0.12);
	transition: transform .2s ease;
}
.site-branding a.brand img.custom-logo { width: auto; max-width: none; height: 64px; }
.site-branding a.brand:hover { transform: scale(1.03); }
#mobile-header .site-branding a.brand { width: 50px; height: 50px; border-radius: 14px; }
#mobile-header .site-branding a.brand img.custom-logo { height: 47px; }

/* Icons: 22px glyphs in 44px touch targets (WCAG 2.5.5), evenly spaced. */
.b27-header-icons { display: flex; align-items: center; margin: 0; padding: 0; list-style: none; }
.b27-header-icons a,
#masthead .search-toggle-open,
#masthead .header-cart-button,
#masthead .menu-toggle-open {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--b27-ink);
	transition: background-color .15s ease, color .15s ease;
}
.b27-header-icons a:hover,
#masthead .search-toggle-open:hover,
#masthead .header-cart-button:hover,
#masthead .menu-toggle-open:hover { background: #FFF0F2; color: var(--b27-action); }

/* Cart count: small pink badge on the bag, as in the reference. */
#masthead .header-cart-button { position: relative; }
#masthead .header-cart-button .header-cart-total {
	position: absolute;
	top: 5px;
	right: 2px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	height: 18px;
	margin: 0;
	padding: 0 5px;
	border-radius: 9px;
	background: var(--b27-action);
	color: var(--b27-surface);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
}

/* Desktop navigation: small spaced capitals, underline on hover/current (Kadence «underline» style). */
#main-header .main-navigation .primary-menu-container > ul > li.menu-item > a { padding-top: 0.6em; padding-bottom: 0.6em; }

/* Mobile drawer: account + wishlist after the menu, set apart by a divider. */
.mobile-navigation ul li.b27-menu-account--account { margin-top: 0.75rem; border-top: 2px solid #F3C6CD; }

/* ------------------------------------------------------------------ */
/* Announcement bar — action pink, white text (7.3:1).                 */
/* ------------------------------------------------------------------ */
.b27-announce {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 0 3rem;
	background: var(--b27-action);
	color: var(--b27-surface);
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.01em;
	text-align: center;
}
.b27-announce { padding: 0 2.75rem 0 0; }
.b27-announce__viewport { width: 100%; overflow: hidden; -webkit-mask-image: linear-gradient(to right, transparent, #000 4%, #000 96%, transparent); mask-image: linear-gradient(to right, transparent, #000 4%, #000 96%, transparent); }
.b27-announce__track { display: flex; width: max-content; }
.b27-announce__list { display: flex; margin: 0; padding: 0; list-style: none; }
.b27-announce__item { padding: 0.55rem 2.5rem; white-space: nowrap; }
.b27-announce__item::before { content: "\2726 "; margin-right: 2.5rem; margin-left: -2.5rem; opacity: 0.7; } /* separator between messages */
.b27-announce.is-moving .b27-announce__track { animation: b27-marquee var(--b27-marquee-duration, 40s) linear infinite; }
.b27-announce.is-paused .b27-announce__track,
.b27-announce:hover .b27-announce__track,
.b27-announce:focus-within .b27-announce__track { animation-play-state: paused; }
@keyframes b27-marquee { to { transform: translateX(-50%); } }
.b27-announce a { color: var(--b27-surface); text-decoration: underline; text-underline-offset: 2px; }
.b27-announce :focus-visible { outline-color: var(--b27-surface); box-shadow: none; }
.b27-announce__toggle {
	position: absolute;
	right: 0.5rem;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--b27-surface);
	cursor: pointer;
}
.b27-announce__icon::before { content: "\275A \275A "; font-size: 0.625rem; letter-spacing: -1px; }
.b27-announce__toggle[aria-pressed="true"] .b27-announce__icon::before { content: "\25B6 "; font-size: 0.75rem; }
@media (max-width: 1024px) {
	.b27-announce { min-height: 36px; font-size: 0.78rem; }
	.b27-announce__item { padding: 0.5rem 1.75rem; }
	.b27-announce__item::before { margin-right: 1.75rem; margin-left: -1.75rem; }
}

/* The page never pans sideways on phones (the admin bar's long user name used to push it wide). */
html { overflow-x: clip; }
@media (max-width: 782px) { #wpadminbar #wp-admin-bar-my-account .display-name { display: none; } }
.b27-carousel__track { overscroll-behavior-x: contain; }

/* ------------------------------------------------------------------ */
/* Shared                                                              */
/* ------------------------------------------------------------------ */
.screen-reader-text:not(:focus) { clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; word-wrap: normal !important; }
.b27-hp { position: absolute; left: -9999px; }

.b27-home { --b27-gap: clamp(1rem, 2.5vw, 1.75rem); }
.b27-home .site, .b27-home .content-bg, .b27-home .entry { background: var(--b27-surface); }
.b27-home .entry-content { margin: 0; }
.b27-home .entry-content > .wp-block-group:not(.b27-hero),
.b27-home .entry-content > .wp-block-columns { max-width: 1240px; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; }
.b27-home .entry-content > * + * { margin-top: clamp(2rem, 5vw, 3.5rem); }
.b27-home h2, .b27-home h3 { color: var(--b27-action); }

.b27-section-title { text-align: center; font-size: clamp(1.5rem, 3vw, 2rem); margin: 0 0 1.25rem; }
.b27-heart::after {
	content: "";
	display: inline-block;
	width: 0.85em; height: 0.85em;
	margin-left: 0.4em;
	vertical-align: -0.05em;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.b27-card {
	background: var(--b27-surface);
	border: 1px solid #F9D5DA;
	border-radius: 20px;
	padding: clamp(1rem, 2.5vw, 1.5rem);
	box-shadow: 0 6px 24px rgba(168, 18, 79, 0.06);
}

/* Buttons used on the homepage. */
.b27-home .wp-block-button__link {
	padding: 0.85em 1.8em;
	font-weight: 600;
	background: var(--b27-action);
	color: var(--b27-surface);
	border: 2px solid var(--b27-action);
	border-radius: 10px;
	box-shadow: 0 6px 16px rgba(168, 18, 79, 0.25);
}
.b27-home .wp-block-button__link:hover { background: var(--b27-action-dark); border-color: var(--b27-action-dark); color: var(--b27-surface); }
.b27-home .is-style-outline .wp-block-button__link, .b27-hero3 .wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--b27-ink); border-color: var(--b27-ink); box-shadow: none; text-transform: uppercase; }
.b27-home .is-style-outline .wp-block-button__link:hover, .b27-hero3 .wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--b27-ink); color: var(--b27-surface); }

/* ------------------------------------------------------------------ */
/* Hero                                                                */
/* ------------------------------------------------------------------ */
.b27-hero > .wp-block-group__inner-container,
.b27-hero:not(:has(> .wp-block-group__inner-container)) {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	min-height: clamp(360px, 36vw, 520px);
}
.b27-hero {
	background: linear-gradient(100deg, #FFF3F5 0%, #FFE4E8 55%, #FFD6DC 100%);
	overflow: hidden;
	margin-top: 0 !important;
}
.b27-hero__text { padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 4vw, 2rem) clamp(2rem, 5vw, 4rem) max(clamp(1rem, 2.5vw, 2.5rem), calc((100vw - 1240px) / 2 + 1rem)); }   /* never closer to the edge than the header's logo */
.b27-hero__title {
	margin: 0 0 1rem;
	font-family: var(--global-body-font-family);
	font-weight: 500;
	font-size: clamp(1.5rem, 2.6vw, 2.25rem);
	line-height: 1.25;
	color: var(--b27-ink);
}
.b27-hero__mark {   /* the logo's «B27», in the brand colour */
	display: block;
	width: clamp(130px, 15vw, 220px);
	aspect-ratio: 1232 / 710;
	margin: 0 0 0.6rem;
	background: var(--b27-action);
	-webkit-mask: url("../img/b27-wordmark.svg") left center / contain no-repeat;
	mask: url("../img/b27-wordmark.svg") left center / contain no-repeat;
}
.b27-hero__lead { font-size: clamp(1rem, 1.4vw, 1.2rem); max-width: 30em; margin: 0 0 1.75rem; color: var(--b27-ink); }
.b27-hero .wp-block-buttons { gap: 1rem; }
.b27-hero__img { margin: 0; height: 100%; align-self: stretch; }
.b27-hero__img img { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 22%); mask-image: linear-gradient(to right, transparent 0, #000 22%); width: 100%; height: 100%; object-fit: cover; object-position: 30% 25%; display: block; }

/* ------------------------------------------------------------------ */
/* USPs                                                                */
/* ------------------------------------------------------------------ */
.b27-usps { gap: 0 !important; }
.b27-usp { text-align: center; padding: 0 1rem; }
.b27-usp + .b27-usp { border-left: 1px solid #F3C6CD; }
.b27-usp::before {
	content: "";
	display: block;
	width: 72px; height: 72px;
	margin: 0 auto 0.85rem;
	border-radius: 50%;
	border: 2px solid var(--b27-pink);
	background: #FFF0F2 var(--b27-usp-icon) center / 34px no-repeat;
}
.b27-usp p { margin: 0; }
.b27-usp__title { font-weight: 700; color: var(--b27-ink); }
.b27-usp__text { font-size: 0.875rem; color: #3d3d3d; }
.b27-usp--authentic { --b27-usp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A8124F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 19c0-8 5-13 14-14-1 9-6 14-14 14z'/%3E%3Cpath d='M5 19l8-8'/%3E%3C/svg%3E"); }
.b27-usp--approved  { --b27-usp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A8124F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3Cpath d='M4 21c0-4 3.6-7 8-7s8 3 8 7'/%3E%3Cpath d='M12 14v4m-2-2h4'/%3E%3C/svg%3E"); }
.b27-usp--routine   { --b27-usp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A8124F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Ccircle cx='12' cy='12' r='1.5'/%3E%3Cpath d='M15 9l5-5m0 0h-3m3 0v3'/%3E%3C/svg%3E"); }
.b27-usp--samples   { --b27-usp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A8124F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='4' rx='1'/%3E%3Cpath d='M5 12v8h14v-8M12 8v12M12 8c-2-4-6-4-6-1.5S12 8 12 8zm0 0c2-4 6-4 6-1.5S12 8 12 8z'/%3E%3C/svg%3E"); }

/* ------------------------------------------------------------------ */
/* Quiz promo                                                          */
/* ------------------------------------------------------------------ */
.b27-promo {
	background: linear-gradient(100deg, #FFE3E7 0%, #FFF3F5 60%);
	border-radius: 24px;
	overflow: hidden;
	align-items: center !important;
	gap: 0 !important;
	padding: 0 !important;
}
.b27-promo .wp-block-image { margin: 0; }
.b27-promo .wp-block-image img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
.b27-promo__text { padding: clamp(1.5rem, 4vw, 3rem) !important; }
.b27-promo h2 { font-size: clamp(1.6rem, 3vw, 2.25rem); line-height: 1.2; margin: 0 0 1rem; }

/* ------------------------------------------------------------------ */
/* Categories                                                          */
/* ------------------------------------------------------------------ */
.b27-cats { gap: var(--b27-gap) !important; }
.b27-cat {
	position: relative;
	background: var(--b27-surface);
	border: 1px solid #F9D5DA;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 6px 20px rgba(168, 18, 79, 0.07);
	transition: transform .2s ease, box-shadow .2s ease;
}
.b27-cat:hover, .b27-cat:focus-within { transform: translateY(-3px); box-shadow: 0 10px 26px rgba(168, 18, 79, 0.14); }
.b27-cat .wp-block-image { margin: 0; }
.b27-cat .wp-block-image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.b27-cat__label { margin: 0; padding: 0.9rem 0.75rem; text-align: center; font-weight: 600; font-size: 1.05rem; }
.b27-cat__label a { color: var(--b27-ink); text-decoration: none; }
.b27-cat__label a::after { content: ""; position: absolute; inset: 0; }  /* whole card clickable, one link */
.b27-cat__label a:focus-visible { outline: none; box-shadow: none; }
.b27-cat:focus-within { outline: 3px solid var(--b27-action); outline-offset: 2px; }

/* ------------------------------------------------------------------ */
/* Meet the owner                                                      */
/* ------------------------------------------------------------------ */
.b27-meet {
	position: relative;
	background: linear-gradient(100deg, #FFF3F5 0%, #FFE9EC 100%);
	border-radius: 24px;
	overflow: hidden;
	overflow: clip;   /* clip, not hidden: «hidden» made the card the sticky photo's scroller, so the photo sat 110px down */
	gap: 0 !important;
	padding: 0 !important;
}
.b27-meet > .wp-block-column:first-child { position: relative; min-height: 300px; }
.b27-meet .wp-block-image { position: absolute; inset: 0; margin: 0; }
.b27-meet .wp-block-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; display: block; }
.b27-meet__text { padding: clamp(1.5rem, 4vw, 3rem) clamp(1.5rem, 5vw, 5rem) clamp(1.5rem, 4vw, 3rem) clamp(1.5rem, 4vw, 3rem) !important; align-self: center; }
.b27-meet h2 { font-size: clamp(1.75rem, 3vw, 2.25rem); margin: 0; }
.b27-meet__role { margin: 0.25rem 0 1rem; color: #3d3d3d; }
.b27-meet::after {
	content: "";
	position: absolute;
	right: clamp(1rem, 3vw, 2.5rem);
	top: 1.5rem;
	width: 56px; height: 56px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A8124F' stroke-width='0.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z'/%3E%3Cpath d='M12 20c1 1 2 2.5 1.5 3.5'/%3E%3C/svg%3E") center / contain no-repeat;
	pointer-events: none;
}

/* ------------------------------------------------------------------ */
/* Two-up rows (Top Crushes | Concerns, Reviews | Instagram)           */
/* ------------------------------------------------------------------ */
.b27-duo { gap: var(--b27-gap) !important; align-items: stretch !important; }
.b27-duo > .wp-block-column { min-width: 0; }
.b27-duo h2.wp-block-heading { font-family: var(--global-body-font-family); font-weight: 600; font-size: 1.25rem; text-align: center; margin: 0 0 1rem; }   /* section titles only, not the product names */
.b27-duo .b27-sub { text-align: center; margin: -0.75rem 0 1rem; font-weight: 600; }

/* Carousel */
.b27-carousel { position: relative; padding: 0 2.25rem; }
.b27-carousel__track {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 3 * 0.75rem) / 4);
	gap: 0.75rem;
	margin: 0;
	padding: 0.25rem 0 0.5rem;
	list-style: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}
.b27-carousel__track::-webkit-scrollbar { display: none; }
.b27-carousel__track > li { scroll-snap-align: start; }
.b27-carousel__btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 36px; height: 36px;
	padding: 0;
	border-radius: 50% !important;
	border: 1px solid #E7B3BC;
	background: var(--b27-surface);
	color: var(--b27-ink);
	font-size: 1.4rem;
	line-height: 1;
	cursor: pointer;
	z-index: 1;
}
.b27-carousel__btn:hover { background: var(--b27-action); color: var(--b27-surface); border-color: var(--b27-action); }
/* The arrow is drawn (an SVG chevron), not the ‹ › characters, so it sits exactly in the middle of the circle. */
.b27-carousel__btn { display: inline-flex; align-items: center; justify-content: center; }
.b27-carousel__btn > span { display: none; }
.b27-carousel__btn::before { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat; }
.b27-carousel__btn--prev::before { transform: scaleX(-1); }
.b27-carousel__btn:disabled { opacity: .35; cursor: default; background: var(--b27-surface); color: var(--b27-ink); }
.b27-carousel__btn--prev { left: 0; }
.b27-carousel__btn--next { right: 0; }
.b27-carousel.is-static .b27-carousel__btn { display: none; }
.b27-carousel.is-static { padding: 0; }

/* Product card */
.b27-product-card { position: relative; text-align: center; font-size: 0.8125rem; line-height: 1.35; }
.b27-product-card__img img { width: 100%; aspect-ratio: 1; object-fit: contain; padding: 6%; box-sizing: border-box; background: #fff; border-radius: 12px; display: block; }
.b27-badge {
	position: absolute;
	top: 6px; right: 6px;
	z-index: 1;
	max-width: calc(100% - 12px);
	padding: 0.25em 0.55em;
	overflow-wrap: normal;
	hyphens: manual;
	text-align: center;
	border-radius: 6px;
	background: #FFE3E7;
	color: var(--b27-action);
	font-size: 0.6875rem;
	font-weight: 700;
	line-height: 1.2;
}
.b27-product-card__brand { margin: 0.5rem 0 0; font-weight: 700; text-transform: uppercase; font-size: 0.75rem; color: var(--b27-ink); }
.b27-duo .b27-product-card__title { margin: 0.15rem 0; font-family: var(--global-body-font-family); font-size: 0.8125rem; font-weight: 400; text-align: center; }
.b27-product-card__title a { color: var(--b27-ink); text-decoration: none; }
.b27-product-card__title a::after { content: ""; position: absolute; inset: 0; }
.b27-product-card:focus-within { outline: 3px solid var(--b27-action); outline-offset: 2px; border-radius: 12px; }
.b27-product-card__title a:focus-visible { outline: none; box-shadow: none; }
.b27-product-card__price { margin: 0; font-weight: 700; color: var(--b27-ink); }
.b27-product-card__price del { font-weight: 400; color: #555; }
.b27-product-card__price ins { text-decoration: none; color: var(--b27-action); }
/* «Δημοφιλή τώρα»: the shop's product cards in the carousel, two at a time in the half-width column. */
.b27-carousel--products ul.products.b27-carousel__track { grid-template-columns: none; gap: 0.75rem; grid-auto-columns: calc((100% - 0.75rem) / 2); }   /* not the shop's fixed grid columns */
.b27-carousel--products ul.products li.product { float: none; width: auto; margin: 0; text-align: left; }
.b27-carousel--products ul.products::before, .b27-carousel--products ul.products::after { content: none; }
/* Phones: the whole card width for the two cards (as in the shop); the arrows sit over the photos. */
@media (max-width: 767px) {
	.b27-carousel--products { padding: 0; }
	.b27-carousel--products .b27-carousel__btn { top: 25%; z-index: 4; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12); }
	.b27-carousel--products .b27-carousel__btn--prev { left: -0.5rem; }
	.b27-carousel--products .b27-carousel__btn--next { right: -0.5rem; }
}

/* Skin concerns */
.b27-concerns { display: grid; gap: 0.75rem; margin: 0; padding: 0; list-style: none; }
.b27-concern a {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 56px;
	padding: 0 1rem;
	border-radius: 10px;
	overflow: hidden;
	background: #FFF4F6;
	border: 1px solid #F9D5DA;
	color: var(--b27-ink);
	font-weight: 600;
	font-size: 0.9375rem;
	text-decoration: none;
}
.b27-concern--glow-hydration a { background: #F1F6FC; }
.b27-concern--acne a { background: #F3F7EE; }
.b27-concern__label { position: relative; z-index: 1; }
.b27-concern__img {
	position: absolute;
	top: 0; right: 0; bottom: 0;
	width: 62%;
	background-size: cover;
	background-position: center;
	-webkit-mask-image: linear-gradient(to right, transparent, #000 45%);
	mask-image: linear-gradient(to right, transparent, #000 45%);
	transition: transform .3s ease;
}
.b27-concern a:hover .b27-concern__img { transform: scale(1.05); }
.b27-concern a:hover .b27-concern__label { text-decoration: underline; }

/* Reviews */
.b27-reviews { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; margin: 0; padding: 0; list-style: none; }
.b27-review { padding: 0.9rem; border: 1px solid #F9D5DA; border-radius: 12px; font-size: 0.8125rem; }
.b27-review__stars { margin: 0 0 0.4rem; color: var(--b27-action); letter-spacing: 2px; font-size: 1rem; }
.b27-review__text { margin: 0; padding: 0; border: 0; font-style: normal; }
.b27-review__text p { margin: 0; font-size: 0.8125rem; }
.b27-review__author { margin: 0.5rem 0 0; font-weight: 600; }
.b27-review--placeholder { background: repeating-linear-gradient(135deg, #FFF, #FFF 8px, #FFF6F8 8px, #FFF6F8 16px); }

/* Instagram */
.b27-carousel--insta .b27-carousel__track { grid-auto-columns: calc((100% - 3 * 0.75rem) / 4); }
.b27-insta a { display: block; border-radius: 10px; overflow: hidden; }
.b27-insta__img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; transition: transform .3s ease; }
.b27-insta a:hover .b27-insta__img { transform: scale(1.05); }

/* ------------------------------------------------------------------ */
/* Newsletter — B27 Club                                               */
/* ------------------------------------------------------------------ */
.b27-newsletter { max-width: 1240px; margin: clamp(2.5rem, 6vw, 4.5rem) auto 0; padding: 0 1rem; }
.b27-newsletter__inner {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(1.5rem, 4vw, 4rem);
	padding: clamp(1.75rem, 4.5vw, 3.5rem) clamp(1.5rem, 5vw, 4rem);
	border-radius: 28px;
	background:
		radial-gradient(circle at 94% 8%, rgba(255, 255, 255, 0.7) 0 110px, transparent 111px),
		radial-gradient(circle at 4% 104%, rgba(255, 211, 190, 0.75) 0 170px, transparent 171px),
		linear-gradient(120deg, #FFE3E7 0%, #FFF1EE 55%, #FFE9DD 100%);
	box-shadow: 0 18px 50px rgba(168, 18, 79, 0.10);
	overflow: hidden;
}
.b27-newsletter__eyebrow { margin: 0 0 0.6rem; color: var(--b27-action); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.b27-newsletter .b27-newsletter__title { margin: 0 0 0.75rem; font-family: var(--global-heading-font-family); font-size: clamp(1.9rem, 3.6vw, 2.75rem); font-weight: 500; line-height: 1.12; color: var(--b27-ink); }
.b27-newsletter__lead { margin: 0 0 1.25rem; color: #3d3d3d; font-size: 1.0625rem; }
.b27-newsletter__perks { display: grid; gap: 0.55rem; margin: 0; padding: 0; list-style: none; }
.b27-newsletter__perks li { display: flex; align-items: center; gap: 0.7rem; color: var(--b27-ink); font-size: 0.9375rem; font-weight: 600; }
.b27-newsletter__perks li::before { content: ""; flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--b27-action) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 6.2 5 8.5l4.5-5'/%3E%3C/svg%3E") center / 12px no-repeat; }
.b27-newsletter__form { margin: 0; padding: clamp(1.25rem, 3vw, 1.9rem); border-radius: 22px; background: rgba(255, 255, 255, 0.78); box-shadow: 0 10px 30px rgba(168, 18, 79, 0.08); }
.b27-newsletter__label { display: block; margin: 0 0 0.55rem; color: var(--b27-ink); font-size: 0.875rem; font-weight: 700; }
.b27-newsletter__field {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.35rem;
	border: 1px solid #E7B3BC;
	border-radius: 999px;
	background: var(--b27-surface);
	transition: border-color .15s ease;
}
.b27-newsletter__field:focus-within { border-color: var(--b27-action); outline: 3px solid var(--b27-action); outline-offset: 2px; }
.b27-newsletter__field:has(input[aria-invalid="true"]) { border: 2px solid #B00020; }
.b27-newsletter__field input[type="email"] { flex: 1 1 auto; min-width: 0; min-height: 44px; margin: 0; padding: 0 0.9rem; border: 0; border-radius: 999px; background: transparent; box-shadow: none; font-size: 1rem; }
.b27-newsletter__field input[type="email"]:focus-visible { outline: none; box-shadow: none; }   /* the whole field shows the focus ring */
.b27-newsletter__submit {
	flex: none;
	min-height: 44px;
	padding: 0 1.6rem;
	border: 0;
	border-radius: 999px !important;
	background: var(--b27-action);
	color: var(--b27-surface);
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.01em;
	box-shadow: 0 6px 16px rgba(168, 18, 79, 0.25);
	cursor: pointer;
	transition: background-color .15s ease, transform .15s ease;
}
.b27-newsletter__submit:hover { background: var(--b27-action-dark); transform: translateY(-1px); }
.b27-newsletter__consent { margin: 0.8rem 0 0; color: #3d3d3d; font-size: 0.75rem; line-height: 1.55; }
.b27-newsletter__consent a { color: var(--b27-action); }
.b27-newsletter__msg { margin: 0.6rem 0 0; font-size: 0.875rem; font-weight: 600; }
.b27-newsletter__msg:empty { display: none; }
.b27-newsletter__admin-note { margin: 0.6rem 0 0; color: #8A0019; font-size: 0.75rem; }
@media (max-width: 781px) {
	.b27-newsletter__inner { grid-template-columns: 1fr; border-radius: 22px; }
}
@media (max-width: 420px) {
	.b27-newsletter__field { flex-direction: column; align-items: stretch; border-radius: 18px; }
	.b27-newsletter__submit { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
	.b27-newsletter__submit { transition: none; }
	.b27-newsletter__submit:hover { transform: none; }
}

/* ------------------------------------------------------------------ */
/* Footer                                                              */
/* ------------------------------------------------------------------ */
.b27-footer { background: var(--b27-surface); border-top: 1px solid #F9D5DA; }
.b27-footer__inner {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
	gap: 2rem;
	max-width: 1240px;
	margin: 0 auto;
	padding: 2.5rem 1rem 1.5rem;
}
.b27-footer .b27-footer__heading { margin: 0 0 0.75rem; font-family: var(--global-body-font-family); font-size: 0.9375rem; font-weight: 700; color: var(--b27-ink); }
.b27-footer__menu { margin: 0; padding: 0; list-style: none; font-size: 0.875rem; }
.b27-footer__menu li + li { margin-top: 0.3rem; }
.b27-footer__menu a { color: var(--b27-ink); text-decoration: none; }
.b27-footer__menu a:hover { color: var(--b27-action); text-decoration: underline; }
.b27-footer__social { display: flex; gap: 0.25rem; margin: 0 0 0.5rem; padding: 0; list-style: none; }
.b27-footer__col--contact { text-align: center; }
.b27-footer__col--contact .b27-footer__social { justify-content: center; gap: 0.5rem; margin: 0.25rem 0 1rem; }
.b27-footer__col--contact .b27-footer__social a { border-radius: 50%; background: #FFF0F2; transition: background-color .15s ease, color .15s ease; }
.b27-footer__col--contact .b27-footer__social a:hover { background: var(--b27-action); color: var(--b27-surface); }
.b27-footer__social a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--b27-ink); }
.b27-footer__social a:hover { color: var(--b27-action); }
.b27-footer__tagline { margin: 0; color: var(--b27-action); font-family: var(--global-heading-font-family); font-size: 1.25rem; font-weight: 500; line-height: 1.3; }
.b27-footer__tagline::after { content: " \2661 "; }
.b27-footer__brand { display: flex; align-items: center; justify-content: flex-end; }
.b27-footer__brand a { display: block; padding: 0.75rem 1rem; border-radius: 16px; background: var(--b27-pink); }  /* white wordmark needs pink behind it */
.b27-footer__logo { width: 88px; height: auto; display: block; }
.b27-footer__copy { margin: 0; padding: 0.75rem 1rem 1.25rem; text-align: center; font-size: 0.75rem; color: #3d3d3d; }

/* ------------------------------------------------------------------ */
/* Responsive                                                          */
/* ------------------------------------------------------------------ */
@media (max-width: 1024px) {
	.b27-carousel__track, .b27-carousel--insta .b27-carousel__track { grid-auto-columns: calc((100% - 2 * 0.75rem) / 3); }
	.b27-reviews { grid-template-columns: 1fr; }
	.b27-footer__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.b27-footer__brand { justify-content: flex-start; }
}
@media (max-width: 781px) {
	/* Phones, like the client's example (list 1/10, item 5): the title sits in the empty pink space left of
	   the model, the lead and the buttons follow under the photo. The text groups step aside
	   (display: contents) so the title can share the photo's grid cell. */
	.b27-hero > .wp-block-group__inner-container { grid-template-columns: 1fr; grid-template-rows: 330px auto auto; align-items: start; }
	.b27-hero__text, .b27-hero__text > .wp-block-group__inner-container { display: contents; }
	.b27-hero__img { grid-area: 1 / 1; height: 330px; }
	.b27-hero__img img { -webkit-mask-image: linear-gradient(to top, transparent 0, #000 22%); mask-image: linear-gradient(to top, transparent 0, #000 22%); object-position: 88% 15%; }
	.b27-hero__title { grid-area: 1 / 1; position: relative; z-index: 1; max-width: 50%; margin: 1.5rem 0 0 1rem !important; }
	.b27-hero__lead { grid-row: 2; margin: 0.25rem 1rem 1.25rem !important; }
	.b27-hero .wp-block-buttons { grid-row: 3; margin: 0 1rem 2rem; }
	.b27-meet > .wp-block-column:first-child { min-height: 320px; }
	.b27-hero__lead { font-size: 0.95rem; }
	.b27-usps { display: grid !important; grid-template-columns: 1fr 1fr; row-gap: 1.5rem !important; }   /* 2 over 2 again (client, 2/10) */
	.b27-usp + .b27-usp { border-left: 0; }
	.b27-usp:nth-child(even) { border-left: 1px solid #F3C6CD; }
	.b27-cats { display: grid !important; grid-template-columns: 1fr 1fr; }
	.b27-meet::after { display: none; }
	.b27-carousel__track, .b27-carousel--insta .b27-carousel__track { grid-auto-columns: calc((100% - 0.75rem) / 2); }
}
@media (max-width: 480px) {
	.b27-footer__inner { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
	.b27-cat, .b27-concern__img, .b27-insta__img { transition: none; }
}

/* Kadence gives content lists padding and sets word-break: break-word globally. */
.b27-home .entry-content ul.b27-carousel__track,
.b27-home .entry-content ul.b27-concerns,
.b27-home .entry-content ul.b27-reviews { padding-left: 0; padding-right: 0; }
.b27-home .entry-content .b27-carousel__track > li,
.b27-home .entry-content .b27-concerns > li,
.b27-home .entry-content .b27-reviews > li { margin: 0; }
.b27-badge, .b27-product-card__title, .b27-cat__label { word-break: normal; overflow-wrap: normal; hyphens: manual; }
.b27-cat__label { overflow-wrap: anywhere; }   /* a long word breaks only if it cannot fit (320px with text spacing, WCAG 1.4.12) */

/* ------------------------------------------------------------------ */
/* Product listing: toolbar, sorting, active filters                   */
/* ------------------------------------------------------------------ */
.woocommerce .kadence-shop-top-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1rem;
	margin: 0 0 1rem;
	padding: 0 0 1rem;
	border-bottom: 1px solid #F3C6CD;
}
.woocommerce .kadence-shop-top-row .kadence-shop-top-item { margin: 0; float: none; }
.woocommerce .kadence-shop-top-row .kadence-woo-results-count { margin-right: auto; }
.b27-result-count.woocommerce-result-count { margin: 0; float: none; font-size: 0.875rem; color: #555; }

/* Sorting: a pill with a visible label instead of the default select. */
.woocommerce .b27-ordering { display: flex; align-items: center; gap: 0.6rem; margin: 0; float: none; }
.b27-ordering__label { margin: 0; font-size: 0.875rem; font-weight: 500; color: #3d3d3d; white-space: nowrap; }
.b27-ordering__control { position: relative; display: inline-flex; align-items: center; }
.woocommerce .b27-ordering select.orderby {
	-webkit-appearance: none;
	appearance: none;
	min-height: 44px;
	margin: 0;
	padding: 0 2.6rem 0 1.1rem;
	border: 1px solid #E7B3BC;
	border-radius: 999px;
	background: var(--b27-surface);
	color: var(--b27-ink);
	font: inherit;
	font-size: 0.9rem;
	font-weight: 600;
	cursor: pointer;
	box-shadow: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.woocommerce .b27-ordering select.orderby:hover { border-color: var(--b27-action); box-shadow: 0 2px 10px rgba(168, 18, 79, 0.08); }
.b27-ordering__chevron { position: absolute; right: 1.05rem; color: var(--b27-action); pointer-events: none; }

/* Grid / list toggle: quiet icon buttons. */
.woocommerce .kadence-product-toggle-container .kadence-toggle-shop-layout {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	min-width: 40px;
	height: 40px;
	min-height: 40px;
	padding: 0;
	border-radius: 50% !important;
	color: #555;
	line-height: 1;
}
.woocommerce .kadence-product-toggle-container .kadence-toggle-shop-layout .kadence-svg-iconset { display: flex; }
.woocommerce .kadence-product-toggle-container .kadence-toggle-shop-layout svg { display: block; width: 18px; height: 18px; top: 0; }
.woocommerce .kadence-product-toggle-container .kadence-toggle-shop-layout.toggle-active,
.woocommerce .kadence-product-toggle-container .kadence-toggle-shop-layout:hover { color: var(--b27-action); background: #FFF0F2; }

/* Active filters as removable chips. */
.b27-active-filters { margin: 0 0 1.25rem; }
.b27-active-filters ul { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
.b27-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-height: 36px;
	padding: 0 0.9rem;
	border-radius: 999px;
	background: #FFE3E7;
	color: var(--b27-ink);
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
	transition: background-color .15s ease;
}
.b27-chip svg { color: var(--b27-action); }
.b27-chip:hover { background: var(--b27-pink); color: var(--b27-ink); }
.b27-chip-clear { font-size: 0.875rem; font-weight: 600; color: var(--b27-action); text-decoration: underline; text-underline-offset: 2px; }

/* ------------------------------------------------------------------ */
/* Filter groups (sidebar)                                             */
/* ------------------------------------------------------------------ */
.woocommerce #secondary .widget { margin: 0; padding: 0; border-bottom: 1px solid #F3C6CD; }
.woocommerce #secondary .widget:first-of-type { border-top: 1px solid #F3C6CD; }
.woocommerce #secondary .widget-title {
	margin: 0;
	padding: 0.9rem 0;
	font-family: var(--global-body-font-family);
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
	color: var(--b27-ink);
}
.woocommerce #secondary .widget-title:has(.b27-filter__toggle) { padding: 0; }
.b27-filter__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	min-height: 52px;
	padding: 0;
	border: 0;
	border-radius: 0 !important;
	background: none;
	color: var(--b27-ink);
	font: inherit;
	text-align: left;
	cursor: pointer;
}
.b27-filter__toggle:hover { color: var(--b27-action); background: none; }
.b27-filter__chevron {
	width: 12px;
	height: 12px;
	flex: none;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-3px) rotate(45deg);
	transition: transform .2s ease;
}
.b27-filter__toggle[aria-expanded="true"] .b27-filter__chevron { transform: translateY(2px) rotate(225deg); }
.b27-filter__body { padding: 0 0 1rem; }
.b27-filter__body[hidden] { display: none; }

.woocommerce #secondary .b27-filter ul,
.woocommerce #secondary .widget ul { margin: 0; padding: 0; list-style: none; }
.woocommerce #secondary .widget li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
}
.woocommerce #secondary .widget li[hidden] { display: none; }
.woocommerce #secondary .widget li a {
	position: relative;
	display: flex;
	flex: 1;
	align-items: center;
	gap: 0.7rem;
	min-height: 38px;
	padding: 0;
	color: var(--b27-ink);
	font-size: 0.9375rem;
	text-decoration: none;
}
.woocommerce #secondary .widget li a::before {   /* custom checkbox */
	content: "";
	flex: none;
	width: 18px;
	height: 18px;
	border: 1.5px solid #9E8A90;
	border-radius: 5px;
	background: var(--b27-surface) center / 12px no-repeat;
	transition: background-color .15s ease, border-color .15s ease;
}
.woocommerce #secondary .widget li a:hover { color: var(--b27-action); }
.woocommerce #secondary .widget li a:hover::before { border-color: var(--b27-action); }
.woocommerce #secondary .widget li.chosen a,
.woocommerce #secondary .widget li.woocommerce-widget-layered-nav-list__item--chosen a,
.woocommerce #secondary .widget li.is-active a { font-weight: 700; }
.woocommerce #secondary .widget li.chosen a::before,
.woocommerce #secondary .widget li.woocommerce-widget-layered-nav-list__item--chosen a::before,
.woocommerce #secondary .widget li.is-active a::before {
	border-color: var(--b27-action);
	background-color: var(--b27-action);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 6.2 5 8.5l4.5-5'/%3E%3C/svg%3E");
}
.b27-price-ranges a::before { border-radius: 50% !important; }   /* single choice → radio look */
/* Tapped, page loading (filters.js): the box flips at once, the rest of the panel waits. */
.woocommerce #secondary .widget li.is-pending:not(.chosen):not(.woocommerce-widget-layered-nav-list__item--chosen):not(.is-active) a::before {
	border-color: var(--b27-action);
	background-color: var(--b27-action);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 6.2 5 8.5l4.5-5'/%3E%3C/svg%3E");
}
.woocommerce #secondary .widget li.is-pending:is(.chosen, .woocommerce-widget-layered-nav-list__item--chosen, .is-active) a::before {
	border-color: #9E8A90;
	background-color: var(--b27-surface);
	background-image: none;
}
#secondary.is-loading .b27-filter__body { pointer-events: none; }
#secondary.is-loading .b27-filter__body > :not(ul),
#secondary.is-loading .b27-filter__body li:not(.is-pending) { opacity: .55; transition: opacity .15s ease; }
#secondary.is-loading .b27-drawer__apply { cursor: progress; }
#main.is-loading ul.products,
#main.is-loading .b27-active-filters { opacity: .5; transition: opacity .15s ease; pointer-events: none; }
/* «Δείξε όλα»: a small outlined pill whose box always wraps the whole label. */
button.b27-filter__more {
	display: inline-flex;
	align-items: center;
	width: auto;
	min-height: 36px;
	margin: 0.5rem 0 0;
	padding: 0.35rem 1rem;
	border: 1px solid #E7C3CA;
	border-radius: var(--b27-radius-pill);
	background: var(--b27-surface);
	color: var(--b27-action);
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
}
button.b27-filter__more:hover, button.b27-filter__more:focus { border-color: var(--b27-action); background: #FFF0F2; color: var(--b27-action-dark); }

/* «Φίλτρα» button + off-canvas panel on every screen size: the filters stay closed
   until asked for, and the products get the full width (4 per row on desktop). */
@media all {
	.b27-filters-btn {
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;
		min-height: 44px;
		padding: 0 1.1rem;
		border: 1px solid var(--b27-ink);
		border-radius: 999px !important;
		background: var(--b27-surface);
		color: var(--b27-ink);
		font-weight: 700;
		cursor: pointer;
	}
	.b27-filters-btn:hover { background: var(--b27-ink); color: var(--b27-surface); }
	.b27-filters-btn__icon {
		width: 18px;
		height: 18px;
		background: currentColor;
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 6h16M7 12h10M10 18h4'/%3E%3C/svg%3E") center / contain no-repeat;
		mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 6h16M7 12h10M10 18h4'/%3E%3C/svg%3E") center / contain no-repeat;
	}
	.b27-filters-btn__count { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--b27-action); color: var(--b27-surface); font-size: 0.75rem; }
	.b27-filters-btn:hover .b27-filters-btn__count { background: var(--b27-surface); color: var(--b27-ink); }
}
/* Desktop toolbar: [Φίλτρα] [N προϊόντα] ……… [Ταξινόμηση ▾] [▦ ☰]; no sidebar column any more. */
@media (min-width: 1025px) {
	.woocommerce .kadence-shop-top-row { align-items: center; gap: 1rem; }
	.woocommerce .kadence-shop-top-row .kadence-woo-results-count { margin-right: auto; }
	.woocommerce.has-sidebar .content-container.site-container,
	.woocommerce.has-sidebar .content-container { grid-template-columns: minmax(0, 1fr); }
	.woocommerce.has-sidebar #main { grid-column: 1; grid-row: 1; }
}
@media (max-width: 1024px) {
	/* Toolbar: [Φίλτρα] [Ταξινόμηση ▾] on one row, the count below. */
	.woocommerce .kadence-shop-top-row .kadence-woo-results-count { order: 3; flex-basis: 100%; }
	.woocommerce .kadence-shop-top-row .kadence-woo-ordering { order: 2; flex: 1 1 auto; min-width: 0; max-width: 340px; margin-left: auto; }
	.woocommerce .kadence-shop-top-row .b27-filters-btn { flex: none; }
	.woocommerce .b27-ordering, .b27-ordering__control { width: 100%; min-width: 0; }
	.woocommerce .b27-ordering select.orderby { width: 100%; min-width: 0; text-overflow: ellipsis; }
	.woocommerce .kadence-shop-top-row .kadence-woo-toggle { display: none; }
	.b27-ordering__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); white-space: nowrap; }
}
@media all {
	/* The sidebar is an off-canvas panel from the right. */
	.woocommerce.has-sidebar #secondary {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		z-index: 100001;
		display: flex;
		flex-direction: column;
		width: min(92vw, 400px);
		max-width: none;
		margin: 0;
		padding: 0;
		background: var(--b27-surface);
		box-shadow: -12px 0 40px rgba(0, 0, 0, 0.14);
		transform: translateX(100%);
		visibility: hidden;
		transition: transform .3s ease, visibility 0s linear .3s;
	}
	.woocommerce.has-sidebar #secondary.is-open { transform: none; visibility: visible; transition: transform .3s ease; }
	.woocommerce.has-sidebar #secondary.no-anim { transition: none; }
	.woocommerce.has-sidebar #secondary .sidebar-inner-wrap { flex: 1; overflow-y: auto; margin: 0; padding: 0 1.25rem; overscroll-behavior: contain; }
	.woocommerce #secondary .widget:first-of-type { border-top: 0; }
	.b27-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 0.75rem 0.75rem 0.75rem 1.25rem; border-bottom: 1px solid #F3C6CD; }
	.b27-drawer__title { margin: 0; font-size: 1.35rem; color: var(--b27-ink); }
	.b27-drawer__title:focus { outline: none; }
	.b27-drawer__close { width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50% !important; background: none; color: var(--b27-ink); font-size: 1.75rem; line-height: 1; cursor: pointer; }
	.b27-drawer__close:hover { background: #FFF0F2; color: var(--b27-action); }
	.b27-drawer__foot { display: flex; align-items: center; gap: 1rem; padding: 0.9rem 1.25rem calc(0.9rem + env(safe-area-inset-bottom)); border-top: 1px solid #F3C6CD; background: var(--b27-surface); }
	.b27-drawer__clear { font-weight: 700; color: var(--b27-action); }
	.b27-drawer__apply { flex: 1; min-height: 48px; padding: 0 1rem; white-space: nowrap; font-size: 0.95rem; }
	.b27-drawer-backdrop { position: fixed; inset: 0; z-index: 100000; background: rgba(0, 0, 0, 0.35); }
	.b27-drawer-backdrop[hidden] { display: none; }
	html.b27-drawer-open { overflow: hidden; }
}
@media (prefers-reduced-motion: reduce) {
	.woocommerce.has-sidebar #secondary, .woocommerce.has-sidebar #secondary.is-open, .b27-filter__chevron { transition: none; }
}

/* Skin profile (My Account) */
.b27-profile__group { margin: 0 0 1.5rem; padding: 1rem 1.25rem; border: 1px solid #F3C6CD; border-radius: 12px; }
.b27-profile__group legend { padding: 0 0.4rem; font-weight: 700; }
.b27-profile__legend-hint { font-weight: 400; color: #3d3d3d; }
.b27-profile__choice { display: grid; grid-template-columns: auto 1fr; column-gap: 0.6rem; margin: 0 0 0.6rem; }
.b27-profile__choice input { margin-top: 0.3rem; width: 1.15rem; height: 1.15rem; accent-color: var(--b27-action); }
.b27-profile__quiz > p { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.25rem; }   /* the text link wraps under the button, not over it (WCAG 2.5.8) */
.b27-profile__choice label { font-weight: 600; }
.b27-profile__desc { grid-column: 2; font-size: 0.875rem; color: #3d3d3d; }
.b27-profile__consent { display: grid; grid-template-columns: auto 1fr; column-gap: 0.6rem; }
.b27-profile__consent input { margin-top: 0.3rem; width: 1.15rem; height: 1.15rem; accent-color: var(--b27-action); }
.b27-profile__delete-btn { min-height: 44px; padding: 0 1rem; border: 2px solid #8A0019; border-radius: 999px; background: #fff; color: #8A0019; font-weight: 600; cursor: pointer; }
.b27-profile__delete-btn:hover { background: #8A0019; color: #fff; }
.b27-profile-cta { margin: 1rem 0; padding: 1rem 1.25rem; border-radius: 12px; background: #FFF4F6; border: 1px solid #F3C6CD; }
.b27-profile-cta p { margin: 0; }

/* Sale prices: the struck-through old price must stay readable (Kadence fades it). */
.woocommerce .price del, .woocommerce .price del .amount, .woocommerce .price del bdi,
.woocommerce ul.products li.product .price del,
.woocommerce div.product p.price del,
.woocommerce div.product span.price del { opacity: 1; color: #555555; }
.woocommerce .price ins { text-decoration: none; }

/* ------------------------------------------------------------------ */
/* Single product                                                      */
/* ------------------------------------------------------------------ */
/* Breadcrumbs (Kadence): product and category pages, quiet and aligned. */
.kadence-breadcrumbs { margin: 0 0 1.5rem; color: #3d3d3d; font-size: 0.8125rem; line-height: 1.5; }
.kadence-breadcrumbs a { color: #1a1a1a; text-decoration: none; }
.kadence-breadcrumbs a:hover { color: var(--b27-action); text-decoration: underline; text-underline-offset: 3px; }
.kadence-breadcrumbs .bc-delimiter { margin: 0 0.5em; color: #555; }
.product-archive-title .kadence-breadcrumbs,
.entry-hero .kadence-breadcrumbs { margin: 0 0 0.75rem; }

@media (min-width: 768px) {
	.single-product div.product {
		position: relative;
		display: grid;
		grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
		column-gap: clamp(1.75rem, 4.5vw, 5rem);
		align-items: start;
	}
	.single-product div.product > * { grid-column: 1 / -1; }
	.single-product div.product > .b27-gallery-col,
	.single-product div.product > .summary { grid-row: 1; width: auto !important; float: none !important; margin: 0 !important; }
	.single-product div.product > .b27-gallery-col { grid-column: 1; align-self: stretch; }   /* as tall as the summary: the sticky photo stops at its end */
	.single-product div.product > .summary { grid-column: 2; padding-top: 0.5rem; }
}

/* Desktop: the photo follows the page while the summary scrolls and stops where its grid row ends (above the tabs).
   Offset = sticky header (73px) + the admin bar when logged in. */
@media (min-width: 1200px) {
	.single-product .b27-gallery-col > .woocommerce-product-gallery { position: sticky !important; top: calc(73px + 1.5rem + var(--wp-admin--admin-bar--height, 0px)); }
}

/* Gallery: square frame (the product photos are square), the whole photo visible, rounded. */
.single-product div.product .woocommerce-product-gallery { position: relative; }
.single-product .b27-gallery-col > .woocommerce-product-gallery { width: 100% !important; float: none !important; margin: 0 !important; }
.single-product .woocommerce-product-gallery .flex-viewport,
.single-product .woocommerce-product-gallery__wrapper { border-radius: 22px; overflow: hidden; background: #FFF4F6; }
.single-product .woocommerce-product-gallery__image img { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; background: #fff; }
.single-product .woocommerce-product-gallery .flex-control-thumbs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.75rem; margin: 0.9rem 0 0; padding: 0; }
.single-product .woocommerce-product-gallery .flex-control-thumbs li { width: auto !important; margin: 0 !important; float: none !important; }
.single-product .woocommerce-product-gallery .flex-control-thumbs img { aspect-ratio: 1; object-fit: contain; background: #fff; border: 2px solid transparent; border-radius: 12px; opacity: 0.7; transition: opacity .15s ease, border-color .15s ease; }
.single-product .woocommerce-product-gallery .flex-control-thumbs img.flex-active,
.single-product .woocommerce-product-gallery .flex-control-thumbs img:hover { opacity: 1; border-color: var(--b27-action); }
.single-product .woocommerce-product-gallery__trigger {
	position: absolute;
	top: 1rem;
	right: 1rem;
	z-index: 5;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--b27-surface);
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
	color: var(--b27-ink);
	text-indent: 0;
}
.single-product .woocommerce-product-gallery__trigger > span { display: none; }   /* WordPress turns the 🔍 into an <img> */
.single-product .woocommerce-product-gallery__trigger::before {
	content: "";
	width: 20px;
	height: 20px;
	border: 0;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m20 20-4.8-4.8M10.5 7.5v6M7.5 10.5h6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m20 20-4.8-4.8M10.5 7.5v6M7.5 10.5h6'/%3E%3C/svg%3E") center / contain no-repeat;
	position: static;
	transform: none;
}
.single-product .woocommerce-product-gallery__trigger::after { display: none; }
.single-product .woocommerce-product-gallery__trigger:hover { color: var(--b27-action); }

/* Discount badge (single + cards). */
.woocommerce span.onsale.b27-onsale {
	min-width: 0;
	min-height: 0;
	padding: 0.35em 0.8em;
	border-radius: 999px;
	background: var(--b27-action);
	color: var(--b27-surface);
	font-size: 0.8125rem;
	font-weight: 700;
	line-height: 1.2;
}
.single-product div.product > span.onsale { position: absolute; top: 1rem; left: 1rem; right: auto; z-index: 6; margin: 0; }

/* Summary hierarchy: brand → title → price → text → choices → buy → info. */
.b27-product-eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin: 0 0 0.7rem; }
.b27-product-brand { color: var(--b27-action); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none; }
.b27-product-brand:hover { text-decoration: underline; text-underline-offset: 3px; }
.b27-product-badge { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.3em 0.75em; border-radius: 999px; background: #FFE3E7; color: var(--b27-action-dark); font-size: 0.75rem; font-weight: 700; }
.b27-product-badge::before { content: ""; width: 11px; height: 11px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.2 6.6L21 11l-6.8 2.4L12 20l-2.2-6.6L3 11l6.8-2.4z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.2 6.6L21 11l-6.8 2.4L12 20l-2.2-6.6L3 11l6.8-2.4z'/%3E%3C/svg%3E") center / contain no-repeat; }
.single-product .summary .product_title { margin: 0 0 1rem; color: var(--b27-ink); font-size: clamp(1.85rem, 2.8vw, 2.5rem); font-weight: 500; line-height: 1.12; letter-spacing: -0.01em; }
.b27-product-subtitle { max-width: 34rem; margin: 0 0 1rem; color: #555; font-size: 1rem; line-height: 1.5; }
.b27-product-subtitle:has(+ .b27-product-size) { margin-bottom: 0.35rem; }
.b27-product-size { margin: 0 0 1rem; color: #555; font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.04em; }
.single-product .summary .product_title:has(+ .b27-product-subtitle) { margin-bottom: 0.6rem; }
.woocommerce.single-product div.product .summary .price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.75rem; margin: 0 0 0.5rem; color: var(--b27-ink); font-size: 1.75rem; font-weight: 700; }
.single-product .summary .price ins { order: 1; color: var(--b27-action); }
.single-product .summary .price del { order: 2; font-size: 1.1rem; font-weight: 500; }
.b27-savings { display: flex; align-items: center; gap: 0.5rem; margin: 0 0 1.5rem; color: var(--b27-action-dark); font-size: 0.875rem; font-weight: 600; }
.b27-savings__pct { padding: 0.2em 0.6em; border-radius: 999px; background: var(--b27-action); color: var(--b27-surface); font-size: 0.75rem; font-weight: 700; }
.single-product .summary .woocommerce-product-details__short-description { max-width: 34rem; margin: 1rem 0 1.5rem; color: #3d3d3d; font-size: 1.0625rem; line-height: 1.7; }
.single-product .summary .b27-savings + .woocommerce-product-details__short-description { margin-top: 0; }
.single-product .summary .woocommerce-product-details__short-description p:last-child { margin-bottom: 0; }

.b27-product-attrs { display: grid; gap: 0.75rem; margin: 0 0 1.5rem; padding: 0; border: 0; }
.b27-product-attrs__row { display: grid; grid-template-columns: 8rem 1fr; align-items: baseline; gap: 0.75rem; }
.b27-product-attrs dt { margin: 0; color: #555; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.b27-product-attrs dd { margin: 0; }
.b27-product-attrs ul { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0; padding: 0; list-style: none; }
.b27-product-attrs li { padding: 0.25em 0.8em; border: 1px solid #EFD0D6; border-radius: 999px; background: var(--b27-surface); color: var(--b27-ink); font-size: 0.8125rem; }

.single-product .summary .stock { display: inline-flex; align-items: center; gap: 0.5rem; margin: 0 0 0.9rem; font-size: 0.875rem; font-weight: 600; }
.single-product .summary .stock.in-stock { color: #1E7B34; }
.single-product .summary .stock.in-stock::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #2E9E4A; box-shadow: 0 0 0 4px rgba(46, 158, 74, 0.15); }
.single-product .summary .stock.out-of-stock { color: #8A0019; }

/* Buy row: quantity stepper + prominent add to cart + round wishlist heart. */
.single-product .summary form.cart:not(.variations_form),
.single-product .summary .woocommerce-variation-add-to-cart { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; margin: 0 0 1.75rem; }
.single-product .summary form.cart .quantity { display: inline-flex; align-items: center; margin: 0; border: 1px solid #E7B3BC; border-radius: 999px; background: var(--b27-surface); overflow: hidden; }
.single-product .summary form.cart .quantity input.qty { width: 3rem; min-height: 54px; margin: 0; padding: 0; border: 0; background: transparent; font-size: 1rem; font-weight: 700; text-align: center; -moz-appearance: textfield; }
.single-product .summary form.cart .quantity input.qty::-webkit-inner-spin-button,
.single-product .summary form.cart .quantity input.qty::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.single-product .summary form.cart .quantity input.minus,
.single-product .summary form.cart .quantity input.plus { width: 44px; min-height: 54px; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--b27-ink); font-size: 1.25rem; font-weight: 500; cursor: pointer; }
.single-product .summary form.cart .quantity input.minus:hover,
.single-product .summary form.cart .quantity input.plus:hover { background: #FFF0F2; color: var(--b27-action); }
.single-product .summary form.cart .single_add_to_cart_button {
	display: inline-flex;
	flex: 1 1 240px;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	min-height: 56px;
	margin: 0;
	padding: 0 2rem;
	border-radius: 999px;
	background: var(--b27-action);
	color: var(--b27-surface);
	font-size: 1.0625rem;
	font-weight: 700;
	letter-spacing: 0.01em;
	box-shadow: 0 10px 24px rgba(168, 18, 79, 0.25);
	transition: background-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.single-product .summary form.cart .single_add_to_cart_button::before { content: ""; flex: none; width: 20px; height: 20px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8h14l-1.2 11.1a2 2 0 0 1-2 1.9H8.2a2 2 0 0 1-2-1.9z'/%3E%3Cpath d='M9 8V6.5a3 3 0 0 1 6 0V8'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8h14l-1.2 11.1a2 2 0 0 1-2 1.9H8.2a2 2 0 0 1-2-1.9z'/%3E%3Cpath d='M9 8V6.5a3 3 0 0 1 6 0V8'/%3E%3C/svg%3E") center / contain no-repeat; }
.single-product .summary form.cart .single_add_to_cart_button:hover { background: var(--b27-action-dark); box-shadow: 0 14px 28px rgba(168, 18, 79, 0.3); transform: translateY(-1px); }
/* Not yet available (e.g. no gift card amount chosen): clearly inactive but still readable (≈7:1). */
.single-product .summary form.cart .single_add_to_cart_button.disabled,
.single-product .summary form.cart .single_add_to_cart_button:disabled { opacity: 1; background: #F3C6CD; color: var(--b27-action-dark); box-shadow: none; cursor: not-allowed; transform: none; }
.single-product .summary form.cart .tinv-wraper { flex: none; margin: 0; }
/* TI Wishlist ships a default blue (#007acc) with high specificity — use the brand colours everywhere. */
body .tinv-wishlist a:not(.button):not(.social) { color: var(--b27-action); }
.woocommerce.single-product div.product .summary form.cart .tinvwl_add_to_wishlist_button { color: var(--b27-ink); font-family: var(--global-body-font-family); text-decoration: none; }
.woocommerce.single-product div.product .summary form.cart .tinvwl_add_to_wishlist_button:hover { color: var(--b27-action); }
/* Heart only (the name comes from aria-label «Προσθήκη στα αγαπημένα»). */
.woocommerce.single-product div.product .summary form.cart .tinvwl_add_to_wishlist_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin: 0;
	padding: 0;
	border: 1px solid #E7B3BC;
	border-radius: 50%;
	background: var(--b27-surface);
	font-size: 0;
	transition: background-color .15s ease, border-color .15s ease;
}
.woocommerce.single-product div.product .summary form.cart .tinvwl_add_to_wishlist_button::before { margin: 0; color: var(--b27-action); font-size: 1.35rem; }
.woocommerce.single-product div.product .summary form.cart .tinvwl_add_to_wishlist_button:hover { border-color: var(--b27-action); background: #FFF0F2; }
.single-product .summary .ppc-button-wrapper:empty { display: none; }

/* Variations (e.g. gift card amounts). */
.single-product .summary table.variations { width: 100%; margin: 0 0 1.25rem; border: 0; }
.single-product .summary table.variations tr { display: grid; gap: 0.5rem; }
.single-product .summary table.variations th,
.single-product .summary table.variations td { display: block; padding: 0; border: 0; background: none; text-align: left; }
.single-product .summary table.variations th label { color: var(--b27-ink); font-size: 0.875rem; font-weight: 700; }
.woocommerce.single-product div.product .summary table.variations select {
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	min-height: 52px;
	margin: 0;
	padding: 0 2.75rem 0 1.1rem;
	border: 1px solid #E7B3BC;
	border-radius: 999px;
	background: var(--b27-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23A8124F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E") right 1.1rem center / 12px no-repeat;
	color: var(--b27-ink);
	font-size: 1rem;
	font-weight: 600;
}
.single-product .summary .reset_variations { font-size: 0.8125rem; }

/* Shipping / trust box (Kadence «extras»). */
.single-product .single-product-extras { margin: 0 0 1.75rem; padding: 1rem 1.2rem; border: 0; border-radius: 16px; background: #FFF6F7; }
.single-product .single-product-extras > p { display: flex; align-items: center; gap: 0.6rem; margin: 0 0 0.6rem; font-size: 0.9375rem; }
.single-product .single-product-extras > p::before {
	content: "";
	flex: none;
	width: 22px;
	height: 22px;
	background: var(--b27-action);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v10H3zM14 9h4l3 3v4h-7'/%3E%3Ccircle cx='7' cy='17.5' r='1.8'/%3E%3Ccircle cx='17' cy='17.5' r='1.8'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v10H3zM14 9h4l3 3v4h-7'/%3E%3Ccircle cx='7' cy='17.5' r='1.8'/%3E%3Ccircle cx='17' cy='17.5' r='1.8'/%3E%3C/svg%3E") center / contain no-repeat;
}
.single-product .single-product-extras ul { display: grid; gap: 0.35rem; margin: 0; padding: 0; list-style: none; font-size: 0.875rem; color: #3d3d3d; }
.single-product .single-product-extras li { display: flex; align-items: center; gap: 0.6rem; margin: 0; }
.single-product .single-product-extras .kadence-svg-iconset { flex: none; width: 22px; color: var(--b27-action); }

.single-product .summary .product_meta { padding-top: 1rem; border-top: 1px solid #F3C6CD; font-size: 0.8125rem; color: #555; }
.woocommerce.single-product div.product .summary .product_meta > span { display: block; margin-bottom: 0.25rem; font-size: 0.8125rem; }
.single-product .summary .product_meta a { color: #3d3d3d; }
/* Brand and «Vivian's Choice» already show above the title. */
.woocommerce.single-product div.product .summary .product_meta > .tagged_as,
.woocommerce.single-product div.product .summary .product_meta > .posted_in + .posted_in,
.woocommerce.single-product div.product .summary .product_meta > .tagged_as + .posted_in { display: none; }

/* Tabs: clean underline tabs (selectors match Kadence's .woocommerce div.product … specificity). */
.woocommerce.single-product div.product .woocommerce-tabs { margin-top: clamp(2.5rem, 6vw, 4.5rem); }
.woocommerce.single-product div.product .woocommerce-tabs ul.tabs {
	display: flex;
	gap: 2rem;
	margin: 0 0 1.5rem;
	padding: 0;
	border: 0;
	border-bottom: 1px solid #F3C6CD;
	overflow-x: auto;
	scrollbar-width: none;
}
.woocommerce.single-product div.product .woocommerce-tabs ul.tabs::before,
.woocommerce.single-product div.product .woocommerce-tabs ul.tabs::after { display: none; }
.woocommerce.single-product div.product .woocommerce-tabs ul.tabs li { flex: none; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; }
.woocommerce.single-product div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce.single-product div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce.single-product div.product .woocommerce-tabs ul.tabs li a {
	display: block;
	padding: 0.9rem 0;
	border-bottom: 2px solid transparent;
	color: #555;   /* 7.4:1 — state is shown by colour + underline, so Kadence's 0.7 opacity is dropped */
	opacity: 1;
	font-size: 0.9375rem;
	font-weight: 700;
	text-decoration: none;
}
.woocommerce.single-product div.product .woocommerce-tabs ul.tabs li a:hover { color: var(--b27-ink); }
.woocommerce.single-product div.product .woocommerce-tabs ul.tabs li.active a { border-bottom-color: var(--b27-action); color: var(--b27-ink); }
.woocommerce.single-product div.product .woocommerce-tabs .panel { max-width: 780px; margin: 0; padding: 0; border: 0; line-height: 1.75; }
.woocommerce.single-product div.product .woocommerce-tabs .panel > h2:first-child { display: none; }   /* repeats the tab label */
.woocommerce.single-product div.product .woocommerce-tabs table.shop_attributes { border: 0; }
.woocommerce.single-product div.product .woocommerce-tabs table.shop_attributes th,
.woocommerce.single-product div.product .woocommerce-tabs table.shop_attributes td { padding: 0.75rem 0; border: 0; border-bottom: 1px solid #F3C6CD; background: none; font-style: normal; }
.woocommerce.single-product div.product .woocommerce-tabs table.shop_attributes th { width: 12rem; font-weight: 700; }

/* Related products. */
.single-product section.related { margin-top: clamp(2.5rem, 6vw, 4.5rem); }
.single-product section.related > h2 { margin: 0 0 1.25rem; font-size: clamp(1.5rem, 2.5vw, 2rem); color: var(--b27-ink); }

/* Mobile / tablet. */
@media (max-width: 1024px) {
	.single-product .woocommerce-product-gallery .flex-control-thumbs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.b27-product-attrs__row { grid-template-columns: 1fr; gap: 0.35rem; }
	.woocommerce.single-product div.product .woocommerce-tabs ul.tabs { gap: 1.5rem; }
}
@media (max-width: 767px) {
	.single-product div.product > .b27-gallery-col { margin: 0 0 1.5rem; }
	/* Tabs: all visible as wrapping pills instead of a row that scrolls sideways. */
	.woocommerce.single-product div.product .woocommerce-tabs ul.tabs { flex-wrap: wrap; gap: 0.5rem; padding-bottom: 1rem; overflow: visible; }
	.woocommerce.single-product div.product .woocommerce-tabs ul.tabs li a { padding: 0.55rem 0.95rem; border: 1px solid #EFD0D6; border-radius: 999px; background: var(--b27-surface); font-size: 0.875rem; }
	.woocommerce.single-product div.product .woocommerce-tabs ul.tabs li.active a { border-color: var(--b27-action); background: var(--b27-action); color: var(--b27-surface); }
	.single-product div.product > .summary { width: 100% !important; float: none !important; }
}
@media (max-width: 480px) {
	/* Quantity + heart on one row, add to cart full width underneath. */
	.single-product .summary form.cart .single_add_to_cart_button { order: 3; flex: 1 1 100%; padding: 0 1rem; }
	.single-product .summary form.cart .tinv-wraper { margin-left: auto; }
}

/* Sticky buy bar (mobile/tablet), shown once the main button scrolls away. */
.b27-buybar { display: none; }
@media (max-width: 1024px) {
	.b27-buybar {
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 9990;
		display: flex;
		align-items: center;
		gap: 0.75rem;
		padding: 0.6rem 1rem calc(0.6rem + env(safe-area-inset-bottom));
		background: var(--b27-surface);
		border-top: 1px solid #F3C6CD;
		box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.08);
	}
	.b27-buybar[hidden] { display: none; }
	.b27-buybar__info { display: grid; flex: 1; min-width: 5.5em; }   /* the price always fits; the button shrinks and wraps instead (text spacing, WCAG 1.4.12) */
	.b27-buybar__title { overflow: hidden; font-size: 0.8125rem; color: #3d3d3d; white-space: nowrap; text-overflow: ellipsis; }
	.b27-buybar__price { font-size: 1.05rem; font-weight: 700; color: var(--b27-ink); }
	.b27-buybar__btn { flex: 0 1 auto; min-height: 48px; padding: 0 1.25rem; border-radius: 999px; font-weight: 700; white-space: normal; text-align: center; }
	html.b27-buybar-visible body { padding-bottom: 76px; }
	html.b27-buybar-visible #kt-scroll-up { bottom: 90px; }
}
@media (prefers-reduced-motion: reduce) {
	.single-product .summary form.cart .single_add_to_cart_button { transition: none; }
	.single-product .summary form.cart .single_add_to_cart_button:hover { transform: none; }
}

/* ------------------------------------------------------------------ */
/* Product cards (shop, categories, related products, quiz results)    */
/* ------------------------------------------------------------------ */
.woocommerce ul.products li.product {
	position: relative;
	overflow: hidden;
	border: 1px solid #F6DDE1;
	border-radius: 18px;
	background: var(--b27-surface);
	box-shadow: none;
	container-type: inline-size;   /* 100cqw = card width = height of the square photo */
	transition: box-shadow .25s ease;
}
.woocommerce ul.products li.product:hover { box-shadow: 0 14px 34px rgba(168, 18, 79, 0.10); }
.woocommerce ul.products li.product .woocommerce-loop-image-link { display: block; overflow: hidden; background: #FFF4F6; }
/* The whole product photo, with breathing room, so nothing touches the card edge or hides under the badge. */
.woocommerce ul.products li.product .woocommerce-loop-image-link img { display: block; width: 100%; height: auto; margin: 0; padding: 7%; box-sizing: border-box; aspect-ratio: 1; object-fit: contain; background: #fff; transition: transform .5s ease; }
.woocommerce ul.products li.product:hover .woocommerce-loop-image-link img { transform: scale(1.04); }
.woocommerce ul.products li.product .product-details { padding: 1rem 1.1rem 1.2rem; }
.woocommerce ul.products li.product .b27-loop-brand { margin: 0 0 0.3rem; color: var(--b27-action); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.14em; line-height: 1.3; text-transform: uppercase; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { margin: 0 0 0.4rem; padding: 0; font-size: 1.05rem; line-height: 1.3; }
.woocommerce ul.products li.product .woocommerce-loop-product__title a { color: var(--b27-ink); }
.woocommerce ul.products li.product .price { color: var(--b27-ink); font-size: 1rem; font-weight: 700; }

/* Card actions (client, 1/10): «Προσθήκη στο καλάθι» as a full button at the bottom of every card (always visible,
   on the same line across a row), and the wishlist as a plain heart, no frame, at the top right of the photo. */
.woocommerce ul.products:not(.products-list-view) li.product { display: flex; flex-direction: column; }
.woocommerce ul.products:not(.products-list-view) li.product .product-details,
.woocommerce ul.products.woo-archive-action-on-hover:not(.products-list-view) li.product:hover .product-details { position: static; display: flex; flex: 1; flex-direction: column; transform: none; }
.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap,
.woocommerce ul.products.woo-archive-action-on-hover:not(.products-list-view) li.product .product-action-wrap { position: static; display: block; margin: auto 0 0; padding: 0.9rem 0 0; opacity: 1; transform: none; pointer-events: auto; }
.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	width: 100%;
	min-height: 44px;
	margin: 0;
	padding: 0.55rem 0.9rem;
	border: 0;
	border-radius: 999px;
	background: var(--b27-action);
	color: var(--b27-surface);
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	text-transform: none;
	white-space: normal;
	box-shadow: none;
}
.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .button:hover,
.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .button:focus-visible { background: var(--b27-action-dark); color: var(--b27-surface); }
.woocommerce ul.products li.product .product-action-wrap .button::before { content: ""; flex: none; width: 18px; height: 18px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8h14l-1.2 11.1a2 2 0 0 1-2 1.9H8.2a2 2 0 0 1-2-1.9z'/%3E%3Cpath d='M9 8V6.5a3 3 0 0 1 6 0V8'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8h14l-1.2 11.1a2 2 0 0 1-2 1.9H8.2a2 2 0 0 1-2-1.9z'/%3E%3Cpath d='M9 8V6.5a3 3 0 0 1 6 0V8'/%3E%3C/svg%3E") center / contain no-repeat; }
.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .button .kadence-svg-iconset { display: none; }
.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .button.loading::before,
.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .button.added::before { display: none; }
.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .button.loading .kadence-svg-iconset:nth-of-type(2),
.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .button.added .kadence-svg-iconset:nth-of-type(3) { display: inline-flex; }
.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .added_to_cart { display: none; }   /* header bag updates instead */
.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .tinv-wraper { position: absolute; top: 0.35rem; right: 0.35rem; z-index: 3; width: auto; height: auto; min-height: 0; margin: 0; padding: 0; line-height: 0; }
.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .tinv-wishlist-clear { display: none; }
.woocommerce ul.products li.product .product-action-wrap .tinvwl_add_to_wishlist_button {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; margin: 0; padding: 0;
	border: 0; border-radius: 50%; background: none; box-shadow: none; font-size: 0;
}
.woocommerce ul.products li.product .product-action-wrap .tinvwl_add_to_wishlist_button::before { margin: 0; color: var(--b27-action); font-size: 1.45rem; transition: transform .15s ease; }
.woocommerce ul.products li.product .product-action-wrap .tinvwl_add_to_wishlist_button:hover::before { transform: scale(1.12); }
/* TI Wishlist's hover tooltip (with a pointer arrow) off on cards: the heart already has its name (aria-label). */
.woocommerce ul.products li.product .tinvwl-tooltip { display: none !important; }
/* The heart is an icon-font glyph inside the link, so it inherits the link underline: none in every state. */
.woocommerce ul.products li.product .tinvwl_add_to_wishlist_button,
.woocommerce ul.products li.product .tinvwl_add_to_wishlist_button:is(:hover, :focus, :focus-visible, :active),
.woocommerce ul.products li.product .tinvwl_add_to_wishlist_button::before { text-decoration: none !important; }
/* The same lines in every card, at the same height (client, 1/10): photo, brand (one line), sun/moon, name
   (two lines at most, then «…»), price, button. Empty brand / sun-moon lines keep their space. */
.woocommerce ul.products:not(.products-list-view) li.product .product-details > .b27-loop-brand { height: 1.3em; margin: 0 0 0.35rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.woocommerce ul.products:not(.products-list-view) li.product .product-details > .b27-when { display: flex; height: 1.15rem; margin: 0 0 0.35rem; }
.woocommerce ul.products:not(.products-list-view) li.product .product-details > .woocommerce-loop-product__title { display: -webkit-box; min-height: 2.6em; margin: 0 0 0.5rem; overflow: hidden; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
/* The link itself is clamped too: otherwise its hidden third line still overlaps the «Προσθήκη» button (axe target-size, WCAG 2.5.8). */
.woocommerce ul.products:not(.products-list-view) li.product .product-details > .woocommerce-loop-product__title > a { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.woocommerce ul.products:not(.products-list-view) li.product .product-details > .price { display: block; min-height: 1.5em; margin: 0; }
.woocommerce ul.products:not(.products-list-view) li.product .product-details > .product-excerpt { display: none; }
/* Narrow cards (2 per row on phones): a little tighter. */
@container (max-width: 230px) {
	.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .button { gap: 0.35rem; padding: 0.5rem 0.4rem; }
	.woocommerce ul.products:not(.products-list-view) li.product .product-action-wrap .button.add_to_cart_button.product_type_simple { white-space: nowrap; }   /* «Καλάθι» never breaks */
}
/* The heart takes the top right, so the badges go top left, and a sale badge to the bottom left of the photo. */
.woocommerce ul.products li.product .b27-badges { right: auto; left: 10px; align-items: flex-start; }
.woocommerce ul.products li.product span.onsale.b27-onsale { top: calc(100cqw - 2.5rem); right: auto; left: 0.75rem; z-index: 2; margin: 0; }
@media (prefers-reduced-motion: reduce) {
	.woocommerce ul.products li.product,
	.woocommerce ul.products li.product .woocommerce-loop-image-link img,
	.woocommerce ul.products li.product .tinvwl_add_to_wishlist_button::before { transition: none; }
	.woocommerce ul.products li.product:hover .woocommerce-loop-image-link img { transform: none; }
}

/* ------------------------------------------------------------------ */
/* Cart & checkout: gift card field — compact, opens when needed       */
/* ------------------------------------------------------------------ */
#pwgc-redeem-gift-card-container { margin: 0; padding: 0.35rem 0; }
#pwgc-redeem-gift-card-form { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 0; }
#pwgc-redeem-gift-card-form label {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	flex-basis: 100%;
	margin: 0;
	color: var(--b27-action);
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}
#pwgc-redeem-gift-card-form label::before { content: ""; flex: none; width: 16px; height: 16px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='4' rx='1'/%3E%3Cpath d='M5 12v8h14v-8M12 8v12M12 8c-2-4-6-4-6-1.5S12 8 12 8zm0 0c2-4 6-4 6-1.5S12 8 12 8z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='4' rx='1'/%3E%3Cpath d='M5 12v8h14v-8M12 8v12M12 8c-2-4-6-4-6-1.5S12 8 12 8zm0 0c2-4 6-4 6-1.5S12 8 12 8z'/%3E%3C/svg%3E") center / contain no-repeat; }
#pwgc-redeem-gift-card-form input {
	flex: 1 1 140px;
	min-width: 0;
	min-height: 40px;
	margin: 0;
	padding: 0 0.9rem;
	border: 1px solid #E7B3BC;
	border-radius: 999px;
	background: var(--b27-surface);
	font-size: 0.875rem;
}
#pwgc-redeem-gift-card-form .pwgc-apply-gift-card-button {
	flex: none;
	min-height: 40px;
	margin: 0;
	padding: 0 1rem;
	border: 1px solid var(--b27-ink);
	border-radius: 999px;
	background: var(--b27-surface);
	color: var(--b27-ink);
	font-size: 0.8125rem;
	font-weight: 700;
}
#pwgc-redeem-gift-card-form .pwgc-apply-gift-card-button:hover { background: var(--b27-ink); color: var(--b27-surface); }
/* PW sets both controls to 100% width; keep them on one compact row. */
#pwgc-redeem-gift-card-container #pwgc-redeem-gift-card-form input,
#pwgc-redeem-gift-card-container #pwgc-redeem-gift-card-form .pwgc-apply-gift-card-button { width: auto; }
/* Collapsed until the field is focused (label click / Tab) or holds a code. Still focusable while collapsed. */
#pwgc-redeem-gift-card-form:not(:focus-within):not(:has(input:not(:placeholder-shown))) input,
#pwgc-redeem-gift-card-form:not(:focus-within):not(:has(input:not(:placeholder-shown))) .pwgc-apply-gift-card-button {
	position: absolute;
	width: 1px;
	height: 1px;
	min-height: 0;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	border: 0;
	white-space: nowrap;
}

/* ------------------------------------------------------------------ */
/* Cookie consent (CookieYes) in the B27 palette.                      */
/* The banner is served by CookieYes' cloud with inline blue styles,   */
/* so colours need !important. Accept and reject stay equally          */
/* prominent (GDPR); «Προσαρμογή» is the outline button.               */
/* ------------------------------------------------------------------ */
.cky-consent-container .cky-consent-bar,
.cky-preference-center {
	border: 1px solid #F6DDE1 !important;
	border-radius: 18px !important;
	box-shadow: 0 18px 50px rgba(0, 0, 0, 0.12) !important;
	font-family: var(--global-body-font-family);
}
.cky-consent-container .cky-title,
.cky-preference-center .cky-preference-title {
	color: var(--b27-ink) !important;
	font-family: var(--global-heading-font-family);
	font-size: 1.25rem;
	font-weight: 500;
}
.cky-consent-container .cky-notice-des,
.cky-consent-container .cky-notice-des p,
.cky-preference-center .cky-preference-content-wrapper { color: #3d3d3d !important; }
.cky-consent-container .cky-btn,
.cky-preference-center .cky-btn {
	min-height: 44px;
	border-radius: 999px !important;
	font-family: inherit;
	font-size: 0.875rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.01em;
	opacity: 1 !important;
	transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.cky-btn.cky-btn-accept,
.cky-btn.cky-btn-reject,
.cky-btn.cky-btn-preferences {
	border-color: var(--b27-action) !important;
	background-color: var(--b27-action) !important;
	color: var(--b27-surface) !important;
}
.cky-btn.cky-btn-accept:hover,
.cky-btn.cky-btn-reject:hover,
.cky-btn.cky-btn-preferences:hover {
	border-color: var(--b27-action-dark) !important;
	background-color: var(--b27-action-dark) !important;
}
.cky-btn.cky-btn-customize {
	border-color: var(--b27-action) !important;
	background-color: transparent !important;
	color: var(--b27-action) !important;
}
.cky-btn.cky-btn-customize:hover { background-color: #FFF0F2 !important; }
.cky-consent-container .cky-btn:focus-visible,
.cky-preference-center .cky-btn:focus-visible,
.cky-btn-revisit-wrapper .cky-btn-revisit:focus-visible {
	outline: 3px solid var(--b27-action) !important;
	outline-offset: 2px;
	box-shadow: 0 0 0 5px var(--b27-surface) !important;
}
.cky-preference-center .cky-show-desc-btn,
.cky-preference-center .cky-preference-content-wrapper a,
.cky-consent-container .cky-notice-des a { color: var(--b27-action) !important; }
.cky-preference-center .cky-switch input[type="checkbox"]:checked { background: var(--b27-action) !important; }
.cky-btn-revisit-wrapper { background-color: var(--b27-action) !important; }

/* ------------------------------------------------------------------ */
/* Header navigation: category row, highlighted links, dropdowns       */
/* ------------------------------------------------------------------ */
/* Desktop menu: one row, centred between logo and icons. Every item is a pink pill
   with its icon (as Trending now / Ιδέες για Δώρα); AI Skin Quiz filled so it stands out.
   «Αρχική» only in the mobile drawer — on desktop the logo is the way home. */
.b27-nav-icon { flex: none; order: -1; margin-right: 0.4em; vertical-align: -3px; }
#site-navigation .nav-drop-title-wrap:has(> .b27-nav-icon) { display: inline-flex; align-items: center; }
.mobile-navigation a:has(> .b27-nav-icon) { display: flex; align-items: center; }
/* Kadence's keyboard submenu button over the arrow: at least 24px wide (WCAG 2.5.8). */
#site-navigation .primary-menu-container > ul > li > .dropdown-nav-special-toggle { right: 3px; width: 26px; }
#site-navigation .menu > li.b27-ico-home { display: none; }
#site-navigation .primary-menu-container > ul { position: relative; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 0.4rem; }
#main-header #site-navigation .primary-menu-container > ul > li.menu-item > a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 0 0.9rem;
	border: 1px solid #FFE0E6;
	border-radius: var(--b27-radius-pill);
	background: #FFF0F2;
	color: var(--b27-action);
	font-weight: 700;
	white-space: nowrap;
	transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
#main-header #site-navigation .primary-menu-container > ul > li.menu-item:is(:hover, .menu-item--toggled-on) > a { border-color: #F3C6CD; background: #FFE0E6; color: var(--b27-action-dark); }
#main-header #site-navigation .primary-menu-container > ul > li:is(.current-menu-item, .current-menu-ancestor, .current-menu-parent) > a { border-color: var(--b27-action); }
#main-header #site-navigation .primary-menu-container > ul > li.b27-nav-quiz > a { border-color: var(--b27-action); background: var(--b27-action); color: var(--b27-surface); box-shadow: 0 6px 16px rgba(168, 18, 79, 0.25); }
#main-header #site-navigation .primary-menu-container > ul > li.b27-nav-quiz > a:hover { border-color: var(--b27-action-dark); background: var(--b27-action-dark); color: var(--b27-surface); }
#main-header #site-navigation .primary-menu-container > ul > li > a .dropdown-nav-toggle { margin-left: 0.15em; }

/* Dropdowns stay open while the pointer travels from the pill into the panel: an
   invisible bridge covers the gap, and the panel waits a moment before closing. */
#main-header #site-navigation .primary-menu-container > ul > li > ul.sub-menu {
	display: block;
	top: calc(100% + 8px);
	visibility: hidden;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity .15s ease .2s, transform .15s ease .2s, visibility 0s linear .35s;
}
#main-header #site-navigation .primary-menu-container > ul > li:is(:hover, .menu-item--toggled-on) > ul.sub-menu {
	visibility: visible;
	opacity: 1;
	transform: none;
	transition-delay: 0s;
}
#main-header #site-navigation .primary-menu-container > ul > li > ul.sub-menu::before { content: ""; position: absolute; right: 0; bottom: 100%; left: 0; height: 18px; }
@media (prefers-reduced-motion: reduce) {
	#main-header #site-navigation .primary-menu-container > ul > li > ul.sub-menu { transform: none; transition: visibility 0s linear .35s; }
}

/* Dropdowns: white panel, dark text (Kadence defaults to a dark panel). */
#masthead .header-navigation .header-menu-container ul ul.sub-menu {
	padding: 0.5rem 0;
	border: 1px solid #F6DDE1;
	border-radius: 14px;
	background: var(--b27-surface);
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.10);
}
#masthead .header-navigation .header-menu-container ul ul li.menu-item { border: 0; }
#masthead .header-navigation .header-menu-container ul ul li.menu-item > a {
	width: auto;
	min-width: 220px;
	padding: 0.55rem 1.15rem;
	color: var(--b27-ink);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
}
#masthead .header-navigation .header-menu-container ul ul li.menu-item > a:hover,
#masthead .header-navigation .header-menu-container ul ul li.current-menu-item > a { background: #FFF4F6; color: var(--b27-action); }

/* One-column dropdowns with a second level (e.g. Ενδεικτικές ρουτίνες): the sub-list opens to
   the side of its item (arrow ›), with the same bridge and close delay as the first level. */
#main-header #site-navigation .primary-menu-container > ul > li:not(.b27-mega) > ul > li.menu-item-has-children { position: relative; }
#main-header #site-navigation .primary-menu-container > ul > li.b27-deep > ul > li > a { min-width: 270px; white-space: nowrap; }
#main-header #site-navigation .primary-menu-container > ul > li:not(.b27-mega) > ul > li.menu-item-has-children > a { position: relative; padding-right: 2.5rem; }
#main-header #site-navigation .primary-menu-container > ul > li:not(.b27-mega) > ul > li.menu-item-has-children > a .nav-drop-title-wrap { position: static; }
#main-header #site-navigation .primary-menu-container > ul > li:not(.b27-mega) > ul > li > a .dropdown-nav-toggle { position: absolute; top: 50%; right: 0.9rem; margin: 0; transform: translateY(-50%); }   /* Kadence already turns the arrow to point right */
#main-header #site-navigation .primary-menu-container > ul > li:not(.b27-mega) > ul > li > ul.sub-menu {
	display: block;
	top: -0.5rem;
	left: 100%;
	margin-left: 6px;
	visibility: hidden;
	opacity: 0;
	transition: opacity .15s ease .2s, visibility 0s linear .35s;
}
#main-header #site-navigation .primary-menu-container > ul > li:not(.b27-mega) > ul > li:is(:hover, .menu-item--toggled-on) > ul.sub-menu { visibility: visible; opacity: 1; transition-delay: 0s; }
#main-header #site-navigation .primary-menu-container > ul > li:not(.b27-mega) > ul > li > ul.sub-menu::before { content: ""; position: absolute; top: 0; right: 100%; bottom: 0; width: 12px; }
#main-header #site-navigation .primary-menu-container > ul > li:not(.b27-mega) > ul > li > .dropdown-nav-special-toggle { right: 0.4rem; width: 28px; }

/* Skincare / Makeup: one panel with every subcategory and its filters. */
#site-navigation li.b27-mega { position: static; }
#main-header #site-navigation .primary-menu-container > ul > li.b27-mega > ul.sub-menu {
	display: grid;
	grid-template-columns: repeat(3, minmax(190px, 1fr));
	gap: 0.25rem 2rem;
	left: 50%;
	width: max-content;
	max-width: calc(100vw - 48px);
	padding: 1.25rem 1.75rem 1rem;
	transform: translate(-50%, 6px);
}
#main-header #site-navigation .primary-menu-container > ul > li.b27-mega > ul.sub-menu:has(> li:nth-child(4)) { grid-template-columns: repeat(4, minmax(190px, 1fr)); }
#main-header #site-navigation .primary-menu-container > ul > li.b27-mega:is(:hover, .menu-item--toggled-on) > ul.sub-menu { transform: translate(-50%, 0); }
#masthead #site-navigation li.b27-mega > ul > li.menu-item > a { min-width: 0; padding: 0.4rem 0 0.3rem; font-weight: 700; background: none; }
#masthead #site-navigation li.b27-mega ul ul.sub-menu {
	position: static;
	display: block;
	padding: 0 0 0.75rem;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	background: none;
}
#masthead #site-navigation li.b27-mega ul ul li.menu-item > a { min-width: 0; padding: 0.28rem 0; color: #3d3d3d; font-weight: 400; background: none; }
#masthead #site-navigation li.b27-mega ul ul li.menu-item > a:hover, #masthead #site-navigation li.b27-mega > ul > li.menu-item > a:hover { color: var(--b27-action); text-decoration: none; }   /* colour only, no underline (George, 9/10) */
#site-navigation li.b27-mega ul .dropdown-nav-toggle,
#site-navigation li.b27-mega ul .dropdown-nav-special-toggle,
#masthead #site-navigation li.b27-mega ul ul ul { display: none; }

/* A small heart in front of every subcategory in the menus, as a list marker (client list 1/10, item 31).
   The «/ ""» alternative text keeps screen readers from reading it out. */
#masthead .header-navigation .header-menu-container ul ul li.menu-item > a::before,
.mobile-navigation ul ul li.menu-item > a::before,
.mobile-navigation ul ul li.menu-item > .drawer-nav-drop-wrap > a::before {
	content: "\2665\FE0E";   /* text heart, not the red emoji phones show for a bare ♥ */
	content: "\2665\FE0E" / "";
	display: inline-block;
	flex: none;
	margin-right: 0.5em;
	color: #F08FA3;
	font-size: 0.75em;
	line-height: 1;
}
#masthead #site-navigation li.b27-mega > ul > li.menu-item > a::before { content: none; }   /* column headings in the big panels */
#masthead .header-navigation .header-menu-container ul ul li.menu-item > a { display: flex; align-items: center; }   /* heart on the same line, also before items with a › sub-list */

/* Mobile drawer: social icons row at the bottom. */
.mobile-navigation ul li.b27-menu-social { padding: 1rem 0 0.5rem; border-bottom: 0; }
.mobile-navigation ul li.b27-menu-social > ul.b27-social-list { display: flex; gap: 0.25rem; margin: 0; padding: 0 0.5rem; list-style: none; }
.mobile-navigation ul li.b27-menu-social > ul.b27-social-list li { border: 0; }
.mobile-navigation ul li.b27-menu-social > ul.b27-social-list a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border-radius: 50%; color: var(--b27-action); }
.mobile-navigation ul li.b27-menu-social > ul.b27-social-list a:hover { background: #FFF0F2; }
.mobile-navigation .b27-nav-quiz > a,
.mobile-navigation .b27-nav-special > a,
.mobile-navigation .b27-nav-special > .drawer-nav-drop-wrap > a { color: var(--b27-action); }

/* ------------------------------------------------------------------ */
/* Listing header: subcategory pills (Title → pills → Φίλτρα & grid)   */
/* ------------------------------------------------------------------ */
/* Kadence's title area is a centred flex column: keep the pills at the column's width. */
.b27-pills { align-self: stretch; width: 100%; min-width: 0; margin: 1rem 0 0.25rem; }
.b27-pills ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
.b27-pill {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 0.4rem 1.1rem;
	border: 1px solid #E7C3CA;
	border-radius: var(--b27-radius-pill);
	background: var(--b27-surface);
	color: var(--b27-ink);
	font-size: 0.9rem;
	font-weight: 500;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	transition: border-color .15s ease, color .15s ease, background-color .15s ease;
}
.b27-pill:hover { border-color: var(--b27-action); color: var(--b27-action); }
.b27-pill[aria-current] { border-color: var(--b27-action); background: var(--b27-action); color: var(--b27-surface); }
@media (max-width: 767px) {
	/* One swipeable row instead of a tall block of pills. */
	.b27-pills ul { flex-wrap: nowrap; justify-content: flex-start; margin: 0 -1rem; padding: 2px 1rem 8px; overflow-x: auto; scrollbar-width: none; }
	.b27-pills ul::-webkit-scrollbar { display: none; }
}
.b27-archive-tip { margin-top: 0.75rem; }

/* ------------------------------------------------------------------ */
/* Vivian: tip box, «Δες τι λέει η Vivian» button and dialog           */
/* ------------------------------------------------------------------ */
.b27-vivian-tip {
	margin: 1.25rem 0 0;
	padding: 1rem 1.2rem;
	border-left: 4px solid var(--b27-action);
	border-radius: 12px;
	background: linear-gradient(100deg, #FFF3F5 0%, #FFE9EC 100%);
	text-align: left;
}
.b27-vivian-tip p { margin: 0; }
.b27-vivian-tip p + p:not(.b27-vivian-tip__label) { margin-top: 0.5rem; }
.single-product .summary .b27-vivian-tip { max-width: 34rem; margin: 0 0 1.5rem; }
.b27-tab-text { max-width: 48rem; }
.b27-tab-text p { margin: 0 0 0.75rem; }
.b27-tab-text--inci { color: #444; font-size: 0.9375rem; line-height: 1.7; }
.b27-vivian-tip .b27-vivian-tip__label { margin-bottom: 0.25rem; color: var(--b27-action); font-weight: 700; display: flex; align-items: center; gap: 0.5rem; }
.b27-vivian-tip__avatar { flex: none; width: 32px; height: 32px; border-radius: 50%; }

button.b27-tip-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-height: 44px;
	padding: 0.5rem 1.1rem;
	border: 1px dashed var(--b27-action);
	background: #FFF6F8;
	color: var(--b27-action);
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1.3;
	text-align: left;
	cursor: pointer;
}
button.b27-tip-btn:hover { background: #FFE9EE; color: var(--b27-action-dark); }

.b27-dialog {
	width: min(560px, calc(100vw - 2rem));
	max-height: calc(100vh - 2rem);
	padding: 0;
	border: 0;
	border-radius: 20px;
	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.25);
	color: var(--b27-ink);
	text-align: left;
}
.b27-dialog::backdrop { background: rgba(30, 0, 12, 0.45); }
.b27-dialog__inner { position: relative; padding: 2rem 1.75rem 1.75rem; }
button.b27-dialog__close {
	position: absolute;
	top: 0.75rem;
	right: 0.75rem;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	background: #FFF0F2;
	color: var(--b27-ink);
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
}
button.b27-dialog__close:hover { background: var(--b27-action); color: var(--b27-surface); }
.b27-dialog__eyebrow { margin: 0 0 0.25rem; color: var(--b27-action); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.b27-dialog__title { margin: 0 0 0.75rem; padding-right: 2.75rem; font-size: 1.6rem; }
.b27-dialog__more { margin: 1.25rem 0 0; font-weight: 600; }
.b27-dialog__more a { color: var(--b27-action); }

/* Ingredients on the product page. */
.b27-product-ingredients { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 1.25rem; }
.b27-product-ingredients__title { flex-basis: 100%; margin: 0; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }

/* «Συστατικά» page. */
.entry-content ul.b27-ingredients,
.entry-content ul.b27-routines,
.entry-content ol.b27-steps,
.entry-content ul.b27-brands { margin: 1.5rem 0; padding: 0; list-style: none; }
.b27-ingredients { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1rem; }
.entry-content .b27-ingredients > li,
.entry-content .b27-routines > li,
.entry-content .b27-steps > li,
.entry-content .b27-brands > li { margin: 0; }
.b27-ingredient {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.25rem;
	border: 1px solid #F6DDE1;
	border-radius: 18px;
	background: var(--b27-surface);
	box-shadow: 0 6px 20px rgba(168, 18, 79, 0.06);
}
.b27-ingredient__name { margin: 0; font-size: 1.25rem; }
.b27-ingredient__name a { color: var(--b27-ink); text-decoration: none; }
.b27-ingredient__name a:hover { color: var(--b27-action); text-decoration: underline; }

/* ------------------------------------------------------------------ */
/* Ενδεικτικές ρουτίνες                                                */
/* ------------------------------------------------------------------ */
.b27-routines { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
.b27-routine-card {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 1.5rem 1.4rem 1.25rem;
	border: 1px solid #F6DDE1;
	border-radius: 18px;
	background: linear-gradient(160deg, #FFFFFF 40%, #FFF1F4 100%);
	box-shadow: 0 6px 20px rgba(168, 18, 79, 0.06);
	transition: transform .2s ease, box-shadow .2s ease;
}
.b27-routine-card:hover, .b27-routine-card:focus-within { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(168, 18, 79, 0.14); }
.b27-routine-card:focus-within { outline: 3px solid var(--b27-action); outline-offset: 2px; }
.b27-routine-card__title { margin: 0 0 0.5rem; font-size: 1.3rem; }
.b27-routine-card__title a { color: var(--b27-ink); text-decoration: none; }
.b27-routine-card__title a::after { content: ""; position: absolute; inset: 0; border-radius: 18px; }
.b27-routine-card__title a:focus-visible { outline: none; box-shadow: none; }
.b27-routine-card p { flex: 1; margin: 0 0 1rem; color: #3d3d3d; font-size: 0.9375rem; }
.b27-routine-card__more { color: var(--b27-action); font-weight: 700; font-size: 0.9rem; }

.b27-routine-hero {
	margin: 0 0 2.5rem;
	padding: clamp(1.75rem, 5vw, 3.5rem) clamp(1.25rem, 5vw, 4rem);
	border-radius: 24px;
	background: radial-gradient(circle at 90% 10%, #FEBCC0 0, rgba(254, 188, 192, 0) 45%), linear-gradient(110deg, #FFF3F5 0%, #FFE3E8 100%);
}
.b27-routine-hero__eyebrow { margin: 0 0 0.5rem; color: var(--b27-action); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.b27-routine-hero__eyebrow a { color: var(--b27-action); text-decoration: underline; text-underline-offset: 3px; }
.b27-routine-hero__eyebrow a:hover { color: var(--b27-action-dark); }
.b27-routine-hero__title { margin: 0 0 1.25rem; font-size: clamp(2rem, 4.5vw, 3rem); line-height: 1.1; }
.b27-routine-hero__need { max-width: 46rem; }
.b27-routine-hero__label { margin: 0 0 0.25rem; font-family: var(--global-body-font-family); font-size: 0.9375rem; font-weight: 700; }
.b27-routine-hero__need p { margin: 0; font-size: 1.0625rem; line-height: 1.6; }
.b27-routine-hero__need p + p { margin-top: 0.75rem; }
.b27-routine-hero .b27-vivian-tip { max-width: 46rem; background: var(--b27-surface); }

.b27-routine-steps .b27-section-title { margin: 0 0 1.25rem; text-align: center; }
.b27-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 220px)); justify-content: center; align-items: start; gap: 1rem; counter-reset: none; }
/* Desktop: one row per section (up to 6 steps), so no step is left alone on a second row. */
@media (min-width: 1200px) { .b27-steps { grid-template-columns: repeat(var(--b27-cols, 4), minmax(0, 220px)); } }
/* Eye routines (client 6/10): one «Τα προϊόντα» section, the two products side by side and bigger. */
@media (min-width: 600px) { .b27-steps.b27-steps--plain { grid-template-columns: repeat(var(--b27-cols, 2), minmax(0, 280px)); gap: 1.5rem; } }
@media (max-width: 599px) {
	.b27-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
	.b27-step { --pad: 0.65rem; }
	.b27-steps .b27-step__label { min-height: calc(0.6875rem * 1.3 + 3 * 0.9375rem * 1.3 + 0.8rem); } /* narrow cards: labels can take three lines (selector outranks the base rule further down) */
	.b27-step .button { padding: 0.55rem 0.6rem; }
}
.b27-step {
	--pad: 0.9rem;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	padding: 0 0 var(--pad);
	border: 1px solid #F6DDE1;
	border-radius: 18px;
	background: var(--b27-surface);
	text-align: left;
	transition: box-shadow .25s ease;
}
.b27-step:hover { box-shadow: 0 14px 34px rgba(168, 18, 79, 0.10); }
/* Like the shop cards (brand · serif name · price · button), each card only as tall as its content.
   Label (2 lines) and name (3 lines) keep a fixed height, so photos, prices and buttons line up. */
.b27-step__label { min-height: calc(0.6875rem * 1.3 + 2 * 0.9375rem * 1.3 + 0.8rem); margin: 0; padding: 0.6rem var(--pad) 0.2rem; font-size: 0.9375rem; font-weight: 700; line-height: 1.3; box-sizing: border-box; }
.b27-step__num { display: block; color: var(--b27-action); font-size: 0.6875rem; letter-spacing: 0.12em; text-transform: uppercase; }
.b27-step__img { display: block; width: 100%; overflow: hidden; background: #fff; }
.b27-step__img img { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; padding: 3% 6% 6%; box-sizing: border-box; transition: transform .5s ease; }
.b27-step:hover .b27-step__img img { transform: scale(1.04); }
.b27-step__brand { margin: 0.6rem var(--pad) 0; overflow: hidden; color: var(--b27-action); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.14em; line-height: 1.3; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; } /* one line, so prices line up */
.b27-step .b27-step__name { display: -webkit-box; min-height: calc(3 * 1.3em); margin: 0.2rem var(--pad) 0.3rem; overflow: hidden; font-family: var(--global-heading-font-family); font-size: 1rem; font-weight: 500; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; } /* three lines kept, so prices and buttons line up */ /* beats .entry-content h3 */
.b27-step__name a { color: var(--b27-ink); text-decoration: none; }
.b27-step__name a:hover { color: var(--b27-action); text-decoration: underline; }
.b27-step__price { margin: 0 var(--pad) 0.75rem; font-weight: 700; }
.b27-step .button { margin: 0 var(--pad); padding: 0.55rem 1rem; font-size: 0.8125rem; text-align: center; }
.b27-step .added_to_cart { margin: 0.5rem var(--pad) 0; font-size: 0.8125rem; color: var(--b27-action); }
.b27-routine-steps + .b27-routine-steps { margin-top: clamp(2rem, 5vw, 3rem); }
/* Πρωί / Βράδυ / Extra as tabs (b27-core assets/routine-tabs.js); the panel heading is then read by screen readers only. */
.b27-routine-tabs__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem; margin: 0 0 1.25rem; }
.b27-routine-tabs__list[hidden] { display: none; }
button.b27-routine-tab { display: inline-flex; align-items: center; gap: 0.4rem; min-height: 44px; margin: 0; padding: 0.55rem 1.3rem; border: 1px solid #EFD0D6; border-radius: 999px; background: var(--b27-surface); color: var(--b27-ink); font-family: var(--global-heading-font-family); font-size: 1.125rem; font-weight: 500; line-height: 1.2; box-shadow: none; cursor: pointer; }
button.b27-routine-tab:hover { border-color: var(--b27-action); background: var(--b27-surface); color: var(--b27-action-dark); }
button.b27-routine-tab[aria-selected="true"] { border-color: var(--b27-action); background: var(--b27-action); color: var(--b27-surface); }
button.b27-routine-tab[aria-selected="true"] .b27-routine-steps__icon { color: #FFE08A; }   /* light gold, 4.5:1 on the selected (pink) tab */
button.b27-routine-tab:focus-visible { outline: 3px solid var(--b27-action); outline-offset: 2px; }
.b27-routine-tabs.is-tabbed .b27-routine-steps + .b27-routine-steps { margin-top: 0; }
.b27-routine-tabs.is-tabbed .b27-routine-steps > .b27-section-title { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.b27-routine-tabs.is-tabbed .b27-routine-steps:focus-visible { outline: 3px solid var(--b27-action); outline-offset: 6px; border-radius: 12px; }
.b27-routine-tabs + .b27-routine-set { margin-top: clamp(1.5rem, 4vw, 2.5rem); }
.b27-routine-steps__icon { color: #946600; } /* sun and moon in the same gold, dark enough for 5:1 on the tabs */
.b27-routine-steps__note { max-width: 46rem; margin: 1.25rem auto 0; color: #3d3d3d; font-size: 0.9375rem; text-align: center; }
.b27-step__product { display: flex; flex: 1; flex-direction: column; }
.b27-step__extra { margin-top: 0.75rem; padding: 0 var(--pad); }
.b27-step__text { margin: 0.75rem 0 0; color: #3d3d3d; font-size: 0.875rem; }
/* Text-only step (e.g. «μόνο με χλιαρό νερό»): as tall as a product card = photo (card width) + brand, name, price, button (13.45rem). */
.b27-step__textbox { display: grid; margin: 0 var(--pad); }
.b27-step__textbox::after { content: ""; grid-area: 1 / 1; padding-top: calc(100% + 2 * var(--pad) + 13.45rem); }
.b27-step--text .b27-step__text { grid-area: 1 / 1; margin: 0; }
.b27-step--text .b27-step__extra { margin: 0.75rem 0 0; }
.b27-step--text .b27-step__text { display: flex; flex-direction: column; align-items: center; justify-content: center; align-self: stretch; padding: 1rem; border: 1px dashed #EFD0D6; border-radius: 12px; color: var(--b27-ink); font-size: 1rem; line-height: 1.4; text-align: center; }
.b27-step--water .b27-step__text::before { content: ""; width: 34px; height: 34px; margin-bottom: 0.75rem; background: #3D9BD9; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3s6 6.4 6 11a6 6 0 0 1-12 0c0-4.6 6-11 6-11z'/%3E%3Cpath d='M9.5 15a2.5 2.5 0 0 0 2.5 2.5'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3s6 6.4 6 11a6 6 0 0 1-12 0c0-4.6 6-11 6-11z'/%3E%3Cpath d='M9.5 15a2.5 2.5 0 0 0 2.5 2.5'/%3E%3C/svg%3E") center / contain no-repeat; }
.b27-step__alt { display: flex; flex-direction: column; align-items: flex-start; gap: 0.3rem; margin: 0; font-size: 0.8125rem; }
.b27-step__or { color: var(--b27-action); font-size: 0.875rem; font-weight: 700; }
.b27-step__alt a { display: flex; align-items: center; gap: 0.5rem; color: var(--b27-ink); font-weight: 600; line-height: 1.3; text-decoration: none; }
.b27-step__alt a:hover span { color: var(--b27-action); text-decoration: underline; }
.b27-step__alt img { flex: none; width: 48px; height: 48px; border: 1px solid #F6DDE1; border-radius: 8px; background: #fff; object-fit: contain; }
.b27-step__alt-price { font-weight: 700; }
.b27-step__note { margin: 0.5rem 0 0; color: #3d3d3d; font-size: 0.8125rem; line-height: 1.45; }
.b27-step__extra > :first-child { margin-top: 0; }
.b27-step__note a { color: var(--b27-action-dark); }
.b27-routine-set__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.4rem; margin: 0 0 0.5rem; padding: 0; list-style: none; }
.b27-routine-set__list li { padding: 0.25em 0.8em; border: 1px solid #EFD0D6; border-radius: 999px; background: var(--b27-surface); font-size: 0.8125rem; }

.b27-routine-set { max-width: 60rem; margin: 2.5rem auto 1rem; text-align: center; }
.b27-routine-set > h2 { margin: 0 0 0.25rem; font-size: clamp(1.5rem, 3vw, 2rem); }
/* Two sets side by side (one under the other on phones): «Βασική ρουτίνα» and «Ρουτίνα + Extra». */
.b27-routine-set__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: 2.25rem 1.5rem; margin-top: 2.25rem; }
.b27-routine-set__card {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 2rem clamp(1.25rem, 3vw, 2rem) 1.75rem;
	border: 2px solid var(--b27-action);
	border-radius: 24px;
	background: #FFF6F8;
}
.b27-routine-set__card--basic { border-color: #E7B3BC; background: var(--b27-surface); }
.b27-routine-set__card h3 { margin: 0.5rem 0 0.35rem; font-size: 1.35rem; }
.b27-routine-set__card form { margin-top: auto; }
.b27-routine-set__badge {
	position: absolute;
	top: -1.4rem;
	left: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.5rem;
	height: 3.5rem;
	margin: 0;
	border-radius: 50%;
	background: var(--b27-action);
	color: var(--b27-surface);
	font-weight: 800;
	transform: translateX(-50%);
}
.b27-routine-set__price { margin: 0.75rem 0 1.25rem; font-size: 1.5rem; }
.b27-routine-set__price del { margin-right: 0.5rem; color: #595959; font-size: 1.1rem; }
.b27-routine-set__price ins { color: var(--b27-action); font-weight: 800; text-decoration: none; }
.b27-routine-set form { margin: 0; }
.b27-routine-set__btn { padding: 0.85rem 2rem; font-size: 1rem; }
.b27-routine-set__note { margin: 0.9rem 0 0; color: #3d3d3d; font-size: 0.8125rem; }

/* ------------------------------------------------------------------ */
/* Shop by Category (square tiles) and Brands                          */
/* ------------------------------------------------------------------ */
.b27-carousel--cats .b27-carousel__track { grid-auto-columns: calc((100% - 4 * 0.75rem) / 5); }
.b27-cat-tile a {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 18px;
	background: #FFE9EC;
	color: var(--b27-ink);
	text-decoration: none;
}
.b27-cat-tile__img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; transition: transform .3s ease; }
.b27-cat-tile a:hover .b27-cat-tile__img { transform: scale(1.05); }
.b27-cat-tile a { border: 1px solid #F6DDE1; }
.b27-cat-tile__img--product { object-fit: contain; padding: 10%; box-sizing: border-box; background: #fff; }   /* a product photo until the category has its own image; room for the label */
.b27-cat-tile__label {   /* under the photo, two lines high on every tile, desktop and phone alike */
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: calc(2 * 1.2em + 1.2rem);
	padding: 0.6rem 0.5rem;
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	word-break: normal;
	overflow-wrap: normal;
}
.b27-cat-tile a:hover .b27-cat-tile__label { color: var(--b27-action); }
.b27-home .entry-content .b27-carousel--cats ul.b27-carousel__track { padding-left: 0; padding-right: 0; }
@media (max-width: 1024px) { .b27-carousel--cats .b27-carousel__track { grid-auto-columns: calc((100% - 2 * 0.75rem) / 3); } }
@media (max-width: 781px) {
	.b27-carousel--cats .b27-carousel__track { grid-auto-columns: calc((100% - 0.75rem) / 2.3); }
	.b27-cat-tile__label { font-size: 0.875rem; }
}
@media (prefers-reduced-motion: reduce) { .b27-cat-tile__img, .b27-routine-card, .b27-step, .b27-step__img img { transition: none; } .b27-step:hover .b27-step__img img { transform: none; } }

.b27-brands { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0.75rem; }
.b27-brand a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	padding: 1.25rem 0.75rem;
	border: 1px solid #F6DDE1;
	border-radius: 18px;
	background: var(--b27-surface);
	color: var(--b27-ink);
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.b27-brand a:hover { border-color: var(--b27-action); box-shadow: 0 8px 22px rgba(168, 18, 79, 0.12); color: var(--b27-action); }
.b27-brand .b27-brand__logo, .entry-content .b27-brand .b27-brand__logo { display: block; width: 100%; max-width: 120px; height: 72px; object-fit: contain; }   /* tall logos (Beauty of Joseon) stay inside */
.b27-brand__mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: linear-gradient(135deg, #FEBCC0, #FFD3BE);
	color: var(--b27-action-dark);
	font-family: var(--global-heading-font-family);
	font-size: 1.5rem;
}

/* Legal pages: the GDPR table fits the screen (cells wrap) — no sideways scrolling region on phones. */
.wp-block-table.b27-legal-table { overflow-x: visible; }
.b27-legal-table table { width: 100%; table-layout: fixed; font-size: 0.9rem; }
.b27-legal-table th, .b27-legal-table td { overflow-wrap: anywhere; hyphens: auto; vertical-align: top; }
@media (max-width: 600px) { .b27-legal-table table { font-size: 0.8125rem; } .b27-legal-table th, .b27-legal-table td { padding: 0.5em 0.4em; } }
.b27-legal-table th { background: #FFF0F2; }
/* Few categories (others still hidden): centre the tiles instead of leaving a gap on the right. */
.b27-carousel--cats .b27-carousel__track { justify-content: safe center; }
/* Product grids placed in page content (e.g. «Trending now»): whole words, as in the shop. */
.entry-content ul.products .woocommerce-loop-product__title,
.entry-content ul.products .price { word-break: normal; overflow-wrap: normal; hyphens: manual; }
@media (max-width: 600px) { .woocommerce.page .entry-content ul.products li.product .woocommerce-loop-product__title, .page .entry-content .woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 1rem; } }

/* Header row: logo · centred menu · icons; the pills tighten a little on smaller laptops so one row always fits. */
#main-header .site-main-header-inner-wrap { padding-left: clamp(1rem, 2.5vw, 2.5rem); padding-right: clamp(1rem, 2.5vw, 2.5rem); }
/* Logo, menu and icons as one compact group in the middle of the page (logo and icons close to the menu). */
#main-header .site-main-header-inner-wrap.site-header-row-center-column { grid-template-columns: auto auto auto; justify-content: center; column-gap: clamp(1.25rem, 2.5vw, 2.5rem); }
#main-header .site-header-main-section-center { justify-content: center; min-width: 0; }
@media (max-width: 1439px) {
	#site-navigation .primary-menu-container > ul { gap: 0.3rem; }
	#main-header #site-navigation .primary-menu-container > ul > li.menu-item > a { padding: 0 0.7rem; font-size: 13px; }
}
@media (max-width: 1319px) {
	#main-header #site-navigation .primary-menu-container > ul > li.menu-item > a { padding: 0 0.55rem; font-size: 12.5px; }
	#site-navigation .primary-menu-container > ul { gap: 0.25rem; }
}
@media (max-width: 1279px) {
	#main-header .site-main-header-inner-wrap { padding-left: 1rem; padding-right: 1rem; }
	#main-header .site-main-header-inner-wrap.site-header-row-center-column { column-gap: 0.75rem; }
	#site-navigation .primary-menu-container > ul { gap: 0.2rem; }
	#main-header #site-navigation .primary-menu-container > ul > li.menu-item > a { padding: 0 0.45rem; font-size: 12px; }
}
/* Laptops (1200–1599px): with Beauty Tools the menu has nine pills and ran over the logo on the left and the account
   icons on the right (Βίβιαν 26/10, photo from her laptop). The pills drop their small icons here; the labels stay. */
@media (min-width: 1200px) and (max-width: 1599px) {
	#site-navigation .primary-menu-container > ul > li > a .b27-nav-icon { display: none; }
	#site-navigation .primary-menu-container > ul { gap: 3px; }
	#main-header #site-navigation .primary-menu-container > ul > li.menu-item > a { padding-left: 9px; padding-right: 9px; }
}

/* Header utility icons (search, account, wishlist, bag): same 22px size and 1.6px line. */
#masthead .search-toggle-open .kadence-svg-iconset,
#masthead .header-cart-button .kadence-svg-iconset { font-size: 22px; line-height: 0; }
#masthead .b27-line-icon,
#masthead .b27-header-icons svg { width: 22px; height: 22px; top: 0; }
#main-header .site-header-main-section-right { gap: 0.25rem; }
#main-header .site-header-main-section-right .site-header-item { margin: 0; }

/* Homepage: a little air between the last section (B27 Club) and the footer. */
.b27-home .entry-content > :last-child { margin-bottom: clamp(2rem, 4vw, 3.5rem); }

/* ------------------------------------------------------------------ */
/* Category header: soft gradient, clear hierarchy                     */
/* ------------------------------------------------------------------ */
.product-archive-hero-section .entry-hero-container-inner {
	background: radial-gradient(circle at 88% 0%, rgba(254, 188, 192, 0.55) 0, rgba(254, 188, 192, 0) 42%), linear-gradient(110deg, #FFF4F6 0%, #FFE6EA 100%);
	border-bottom: 1px solid #F6DDE1;
}
.product-archive-hero-section .hero-container { padding-top: clamp(1.5rem, 3vw, 2.5rem); padding-bottom: clamp(1.5rem, 3vw, 2.25rem); }
.product-archive-hero-section .entry-header { max-width: 60rem; margin: 0 auto; }
.product-archive-hero-section .kadence-breadcrumbs { margin: 0 0 0.75rem; color: #5c5c5c; font-size: 0.8125rem; }
.product-archive-hero-section .kadence-breadcrumbs a { color: #5c5c5c; }
.product-archive-hero-section .kadence-breadcrumbs a:hover { color: var(--b27-action); }
.product-archive-hero-section .archive-title { margin: 0; font-size: clamp(2rem, 3.4vw, 2.75rem); line-height: 1.1; color: var(--b27-ink); }
.product-archive-hero-section .archive-description { max-width: 40rem; margin: 0.6rem auto 0; color: #3d3d3d; font-size: 1rem; line-height: 1.55; }
.product-archive-hero-section .archive-description p { margin: 0; }
.product-archive-hero-section .b27-pills { margin-top: 1.25rem; }
.product-archive-hero-section .b27-pill { border-color: #F3C6CD; box-shadow: 0 2px 8px rgba(168, 18, 79, 0.06); }
.product-archive-hero-section .b27-archive-tip { margin-top: 1rem; }

/* ------------------------------------------------------------------ */
/* Price filter: two-handle slider                                     */
/* ------------------------------------------------------------------ */
.b27-price-slider { margin: 0; padding: 0.25rem 0.25rem 0.5rem; }
.b27-price-slider__values { display: flex; justify-content: space-between; margin: 0 0 0.25rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.b27-price-slider__track { --lo: 0%; --hi: 100%; position: relative; height: 44px; }
.b27-price-slider__track::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 12px;
	right: 12px;
	height: 4px;
	border-radius: 2px;
	background: linear-gradient(to right, #E7C3CA var(--lo), var(--b27-action) var(--lo), var(--b27-action) var(--hi), #E7C3CA var(--hi));
	transform: translateY(-50%);
}
.b27-price-slider input[type="range"] {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 44px;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	pointer-events: none;   /* only the handles take the pointer, so both stay reachable */
	-webkit-appearance: none;
	appearance: none;
}
.b27-price-slider input[type="range"]::-webkit-slider-runnable-track { height: 44px; background: none; }
.b27-price-slider input[type="range"]::-moz-range-track { height: 44px; background: none; }
.b27-price-slider input[type="range"]::-webkit-slider-thumb {
	width: 24px;
	height: 24px;
	margin-top: 10px;
	border: 2px solid var(--b27-action);
	border-radius: 50%;
	background: var(--b27-surface);
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
	cursor: grab;
	pointer-events: auto;
	-webkit-appearance: none;
	appearance: none;
}
.b27-price-slider input[type="range"]::-moz-range-thumb {
	width: 20px;
	height: 20px;
	border: 2px solid var(--b27-action);
	border-radius: 50%;
	background: var(--b27-surface);
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
	cursor: grab;
	pointer-events: auto;
}
.b27-price-slider input[type="range"]:focus-visible { outline: none; box-shadow: none; }
.b27-price-slider input[type="range"]:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 3px var(--b27-surface), 0 0 0 6px var(--b27-action); }
.b27-price-slider input[type="range"]:focus-visible::-moz-range-thumb { box-shadow: 0 0 0 3px var(--b27-surface), 0 0 0 6px var(--b27-action); }
.b27-price-slider__apply { width: 100%; min-height: 44px; margin-top: 0.5rem; }

/* ΕΣΠΑ banner: card fixed bottom-left on the homepage, stacked above CookieYes (espa.js sets --b27-espa-bottom). */
.b27-espa {
	position: fixed;
	left: var(--b27-espa-left, 16px);
	bottom: var(--b27-espa-bottom, 76px);
	z-index: 9000;   /* above the page and sticky header, under the menu/cart/filter drawers (99999+) and CookieYes */
	display: flex;
	align-items: flex-start;
	width: min(240px, calc(100vw - 2 * var(--b27-espa-left, 16px)));   /* smaller, at the client's request (1/10) */
	padding: 6px 8px;
	border: 1px solid #E3E8F2;
	border-radius: 14px;
	background: var(--b27-surface);
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.16);
	transition: bottom .2s ease;
}
.b27-espa[hidden] { display: none; }
.b27-espa__link { flex: 1; min-width: 0; line-height: 0; border-radius: 6px; }
.b27-espa__img { display: block; width: 100%; height: auto; }
/* Keyboard focus never ends up hidden behind the card. */
html:has(.b27-espa:not([hidden])) { scroll-padding-bottom: 180px; }
@media (prefers-reduced-motion: reduce) { .b27-espa { transition: none; } }

/* Product badges («Vivian's Choice», «Trending now»), stacked at the top right of a card; each opens its list. */
.b27-badges { position: absolute; top: 10px; right: 10px; z-index: 3; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.b27-badges .b27-badge { position: static; display: inline-flex; align-items: center; min-height: 24px; max-width: none; text-decoration: none; } /* 24px target (WCAG 2.5.8) */
.b27-badges a.b27-badge:hover, .b27-badges a.b27-badge:focus-visible { text-decoration: underline; text-underline-offset: 2px; }
.b27-badges a.b27-badge[href] { color: var(--b27-action); } /* beats the card's own link colour */
.b27-badges a.b27-badge--trending[href] { background: var(--b27-action); color: var(--b27-surface); }
.b27-product-card .b27-badges { top: 6px; right: 6px; }
a.b27-product-badge { text-decoration: none; }
a.b27-product-badge:hover { text-decoration: underline; text-underline-offset: 2px; }
.b27-product-badge--trending { background: var(--b27-action); color: var(--b27-surface); }
.b27-product-badge--trending::before { -webkit-mask: none; mask: none; content: "\2197 "; width: auto; height: auto; background: none; font-size: 0.8rem; line-height: 1; }
.b27-product-attrs li a { color: inherit; text-decoration: none; }
.b27-product-attrs li:has(a):hover { border-color: var(--b27-action); }
.b27-product-attrs li a:hover { text-decoration: underline; text-underline-offset: 2px; }

/* When a product is used: sun (morning) / moon (evening), a darker gold than the routine tabs so it reads at 5:1. */
.b27-when { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.9rem; }
.b27-when__item { display: inline-flex; align-items: center; gap: 0.3rem; }
.b27-when__icon { color: #946600; font-size: 1.1em; line-height: 1; }
.b27-product-when { margin: -0.25rem 0 1rem; color: #3d3d3d; font-size: 0.875rem; font-weight: 600; }
.b27-when--icons { gap: 0.3rem; margin: 0 0 0.3rem; }
.b27-when--icons .b27-when__icon { font-size: 1rem; }

/* Menu arrows exactly on the middle line of their item (Kadence sets its icons a little below the text baseline). */
#site-navigation .dropdown-nav-toggle,
.mobile-navigation .drawer-sub-toggle { display: inline-flex; align-items: center; justify-content: center; }
#site-navigation .dropdown-nav-toggle .kadence-svg-iconset.svg-baseline svg,
.mobile-navigation .drawer-sub-toggle .kadence-svg-iconset.svg-baseline svg { top: 0; }
#site-navigation .nav-drop-title-wrap { display: inline-flex; align-items: center; }

.woocommerce nav.woocommerce-pagination ul.page-numbers li .page-numbers { display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; }
.woocommerce-pagination a.page-numbers:is(.next, .prev) { min-width: 42px; min-height: 42px; }   /* the text is for screen readers only, so the arrow needs its own box */
.woocommerce-pagination a.page-numbers:is(.next, .prev)::before { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat; }
.woocommerce-pagination a.page-numbers.prev::before { transform: scaleX(-1); }

/* ------------------------------------------------------------------ */
/* Client list 1/10, item 2: header on the logo's pink, logo in a white frame */
/* ------------------------------------------------------------------ */
#masthead .site-main-header-wrap .site-header-row-container-inner { background: var(--b27-pink); }
#masthead .site-branding a.brand { border: 3px solid var(--b27-surface); box-shadow: 0 6px 18px rgba(168, 18, 79, 0.18); }
#masthead .b27-header-icons a:hover,
#masthead .search-toggle-open:hover,
#masthead .header-cart-button:hover,
#masthead .menu-toggle-open:hover { background: rgba(255, 255, 255, 0.6); }
#main-header #site-navigation .primary-menu-container > ul > li.menu-item:not(.b27-nav-quiz) > a { border-color: #FFF0F2; background: #FFF6F7; }

/* Item 3: search as a pink panel at the top (not a black full screen); the page stays visible, dimmed, below it. */
#search-drawer .drawer-overlay { background: rgba(60, 10, 30, 0.35); }
#search-drawer .drawer-inner { top: 0; bottom: auto; height: auto; min-height: 0; padding-bottom: 2rem; background: var(--b27-pink); box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18); }
#search-drawer .drawer-header .drawer-toggle { color: var(--b27-ink); }
#search-drawer .drawer-content { padding-top: 0.5rem; }
#search-drawer .search-form input.search-field {
	border: 2px solid var(--b27-surface);
	border-radius: var(--b27-radius-pill);
	background: var(--b27-surface);
	color: var(--b27-ink);
	font-size: 1.125rem;
}
#search-drawer .search-form input.search-field::placeholder { color: #595959; opacity: 1; }
#search-drawer .search-form input.search-field:focus { border-color: var(--b27-action); }
#search-drawer .search-form .kadence-search-icon-wrap { color: var(--b27-action); }
/* The sticky header (after scrolling) looks the same as the normal one: pink row, framed logo. */
#masthead :is(#main-header, #mobile-header) .kadence-sticky-header.item-is-fixed .site-header-row-container-inner { background: var(--b27-pink); }   /* two ids: beats Kadence's white sticky rule */

/* Brand on product cards is a link to the brand's products (client, 1/10). */
.woocommerce ul.products li.product .b27-loop-brand a { color: inherit; text-decoration: none; }
.woocommerce ul.products li.product .b27-loop-brand a:hover,
.woocommerce ul.products li.product .b27-loop-brand a:focus-visible { text-decoration: underline; text-underline-offset: 2px; }

/* ------------------------------------------------------------------ */
/* Client list 1/10, item 15: page headers — a narrower banner and the body font (bold) for the title,  */
/* on a soft blush so it no longer melts into the pink header.        */
/* ------------------------------------------------------------------ */
.entry-hero.page-hero-section .entry-hero-container-inner,
.product-archive-hero-section .entry-hero-container-inner { background: linear-gradient(110deg, #FFF6F7 0%, #FFE9EC 100%); }
.entry-hero.page-hero-section .hero-section-overlay { display: none; }
.entry-hero.page-hero-section .hero-container { min-height: 0; padding-top: clamp(1rem, 2.2vw, 1.6rem); padding-bottom: clamp(1rem, 2.2vw, 1.6rem); }
.product-archive-hero-section .hero-container { padding-top: clamp(1rem, 2.2vw, 1.6rem); padding-bottom: clamp(1rem, 2.2vw, 1.6rem); }
.entry-hero.page-hero-section .entry-header,
.product-archive-hero-section .entry-header { min-height: 0; }
.entry-hero .entry-title,
.product-archive-hero-section .archive-title {
	font-family: var(--global-body-font-family);
	font-weight: 700;
	font-size: clamp(1.6rem, 2.6vw, 2.1rem);
	letter-spacing: -0.01em;
	line-height: 1.15;
	color: var(--b27-ink);
}
.entry-hero .entry-title::after,
.product-archive-hero-section .archive-title::after { content: ""; display: block; width: 2.5rem; height: 3px; margin: 0.55rem auto 0; border-radius: 3px; background: var(--b27-action); }
/* Header icons (menu, search, account, wishlist, bag) in the brand pink: 3.7:1 on the pink header (WCAG 1.4.11 asks 3:1);
   white would be 1.6:1. */
#masthead .b27-header-icons a,
#masthead .search-toggle-open,
#masthead .header-cart-button,
#masthead .menu-toggle-open { color: var(--b27-action); }
#masthead .b27-header-icons a:hover,
#masthead .search-toggle-open:hover,
#masthead .header-cart-button:hover,
#masthead .menu-toggle-open:hover { color: var(--b27-action-dark); }

/* Client list 1/10, item 18: product names in the clear body font (Commissioner, bold) instead of the display serif,
   on cards, the product page and the routine steps. */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.single-product .summary .product_title,
.b27-step .b27-step__name {
	font-family: var(--global-body-font-family);
	font-weight: 700;
	letter-spacing: -0.005em;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 1rem; }
.single-product .summary .product_title { font-size: clamp(1.6rem, 2.4vw, 2.1rem); line-height: 1.15; }
.b27-step .b27-step__name { font-size: 0.9375rem; }

/* Client list 1/10, items 23/24: the gift card's picture (a pink voucher, op 64) sits on its own soft pink,
   on product cards and on its product page. */
.woocommerce ul.products li.product.product-type-pw-gift-card .woocommerce-loop-image-link,
.woocommerce ul.products li.product.product-type-pw-gift-card .woocommerce-loop-image-link img,
.single-product div.product.product-type-pw-gift-card .woocommerce-product-gallery__image,
.single-product div.product.product-type-pw-gift-card .woocommerce-product-gallery__image img,
.single-product div.product.product-type-pw-gift-card .flex-control-thumbs img { background: #FDEEF1; }   /* the voucher picture's own background (tools/media/giftcard) */

/* ------------------------------------------------------------------ */
/* Client list 1/10, item 38: pages on a soft pastel pink (the site's background, lighter than the logo's pink),  */
/* not white. Product cards and homepage cards stay white, so photos and boxes still stand out.               */
/* ------------------------------------------------------------------ */
.content-bg:not(.loop-entry),
body.content-style-boxed .content-bg:not(.loop-entry) { background: transparent; box-shadow: none; }
.site-footer,
#colophon .site-footer-wrap,
#colophon .site-footer-row-container-inner { background: #FFEBEE; }

/* Item 39: footer logo centred at the very bottom, no background (the white letters keep their pink outline). */
.b27-footer .b27-footer__brand { display: flex; justify-content: center; padding: 0.5rem 1rem 0; }
.b27-footer .b27-footer__brand a { padding: 0; border-radius: 0; background: none; }
.b27-footer .b27-footer__logo { width: 120px; filter: drop-shadow(0 1px 1px rgba(194, 24, 91, 0.35)); }
@media (min-width: 1025px) { .b27-footer .b27-footer__inner { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* FAQ (client list 1/10, item 14): each question opens its answer (native details/summary, keyboard and screen reader friendly). */
.entry-content details.b27-faq { margin: 0 0 0.6rem; border: 1px solid #F3C6CD; border-radius: 14px; background: var(--b27-surface); }
.entry-content details.b27-faq > summary { position: relative; padding: 0.95rem 3rem 0.95rem 1.1rem; font-weight: 700; color: var(--b27-ink); cursor: pointer; list-style: none; }
.entry-content details.b27-faq > summary::-webkit-details-marker { display: none; }
.entry-content details.b27-faq > summary::after { content: "+"; position: absolute; top: 50%; right: 1.1rem; color: var(--b27-action); font-size: 1.5rem; font-weight: 400; line-height: 1; transform: translateY(-50%); }
.entry-content details.b27-faq[open] > summary::after { content: "\2212 "; }
.entry-content details.b27-faq > summary:hover { color: var(--b27-action); }
.entry-content details.b27-faq > p { margin: 0; padding: 0 1.1rem 1rem; color: #3d3d3d; }
.entry-content details.b27-faq + h2 { margin-top: 2rem; }

/* Client list 1/10, item 35: each routine set as a gift box: the product thumbnails sit in a box tied with a ribbon and a bow. */
.b27-routine-set__box {
	position: relative;
	margin: 1.6rem 0 0.75rem;
	padding: 1.6rem 1rem 1rem;
	border: 2px solid #F3C6CD;
	border-radius: 16px;
	background:
		linear-gradient(var(--b27-action), var(--b27-action)) center / 12px 100% no-repeat,
		linear-gradient(var(--b27-action), var(--b27-action)) center / 100% 12px no-repeat,
		#FFFFFF;
}
.b27-routine-set__card--basic .b27-routine-set__box { background-color: #FFF6F8; }
.b27-routine-set__bow {   /* a two-loop bow on the ribbon, top centre */
	position: absolute;
	top: -18px;
	left: 50%;
	width: 56px;
	height: 30px;
	transform: translateX(-50%);
	background: var(--b27-action);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56 30'%3E%3Cpath d='M28 15C20 3 4 0 3 9c-1 8 13 9 25 6Zm0 0c8-12 24-15 25-6 1 8-13 9-25 6Z'/%3E%3Ccircle cx='28' cy='15' r='5'/%3E%3Cpath d='M25 18l-7 12h5l5-9 5 9h5l-7-12Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56 30'%3E%3Cpath d='M28 15C20 3 4 0 3 9c-1 8 13 9 25 6Zm0 0c8-12 24-15 25-6 1 8-13 9-25 6Z'/%3E%3Ccircle cx='28' cy='15' r='5'/%3E%3Cpath d='M25 18l-7 12h5l5-9 5 9h5l-7-12Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.b27-routine-set__thumbs { position: relative; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.6rem; margin: 0; padding: 0; list-style: none; }
.b27-routine-set__thumbs li { width: 64px; height: 64px; padding: 4px; border: 1px solid #F3C6CD; border-radius: 12px; background: #FFFFFF; box-shadow: 0 4px 10px rgba(194, 24, 91, 0.10); }
.b27-routine-set__thumbs img { display: block; width: 100%; height: 100%; object-fit: contain; }

/* ================================================================== */
/* Client's notes of 2/10                                              */
/* ================================================================== */

/* 8: no display serif anywhere — every heading in the clear body font (Commissioner), bold. */
:root { --global-heading-font-family: var(--global-body-font-family); }
h1, h2, h3, h4, h5, h6, .wp-block-heading { font-weight: 700; letter-spacing: -0.005em; }

/* 1: header logo bigger and without the frame (as in the footer). */
#masthead .site-branding a.brand { width: auto; height: auto; padding: 0; overflow: visible; border: 0; border-radius: 0; background: none; box-shadow: none; }
#masthead .site-branding a.brand img.custom-logo { height: 84px; }
#mobile-header .site-branding a.brand { width: auto; height: auto; border-radius: 0; }
#mobile-header .site-branding a.brand img.custom-logo { height: 60px; }

/* 2: search — a slightly bigger icon; the field white with a pink border, on a compact pink bar. */
#masthead .search-toggle-open .kadence-svg-iconset { font-size: 26px; }
#search-drawer .drawer-inner { padding-bottom: 1rem; }
#search-drawer .drawer-content { padding-top: 0; padding-bottom: 0; }
#search-drawer .search-form { margin: 0; }
#search-drawer .search-form input.search-field { border: 2px solid var(--b27-action); background: var(--b27-surface); }
/* The search panel's header strip (z-index 100, full width) sat over the field and caught every tap: only the close button takes clicks; on phones the field stops before it. */
#search-drawer .drawer-header { pointer-events: none; }
#search-drawer .drawer-header .drawer-toggle { pointer-events: auto; }
@media (max-width: 767px) {
	#search-drawer.popup-drawer .drawer-inner .drawer-content { padding-left: 1rem; padding-right: 3.5rem; }
}
/* Kadence colours the focused field white (for its dark panel), so typed text vanished on our white field. */
#search-drawer .drawer-inner .search-form input.search-field,
#search-drawer .drawer-inner .search-form input.search-field:focus { color: var(--b27-ink); }

/* 3: hero — the lead bigger, a heart before each line; space between the buttons and the icons below. */
.b27-hero .b27-hero__lead { font-size: clamp(1.1rem, 1.6vw, 1.35rem); line-height: 1.55; }
.b27-hero__lead br { display: none; }
.b27-hero__line { position: relative; display: block; padding-left: 1.4em; }
.b27-hero__line + br + .b27-hero__line { margin-top: 0.35em; }
.b27-hero__line::before { content: "\2665\FE0E"; content: "\2665\FE0E" / ""; position: absolute; left: 0; top: 0; color: var(--b27-action); }
.b27-hero .wp-block-buttons { margin-bottom: 0.5rem; }
@media (max-width: 767px) {
	.b27-hero.b27-hero .wp-block-buttons.wp-block-buttons { margin-bottom: 2rem; }   /* (beats WP's last-child rule) space under «Όλα τα προϊόντα» before the hero ends */
}
@media (min-width: 768px) {
	.b27-hero__img--girl img { padding: clamp(2rem, 5vw, 4.5rem) clamp(1.5rem, 5vw, 5rem) 0 !important; }   /* a little smaller on desktop */
}
.b27-usps { margin-top: clamp(1.5rem, 3vw, 2.5rem) !important; }
.b27-hero { background: linear-gradient(100deg, #FFF1F4 0%, #FFDDE5 55%, #FFC9D5 100%); }
.b27-hero__img { position: relative; }
.b27-hero__img::after {   /* the photo's lilac backdrop turned pink: a pink «hue» layer, faded in like the photo */
	content: "";
	position: absolute;
	inset: 0;
	background: #FF7FA8;
	mix-blend-mode: hue;
	opacity: 0.55;
	pointer-events: none;
	-webkit-mask-image: linear-gradient(to right, transparent 0, #000 22%);
	mask-image: linear-gradient(to right, transparent 0, #000 22%);
}
@media (max-width: 767px) {
	.b27-hero__img::after { -webkit-mask-image: linear-gradient(to top, transparent 0, #000 22%); mask-image: linear-gradient(to top, transparent 0, #000 22%); }
}

/* 6: «Φροντίδα ανά ηλικία» — the age routines, a deeper pink the older the skin, the age in a chip. */
.b27-concern--age a { justify-content: space-between; gap: 1rem; }
.b27-concern--age-1 a { background: #FFF1F3; }
.b27-concern--age-2 a { background: #FFE4E9; }
.b27-concern--age-3 a { background: #FED5DD; }
.b27-concern--age-4 a { background: #FBC6D1; }
.b27-concern--age-5 a { background: #F8B6C4; }
.b27-concern__age { flex: none; padding: 0.2em 0.7em; border-radius: 999px; background: var(--b27-surface); color: var(--b27-action-dark); font-size: 0.8125rem; font-weight: 700; }

/* 7: B27 Club — the −10% up front. */
.b27-newsletter__offer { display: inline-flex; align-items: center; gap: 0.75rem; margin: 0 0 1rem; padding: 0.4rem 1rem 0.4rem 0.4rem; border-radius: 999px; background: var(--b27-surface); box-shadow: 0 8px 22px rgba(194, 24, 91, 0.16); color: var(--b27-ink); font-weight: 700; }
.b27-newsletter__pct { display: inline-grid; place-items: center; min-width: 4.2rem; height: 4.2rem; border-radius: 50%; background: var(--b27-action); color: var(--b27-surface); font-size: 1.35rem; font-weight: 800; }
.b27-newsletter__inner { background: radial-gradient(circle at 90% 10%, rgba(255, 255, 255, 0.7) 0, rgba(255, 255, 255, 0) 40%), linear-gradient(120deg, #FFE1E7 0%, #FEBCC0 100%); }

/* 10: sun / moon a little bigger on the product page, and on the routine step cards. */
.b27-product-when { font-size: 1rem; }
.b27-product-when .b27-when__icon { font-size: 1.35em; }
.b27-when-svg { display: block; width: 1em; height: 1em; }
.b27-routine-steps__icon .b27-when-svg { display: inline-block; vertical-align: -0.12em; }
.b27-step .b27-step__when { margin: 0 var(--pad) 0.2rem; min-height: 1.1rem; line-height: 1; }

/* 12: the girl next to «Vivian's Tip» bigger. */
.b27-vivian-tip__avatar { width: 44px; height: 44px; }
.b27-newsletter .b27-newsletter__title { font-weight: 700; }

/* Logo vertically centred in the header (client, 2/10): no inline gap under the image, the same space above and below. */
#masthead .site-branding { display: flex; align-items: center; padding: 8px 0; }
#masthead .site-branding a.brand { display: flex; align-items: center; }
#masthead .site-branding a.brand img.custom-logo { display: block; }
#masthead .kadence-sticky-header.item-is-fixed .site-branding { padding: 4px 0; }

/* «Φροντίδα ανά ηλικία»: the list centred top-to-bottom in the space under the heading (the card is as tall as «Δημοφιλή τώρα»). */
.b27-card:has(> .b27-concerns--age) { display: flex; flex-direction: column; }
.b27-card.b27-card > ul.b27-concerns--age { margin-block: auto; }   /* beats WP's «.is-layout-flow > :last-child { margin-block-end: 0 }» */

/* Side cart − / + (b27-core inc/cart.php; client, 2/10): 32px round buttons (WCAG 2.5.8), the price after them. */
.b27-mini-qty { display: flex !important; flex-wrap: wrap; align-items: center; gap: 0.4rem; margin-top: 0.35rem; color: var(--b27-ink); font-size: 0.875rem; }
.b27-mini-qty__btn {
	display: inline-grid !important; place-items: center;
	width: 32px; height: 32px; min-height: 0 !important; padding: 0 !important;
	border: 1.5px solid var(--b27-action) !important; border-radius: 50% !important;
	background: var(--b27-surface) !important; color: var(--b27-action) !important;
	font-size: 1.1rem; font-weight: 700; line-height: 1; box-shadow: none !important;
}
.b27-mini-qty__btn:hover:not([disabled]) { background: var(--b27-action) !important; color: var(--b27-surface) !important; }
.b27-mini-qty__btn[disabled] { border-color: #b8b8b8 !important; color: #767676 !important; cursor: default; }
.b27-mini-qty__val { min-width: 1.5em; text-align: center; font-weight: 700; }
.b27-mini-qty__price { margin-left: 0.25rem; color: #3d3d3d; }
.b27-mini-qty[aria-busy="true"] { opacity: 0.6; }
/* Each item: photo in a fixed left column, name and − / + lined up beside it (the floated photo pushed the controls
   sideways when the name took one line). */
.woocommerce-mini-cart .woocommerce-mini-cart-item { min-height: 66px; padding-left: 64px !important; padding-right: 1.75rem !important; }
.woocommerce-mini-cart .woocommerce-mini-cart-item img { position: absolute; left: 0; top: 0.75rem; float: none !important; width: 50px !important; margin: 0 !important; }
.woocommerce-mini-cart .woocommerce-mini-cart-item .b27-mini-qty { padding-left: 0 !important; margin-left: 0 !important; }

/* Cart page: the block's − / + more visible. */
.wc-block-components-quantity-selector { border: 1.5px solid var(--b27-action) !important; border-radius: 999px !important; }
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button { min-width: 36px; color: var(--b27-action) !important; font-size: 1.15rem; font-weight: 700; opacity: 1 !important; }
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:disabled { color: #767676 !important; }
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__input { font-weight: 700; }


/* Hero: the girl from the logo instead of the photo (client, 2/10). Transparent background on the hero's pink,
   the whole figure visible (contain), sitting on the bottom edge, the cut faded out; no pink «hue» layer. */
.b27-hero__img--girl::after { content: none; }
.b27-hero__img--girl img {
	object-fit: contain; object-position: center bottom;
	padding-top: clamp(1rem, 3vw, 2.5rem);
	-webkit-mask-image: linear-gradient(to top, transparent 0, #000 14%); mask-image: linear-gradient(to top, transparent 0, #000 14%);
}
@media (max-width: 767px) {
	.b27-hero__img--girl { display: flex; justify-content: flex-end; align-items: flex-end; }
	.b27-hero__img--girl img { width: 60%; height: auto; max-height: 100%; padding-top: 0; object-position: right bottom; }
}

/* Free shipping progress (b27-core inc/cart.php; client, 2/10): side cart and cart page. */
.b27-freeship { margin: 0 0 1rem; padding: 0.75rem 0.9rem; border-radius: 12px; background: #FFF0F2; color: var(--b27-ink); font-size: 0.9rem; }
.b27-freeship__text { margin: 0 0 0.5rem; }
.b27-freeship__text strong { color: var(--b27-action-dark); }
.b27-freeship__bar { height: 8px; border-radius: 999px; background: #F9D5DA; overflow: hidden; }
.b27-freeship__bar span { display: block; height: 100%; border-radius: inherit; background: var(--b27-action); transition: width .3s ease; }
.b27-freeship.is-free .b27-freeship__bar span { background: #2E7D32; }
.b27-freeship--page { max-width: 1240px; margin: 0 auto 1.25rem; font-size: 1rem; }
@media (prefers-reduced-motion: reduce) { .b27-freeship__bar span { transition: none; } }


/* Contact form (b27-core inc/contact.php; client, 5/10). */
.b27-contact { max-width: 640px; }
.b27-contact__field { display: grid; gap: 0.35rem; margin: 0 0 1rem; }
.b27-contact__field label { font-weight: 600; }
.b27-contact__field input:not([type="checkbox"]), .b27-contact__field textarea { width: 100%; border: 1.5px solid #8a8a8a; border-radius: 10px; background: var(--b27-surface); padding: 0.7rem 0.85rem; font: inherit; }
.b27-contact__field input:focus-visible, .b27-contact__field textarea:focus-visible { outline: 3px solid var(--b27-action); outline-offset: 1px; }
.b27-contact__field [aria-invalid="true"] { border-color: #B00020; }
.b27-contact__field--check { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 0.5rem; }
.b27-contact__field--check input { width: 22px; height: 22px; margin-top: 0.15rem; accent-color: var(--b27-action); }
.b27-contact__field--check label { flex: 1; font-weight: 400; }
.b27-contact__err { order: -1; flex-basis: 100%; color: #B00020; font-size: 0.875rem; font-weight: 600; }
.b27-contact__field:not(.b27-contact__field--check) .b27-contact__err { order: 0; }
.b27-contact__req { color: #595959; font-size: 0.875rem; }
.b27-contact__summary { margin: 0 0 1.25rem; padding: 1rem 1.25rem; border: 2px solid #B00020; border-radius: 12px; background: #FFF5F5; }
.b27-contact__summary ul { margin: 0.25rem 0 0; }
.b27-contact__summary a { color: #B00020; }
.b27-contact__done { margin: 0 0 1.25rem; padding: 1rem 1.25rem; border-radius: 12px; background: #E8F5E9; color: #1B5E20; font-weight: 600; }
.b27-contact__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }


/* Routine sets as banners (b27-core inc/routines.php; client, 5/10, after her examples). */
.b27-routine-set__banners { display: grid; gap: 1.5rem; margin-top: 2rem; text-align: left; }
.b27-set-banner {
	position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: center; gap: 1rem;
	overflow: hidden; padding: clamp(1.5rem, 4vw, 2.75rem); border-radius: 24px;
	background: radial-gradient(circle at 78% 45%, rgba(255, 255, 255, 0.75) 0, rgba(255, 255, 255, 0) 38%), linear-gradient(120deg, #FFEDF1 0%, #FAD3DC 100%);
	box-shadow: 0 16px 40px rgba(194, 24, 91, 0.10);
}
.b27-set-banner--full { background: radial-gradient(circle at 78% 45%, rgba(255, 255, 255, 0.75) 0, rgba(255, 255, 255, 0) 38%), linear-gradient(120deg, #FCE4EA 0%, #F6C3CF 100%); }
.b27-set-banner__eyebrow { margin: 0 0 0.6rem; color: var(--b27-ink); font-size: 0.875rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.b27-set-banner__eyebrow span:first-child { color: var(--b27-action); }
.b27-routine-set .b27-set-banner__title { margin: 0 0 0.85rem; font-size: clamp(1.6rem, 3.4vw, 2.4rem); font-weight: 700; line-height: 1.15; }
.b27-set-banner__meta { margin: 0 0 0.6rem; color: var(--b27-ink); font-size: 1.0625rem; font-weight: 600; }
.b27-set-banner__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.75rem; margin: 0 0 1.25rem; }
.b27-set-banner__price del { color: #4d4d4d; font-size: 1.2rem; }
.b27-set-banner__price ins { color: var(--b27-action-dark); font-size: clamp(1.8rem, 3.6vw, 2.4rem); font-weight: 800; text-decoration: none; }
.b27-set-banner__note { margin: -0.5rem 0 1rem; color: #3d3d3d; font-size: 0.8125rem; }
.b27-set-banner form { margin: 0; }
.b27-set-banner__btn { padding: 0.9rem 1.75rem; border-radius: 999px; font-size: 1rem; }
.b27-set-banner__visual { position: relative; display: flex; align-items: center; justify-content: center; min-height: 300px; }
.b27-set-banner__badge {
	position: absolute; top: 0; right: 0; z-index: 2; display: grid; place-items: center; width: 84px; height: 84px; margin: 0;
	border-radius: 50%; background: var(--b27-action); color: var(--b27-surface); font-size: 1.5rem; font-weight: 800; box-shadow: 0 8px 20px rgba(194, 24, 91, 0.25);
}
.b27-set-banner__products { display: flex; align-items: flex-end; justify-content: center; width: 86%; margin: 0; padding: 2rem 0 1rem; list-style: none; }
.b27-set-banner__products li { flex: 0 1 30%; max-width: 190px; margin-left: -10%; }
.b27-set-banner__products li:first-child { margin-left: 0; }
.b27-set-banner__products li:nth-child(even) { margin-bottom: 12%; }   /* a staggered group, like a product shot (not transform: it would cut the blend below) */
.b27-set-banner__products img { display: block; width: 100%; height: auto; mix-blend-mode: multiply; transform: scale(1.45); transform-origin: 50% 85%; }   /* the photos' white backgrounds disappear into the pink; scaled, as the bottles fill only the middle of each photo */
@media (max-width: 767px) {
	.b27-set-banner { grid-template-columns: 1fr; }
	.b27-set-banner__visual { order: -1; min-height: 0; padding-top: 1.5rem; }
	.b27-set-banner__badge { width: 64px; height: 64px; font-size: 1.15rem; top: -0.25rem; }
	.b27-set-banner__btn { width: 100%; }
}

/* «Γνώρισε τη Βίβιαν» with the longer bio (client, 5/10): on wide screens the photo stays in view at a normal
   height (sticky) while the text runs beside it, instead of stretching to the text's full height; tighter paragraphs. */
/* Phones: the whole photo, not a close crop of the face (client, 8/10: «ξεζουμ τη φωτο τη δική μου από κινητά»). */
@media (max-width: 767px) {
	.b27-meet > .wp-block-column:first-child { min-height: 0; }
	.b27-meet .wp-block-image { position: static; width: 72%; max-width: 300px; margin: 1.5rem auto 0; }   /* a bit smaller on phones (George, 8/10) */
	.b27-meet .wp-block-image img { height: auto; aspect-ratio: 831 / 1024; object-fit: cover; border-radius: 18px; }   /* her photo's own shape (a ratio is needed: «auto» stretched it) */
}
@media (min-width: 768px) {
	.b27-meet > .wp-block-column:first-child { align-self: stretch; }
	.b27-meet .wp-block-image { position: sticky; inset: auto; top: 110px; height: min(640px, calc(100vh - 140px)); }
	.b27-meet > .wp-block-column:first-child { padding: clamp(1rem, 1.6vw, 1.5rem) 0 clamp(1rem, 1.6vw, 1.5rem) clamp(1rem, 1.6vw, 1.5rem) !important; }   /* the photo inset, with round corners (George, 9/10) */
	.b27-meet .wp-block-image img { border-radius: 18px; }
}
.b27-meet__text p { margin: 0 0 0.45rem; line-height: 1.55; }   /* tighter (client, 5/10 evening) */
.b27-meet__text .wp-block-buttons { margin-top: 1.25rem; }
/* Client 6/10: the hearts in fuchsia (a text heart, so CSS colours it) and the bold lines in the dark fuchsia of the button. */
.b27-meet__text .b27-heart { color: var(--b27-action); font-family: Arial, sans-serif; }
.b27-meet__text strong { color: var(--b27-action); }
.b27-set-banner__shot { display: block; width: 100%; max-width: 560px; height: auto; margin: 1.5rem auto 0; }   /* ready-made set photo (transparent background) */

/* «Back to top» (Kadence): round, in the brand colour, on a white disc so it stays visible over any section (5/10). */
#kt-scroll-up.scroll-up-wrap { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0; border: 2px solid var(--b27-action); border-radius: 50%; background: var(--b27-surface); color: var(--b27-action); box-shadow: 0 6px 16px rgba(194, 24, 91, 0.18); }
#kt-scroll-up.scroll-up-wrap:hover, #kt-scroll-up.scroll-up-wrap:focus-visible { background: var(--b27-action); color: var(--b27-surface); }
#kt-scroll-up.scroll-up-wrap:focus-visible { outline: 3px solid var(--b27-action-dark); outline-offset: 3px; }

/* Search results on phones (client: «η αναζήτηση δεν λειτουργεί»): a compact title, so the products show at once. */
@media (max-width: 767px) {
	body.search .entry-hero h1, body.search .page-title, body.search h1.archive-title { font-size: 1.35rem; line-height: 1.3; }
	body.search .entry-hero-container-inner, body.search .entry-header { padding-top: 0.75rem; padding-bottom: 0.75rem; }
}

/* Search suggestions (client 6/10; b27-core assets/search-suggest.js): a white list under the field. */
.b27-sugg-form { position: relative; }
.b27-sugg {
	position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 120;
	margin: 0; padding: 0.35rem; list-style: none;
	background: var(--b27-surface); color: var(--b27-ink);
	border: 2px solid var(--b27-action); border-radius: 18px;
	box-shadow: 0 14px 34px rgba(0, 0, 0, 0.16);
	max-height: min(70vh, 480px); overflow-y: auto;
}
.b27-sugg[hidden] { display: none; }
.b27-sugg li { display: flex; align-items: center; gap: 0.75rem; margin: 0; padding: 0.45rem 0.6rem; border-radius: 12px; cursor: pointer; }
.b27-sugg li[aria-selected="true"], .b27-sugg li:hover { background: #FDE7EA; outline: 2px solid var(--b27-action); outline-offset: -2px; }
.b27-sugg li[aria-disabled="true"] { cursor: default; outline: 0; background: none; }
.b27-sugg__img { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 8px; overflow: hidden; background: #fff; }
.b27-sugg__img img { width: 100%; height: 100%; object-fit: contain; display: block; }
.b27-sugg__text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.b27-sugg__brand { font-size: 0.75rem; letter-spacing: 0.04em; text-transform: uppercase; color: #595959; }
.b27-sugg__name { font-size: 0.95rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.b27-sugg__price { flex: 0 0 auto; font-weight: 700; font-size: 0.95rem; }
.b27-sugg__all { font-weight: 700; color: var(--b27-action); padding: 0.2rem 0; }
.b27-sugg__none { color: #3d3d3d; }
#search-drawer .drawer-inner { overflow: visible; }

/* Homepage hero (client 6/10, like boldandbrave.gr; markup in inc/sections.php). */
.b27-hero2 { position: relative; overflow: hidden; margin-top: 0 !important; background: linear-gradient(180deg, #FFD3D8 0%, #FFC6CC 55%, var(--b27-pink) 100%); text-align: center; }
.b27-hero2__stage { position: relative; max-width: 900px; margin: 0 auto; }
.b27-hero2__girl {   /* the picture fades into the pink */
	display: block; width: 100%; height: auto;
	-webkit-mask-image: linear-gradient(180deg, #000 52%, rgba(0, 0, 0, 0.35) 82%, transparent 100%);
	mask-image: linear-gradient(180deg, #000 52%, rgba(0, 0, 0, 0.35) 82%, transparent 100%);
}
.b27-hero2__mark {   /* the logo's «B27», big and white with the logo's soft shadow, in front of the girl's shoulders */
	position: absolute; z-index: 1; left: 50%; bottom: 0; transform: translate(-50%, 35%);   /* below the chin, partly into the text */
	width: min(64%, 520px); aspect-ratio: 1232 / 710;
	background: linear-gradient(180deg, #fff 0%, #fff 45%, #FFE3E9 100%);   /* the letters a little shaded (client, 7/10) */
	-webkit-mask: url("../img/b27-wordmark.svg") center bottom / contain no-repeat;
	mask: url("../img/b27-wordmark.svg") center bottom / contain no-repeat;
	filter: drop-shadow(0 2px 0 rgba(194, 24, 91, 0.18)) drop-shadow(0 6px 12px rgba(150, 40, 70, 0.38));
}
.b27-hero2__text { position: relative; z-index: 2; margin: 0 auto; padding: calc(min(12.9vw, 105px) + clamp(0.75rem, 2vw, 1.5rem)) 1rem clamp(2rem, 5vw, 3.5rem); max-width: 900px; }
.b27-hero2__title {
	margin: 0 0 0.75rem; color: var(--b27-ink);
	font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; line-height: 1.1;
	font-size: clamp(1.9rem, 5.5vw, 3.4rem);
}
.b27-hero2 .b27-hero__lead { margin: 0 auto 1.5rem; max-width: 34em; font-size: clamp(1rem, 1.6vw, 1.25rem); color: var(--b27-ink); text-align: left; display: inline-block; }
.b27-hero2 .wp-block-buttons { justify-content: center; gap: 0.75rem; }
@media (min-width: 900px) { .b27-hero2__stage { max-width: min(560px, calc((100vh - 330px) * 1.06)); min-width: 420px; } }   /* desktop: the title stays on the first screen */
@media (max-width: 599px) {
	.b27-hero2 .wp-block-buttons { flex-direction: column; align-items: stretch; max-width: 22rem; margin: 0 auto; }
}

/* Homepage hero, trial 3 (client, 8/10; only with ?hero=3): the girl in profile on pink on the left, the B27 wordmark,
   title, text and buttons in the empty pink space on the right. Phones: the photo on top, the text under it on the same pink. */
.b27-hero3 { position: relative; overflow: hidden; margin-top: 0 !important; background: #FDBCC1; display: flex; flex-direction: column; }
.b27-hero3__stage { order: 2; }   /* phones: the text and buttons first, the photo under them (George, 8/10) */
.b27-hero3__stage { position: relative; }
.b27-hero3__img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: 22% 30%; }
.b27-hero3__text { position: relative; z-index: 2; padding: 2rem 1.25rem 1.75rem; text-align: center; }
.b27-hero3__mark {   /* the logo's «B27», white with the logo's soft shadow, as in the current hero */
	width: min(50%, 190px); aspect-ratio: 1232 / 710; margin: 0 auto 0.75rem;
	background: linear-gradient(180deg, #fff 0%, #fff 45%, #FFE3E9 100%);
	-webkit-mask: url("../img/b27-wordmark.svg") center / contain no-repeat;
	mask: url("../img/b27-wordmark.svg") center / contain no-repeat;
	filter: drop-shadow(0 2px 0 rgba(194, 24, 91, 0.18)) drop-shadow(0 6px 12px rgba(150, 40, 70, 0.38));
}
.b27-hero3 .b27-hero__lead { margin: 0 auto 1.5rem; max-width: 30em; font-size: clamp(1rem, 1.5vw, 1.2rem); color: var(--b27-ink); }
.b27-hero3 .wp-block-buttons { justify-content: center; gap: 0.75rem; }
@media (max-width: 599px) {
	.b27-hero3 .wp-block-buttons { flex-direction: column; align-items: stretch; max-width: 22rem; margin: 0 auto; }
}
@media (min-width: 900px) {
	.b27-hero3 { min-height: min(calc(100vh - 140px), 46vw, 760px); flex-direction: row; align-items: center; }
	.b27-hero3__stage { position: absolute; inset: 0; }
	.b27-hero3__img { height: 100%; aspect-ratio: auto; object-position: 0% 30%; }
	.b27-hero3__text { width: 40%; margin-left: 57%; padding: 2.5rem clamp(1.5rem, 3vw, 3rem) 2.5rem 0; text-align: left; }
	.b27-hero3__mark { margin: 0 0 1rem; width: min(70%, 320px); }
	.b27-hero3 .b27-hero__lead { margin-left: 0; }
	.b27-hero3 .wp-block-buttons { justify-content: flex-start; }
}

/* B27 Club as the client's idea 5 (7/10, «με τη φιγούρα του B27»): a wide light-pink band — the logo's girl big on the
   left, standing on the bottom edge; in the middle the eyebrow, title, text and the email field with its button on one
   line; on the right the perks with outline icons and «B27♥» in the corner. */
.b27-newsletter--v5 .b27-newsletter__inner {
	grid-template-columns: minmax(180px, 0.85fr) minmax(0, 1.5fr) minmax(0, 0.95fr);
	align-items: center;
	gap: clamp(1.25rem, 3vw, 2.75rem);
	padding: clamp(1.5rem, 3.5vw, 2.75rem) clamp(1.25rem, 3.5vw, 3rem) 0;
	border: 1.5px solid #EBA6BC;
	border-radius: 28px;
	background:
		radial-gradient(circle at 12% 18%, rgba(255, 255, 255, 0.75) 0 90px, transparent 91px),
		radial-gradient(circle at 96% 92%, rgba(255, 255, 255, 0.55) 0 120px, transparent 121px),
		linear-gradient(115deg, #FFE7EC 0%, #FFD9E0 55%, #FFE4E2 100%);
}
.b27-newsletter--v5 .b27-newsletter__girl { align-self: end; margin: 0; }
.b27-newsletter--v5 .b27-newsletter__girl img { display: block; width: 100%; max-width: 320px; height: auto; margin: 0 auto; }
.b27-newsletter--v5 .b27-newsletter__main, .b27-newsletter--v5 .b27-newsletter__aside { padding-bottom: clamp(1.5rem, 3.5vw, 2.75rem); }
.b27-newsletter--v5 .b27-newsletter__title { text-wrap: balance; margin-bottom: 0.6rem; }
/* Less «zoomed» on a computer (Βίβιαν 26/10): a smaller girl and title, so the band reads at a calmer scale. */
@media (min-width: 782px) {
	.b27-newsletter--v5 .b27-newsletter__inner { grid-template-columns: minmax(160px, 0.7fr) minmax(0, 1.5fr) minmax(0, 0.95fr); }
	.b27-newsletter--v5 .b27-newsletter__girl img { max-width: 250px; }
	.b27-newsletter--v5 .b27-newsletter__title { font-size: clamp(1.75rem, 2.6vw, 2.25rem); }
}
.b27-newsletter--v5 .b27-newsletter__lead { max-width: 32em; margin-bottom: 1.1rem; }
.b27-newsletter--v5 .b27-newsletter__form { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
.b27-newsletter--v5 .b27-newsletter__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); white-space: nowrap; }
.b27-newsletter--v5 .b27-newsletter__field { max-width: 30rem; background: var(--b27-surface); box-shadow: 0 8px 22px rgba(168, 18, 79, 0.10); }
.b27-newsletter--v5 .b27-newsletter__submit { white-space: nowrap; }
.b27-newsletter--v5 .b27-newsletter__consent { max-width: 30rem; }
.entry-content ul.b27-newsletter__perks, .b27-newsletter--v5 ul.b27-newsletter__perks { display: grid; gap: 0.9rem; margin: 0; padding: 0; list-style: none; }
.b27-newsletter--v5 .b27-newsletter__perks li { display: flex; align-items: center; gap: 0.75rem; margin: 0; font-size: 0.9375rem; font-weight: 600; color: var(--b27-ink); }
.b27-newsletter--v5 .b27-newsletter__perks li::before {
	content: ""; flex: none; width: 38px; height: 38px; border-radius: 50%;
	background: var(--b27-surface) center / 20px no-repeat; box-shadow: 0 4px 12px rgba(168, 18, 79, 0.10);
}
.b27-newsletter--v5 .b27-newsletter__perks li.b27-newsletter__perk--gift::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C2185B' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='4' rx='1'/%3E%3Cpath d='M12 8v13M19 12v7a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-7M7.5 8a2.5 2.5 0 0 1 0-5C10 3 12 8 12 8s2-5 4.5-5a2.5 2.5 0 0 1 0 5'/%3E%3C/svg%3E"); }
.b27-newsletter--v5 .b27-newsletter__perks li.b27-newsletter__perk--star::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C2185B' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3 2.8 5.7 6.2.9-4.5 4.4 1 6.2L12 17.3 6.5 20.2l1-6.2L3 9.6l6.2-.9z'/%3E%3C/svg%3E"); }
.b27-newsletter--v5 .b27-newsletter__perks li.b27-newsletter__perk--heart::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C2185B' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.4-9.2-8.6C1.2 8.2 3.1 4.5 6.6 4.5c2 0 3.4 1.2 4.4 2.6 1-1.4 2.4-2.6 4.4-2.6 3.5 0 5.4 3.7 3.8 6.9C19 15.6 12 20 12 20z'/%3E%3C/svg%3E"); }
.b27-newsletter--v5 .b27-newsletter__perks li.b27-newsletter__perk--spark::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C2185B' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v4M12 17v4M3 12h4M17 12h4M6.3 6.3l2.5 2.5M15.2 15.2l2.5 2.5M6.3 17.7l2.5-2.5M15.2 8.8l2.5-2.5'/%3E%3C/svg%3E"); }
.b27-newsletter--v5 .b27-newsletter__mark { margin: 1.5rem 0 0; text-align: right; font-weight: 800; font-size: clamp(1.6rem, 2.6vw, 2.2rem); letter-spacing: 0.02em; color: var(--b27-action); line-height: 1; }
.b27-newsletter--v5 .b27-newsletter__mark span { font-size: 0.6em; vertical-align: super; margin-left: 0.1em; }
@media (max-width: 1024px) and (min-width: 782px) {
	.b27-newsletter--v5 .b27-newsletter__inner { grid-template-columns: minmax(150px, 0.7fr) minmax(0, 1.3fr); }
	.b27-newsletter--v5 .b27-newsletter__aside { grid-column: 2; padding-top: 0; }
	.b27-newsletter--v5 .b27-newsletter__girl { grid-row: 1 / span 2; }
}
@media (max-width: 781px) {
	.b27-newsletter--v5 .b27-newsletter__inner { grid-template-columns: 1fr; text-align: center; padding-top: 1.5rem; }
	.b27-newsletter--v5 .b27-newsletter__girl { order: -1; align-self: center; }
	.b27-newsletter--v5 .b27-newsletter__girl img { max-width: 180px; }
	.b27-newsletter--v5 .b27-newsletter__main { padding-bottom: 0; }
	.b27-newsletter--v5 .b27-newsletter__lead, .b27-newsletter--v5 .b27-newsletter__field, .b27-newsletter--v5 .b27-newsletter__consent { margin-left: auto; margin-right: auto; }
	.entry-content ul.b27-newsletter__perks, .b27-newsletter--v5 ul.b27-newsletter__perks { display: inline-grid; text-align: left; }
	.b27-newsletter--v5 .b27-newsletter__mark { text-align: center; }
}

/* Homepage background: the same as every other page (George, 7/10): the body's --b27-blush shows through, the
   sections keep their own white cards. */
body.b27-home #wrapper.site, body.b27-home .content-bg, body.b27-home .entry { background: transparent; }

/* B27 Club: the code on the page after the confirmation email (inc/newsletter.php, inc/club.php). */
.b27-newsletter__code { margin-top: 1rem; padding: 1rem 1.1rem; border-radius: 16px; background: var(--b27-surface); border: 2px dashed var(--b27-action); text-align: center; }
.b27-newsletter__code p { margin: 0 0 0.4rem; }
.b27-newsletter__code-value { font-size: 1.6rem; font-weight: 800; letter-spacing: 0.12em; color: var(--b27-action); user-select: all; }
.b27-newsletter__code-note { font-size: 0.85rem; color: #3d3d3d; margin: 0 !important; }

/* Show-password eye: the click area covers the right end of the field, not just the 22px icon (WCAG 2.5.8). */
.woocommerce .password-input .show-password-input { top: 0; right: 0; width: 40px; height: 100%; display: flex; align-items: center; justify-content: center; }

/* Very narrow screens / 400% zoom (320px, WCAG 1.4.10): one product per row, so the badge, the heart, the brand and the title are not squeezed or cut. */
@media (max-width: 359px) {
	.woocommerce ul.products:not(.products-list-view) { grid-template-columns: minmax(0, 1fr) !important; }
}

/* Homepage hero, trial 4 (George, 9/10; only with ?hero=4): desktop exactly as trial 3; phones and tablets the photo on
   top, fading into the pink, the big «B27» over its lower edge and the text under it, as in the current hero. */
@media (max-width: 899px) {
	.b27-hero4 .b27-hero3__stage { order: 0; }
	.b27-hero4 .b27-hero3__img {
		-webkit-mask-image: linear-gradient(180deg, #000 52%, rgba(0, 0, 0, 0.35) 82%, transparent 100%);
		mask-image: linear-gradient(180deg, #000 52%, rgba(0, 0, 0, 0.35) 82%, transparent 100%);
	}
	.b27-hero4 .b27-hero3__text { padding-top: 0; }
	.b27-hero4 .b27-hero3__mark { width: min(64vw, 520px); margin: calc(min(64vw, 520px) * -0.375) auto 0.75rem; }   /* ~65% of the wordmark over the photo */
}
@media (max-width: 599px) {   /* phones: a 4:5 frame so the girl (about 27% across the photo) sits exactly in the middle (George, 9/10) */
	.b27-hero4 .b27-hero3__img { aspect-ratio: 4 / 5; object-position: 1% 50%; }
}
/* Smaller photo (George, 9/10). Phones/tablets: 80% wide in the middle, its edges fading into the pink.
   Desktop: the whole photo, smaller, at the bottom left fading into the pink at both sides, and a smaller «B27». */
@media (max-width: 899px) {
	.b27-hero4 .b27-hero3__img {
		width: 80%; margin: 0 auto;
		-webkit-mask-image: linear-gradient(180deg, #000 52%, rgba(0, 0, 0, 0.35) 82%, transparent 100%), linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%);
		mask-image: linear-gradient(180deg, #000 52%, rgba(0, 0, 0, 0.35) 82%, transparent 100%), linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%);
		-webkit-mask-composite: source-in; mask-composite: intersect;
	}
	.b27-hero4 .b27-hero3__mark { width: min(54vw, 440px); margin-top: calc(min(54vw, 440px) * -0.375); }
}
@media (min-width: 900px) {
	.b27-hero4 { min-height: 0; }
	.b27-hero4 .b27-hero3__stage { display: flex; align-items: flex-end; padding-left: 13vw; }   /* the photo sits at the bottom left, close to the text (George, 9/10) */
	.b27-hero4 .b27-hero3__img {
		width: auto; max-width: none; height: clamp(380px, 40vw, 560px); object-fit: contain;
		-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 78%, transparent 100%);
		mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 78%, transparent 100%);
	}
	.b27-hero4 .b27-hero3__text { margin-left: 49%; padding-top: 2rem; padding-bottom: 2rem; }
	.b27-hero4 .b27-hero3__mark { width: min(55%, 240px); }
}

.b27-hero5 .b27-hero5__brand .b27-hero2__title { margin-bottom: 0.75rem; }   /* the title is the last child of its wrapper; keep trial 4's gap */
/* Homepage hero, trial 5 (George, 9/10; only with ?hero=5): desktop as trial 4. Phones and tablets: the whole photo,
   the girl on its left; «B27» and the title on the photo's empty pink right side; the photo fades out at the bottom,
   then the text and buttons. */
@media (max-width: 899px) {
	.b27-hero5 { display: grid; grid-template-columns: 1fr 1fr; }
	.b27-hero5 .b27-hero3__stage { grid-column: 1 / -1; grid-row: 1; }
	.b27-hero4.b27-hero5 .b27-hero3__img {
		width: 100%; aspect-ratio: 3 / 2; object-position: 0 50%;
		-webkit-mask-image: linear-gradient(180deg, #000 60%, rgba(0, 0, 0, 0.35) 85%, transparent 100%);
		mask-image: linear-gradient(180deg, #000 60%, rgba(0, 0, 0, 0.35) 85%, transparent 100%);
	}
	.b27-hero5 .b27-hero3__text { display: contents; }
	.b27-hero5__brand { position: relative; z-index: 2; grid-column: 2; grid-row: 1; align-self: center; padding: 0 1rem 1.5rem 0; text-align: center; }
	.b27-hero4.b27-hero5 .b27-hero3__mark { width: 80%; margin: 0 auto 0.5rem; }
	.b27-hero5 .b27-hero5__brand .b27-hero2__title { margin-bottom: 0; font-size: clamp(1.15rem, 5.4vw, 2.4rem); }
	.b27-hero5__more { grid-column: 1 / -1; grid-row: 2; padding: 0.5rem 1.25rem 1.75rem; text-align: center; }
}

/* Instagram feed on the homepage (Smash Balloon, feed 1): the posts centred while there are fewer than a full row,
   rounded like the site's cards; 4 per row on desktop, 2 on phones. */
.b27-insta-feed #sb_instagram #sbi_images { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; padding: 0; }
.b27-insta-feed #sb_instagram #sbi_images .sbi_item { flex: 0 0 calc((100% - 36px) / 4); width: auto; max-width: none; padding: 0 !important; }
.b27-insta-feed #sb_instagram .sbi_photo_wrap, .b27-insta-feed #sb_instagram .sbi_photo { border-radius: 14px; overflow: hidden; }
.b27-insta-feed #sb_instagram #sbi_load { margin-top: 1.25rem; }
@media (max-width: 767px) {
	.b27-insta-feed #sb_instagram #sbi_images .sbi_item { flex-basis: calc((100% - 12px) / 2); }
}