/* ==========================================================================
   bubi bird — design system
   ========================================================================== */

:root {
	--cream: #f7f1ea;
	--brown: #4a3728;
	--pink: #d98a85;
	--tan: #ead6b7;
	--sage: #b7c4ad;
	--blue: #a9cbdd;
	--coral: #eea9a4;
	--white: #fff;

	--ink-70: rgba(74, 55, 40, .7);
	--ink-55: rgba(74, 55, 40, .55);
	--line: rgba(74, 55, 40, .08);

	--gx: clamp(16px, 4vw, 32px);
	--wrap: 1280px;
	--r-card: 22px;
	--r-lg: 28px;

	--sans: 'Nunito', system-ui, -apple-system, sans-serif;
	--mono: 'Montserrat', system-ui, sans-serif;
}

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

html { scroll-behavior: smooth; }

body {
	margin: 0;
	background: var(--cream);
	color: var(--brown);
	font-family: var(--sans);
	font-weight: 600;
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}

a { color: var(--brown); text-decoration: none; }
a:hover { color: var(--pink); }

img { max-width: 100%; height: auto; display: block; }

button, input, select, textarea { font-family: inherit; }
button { cursor: pointer; }

h1, h2, h3, h4 { letter-spacing: -.02em; line-height: 1.05; margin: 0; }
h1 { font-weight: 900; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding-inline: var(--gx); }

.eyebrow {
	font-family: var(--mono);
	font-size: 11px;
	letter-spacing: .16em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--pink);
}

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden; clip-path: inset(50%);
	white-space: nowrap;
}

.skip-link {
	position: absolute; left: -9999px; top: 0; z-index: 100;
	background: var(--brown); color: var(--cream);
	padding: 12px 20px; border-radius: 0 0 12px 0; font-weight: 800;
}
.skip-link:focus { left: 0; color: var(--cream); }

:focus-visible { outline: 3px solid var(--pink); outline-offset: 2px; border-radius: 4px; }

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wp-element-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 52px;
	padding: 0 28px;
	border: 0;
	border-radius: 999px;
	background: var(--brown);
	color: var(--cream);
	font-family: var(--sans);
	font-weight: 800;
	font-size: 15px;
	line-height: 1;
	white-space: nowrap;
	transition: transform .15s, background .15s;
}
.btn:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
	background: #3a2a1e;
	color: var(--cream);
	transform: translateY(-2px);
}

.btn--ghost {
	background: transparent;
	color: var(--brown);
	border: 2px solid var(--brown);
}
.btn--ghost:hover { background: var(--tan); color: var(--brown); }

.btn--sm { height: 44px; padding: 0 20px; font-size: 14px; }

.woocommerce button.button.alt,
.woocommerce a.button.alt,
.woocommerce input.button.alt {
	background: var(--brown);
	color: var(--cream);
}
.woocommerce button.button.alt:hover { background: #3a2a1e; }

.woocommerce .button.disabled,
.woocommerce button.button:disabled {
	opacity: .45;
	cursor: not-allowed;
	transform: none;
}

/* --------------------------------------------------------------------------
   Announcement marquee
   -------------------------------------------------------------------------- */

.announce {
	background: var(--brown);
	color: var(--cream);
	font-family: var(--mono);
	font-size: 11px;
	letter-spacing: .14em;
	text-transform: uppercase;
	height: 36px;
	display: flex;
	align-items: center;
	overflow: hidden;
}
.announce__track {
	display: flex;
	white-space: nowrap;
	padding-left: 24px;
	animation: bbMarquee 36s linear infinite;
}
.announce__item {
	display: inline-flex;
	align-items: center;
	gap: 28px;
	padding-right: 28px;
}
.announce__dot {
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--sage);
	display: inline-block;
}
@keyframes bbMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

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

.site-header {
	position: sticky;
	top: 0;
	z-index: 40;
	background: rgba(247, 241, 234, .9);
	backdrop-filter: blur(12px);
	border-bottom: 1px solid var(--line);
}
.site-header__bar {
	max-width: var(--wrap);
	margin: 0 auto;
	padding-inline: var(--gx);
	height: 76px;
	display: flex;
	align-items: center;
	gap: clamp(8px, 2vw, 32px);
}
.site-logo img {
	height: clamp(34px, 9vw, 44px);
	max-width: 44vw;
	object-fit: contain;
}
.site-nav {
	display: flex;
	gap: 26px;
	margin-left: auto;
	font-weight: 700;
	font-size: 14px;
	list-style: none;
}
/* The menu is rendered as bare <li>s, which browsers draw a bullet against. */
.site-nav li,
.mobile-nav li { list-style: none; display: block; margin: 0; }
.site-nav a { padding-bottom: 2px; border-bottom: 2px solid transparent; }
.site-nav .current-menu-item > a,
.site-nav .current-product-ancestor > a,
.site-nav a[aria-current] { color: var(--pink); border-bottom-color: var(--pink); }

/* "Pagal amžių" opens the age list rather than being one more flat link. */
.site-nav > li { position: relative; }
.site-nav .menu-item-has-children > a::after {
	content: '⌄';
	margin-left: 5px;
	font-size: 13px;
	line-height: 1;
	vertical-align: 1px;
}
.site-nav .sub-menu {
	position: absolute;
	left: 50%;
	top: 100%;
	transform: translateX(-50%) translateY(6px);
	margin: 0;
	padding: 10px;
	min-width: 220px;
	list-style: none;
	background: var(--white);
	border-radius: 18px;
	box-shadow: 0 18px 40px rgba(74, 55, 40, .16);
	opacity: 0;
	visibility: hidden;
	transition: opacity .16s, transform .16s;
	z-index: 60;
}
.site-nav > li:hover > .sub-menu,
.site-nav > li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
}
.site-nav .sub-menu a {
	display: block;
	padding: 9px 12px;
	border-radius: 10px;
	border-bottom: 0;
	font-size: 14px;
	white-space: nowrap;
}
.site-nav .sub-menu a:hover { background: var(--tan); }
/* A gap between the trigger and the panel would close it mid-move. */
.site-nav .menu-item-has-children::after {
	content: '';
	position: absolute;
	left: 0; right: 0; top: 100%;
	height: 10px;
}

.header-actions { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }

.icon-btn {
	width: 42px; height: 42px;
	border-radius: 50%;
	border: 0;
	background: transparent;
	display: grid;
	place-items: center;
	color: var(--brown);
}
.icon-btn:hover { background: var(--tan); }

.cart-btn {
	height: 42px;
	padding: 0 16px 0 12px;
	border-radius: 999px;
	border: 0;
	background: var(--brown);
	color: var(--cream);
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 800;
	font-size: 14px;
	transition: transform .15s;
}
.cart-btn:hover { transform: scale(1.04); color: var(--cream); }

.burger { display: none; }

.mobile-nav {
	display: none;
	flex-direction: column;
	gap: 4px;
	padding: 8px var(--gx) 20px;
	border-top: 1px solid var(--line);
	background: var(--cream);
	font-weight: 800;
	font-size: 18px;
}
.mobile-nav.is-open { display: flex; }
.mobile-nav ul { list-style: none; margin: 0; padding: 0; }
.mobile-nav a { padding: 12px 0; display: block; }
/* Nested age links sit indented and a little quieter than the top level. */
.mobile-nav .sub-menu {
	margin: 0 0 6px;
	padding-left: 14px;
	border-left: 2px solid var(--tan);
}
.mobile-nav .sub-menu a { padding: 9px 0; font-size: 15px; font-weight: 700; color: var(--ink-70); }

@media (max-width: 1023px) {
	.site-nav { display: none; }
	.burger { display: grid; }
	.header-actions { margin-left: auto; }
}

/* Search overlay */
.search-panel {
	display: none;
	border-top: 1px solid var(--line);
	background: var(--cream);
	padding: 16px var(--gx);
}
.search-panel.is-open { display: block; }
.search-panel form {
	max-width: var(--wrap);
	margin: 0 auto;
	display: flex;
	gap: 8px;
	background: var(--white);
	border-radius: 999px;
	padding: 6px;
}
.search-panel input[type="search"] {
	flex: 1;
	height: 46px;
	border: 0;
	background: transparent;
	padding: 0 18px;
	font-size: 15px;
	font-weight: 700;
	color: var(--brown);
	outline: none;
	min-width: 0;
}

/* --------------------------------------------------------------------------
   Product cards
   -------------------------------------------------------------------------- */

.products,
ul.products {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr));
	gap: 18px;
}

.product-card {
	background: var(--white);
	border-radius: var(--r-card);
	overflow: hidden;
	position: relative;
	transition: transform .25s cubic-bezier(.2, .8, .2, 1), box-shadow .25s;
	display: flex;
	flex-direction: column;
}
.product-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 18px 40px rgba(74, 55, 40, .14);
}

.product-card__media {
	position: relative;
	aspect-ratio: 1 / 1;
	background: var(--tan);
	overflow: hidden;
	display: block;
}
.product-card__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.product-card__media .alt-img {
	opacity: 0;
	transition: opacity .35s;
}
.product-card:hover .alt-img { opacity: 1; }

.product-card__tag {
	position: absolute;
	top: 12px; left: 12px;
	background: var(--tan);
	color: var(--brown);
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .12em;
	text-transform: uppercase;
	font-weight: 600;
	padding: 6px 10px;
	border-radius: 999px;
	pointer-events: none;
	z-index: 2;
}
.product-card__tag--out { background: var(--coral); }

.product-card__add {
	position: absolute;
	left: 12px; right: 12px; bottom: 12px;
	height: 44px;
	border-radius: 999px;
	border: 0;
	background: var(--brown);
	color: var(--cream);
	font-weight: 800;
	font-size: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	transform: translateY(72px);
	opacity: 0;
	transition: transform .3s cubic-bezier(.2, .8, .2, 1), opacity .25s;
	z-index: 3;
}
.product-card:hover .product-card__add,
.product-card__add:focus-visible { transform: translateY(0); opacity: 1; }
.product-card__add:hover { color: var(--cream); background: #3a2a1e; }
.product-card__add.loading { opacity: .6; }
.product-card__add.added::after { content: ' ✓'; }

.product-card__body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 0; flex: 1; }
.product-card__brand {
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .14em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--ink-55);
	min-height: 14px;
}
.product-card__title {
	margin: 6px 0 8px;
	font-size: 17px;
	font-weight: 800;
	line-height: 1.25;
}
.product-card__meta {
	margin-top: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}
.product-card__price { font-weight: 900; font-size: 17px; white-space: nowrap; }
.product-card__price del { opacity: .5; font-weight: 700; margin-right: 6px; }
.product-card__price ins { text-decoration: none; color: var(--pink); }
.product-card__age {
	font-size: 12px;
	font-weight: 700;
	color: var(--ink-55);
	background: var(--cream);
	padding: 4px 10px;
	border-radius: 999px;
	white-space: nowrap;
}

@media (max-width: 640px) {
	.products, ul.products { grid-template-columns: repeat(2, 1fr); gap: 12px; }
	.product-card__title { font-size: 15px; }
	.product-card__price { font-size: 15px; }
	.product-card__add { opacity: 1; transform: translateY(0); height: 40px; font-size: 13px; }
}

/* --------------------------------------------------------------------------
   Sections
   -------------------------------------------------------------------------- */

.section { max-width: var(--wrap); margin: 0 auto; padding: 72px var(--gx); }
.section--tight { padding-block: 40px; }
.section__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	margin-bottom: 28px;
}
.section__title {
	font-size: clamp(30px, 5vw, 40px);
	font-weight: 900;
	margin: 8px 0 0;
	max-width: 640px;
	text-wrap: balance;
	overflow-wrap: anywhere;
}
.section__lead {
	margin: 0;
	max-width: 380px;
	font-weight: 600;
	color: var(--ink-70);
	font-size: 15px;
	line-height: 1.5;
}

/* Headings that read across the whole column instead of a narrow measure. */
.section__head--stack { display: block; }
.section__title--wide { max-width: none; }
.section__lead--wide { max-width: none; margin-top: 12px; }
@media (min-width: 1000px) {
	/* Wide enough to hold these two lines whole; below that they wrap normally. */
	.section__head--stack .section__title--wide,
	.section__head--stack .section__lead--wide { white-space: nowrap; }
}

/* Row above a product grid: label on the left, link to the full catalogue on the right. */
.shop-toolbar {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	margin: 0 0 20px;
}
.shop-toolbar .woocommerce-result-count {
	margin: 0;
	font-size: clamp(22px, 3vw, 28px);
	font-weight: 900;
	letter-spacing: -.02em;
}
/* This is the way out of an eight-product row into the whole category, so it is a
   button rather than a line of text people scroll past. */
.shop-toolbar__more {
	white-space: nowrap;
	flex-shrink: 0;
	box-shadow: 0 6px 18px rgba(74, 55, 40, .18);
}
.shop-toolbar__arrow { transition: transform .18s; }
.shop-toolbar__more:hover .shop-toolbar__arrow { transform: translateX(4px); }
@media (prefers-reduced-motion: reduce) {
	.shop-toolbar__arrow { transition: none; }
}

[data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .6s, transform .6s; }
[data-reveal].is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	[data-reveal] { opacity: 1; transform: none; transition: none; }
	.announce__track { animation: none; }
}

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

.site-footer { background: var(--white); border-top: 1px solid var(--line); margin-top: 40px; }
.site-footer__cols {
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 56px var(--gx) 28px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
	gap: 32px;
}
.site-footer__heading {
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--ink-55);
	margin-bottom: 4px;
}
.site-footer__col { display: flex; flex-direction: column; gap: 10px; font-size: 14px; font-weight: 700; }
.site-footer__col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.site-footer__brandline {
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .2em;
	text-transform: uppercase;
	font-weight: 600;
	margin-top: 6px;
	color: var(--ink-55);
}
.site-footer__bottom {
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 18px var(--gx) 32px;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: space-between;
	font-size: 12px;
	font-weight: 700;
	color: var(--ink-55);
	border-top: 1px solid var(--line);
}

/* --------------------------------------------------------------------------
   Hero (front page)
   -------------------------------------------------------------------------- */

.hero {
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 56px var(--gx) 40px;
	display: grid;
	grid-template-columns: 1.05fr .95fr;
	gap: 40px;
	align-items: center;
	position: relative;
}
/* The ranking heading, kept visible above the design's line rather than hidden. */
.hero__kicker {
	margin: 0 0 10px;
	font-size: clamp(14px, 1.3vw, 16px);
	font-weight: 800;
	letter-spacing: .01em;
	color: var(--pink);
}

.hero__title {
	font-size: clamp(44px, 5.4vw, 74px);
	line-height: .98;
	font-weight: 900;
	letter-spacing: -.03em;
	margin: 0 0 22px;
	text-wrap: balance;
	overflow-wrap: anywhere;
}
.hero__title em { font-style: normal; color: var(--pink); }
.hero__lead {
	font-size: 19px;
	line-height: 1.5;
	max-width: 460px;
	margin: 0 0 30px;
	font-weight: 600;
	color: rgba(74, 55, 40, .78);
	text-wrap: pretty;
}
.hero__cta { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.hero__grid {
	position: relative;
	height: 520px;
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	grid-template-rows: 1fr 1fr;
	gap: 14px;
}
.hero__tile {
	border-radius: 24px;
	overflow: hidden;
	position: relative;
	display: block;
	transition: transform .25s;
	background: var(--tan);
}
.hero__tile:hover { transform: translateY(-4px); }
.hero__tile:first-child { grid-row: span 2; border-radius: var(--r-lg); }
.hero__tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero__badge {
	position: absolute;
	left: 14px; right: 14px; bottom: 14px;
	width: fit-content;
	max-width: calc(100% - 28px);
	background: var(--cream);
	padding: 8px 14px;
	border-radius: 999px;
	font-weight: 800;
	font-size: 13px;
	/* The two small tiles cannot hold a long name, so the name gives way and the
	   price always stays readable. */
	display: flex;
	align-items: baseline;
	gap: 6px;
	min-width: 0;
	pointer-events: none;
	z-index: 2;
}
.hero__badge-name {
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.hero__badge-price { flex: 0 0 auto; white-space: nowrap; }
.hero__badge-price::before { content: '· '; font-weight: 800; }
.hero__tile:not(:first-child) .hero__badge { font-size: 12px; padding: 7px 12px; }

@media (max-width: 900px) {
	.hero { grid-template-columns: 1fr; }
	.hero__grid { height: 420px; }
}
@media (max-width: 560px) {
	.hero__grid { height: 300px; }
	.hero__tile { border-radius: 18px; }
}

/* Footer: full trading details and the card marks Paysera asks to see. */
.site-footer__blurb { margin: 18px 0 0; font-size: 14px; line-height: 1.55; font-weight: 600; color: var(--ink-70); max-width: 300px; }
.site-footer__contact {
	margin: 14px 0 0;
	font-style: normal;
	font-size: 13px;
	line-height: 1.7;
	font-weight: 600;
	color: var(--ink-70);
	max-width: 320px;
}
.site-footer__contact strong { color: var(--brown); font-weight: 800; }
.site-footer__contact a { text-decoration: underline; }

.site-footer__pay {
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 24px var(--gx) 0;
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
}
.site-footer__pay-label {
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .14em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--ink-55);
}
.pay-marks { display: flex; align-items: center; gap: 10px; }
.pay-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 34px;
	min-width: 52px;
	padding: 0 10px;
	background: var(--white);
	border-radius: 8px;
}
.pay-mark svg { height: 18px; width: auto; display: block; }
.pay-mark img { height: 20px; width: auto; display: block; }
/* A supplied strip already carries its own padding and both marks. */
.pay-mark--strip { background: var(--white); padding: 5px 10px; min-width: 0; }
.pay-mark--strip img { height: 24px; }

/* Brand index page */
.brand-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr));
	gap: 18px;
}
.brand-card {
	display: flex;
	flex-direction: column;
	gap: 4px;
	background: var(--white);
	border-radius: 20px;
	padding: 14px;
	transition: transform .2s;
	min-width: 0;
}
.brand-card:hover { transform: translateY(-4px); }
.brand-card__pic {
	display: block;
	border-radius: 14px;
	overflow: hidden;
	background: var(--cream);
	aspect-ratio: 1;
	margin-bottom: 8px;
}
.brand-card__pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.brand-card__name { font-weight: 800; font-size: 16px; }
.brand-card__count { font-size: 13px; font-weight: 700; color: var(--ink-70); }

/* Brand marquee */
.brand-strip {
	border-top: 1px solid rgba(74, 55, 40, .1);
	border-bottom: 1px solid rgba(74, 55, 40, .1);
	padding: 12px 0;
	overflow: hidden;
	background: var(--cream);
}
.brand-strip__track {
	display: flex;
	white-space: nowrap;
	animation: bbMarquee 40s linear infinite;
}
.brand-strip__track { animation-duration: 30s; padding-left: 24px; }
.brand-strip__item {
	font-family: var(--sans);
	font-weight: 900;
	font-size: 20px;
	letter-spacing: -.01em;
	color: var(--ink-70);
	display: inline-flex;
	align-items: center;
	gap: 28px;
	padding-right: 28px;
}
.brand-strip__item a { color: inherit; }
.brand-strip__dot {
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--sage);
	display: inline-block;
	flex-shrink: 0;
}
.brand-strip a:hover { color: var(--pink); }

/* Age / filter pills */
.pills { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 28px; }
.pill {
	height: 46px;
	padding: 0 20px;
	border-radius: 999px;
	border: 2px solid rgba(74, 55, 40, .12);
	background: var(--white);
	color: var(--brown);
	font-weight: 800;
	font-size: 15px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	transition: all .18s;
}
.pill:hover { transform: translateY(-2px); color: var(--brown); }
.pill.is-active,
.pill[aria-pressed="true"] {
	background: var(--brown);
	color: var(--cream);
	border-color: var(--brown);
}

/* Category tiles */
.cat-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	grid-auto-rows: 220px;
	gap: 16px;
}
.cat-tile {
	border-radius: 26px;
	position: relative;
	overflow: hidden;
	display: block;
	transition: transform .25s;
	background: var(--tan);
}
.cat-tile:hover { transform: translateY(-4px); }
.cat-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cat-tile__label {
	position: absolute;
	left: 14px; bottom: 14px;
	background: var(--cream);
	padding: 8px 12px;
	border-radius: 999px;
	font-weight: 800;
	font-size: 13px;
	pointer-events: none;
	z-index: 2;
}
.cat-tile--big { grid-column: span 3; grid-row: span 2; }
.cat-tile--big .cat-tile__label { left: 24px; bottom: 22px; padding: 12px 18px; font-size: 18px; }
.cat-tile--wide { grid-column: span 3; }
.cat-tile--wide .cat-tile__label { left: 24px; bottom: 22px; padding: 12px 18px; font-size: 18px; }

@media (max-width: 900px) {
	.cat-grid { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 170px; }
	.cat-tile--big { grid-column: span 2; grid-row: span 2; }
	.cat-tile--wide { grid-column: span 2; }
}
@media (max-width: 760px) {
	.cat-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 150px; }
	.cat-tile--big { grid-column: span 2; grid-row: span 1; }
	.cat-tile--wide { grid-column: span 2; }
	.cat-tile--big .cat-tile__label,
	.cat-tile--wide .cat-tile__label { font-size: 15px; padding: 9px 14px; left: 14px; bottom: 14px; }
}

/* Values */
.values { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 20px; }
.value-card { background: var(--white); border-radius: var(--r-card); padding: 28px; }
.value-card__mark { width: 44px; height: 44px; margin-bottom: 18px; }
.value-card h3 { margin: 0 0 8px; font-size: 19px; font-weight: 800; }
.value-card p { margin: 0; font-size: 14px; line-height: 1.55; font-weight: 600; color: var(--ink-70); }

/* Newsletter + social */
.promo-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 20px; }
@media (max-width: 900px) { .promo-grid { grid-template-columns: 1fr; } }

.newsletter {
	background: var(--brown);
	color: var(--cream);
	border-radius: var(--r-lg);
	padding: clamp(24px, 4vw, 44px);
	position: relative;
	overflow: hidden;
}
.newsletter__blob { position: absolute; border-radius: 50%; opacity: .9; }
.newsletter__blob--1 { right: -40px; top: -40px; width: 220px; height: 220px; background: var(--coral); }
.newsletter__blob--2 { right: 60px; bottom: -70px; width: 180px; height: 180px; background: var(--sage); }
.newsletter__inner { position: relative; max-width: 420px; }
.newsletter .eyebrow { color: var(--tan); }
.newsletter h2 { font-size: clamp(26px, 4vw, 36px); font-weight: 900; margin: 10px 0 14px; }
.newsletter p { margin: 0 0 24px; font-size: 15px; line-height: 1.5; font-weight: 600; color: rgba(247, 241, 234, .8); }
.newsletter form {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	background: var(--cream);
	padding: 6px;
	border-radius: 999px;
}
.newsletter input[type="email"] {
	flex: 1 1 160px;
	height: 46px;
	border: 0;
	background: transparent;
	padding: 0 16px;
	font-size: 15px;
	font-weight: 700;
	color: var(--brown);
	outline: none;
	min-width: 0;
}
.newsletter button { height: 46px; padding: 0 22px; font-size: 14px; }
.newsletter button:hover { background: var(--pink); }

.social-card {
	background: var(--white);
	border-radius: var(--r-lg);
	padding: 28px;
	display: flex;
	flex-direction: column;
	gap: 18px;
}
.social-card__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.social-card__handle { font-weight: 900; font-size: 22px; }
.social-card__sub { font-size: 13px; font-weight: 700; color: var(--ink-55); }
.social-card__links { display: flex; gap: 6px; flex-shrink: 0; }
.social-card__links a {
	border: 2px solid var(--brown);
	padding: 9px 14px;
	border-radius: 999px;
	font-weight: 800;
	font-size: 13px;
}
.social-card__links a:hover { background: var(--brown); color: var(--cream); }
.social-card__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; flex: 1; }
.social-card__grid a { aspect-ratio: 1/1; border-radius: 14px; overflow: hidden; background: var(--tan); display: block; }
.social-card__grid img { width: 100%; height: 100%; object-fit: cover; }

/* --------------------------------------------------------------------------
   Page header / breadcrumbs
   -------------------------------------------------------------------------- */

.page-head { max-width: var(--wrap); margin: 0 auto; padding: 40px var(--gx) 8px; }
.page-head__title { font-size: clamp(32px, 5vw, 48px); font-weight: 900; margin: 8px 0 0; text-wrap: balance; }
.page-head__desc { margin: 14px 0 0; max-width: 640px; font-weight: 600; color: var(--ink-70); line-height: 1.55; }

.breadcrumb {
	font-size: 13px;
	font-weight: 700;
	color: var(--ink-55);
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}
.breadcrumb a { color: var(--ink-55); }
.breadcrumb a:hover { color: var(--pink); }

/* --------------------------------------------------------------------------
   Cart drawer
   -------------------------------------------------------------------------- */

.cart-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(74, 55, 40, .35);
	z-index: 50;
	opacity: 0;
	pointer-events: none;
	transition: opacity .3s;
}
.cart-backdrop.is-open { opacity: 1; pointer-events: auto; }

.cart-drawer {
	position: fixed;
	top: 0; right: 0; bottom: 0;
	width: 420px;
	max-width: 100vw;
	background: var(--cream);
	z-index: 60;
	transform: translateX(100%);
	transition: transform .4s cubic-bezier(.2, .8, .2, 1);
	display: flex;
	flex-direction: column;
	box-shadow: -20px 0 60px rgba(74, 55, 40, .15);
}
.cart-drawer.is-open { transform: translateX(0); }
.cart-drawer__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 24px 28px 16px;
}
.cart-drawer__title { font-weight: 900; font-size: 24px; }
/* Says "Grįžti" rather than a bare ×: a cross next to a cart reads as "empty it". */
.cart-drawer__close {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 40px;
	padding: 0 16px;
	border-radius: 999px;
	border: 0;
	background: var(--white);
	font: inherit;
	font-size: 14px;
	font-weight: 800;
	color: var(--brown);
	cursor: pointer;
	white-space: nowrap;
}
.cart-drawer__close:hover { background: var(--tan); }

/* Sold-out product: the ask replaces the add-to-cart button. */
.restock { margin: 18px 0 8px; }
.restock__open { width: 100%; }
/* .btn sets display:inline-flex, which outranks the browser's own [hidden] rule. */
.restock__panel[hidden],
.restock__open[hidden],
.restock__send[hidden] { display: none; }
.restock__label { display: block; font-size: 14px; font-weight: 700; color: var(--ink-70); margin-bottom: 8px; }
.restock__row { display: flex; gap: 8px; flex-wrap: wrap; }
.restock__input {
	flex: 1 1 200px;
	min-width: 0;
	height: 44px;
	border-radius: 14px;
	border: 2px solid rgba(74, 55, 40, .12);
	background: var(--white);
	padding: 0 14px;
	font: inherit;
	font-size: 15px;
	font-weight: 700;
	color: var(--brown);
	outline: none;
}
.restock__input:focus { border-color: var(--brown); }
.restock__input:disabled { opacity: .6; }
.restock__send { flex: 0 0 auto; }
.restock__note { margin: 10px 0 0; font-size: 14px; font-weight: 700; color: var(--sage-ink, #5b6b52); }
.restock__note.is-bad { color: #b4564f; }
.restock__note:empty { display: none; }

.ship-bar { margin: 0 28px; background: var(--white); border-radius: 16px; padding: 14px 16px; }
.ship-bar__label { font-size: 13px; font-weight: 700; margin-bottom: 8px; }
.ship-bar__track { height: 8px; border-radius: 999px; background: var(--tan); overflow: hidden; }
.ship-bar__fill { height: 100%; background: var(--sage); border-radius: 999px; transition: width .4s; }

.cart-drawer__items {
	flex: 1;
	overflow-y: auto;
	padding: 16px 28px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.cart-drawer__empty {
	text-align: center;
	padding: 60px 20px;
	font-weight: 700;
	color: var(--ink-70);
	line-height: 1.6;
}
.mini-item {
	display: grid;
	grid-template-columns: 60px 1fr;
	gap: 12px;
	align-items: center;
	background: var(--white);
	border-radius: 16px;
	padding: 12px;
}
.mini-item__img {
	width: 60px; height: 60px;
	border-radius: 12px;
	object-fit: cover;
	background: var(--tan);
}
.mini-item__body { min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.mini-item__name { font-weight: 800; font-size: 13.5px; line-height: 1.3; }
.mini-item__brand {
	font-size: 11px;
	font-weight: 700;
	color: var(--ink-55);
	font-family: var(--mono);
	letter-spacing: .08em;
	text-transform: uppercase;
}
.mini-item__row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mini-item__qty { display: flex; align-items: center; gap: 4px; }
.mini-item__qty button {
	width: 26px; height: 26px;
	border-radius: 50%;
	border: 0;
	background: var(--cream);
	font-weight: 800;
	color: var(--brown);
	line-height: 1;
}
.mini-item__qty button:hover { background: var(--tan); }
.mini-item__qty span { font-weight: 800; min-width: 18px; text-align: center; font-size: 14px; }
.mini-item__total { font-weight: 900; font-size: 14px; white-space: nowrap; }

.cart-drawer__foot { padding: 20px 28px 28px; border-top: 1px solid rgba(74, 55, 40, .1); }
.cart-drawer__total {
	display: flex;
	justify-content: space-between;
	font-weight: 800;
	font-size: 16px;
	margin-bottom: 14px;
}
.cart-drawer__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cart-drawer__actions .btn { width: 100%; padding-inline: 12px; font-size: 14px; }

/* --------------------------------------------------------------------------
   Cart & checkout pages
   -------------------------------------------------------------------------- */

.woocommerce-cart-form,
.woocommerce .cart-collaterals,
.woocommerce-checkout .woocommerce { font-weight: 600; }

.shop_table {
	width: 100%;
	border-collapse: collapse;
	background: var(--white);
	border-radius: var(--r-card);
	overflow: hidden;
}
.shop_table th, .shop_table td {
	padding: 14px 16px;
	text-align: left;
	border-bottom: 1px solid var(--line);
	font-size: 14px;
}
.shop_table th { font-weight: 800; font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.shop_table .product-thumbnail img { width: 64px; height: 64px; object-fit: cover; border-radius: 12px; }
.shop_table .product-thumbnail { width: 88px; }
.shop_table td.product-name a { font-weight: 800; }

.cart_totals, .woocommerce-checkout-review-order {
	background: var(--white);
	border-radius: var(--r-card);
	padding: 24px;
}
.cart_totals h2, .woocommerce-checkout h3, .woocommerce-billing-fields h3 {
	font-size: 20px;
	font-weight: 900;
	margin: 0 0 16px;
}

.woocommerce form .form-row { display: flex; flex-direction: column; gap: 6px; margin: 0 0 14px; padding: 0; }
.woocommerce form .form-row label { font-size: 13px; font-weight: 800; }
.woocommerce form .form-row .required { color: var(--pink); border: 0; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container .select2-selection--single {
	height: 50px;
	border-radius: 14px;
	border: 2px solid var(--line);
	background: var(--white);
	padding: 0 16px;
	font-size: 15px;
	font-weight: 700;
	color: var(--brown);
	outline: none;
	width: 100%;
}
.woocommerce form .form-row textarea { height: 110px; padding: 14px 16px; resize: vertical; }
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus { border-color: var(--brown); }

.checkout-layout { display: grid; grid-template-columns: 1.15fr .85fr; gap: 32px; align-items: start; }
@media (max-width: 900px) { .checkout-layout { grid-template-columns: 1fr; } }
.checkout-panel { background: var(--white); border-radius: var(--r-lg); padding: clamp(20px, 3vw, 32px); }

.woocommerce-info, .woocommerce-message, .woocommerce-error {
	background: var(--white);
	border: 0;
	border-left: 4px solid var(--sage);
	border-radius: 14px;
	padding: 16px 20px;
	margin: 0 0 20px;
	font-weight: 700;
	font-size: 14px;
	list-style: none;
}
.woocommerce-error { border-left-color: var(--coral); }
.woocommerce-message { border-left-color: var(--sage); }
.woocommerce-info::before, .woocommerce-message::before, .woocommerce-error::before { content: none; }

.woocommerce-notices-wrapper:empty { display: none; }

/* Payment methods */
.woocommerce-checkout #payment { background: transparent; border-radius: 0; }
.woocommerce-checkout #payment ul.payment_methods { border: 0; padding: 0; list-style: none; margin: 0 0 16px; }
.woocommerce-checkout #payment ul.payment_methods li {
	background: var(--cream);
	border-radius: 14px;
	padding: 14px 16px;
	margin-bottom: 10px;
	font-weight: 800;
	font-size: 14px;
}
.woocommerce-checkout #payment div.payment_box {
	background: transparent;
	font-weight: 600;
	font-size: 14px;
	padding: 10px 0 0;
}
.woocommerce-checkout #payment div.payment_box::before { content: none; }
.woocommerce-checkout #payment .place-order { padding: 0; }
#place_order { width: 100%; height: 56px; font-size: 16px; }

/* Order received */
.woocommerce-order { background: var(--white); border-radius: var(--r-lg); padding: clamp(22px, 3vw, 36px); }
.woocommerce-order-overview {
	list-style: none;
	padding: 0;
	margin: 0 0 24px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
	gap: 14px;
}
.woocommerce-order-overview li {
	background: var(--cream);
	border-radius: 14px;
	padding: 14px 16px;
	font-size: 13px;
	font-weight: 700;
	color: var(--ink-55);
}
.woocommerce-order-overview li strong { display: block; font-size: 16px; color: var(--brown); margin-top: 4px; }

/* My account */
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.woocommerce-MyAccount-navigation a {
	display: block;
	padding: 12px 16px;
	border-radius: 14px;
	background: var(--white);
	font-weight: 800;
	font-size: 14px;
}
.woocommerce-MyAccount-navigation .is-active a { background: var(--brown); color: var(--cream); }

/* Misc WooCommerce resets */
.woocommerce .woocommerce-breadcrumb { display: none; }
.woocommerce span.onsale { display: none; }
.woocommerce .quantity .qty { text-align: center; }

/* WooCommerce appends a "view cart" link after an AJAX add; the drawer already covers it. */
.product-card a.added_to_cart { display: none; }

/* ==========================================================================
   Inner pages: about, contact, information
   ========================================================================== */

@keyframes bbBlob {
	0%, 100% { border-radius: 58% 42% 45% 55% / 50% 60% 40% 50%; }
	50%      { border-radius: 45% 55% 60% 40% / 55% 45% 55% 45%; }
}

.page-hero {
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 64px var(--gx) 40px;
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 40px;
	align-items: center;
}
.page-hero__title {
	font-size: clamp(40px, 5.4vw, 72px);
	line-height: .98;
	font-weight: 900;
	letter-spacing: -.03em;
	/* At 72px the tight line-height pulls the caps right up under the eyebrow. */
	margin: 22px 0 26px;
	text-wrap: balance;
	overflow-wrap: anywhere;
}
.page-hero .eyebrow { display: block; line-height: 1.4; }
.page-hero__title em { font-style: normal; color: var(--pink); }
.page-hero__lead {
	font-size: 18px;
	line-height: 1.55;
	max-width: 520px;
	margin: 0;
	font-weight: 600;
	color: rgba(74, 55, 40, .78);
	text-wrap: pretty;
}
.page-hero__art { position: relative; height: 520px; }
.page-hero__blob {
	position: absolute;
	inset: 0;
	background: var(--tan);
	overflow: hidden;
	border-radius: 58% 42% 45% 55% / 50% 60% 40% 50%;
	animation: bbBlob 12s ease-in-out infinite;
}
.page-hero__blob img { width: 100%; height: 100%; object-fit: cover; }
.page-hero__dot {
	position: absolute;
	left: -10px; bottom: 20px;
	width: 64px; height: 64px;
	border-radius: 50%;
	background: var(--blue);
}
.page-hero__sq {
	position: absolute;
	right: -6px; top: 20px;
	width: 44px; height: 44px;
	border-radius: 12px;
	background: var(--coral);
	transform: rotate(14deg);
}
@media (max-width: 900px) {
	.page-hero { grid-template-columns: 1fr; }
	.page-hero__art { height: 340px; }
}
@media (prefers-reduced-motion: reduce) { .page-hero__blob { animation: none; } }

/* Stat cards */
.stat-grid {
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 40px var(--gx) 72px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
	gap: 20px;
}
.stat-card { border-radius: 26px; padding: 32px 28px; }
.stat-card__num {
	font-size: clamp(38px, 5vw, 60px);
	font-weight: 900;
	letter-spacing: -.03em;
	line-height: 1;
}
/* Cards headed by a word rather than a figure need a calmer size. */
.stat-card__num--word { font-size: clamp(24px, 2.6vw, 30px); letter-spacing: -.02em; }
.stat-card__label { font-size: 15px; font-weight: 700; margin-top: 8px; line-height: 1.45; }
.stat-card a { text-decoration: underline; }
.stat-card--brown { background: var(--brown); color: var(--cream); }
.stat-card--brown .stat-card__label { color: rgba(247, 241, 234, .8); }
.stat-card--brown a { color: var(--cream); }
.stat-card--sage { background: var(--sage); }
.stat-card--coral { background: var(--coral); }
.stat-card--blue { background: var(--blue); }
.stat-card--sage .stat-card__label,
.stat-card--coral .stat-card__label,
.stat-card--blue .stat-card__label { color: rgba(74, 55, 40, .8); }

/* Numbered steps */
.band { background: var(--white); padding: 80px 0; }
.band__inner { max-width: var(--wrap); margin: 0 auto; padding-inline: var(--gx); }
.band__title {
	font-size: clamp(30px, 4.5vw, 44px);
	font-weight: 900;
	margin: 0 0 40px;
	max-width: 640px;
	text-wrap: balance;
	overflow-wrap: anywhere;
}
/* The bird photo sits beside the three reasons; without it the reasons keep the
   original three-across row. */
.band__grid {
	display: grid;
	/* The photo is portrait and the reasons are short, so a narrower photo column and a
	   text column that spreads to the same height leave no gap under either one. */
	grid-template-columns: minmax(0, .62fr) minmax(0, 1.38fr);
	gap: 48px;
	align-items: stretch;
}
.band__grid--bare { grid-template-columns: 1fr; }
.band__figure { margin: 0; }
.band__figure img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--r-lg);
}
.band__figure figcaption {
	margin-top: 14px;
	font-weight: 900;
	font-size: 18px;
}
.band__figure figcaption span {
	display: block;
	margin-top: 2px;
	font-weight: 600;
	font-size: 14px;
	line-height: 1.45;
	color: var(--ink-70);
}
@media (max-width: 860px) {
	.band__grid { grid-template-columns: 1fr; gap: 32px; }
}

.steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 36px; }
.steps--stack {
	grid-template-columns: 1fr;
	gap: 28px;
	height: 100%;
	align-content: space-between;
}
@media (max-width: 860px) {
	.steps--stack { height: auto; align-content: start; }
}
.step { display: flex; gap: 18px; }
.step__num {
	width: 48px; height: 48px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-weight: 900;
	font-size: 18px;
	flex-shrink: 0;
}
.step:nth-child(1) .step__num { background: var(--tan); }
.step:nth-child(2) .step__num { background: var(--sage); }
.step:nth-child(3) .step__num { background: var(--coral); }
.step:nth-child(4) .step__num { background: var(--blue); }
.step:nth-child(5) .step__num { background: var(--tan); }
.step h3 { margin: 8px 0; font-size: 19px; font-weight: 800; }
.step p { margin: 0; font-size: 15px; line-height: 1.55; font-weight: 600; color: var(--ink-70); }

/* Split section with photo pair */
.split {
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 80px var(--gx);
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 40px;
	align-items: center;
}
.split__pics { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.split__pic { aspect-ratio: 3/4; border-radius: 22px; overflow: hidden; background: var(--sage); }
.split__pic:first-child { margin-top: 32px; }
.split__pic:last-child { background: var(--coral); }
.split__pic img { width: 100%; height: 100%; object-fit: cover; }
.split h2 { font-size: clamp(30px, 4.5vw, 44px); font-weight: 900; margin: 0 0 18px; text-wrap: balance; }
.split p { font-size: 17px; line-height: 1.55; margin: 0 0 16px; font-weight: 600; color: rgba(74, 55, 40, .78); }
@media (max-width: 900px) { .split { grid-template-columns: 1fr; } }

/* Contact page */
.contact-layout {
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 64px var(--gx) 80px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(32px, 5vw, 72px);
	align-items: start;
}
@media (max-width: 900px) { .contact-layout { grid-template-columns: 1fr; } }

.contact-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
	gap: 14px;
	max-width: 520px;
}
.contact-card {
	background: var(--white);
	border-radius: 20px;
	padding: 20px;
	display: block;
	transition: transform .2s;
}
.contact-card:hover { transform: translateY(-3px); color: var(--brown); }
/* Spans in a block card flow inline, so the label and value shared a line and the
   phone number broke mid-way — and the coloured dot never had any size at all. */
.contact-card__icon { display: block; width: 36px; height: 36px; border-radius: 50%; margin-bottom: 14px; }
.contact-card:nth-child(1) .contact-card__icon { background: var(--blue); }
.contact-card:nth-child(2) .contact-card__icon { background: var(--sage); }
.contact-card:nth-child(3) .contact-card__icon { background: var(--coral); }
.contact-card:nth-child(4) .contact-card__icon { background: var(--tan); }
.contact-card__label {
	display: block;
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .14em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--ink-55);
}
.contact-card__value { display: block; font-weight: 800; font-size: 16px; margin-top: 4px; overflow-wrap: anywhere; }

.details-card {
	margin-top: 40px;
	max-width: 520px;
	background: var(--brown);
	color: var(--cream);
	border-radius: 22px;
	padding: 24px 26px;
}
.details-card__label {
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .16em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--tan);
	margin-bottom: 10px;
}
.details-card__body { font-size: 14px; line-height: 1.7; font-weight: 700; color: rgba(247, 241, 234, .85); }
.details-card__body p { margin: 0; }
.details-card__body a { color: var(--cream); text-decoration: underline; }

.contact-form-card {
	background: var(--white);
	border-radius: var(--r-lg);
	padding: clamp(22px, 3vw, 36px);
	position: sticky;
	top: 130px;
}
@media (max-width: 900px) { .contact-form-card { position: static; } }

/* Contact Form 7 */
.wpcf7 form { display: flex; flex-direction: column; gap: 16px; }
.wpcf7 .cf7-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 14px; }
.wpcf7 .cf7-field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 800; }
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
	width: 100%;
	height: 50px;
	border-radius: 14px;
	border: 2px solid rgba(74, 55, 40, .12);
	background: var(--cream);
	padding: 0 16px;
	font-size: 15px;
	font-weight: 700;
	color: var(--brown);
	outline: none;
	font-family: var(--sans);
}
.wpcf7 textarea { height: auto; padding: 14px 16px; resize: vertical; line-height: 1.5; }
.wpcf7 input:focus, .wpcf7 textarea:focus { border-color: var(--brown); }
.wpcf7 .cf7-topics .wpcf7-radio { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.wpcf7 .cf7-topics .wpcf7-list-item { margin: 0; }
.wpcf7 .cf7-topics .wpcf7-list-item label {
	display: inline-flex;
	align-items: center;
	height: 40px;
	padding: 0 16px;
	border-radius: 999px;
	border: 2px solid rgba(74, 55, 40, .12);
	background: var(--cream);
	font-weight: 800;
	font-size: 13px;
	cursor: pointer;
	transition: all .15s;
}
.wpcf7 .cf7-topics input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
.wpcf7 .cf7-topics input[type="radio"]:checked + span {
	background: var(--brown);
	color: var(--cream);
	border-color: var(--brown);
	border-radius: 999px;
	padding: 0 16px;
	height: 40px;
	display: inline-flex;
	align-items: center;
}
.wpcf7 .cf7-topics .wpcf7-list-item-label { display: inline-flex; align-items: center; }
.wpcf7 .wpcf7-acceptance { font-size: 12px; font-weight: 700; color: var(--ink-55); }
.wpcf7 .wpcf7-acceptance .wpcf7-list-item { margin: 0; }
.wpcf7 .wpcf7-acceptance label { display: flex; gap: 8px; align-items: flex-start; cursor: pointer; }
.wpcf7 .wpcf7-acceptance input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--brown); flex-shrink: 0; margin-top: 1px; }
.wpcf7 .wpcf7-acceptance a { text-decoration: underline; }
.wpcf7 input[type="submit"] {
	height: 54px;
	border-radius: 999px;
	border: 0;
	background: var(--brown);
	color: var(--cream);
	font-weight: 800;
	font-size: 16px;
	cursor: pointer;
	transition: background .15s;
	font-family: var(--sans);
}
.wpcf7 input[type="submit"]:hover { background: var(--pink); }
.wpcf7-not-valid-tip { color: var(--pink); font-size: 12px; font-weight: 700; }
.wpcf7 form .wpcf7-response-output {
	margin: 0;
	border: 0;
	border-radius: 18px;
	padding: 16px 20px;
	font-weight: 800;
	font-size: 15px;
	line-height: 1.4;
	background: var(--tan);
	color: var(--brown);
}
.wpcf7 form.sent .wpcf7-response-output { background: var(--sage); }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output { background: var(--coral); }
.wpcf7-spinner { margin: 0 auto; }

/* Information pages */
.info-layout {
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 24px var(--gx) 80px;
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr);
	gap: 40px;
	align-items: start;
}
.info-nav {
	display: flex;
	flex-direction: column;
	gap: 6px;
	position: sticky;
	top: 130px;
}
.info-nav a {
	padding: 10px 16px;
	border-radius: 999px;
	font-weight: 800;
	font-size: 14px;
	background: transparent;
	color: var(--brown);
	white-space: nowrap;
	transition: all .15s;
}
.info-nav a:hover { background: var(--tan); color: var(--brown); }
.info-nav a.is-active { background: var(--brown); color: var(--cream); }

.info-card {
	background: var(--white);
	border-radius: 26px;
	padding: clamp(24px, 3vw, 40px);
	min-width: 0;
}
.info-card h2:first-child { margin-top: 0; }

.rate-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
	gap: 12px;
	margin-bottom: 22px;
}
.rate { background: var(--cream); border-radius: 18px; padding: 18px; }
.rate--free { background: var(--sage); }
.rate__price { font-weight: 900; font-size: 22px; }
.rate__what { font-size: 14px; font-weight: 700; color: var(--ink-70); margin-top: 4px; line-height: 1.4; }
.rate--free .rate__what { color: rgba(74, 55, 40, .8); }

@media (max-width: 900px) {
	.info-layout { grid-template-columns: 1fr; gap: 20px; }
	.info-nav { position: static; flex-direction: row; overflow-x: auto; padding-bottom: 4px; }
	.info-nav a { background: var(--white); }
}


/* --------------------------------------------------------------------------
   Narrow-screen corrections
   -------------------------------------------------------------------------- */

/* Grid children default to min-width:auto and refuse to shrink; let them. */
.contact-layout > *,
.shop-layout > *,
.split > *,
.promo-grid > *,
.page-hero > * { min-width: 0; }

@media (max-width: 900px) {
	/* Products before the long filter list — nobody wants to scroll past 30 links. */
	.shop-layout .shop-main { order: 1; }
	.shop-layout .shop-sidebar { order: 2; }

	.shop-sidebar { padding: 20px; }
	.shop-sidebar ul { margin-bottom: 18px; }
}

@media (max-width: 480px) {
	.contact-cards { grid-template-columns: 1fr 1fr; gap: 10px; }
	.contact-card { padding: 16px; }
	.contact-card__value { font-size: 14px; }
	.details-card { padding: 20px; }
	.hero__cta .btn { flex: 1 1 100%; }
	.stat-card { padding: 24px 22px; }
}

@keyframes bbBob {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-6px); }
}

/* The product row fades while a new age selection loads. */
.bb-age-results { transition: opacity .18s; }

/* Category tiles carry the design's tints; product shots on white or transparent
   backgrounds then read as part of the palette rather than as white blocks. */
.cat-grid .cat-tile:nth-child(1) { background: var(--tan); }
.cat-grid .cat-tile:nth-child(2) { background: var(--sage); }
.cat-grid .cat-tile:nth-child(3) { background: var(--blue); }
.cat-grid .cat-tile:nth-child(4) { background: var(--coral); }
.cat-grid .cat-tile:nth-child(5) { background: var(--cream); }
.cat-grid .cat-tile img { mix-blend-mode: multiply; }
.cat-grid .cat-tile:nth-child(5) .cat-tile__label { background: var(--white); }

/* ==========================================================================
   Shop archive — laid out from Kategorija.dc.html
   ========================================================================== */

.shop-head { max-width: var(--wrap); margin: 0 auto; padding: 40px var(--gx) 0; }
.shop-head__row {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	margin-top: 14px;
}
.shop-head__title {
	font-size: clamp(36px, 5.5vw, 64px);
	font-weight: 900;
	letter-spacing: -.03em;
	margin: 0;
	line-height: 1;
	text-wrap: balance;
	overflow-wrap: anywhere;
}
.shop-head__blurb {
	margin: 0;
	max-width: 380px;
	font-weight: 600;
	color: var(--ink-70);
	font-size: 16px;
	line-height: 1.5;
}
/* Intro sitting under its title rather than opposite it. */
.shop-head__row--stack { display: block; }
.shop-head__row--stack .shop-head__blurb { max-width: 68ch; margin-top: 14px; }

/* Category chips */
.cat-chips {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	overflow-x: auto;
	padding-bottom: 4px;
	margin-top: 28px;
	scrollbar-width: none;
}
.cat-chips::-webkit-scrollbar { display: none; }
.cat-chip {
	height: 44px;
	padding: 0 18px;
	border-radius: 999px;
	border: 2px solid rgba(74, 55, 40, .12);
	background: var(--white);
	color: var(--brown);
	font-weight: 800;
	font-size: 14px;
	display: inline-flex;
	align-items: center;
	transition: all .18s;
	white-space: nowrap;
	flex-shrink: 0;
}
.cat-chip:hover { transform: translateY(-2px); color: var(--brown); }
.cat-chip.is-active { background: var(--brown); color: var(--cream); border-color: var(--brown); }

/* Layout */
.shop-layout {
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 32px var(--gx) 80px;
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: 32px;
	align-items: start;
}
.shop-layout > * { min-width: 0; }

/* The toggle only exists on small screens; on desktop the rail is simply always open. */
.filters-toggle { display: none; }
.filters-wrap { min-width: 0; }

/* Filters — plain column, no card, per the design */
/* The rail is a card of its own, so the controls inside it read as one panel instead of
   floating loose next to the grid — and its pills stop looking like the category chips
   above, which are a different thing entirely. */
.filters {
	display: flex;
	flex-direction: column;
	position: sticky;
	top: 130px;
	background: var(--white);
	border-radius: var(--r-lg);
	padding: 22px;
}
.filters__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 16px;
	border-bottom: 1px solid rgba(74, 55, 40, .1);
}
.filters__title { font-weight: 900; font-size: 16px; }
.filters__reset {
	border: 0;
	background: transparent;
	font-weight: 700;
	font-size: 13px;
	color: var(--ink-55);
	text-decoration: none;
	padding: 0;
	transition: color .15s;
}
.filters__reset:hover { color: var(--pink); text-decoration: underline; }

/* Each group is a section of the panel, divided by a hairline. */
.filters__group { padding: 18px 0; border-bottom: 1px solid rgba(74, 55, 40, .1); }
.filters__group:last-of-type { padding-bottom: 0; border-bottom: 0; }

.filters__label {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .16em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--ink-55);
	margin-bottom: 12px;
}
.filters__label strong {
	font-family: var(--sans);
	font-size: 14px;
	letter-spacing: 0;
	color: var(--brown);
	font-weight: 800;
}

.filter-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.filter-pill {
	height: 36px;
	padding: 0 14px;
	border-radius: 999px;
	border: 2px solid rgba(74, 55, 40, .12);
	background: var(--white);
	color: var(--brown);
	font-weight: 800;
	font-size: 13px;
	display: inline-flex;
	align-items: center;
	transition: all .15s;
}
.filter-pill:hover { color: var(--brown); border-color: rgba(74, 55, 40, .3); }
.filter-pill.is-active { background: var(--brown); color: var(--cream); border-color: var(--brown); }
/* In the rail the pills stack one per row. Flowing them wrapped left eight labels of
   different lengths breaking at ragged points, which read as scattered text rather than
   as a list of choices. */
.filters .filter-pills { display: grid; grid-template-columns: 1fr; gap: 6px; }
.filters .filter-pill {
	justify-content: flex-start;
	height: 38px;
	padding: 0 14px;
	background: var(--cream);
	border-color: transparent;
	font-size: 14px;
}
.filters .filter-pill:hover { background: var(--tan); }
.filters .filter-pill.is-active { background: var(--brown); border-color: var(--brown); }

.filter-brands { display: flex; flex-direction: column; gap: 6px; }
.filter-brand {
	display: flex;
	align-items: center;
	gap: 10px;
	border: 0;
	background: transparent;
	padding: 6px 0;
	font-weight: 700;
	font-size: 14px;
	color: var(--brown);
	text-align: left;
	width: 100%;
	cursor: pointer;
}
.filter-brand__box {
	width: 20px; height: 20px;
	border-radius: 6px;
	border: 2px solid var(--brown);
	background: transparent;
	display: grid;
	place-items: center;
	flex-shrink: 0;
	transition: background .15s;
}
.filter-brand__tick {
	width: 8px; height: 8px;
	border-radius: 2px;
	background: var(--cream);
	opacity: 0;
	transition: opacity .15s;
}
.filter-brand input { position: absolute; opacity: 0; pointer-events: none; }
.filter-brand.is-active .filter-brand__box { background: var(--brown); }
.filter-brand.is-active .filter-brand__tick { opacity: 1; }
.filter-brand__count { margin-left: auto; font-size: 12px; color: rgba(74, 55, 40, .5); font-weight: 600; }
/* A brand with nothing in this category would only lead to an empty grid. */
.filter-brand.is-empty { opacity: .38; cursor: not-allowed; }
.filter-brand.is-empty input { cursor: not-allowed; }


.filter-range { width: 100%; accent-color: var(--brown); }

/* Toolbar */
.shop-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 18px;
}
.shop-bar__count { font-weight: 800; font-size: 15px; color: var(--ink-70); }
.sort-group {
	display: flex;
	gap: 6px;
	background: var(--white);
	padding: 4px;
	border-radius: 999px;
}
.sort-group a {
	height: 34px;
	padding: 0 14px;
	border-radius: 999px;
	border: 0;
	background: transparent;
	color: var(--brown);
	font-weight: 800;
	font-size: 13px;
	display: inline-flex;
	align-items: center;
	transition: all .15s;
	white-space: nowrap;
}
.sort-group a.is-active { background: var(--brown); color: var(--cream); }

/* Grid */
.products,
ul.products {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
}
@media (max-width: 1100px) { .products, ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 820px)  { .products, ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.shop-empty {
	background: var(--white);
	border-radius: 22px;
	padding: 60px 24px;
	text-align: center;
	font-weight: 700;
	color: var(--ink-70);
	line-height: 1.5;
}
.shop-empty button,
.shop-empty a {
	border: 0;
	background: transparent;
	color: var(--pink);
	font-weight: 800;
	text-decoration: underline;
	font-size: inherit;
	padding: 0;
}

.woocommerce-pagination { margin-top: 40px; }
.woocommerce-pagination ul {
	list-style: none;
	display: flex;
	gap: 8px;
	padding: 0;
	margin: 0;
	justify-content: center;
	flex-wrap: wrap;
	border: 0;
}
.woocommerce-pagination li { border: 0; list-style: none; }
.woocommerce-pagination a,
.woocommerce-pagination span {
	display: grid;
	place-items: center;
	min-width: 44px;
	height: 44px;
	padding: 0 12px;
	border-radius: 999px;
	background: var(--white);
	font-weight: 800;
	font-size: 15px;
}
.woocommerce-pagination .current { background: var(--brown); color: var(--cream); }
.woocommerce-pagination a:hover { background: var(--tan); color: var(--brown); }

@media (max-width: 960px) {
	.shop-layout { grid-template-columns: 1fr; gap: 16px; }
	.filter-brands { flex-direction: row; flex-wrap: wrap; gap: 4px 18px; }
	.filter-brand { width: auto; }
	.filter-brand__count { margin-left: 4px; }

	/* The rail becomes a panel behind one button, above the products. Buried under
	   thirty products nobody ever found it. */
	.filters-wrap { order: 1; }
	.shop-main { order: 2; }

	.filters-toggle {
		display: flex;
		align-items: center;
		gap: 10px;
		width: 100%;
		height: 48px;
		padding: 0 18px;
		border: 2px solid rgba(74, 55, 40, .12);
		border-radius: 999px;
		background: var(--white);
		color: var(--brown);
		font: inherit;
		font-weight: 800;
		font-size: 15px;
		cursor: pointer;
	}
	.filters-toggle__count {
		display: grid;
		place-items: center;
		min-width: 22px;
		height: 22px;
		padding: 0 6px;
		border-radius: 999px;
		background: var(--brown);
		color: var(--cream);
		font-size: 12px;
		font-weight: 900;
	}
	.filters-toggle__chev { margin-left: auto; transition: transform .2s; font-size: 18px; line-height: 1; }
	.filters-toggle[aria-expanded="true"] { border-color: var(--brown); }
	.filters-toggle[aria-expanded="true"] .filters-toggle__chev { transform: rotate(180deg); }

	.filters {
		position: static;
		margin-top: 16px;
	}
	.filters[hidden] { display: none; }
}
@media (max-width: 760px) {
	/* All of them at once: a sideways scroll on a category row goes unnoticed. */
	.cat-chips { flex-wrap: wrap; overflow-x: visible; }
	.cat-chip { height: 40px; padding: 0 14px; font-size: 13px; }
	.products, ul.products { gap: 12px; }
}

/* ==========================================================================
   Single product — laid out from Produktas.dc.html
   ========================================================================== */

.product-wrap { max-width: var(--wrap); margin: 0 auto; padding: 32px var(--gx) 72px; }

.product-main {
	display: grid;
	/* The photo carries the page, so give it the larger share. */
	grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
	gap: clamp(24px, 4vw, 56px);
	margin-top: 22px;
	align-items: start;
}

/* Gallery: thumbnail rail beside the main image */
/* minmax(0, 1fr): without it the thumbnail strip's content sets the column's minimum
   width and pushes the gallery wider than the viewport on a phone. */
.pgallery { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; align-items: start; }
/* One photo, no rail — the image takes the whole column. */
.pgallery--single { grid-template-columns: minmax(0, 1fr); }

/*
 * The rail takes its height from the main image rather than the other way round: a
 * product with eight photos was stretching the row and leaving the main shot looking
 * small. The inner list is absolutely positioned so it contributes no intrinsic height
 * and simply scrolls when there are more thumbnails than fit.
 */
.pgallery__rail { position: relative; align-self: stretch; min-height: 100%; }
.pgallery__thumbs {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: none;
	padding-right: 2px;
}
.pgallery__thumbs::-webkit-scrollbar { display: none; }
.pgallery__thumb {
	width: 72px; height: 72px;
	border-radius: 14px;
	overflow: hidden;
	border: 3px solid transparent;
	padding: 0;
	background: var(--tan);
	flex-shrink: 0;
	transition: border-color .15s;
	cursor: pointer;
}
.pgallery__thumb.is-active { border-color: var(--brown); }
.pgallery__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

.pgallery__main {
	position: relative;
	aspect-ratio: 1/1;
	border-radius: 28px;
	overflow: hidden;
	background: var(--tan);
}
.pgallery__main img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pgallery__flag {
	position: absolute;
	top: 16px; left: 16px;
	background: var(--sage);
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .12em;
	text-transform: uppercase;
	font-weight: 600;
	padding: 7px 12px;
	border-radius: 999px;
	z-index: 2;
}
.pgallery__flag--out { background: var(--coral); }

/* Summary */
.psummary { position: sticky; top: 130px; }
.psummary__brand {
	font-family: var(--mono);
	font-size: 11px;
	letter-spacing: .16em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--pink);
}
.psummary__title {
	font-size: clamp(30px, 3.6vw, 46px);
	font-weight: 900;
	letter-spacing: -.03em;
	margin: 10px 0 14px;
	line-height: 1.05;
	text-wrap: balance;
	overflow-wrap: anywhere;
}
.psummary__meta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.psummary__price { font-weight: 900; font-size: clamp(24px, 5vw, 30px); }
.psummary__price del { opacity: .45; font-size: .7em; font-weight: 700; margin-right: 8px; }
.psummary__price ins { text-decoration: none; color: var(--pink); }
.psummary__vat { font-size: 13px; font-weight: 700; color: var(--ink-55); }
.psummary__age {
	font-size: 12px;
	font-weight: 800;
	background: var(--sage);
	padding: 5px 12px;
	border-radius: 999px;
}
.psummary__stock {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 700;
	color: var(--ink-70);
}
.psummary__stock i { width: 8px; height: 8px; border-radius: 50%; background: var(--sage); display: block; }
.psummary__stock.is-out i { background: var(--coral); }
.psummary__lead {
	margin: 22px 0 0;
	font-size: 16px;
	line-height: 1.55;
	font-weight: 600;
	color: rgba(74, 55, 40, .78);
	text-wrap: pretty;
}

/* Add to cart row */
.psummary form.cart { display: flex; gap: 10px; margin: 26px 0 0; flex-wrap: wrap; align-items: center; }
.psummary form.cart .quantity,
.qty-box {
	display: flex;
	align-items: center;
	background: var(--white);
	border-radius: 999px;
	height: 54px;
	padding: 0 6px;
}
.qty-box button {
	width: 42px; height: 42px;
	border-radius: 50%;
	border: 0;
	background: transparent;
	font-size: 20px;
	font-weight: 800;
	color: var(--brown);
	display: grid;
	place-items: center;
	line-height: 1;
}
.qty-box button:hover { background: var(--tan); }
.qty-box input {
	min-width: 32px;
	width: 40px;
	height: 42px;
	border: 0;
	background: transparent;
	text-align: center;
	font-weight: 900;
	font-size: 16px;
	color: var(--brown);
	outline: none;
	-moz-appearance: textfield;
}
.qty-box input::-webkit-outer-spin-button,
.qty-box input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.psummary .single_add_to_cart_button {
	flex: 1;
	min-width: 200px;
	height: 54px;
	font-size: 16px;
}

.psummary__usps {
	display: flex;
	gap: 18px;
	margin-top: 16px;
	font-size: 13px;
	font-weight: 700;
	color: rgba(74, 55, 40, .65);
	flex-wrap: wrap;
	list-style: none;
	padding: 0;
}

/* Accordions */
.pacc { margin-top: 32px; border-top: 1px solid rgba(74, 55, 40, .1); }
.pacc__item { border-bottom: 1px solid rgba(74, 55, 40, .1); }
.pacc__btn {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 18px 0;
	border: 0;
	background: transparent;
	font-weight: 800;
	font-size: 16px;
	color: var(--brown);
	text-align: left;
}
.pacc__sign {
	width: 28px; height: 28px;
	border-radius: 50%;
	background: var(--tan);
	display: grid;
	place-items: center;
	font-size: 18px;
	flex-shrink: 0;
	transition: transform .25s;
	line-height: 1;
}
.pacc__btn[aria-expanded="true"] .pacc__sign { transform: rotate(45deg); }
.pacc__panel { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.pacc__panel > div { padding-bottom: 18px; }
.pacc__panel .prose { font-size: 15px; line-height: 1.6; color: rgba(74, 55, 40, .75); }
.pacc__panel .prose > :first-child { margin-top: 0; }

.product-video { margin-top: 18px; }
.product-video iframe { width: 100%; aspect-ratio: 16/9; border: 0; border-radius: 18px; display: block; }

/* Related */
.related-band { background: var(--white); padding: 64px 0; margin-top: 8px; }
.related-band__inner { max-width: var(--wrap); margin: 0 auto; padding-inline: var(--gx); }
.related-band__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	margin-bottom: 24px;
}
.related-band__head h2 { font-size: clamp(28px, 4vw, 38px); font-weight: 900; margin: 0; line-height: 1.05; }
.related-band .products { gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .related-band .products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 820px)  { .related-band .products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.related-band .product-card { background: var(--cream); }
.related-band .product-card__body { background: var(--cream); }

@media (max-width: 900px) {
	.product-main { grid-template-columns: 1fr; }
	.psummary { position: static; }
	.pgallery { grid-template-columns: minmax(0, 1fr); }
	.pgallery__rail { position: static; min-height: 0; order: 2; min-width: 0; }
	.pgallery__thumbs {
		position: static;
		flex-direction: row;
		overflow-x: auto;
		overflow-y: hidden;
		min-width: 0;
	}
}

/* Round add button in the card meta row (catalogue variant). */
.product-card__plus {
	width: 38px; height: 38px;
	border-radius: 50%;
	border: 0;
	background: var(--brown);
	color: var(--cream);
	font-size: 20px;
	font-weight: 800;
	display: grid;
	place-items: center;
	transition: all .2s;
	line-height: 1;
	flex-shrink: 0;
	margin-left: auto;
}
.product-card__plus:hover { background: #3a2a1e; color: var(--cream); transform: scale(1.06); }
.product-card__plus.added,
.product-card__plus.is-in-cart { background: var(--sage); color: var(--brown); }
.product-card__plus.added::after { content: none; }
.product-card__plus.loading { opacity: .6; }

/* Takes the place of the + on a sold-out card, so the row still ends in something
   clickable rather than a gap. */
.product-card__notify {
	margin-left: auto;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	height: 38px;
	padding: 0 14px;
	border-radius: 999px;
	border: 2px solid rgba(74, 55, 40, .18);
	background: transparent;
	color: var(--brown);
	font-size: 13px;
	font-weight: 800;
	line-height: 1;
	white-space: nowrap;
	transition: all .2s;
}
.product-card__notify:hover { background: var(--brown); border-color: var(--brown); color: var(--cream); }

/* The slide-up button belongs to the homepage card only. */
.product-card--grid .product-card__add { display: none; }
.product-card--home .product-card__plus { display: none; }
@media (max-width: 640px) {
	.product-card--home .product-card__plus { display: grid; }
	.product-card--home .product-card__add { display: none; }
}

.shop-main { transition: opacity .18s; }

/* Only one unit available: no stepper, so the add button takes the row. */
.psummary form.cart .quantity--fixed { display: none; }
.psummary form.cart .quantity--fixed + .single_add_to_cart_button,
.psummary form.cart .quantity--fixed ~ .single_add_to_cart_button { flex: 1 1 100%; }
.qty-box button:disabled { opacity: .3; cursor: not-allowed; }
.qty-box button:disabled:hover { background: transparent; }

/* ==========================================================================
   Cart — laid out from Krepselis.dc.html
   ========================================================================== */

.cart-page { max-width: var(--wrap); margin: 0 auto; padding: 48px var(--gx) 80px; }
.cart-page__title {
	font-size: clamp(36px, 5vw, 60px);
	font-weight: 900;
	letter-spacing: -.03em;
	margin: 0 0 28px;
	line-height: 1;
}
.cart-page__title span { color: rgba(74, 55, 40, .4); font-size: .6em; font-weight: 800; }

.cart-empty {
	background: var(--white);
	border-radius: 26px;
	padding: 72px 24px;
	text-align: center;
}
.cart-empty__head { font-weight: 900; font-size: 26px; letter-spacing: -.02em; }
.cart-empty p { margin: 10px 0 24px; font-weight: 600; color: var(--ink-70); }

.cart-grid { display: grid; grid-template-columns: 1fr 380px; gap: 28px; align-items: start; }
.cart-grid > * { min-width: 0; }
.cart-lines { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
/* The lines sit inside the cart form, so the gap has to live there — on .cart-lines it
   only separated the form from the "continue shopping" link. */
.woocommerce-cart-form { display: flex; flex-direction: column; gap: 14px; min-width: 0; }

.cart-line {
	display: grid;
	grid-template-columns: 96px 1fr auto auto;
	gap: 16px;
	align-items: center;
	background: var(--white);
	border-radius: 20px;
	padding: 16px;
}
.cart-line__thumb {
	width: 96px; height: 96px;
	border-radius: 14px;
	overflow: hidden;
	background: var(--tan);
	display: block;
	flex-shrink: 0;
}
.cart-line__thumb img { width: 100%; height: 100%; object-fit: cover; }
.cart-line__body { min-width: 0; }
.cart-line__brand {
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .14em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--ink-55);
}
.cart-line__name { display: block; font-weight: 800; font-size: 16px; line-height: 1.3; margin-top: 4px; }
.cart-line__unit { font-size: 13px; font-weight: 700; color: var(--ink-55); margin-top: 4px; }
.cart-line__remove {
	margin-top: 8px;
	border: 0;
	background: transparent;
	padding: 0;
	font-size: 13px;
	font-weight: 700;
	color: var(--pink);
	text-decoration: underline;
	cursor: pointer;
	display: inline-block;
}
.cart-line__qty {
	display: flex;
	align-items: center;
	gap: 4px;
	background: var(--cream);
	border-radius: 999px;
	padding: 4px;
}
.cart-line__qty button {
	width: 36px; height: 36px;
	border-radius: 50%;
	border: 0;
	background: transparent;
	font-weight: 800;
	font-size: 18px;
	color: var(--brown);
	display: grid;
	place-items: center;
	line-height: 1;
}
.cart-line__qty button:hover { background: var(--tan); }
.cart-line__qty span { min-width: 24px; text-align: center; font-weight: 900; }
.cart-line__total { font-weight: 900; font-size: 18px; text-align: right; white-space: nowrap; }

.cart-continue { font-weight: 800; font-size: 14px; margin-top: 6px; display: inline-block; }

.cart-aside {
	background: var(--white);
	border-radius: 26px;
	padding: 26px;
	min-width: 0;
	position: sticky;
	top: 130px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.cart-aside__promo {
	display: flex;
	gap: 6px;
	background: var(--cream);
	padding: 5px;
	border-radius: 999px;
}
.cart-aside__promo input {
	flex: 1;
	min-width: 0;
	border: 0;
	background: transparent;
	padding: 0 14px;
	font-size: 14px;
	font-weight: 700;
	color: var(--brown);
	outline: none;
	height: 40px;
}
.cart-aside__promo button {
	height: 40px;
	padding: 0 16px;
	border-radius: 999px;
	border: 0;
	background: var(--brown);
	color: var(--cream);
	font-weight: 800;
	font-size: 13px;
	flex-shrink: 0;
}
.cart-aside__promo button:hover { background: #3a2a1e; color: var(--cream); }

.cart-aside__rows {
	display: flex;
	flex-direction: column;
	gap: 10px;
	font-size: 14px;
	font-weight: 700;
	color: rgba(74, 55, 40, .75);
	border-top: 1px solid rgba(74, 55, 40, .1);
	padding-top: 16px;
}
.cart-aside__row { display: flex; justify-content: space-between; gap: 12px; }
.cart-aside__row--discount { color: var(--pink); }
.cart-aside__total {
	display: flex;
	justify-content: space-between;
	font-weight: 900;
	font-size: 22px;
	border-top: 1px solid rgba(74, 55, 40, .1);
	padding-top: 16px;
}
.cart-aside__cta {
	display: block;
	text-align: center;
	height: 54px;
	line-height: 54px;
	border-radius: 999px;
	background: var(--brown);
	color: var(--cream);
	font-weight: 800;
	font-size: 16px;
	transition: background .15s;
}
.cart-aside__cta:hover { background: var(--pink); color: var(--cream); }

.pay-badges { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.pay-badges span {
	font-size: 10px;
	font-weight: 800;
	padding: 5px 10px;
	border-radius: 999px;
	background: var(--cream);
	letter-spacing: .06em;
}

@media (max-width: 900px) {
	.cart-grid { grid-template-columns: 1fr; }
	.cart-aside { position: static; }
	.cart-line {
		grid-template-columns: 72px 1fr;
		grid-template-areas: 'thumb body' 'qty total';
		row-gap: 12px;
	}
	.cart-line__thumb { width: 72px; height: 72px; grid-area: thumb; }
	.cart-line__body { grid-area: body; }
	.cart-line__qty { grid-area: qty; justify-self: start; }
	.cart-line__total { grid-area: total; align-self: center; }
}

/* ==========================================================================
   Checkout — laid out from Atsiskaitymas.dc.html
   ========================================================================== */

.checkout-steps {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 700;
	color: rgba(74, 55, 40, .5);
	flex-wrap: wrap;
}
.checkout-steps span.step { display: flex; align-items: center; gap: 6px; }
.checkout-steps i { width: 8px; height: 8px; border-radius: 50%; background: var(--sage); display: block; }
.checkout-steps .is-current { color: var(--brown); }
.checkout-steps .is-current i { background: var(--brown); }
.checkout-steps hr { width: 20px; height: 2px; background: rgba(74, 55, 40, .15); border: 0; margin: 0; }

.checkout-page { max-width: 1180px; margin: 0 auto; padding: 40px var(--gx) 80px; }
.checkout-page__title {
	font-size: clamp(32px, 4.5vw, 52px);
	font-weight: 900;
	letter-spacing: -.03em;
	margin: 0 0 8px;
	line-height: 1;
}

.woocommerce-checkout form.checkout {
	display: grid;
	grid-template-columns: 1fr 400px;
	gap: clamp(24px, 4vw, 56px);
	align-items: start;
}
.woocommerce-checkout form.checkout > * { min-width: 0; }
.woocommerce-checkout #customer_details { display: flex; flex-direction: column; gap: 32px; }
.woocommerce-checkout .col2-set,
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 { width: 100%; float: none; }

.co-section h2,
.woocommerce-checkout h3 {
	font-size: 24px;
	font-weight: 900;
	letter-spacing: -.02em;
	margin: 0 0 16px;
	display: flex;
	align-items: center;
	gap: 12px;
}
.co-step {
	width: 32px; height: 32px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-size: 15px;
	flex-shrink: 0;
	font-weight: 900;
}
.co-step--1 { background: var(--tan); }
.co-step--2 { background: var(--sage); }
.co-step--3 { background: var(--coral); }

/* Fields */
.woocommerce form .form-row {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0 0 12px;
	padding: 0;
}
.woocommerce form .form-row label { font-size: 13px; font-weight: 800; }
.woocommerce form .form-row .required { color: var(--pink); border: 0; text-decoration: none; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection--single {
	height: 50px;
	border-radius: 14px;
	border: 2px solid rgba(74, 55, 40, .12);
	background: var(--white);
	padding: 0 16px;
	font-size: 15px;
	font-weight: 700;
	color: var(--brown);
	outline: none;
	width: 100%;
	font-family: var(--sans);
}
.woocommerce form .form-row textarea { height: 110px; padding: 14px 16px; resize: vertical; line-height: 1.5; }
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus { border-color: var(--brown); }
.woocommerce .select2-container .select2-selection--single .select2-selection__rendered {
	line-height: 46px;
	padding: 0;
	color: var(--brown);
	font-weight: 700;
}
.woocommerce .select2-container .select2-selection--single .select2-selection__arrow { height: 46px; }
.woocommerce form .form-row-first,
.woocommerce form .form-row-last { width: 100%; float: none; }
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
	gap: 0 12px;
}
.woocommerce-billing-fields__field-wrapper > .form-row-wide,
.woocommerce-shipping-fields__field-wrapper > .form-row-wide { grid-column: 1 / -1; }

/* Shipping method list where WooCommerce renders it itself (cart totals). The checkout
   builds its own .ship-card markup, and these ID selectors would outrank the card rules,
   so they stay clear of it. */
#shipping_method:not(.shipping__list) { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 12px; }
#shipping_method li:not(.ship-card) {
	background: var(--white);
	border: 2px solid rgba(74, 55, 40, .12);
	border-radius: 18px;
	padding: 16px;
	margin: 0;
	transition: border-color .15s;
}
#shipping_method li:not(.ship-card):has(input:checked) { border-color: var(--brown); }
#shipping_method li:not(.ship-card) label {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	font-weight: 800;
	font-size: 15px;
	cursor: pointer;
	width: 100%;
}
#shipping_method input[type="radio"] { accent-color: var(--brown); width: 18px; height: 18px; flex-shrink: 0; }
.woocommerce-shipping-totals th { display: none; }
.woocommerce-shipping-totals td { padding: 0 !important; }

/* Payment methods */
.woocommerce-checkout #payment { background: transparent; border-radius: 0; }
.woocommerce-checkout #payment ul.payment_methods {
	border: 0;
	padding: 0;
	list-style: none;
	margin: 0 0 16px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
	gap: 12px;
}
.woocommerce-checkout #payment ul.payment_methods li {
	background: var(--white);
	border: 2px solid rgba(74, 55, 40, .12);
	border-radius: 18px;
	padding: 16px;
	margin: 0;
	font-weight: 800;
	font-size: 15px;
	transition: border-color .15s;
}
.woocommerce-checkout #payment ul.payment_methods li:has(input:checked) { border-color: var(--brown); }
.woocommerce-checkout #payment ul.payment_methods label { cursor: pointer; display: flex; align-items: center; gap: 8px; }
.woocommerce-checkout #payment ul.payment_methods input[type="radio"] { accent-color: var(--brown); width: 18px; height: 18px; }
.woocommerce-checkout #payment div.payment_box {
	background: transparent;
	font-weight: 600;
	font-size: 13px;
	color: var(--ink-70);
	padding: 10px 0 0;
	margin: 0;
	line-height: 1.5;
}
.woocommerce-checkout #payment div.payment_box::before { content: none; }

/* Paysera opens a list of every Lithuanian bank inside its own option. Squeezed into
   half the row it came out one logo per line, so the method that carries a list takes
   the full width and the banks sit in a grid of their own. The label's own insides are
   left to the plugin — overriding them broke the bank names onto one letter per line. */
.woocommerce-checkout #payment ul.payment_methods li:has(.paysera-payments) { grid-column: 1 / -1; }
.paysera-payments .payment-group-title {
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .14em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--ink-55);
	margin: 14px 0 10px;
}
.paysera-payments .payment-group-wrapper {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 190px), 1fr));
	gap: 8px;
	align-items: stretch;
}
.paysera-payments .payment-group-wrapper .payment-group-title { grid-column: 1 / -1; margin-top: 0; }
.paysera-payment-method { min-width: 0; }
.paysera-payment-method-label {
	display: block;
	height: 100%;
	padding: 10px 12px;
	border: 2px solid rgba(74, 55, 40, .12);
	border-radius: 14px;
	background: var(--white);
	cursor: pointer;
	font-size: 13px;
	font-weight: 700;
	transition: border-color .15s;
}
.paysera-payment-method-label:hover { border-color: rgba(74, 55, 40, .3); }
.paysera-payment-method-label:has(input:checked) { border-color: var(--brown); }
.paysera-payment-method-label .paysera-image img { max-height: 24px; max-width: 100%; width: auto; }

.woocommerce-checkout #payment .place-order { padding: 0; margin-top: 16px; }
#place_order { width: 100%; height: 56px; font-size: 16px; }

/* Order review panel */
.woocommerce-checkout-review-order {
	background: var(--white);
	border-radius: 26px;
	padding: 26px;
	position: sticky;
	top: 130px;
}
.woocommerce-checkout #order_review_heading { display: none; }
.woocommerce-checkout-review-order-table { width: 100%; border-collapse: collapse; background: transparent; }
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
	padding: 10px 0;
	text-align: left;
	border: 0;
	font-size: 14px;
	font-weight: 700;
	color: rgba(74, 55, 40, .75);
}
.woocommerce-checkout-review-order-table td:last-child,
.woocommerce-checkout-review-order-table th:last-child { text-align: right; }
.woocommerce-checkout-review-order-table thead th {
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ink-55);
	border-bottom: 1px solid rgba(74, 55, 40, .1);
	padding-bottom: 12px;
}
.woocommerce-checkout-review-order-table .cart_item td { border-bottom: 1px solid rgba(74, 55, 40, .06); }
.woocommerce-checkout-review-order-table .product-name { color: var(--brown); font-weight: 800; }
.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td { border-top: 1px solid rgba(74, 55, 40, .1); }
.woocommerce-checkout-review-order-table tfoot .order-total th,
.woocommerce-checkout-review-order-table tfoot .order-total td {
	font-weight: 900;
	font-size: 20px;
	color: var(--brown);
	padding-top: 14px;
}

/* Order received */
.order-done { max-width: 680px; margin: 0 auto; padding: 80px var(--gx); text-align: center; }
.order-done__mark {
	width: 88px; height: 88px;
	border-radius: 50%;
	background: var(--sage);
	margin: 0 auto 24px;
	display: grid;
	place-items: center;
	font-size: 40px;
	font-weight: 900;
}
.order-done h1 {
	font-size: clamp(34px, 5vw, 54px);
	font-weight: 900;
	letter-spacing: -.03em;
	margin: 0 0 14px;
	line-height: 1;
}
.order-done__lead {
	font-size: 17px;
	font-weight: 600;
	color: rgba(74, 55, 40, .75);
	line-height: 1.55;
	margin: 0 0 30px;
}
.order-done__lead strong { color: var(--brown); }
.order-done .woocommerce-order-overview {
	list-style: none;
	padding: 0;
	margin: 0 0 28px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
	gap: 12px;
	text-align: left;
}
.order-done .woocommerce-order-overview li {
	background: var(--white);
	border-radius: 16px;
	padding: 14px 16px;
	font-size: 12px;
	font-weight: 700;
	color: var(--ink-55);
	font-family: var(--mono);
	letter-spacing: .1em;
	text-transform: uppercase;
}
.order-done .woocommerce-order-overview li strong {
	display: block;
	font-size: 16px;
	color: var(--brown);
	margin-top: 6px;
	font-family: var(--sans);
	letter-spacing: 0;
	text-transform: none;
}
.order-done .woocommerce-order-details,
.order-done .woocommerce-customer-details {
	background: var(--white);
	border-radius: 26px;
	padding: 26px;
	text-align: left;
	margin-top: 20px;
}

@media (max-width: 900px) {
	.woocommerce-checkout form.checkout { grid-template-columns: 1fr; }
	.woocommerce-checkout-review-order { position: static; }
}

/* Notices */
.woocommerce-info, .woocommerce-message, .woocommerce-error {
	background: var(--white);
	border: 0;
	border-left: 4px solid var(--sage);
	border-radius: 14px;
	padding: 16px 20px;
	margin: 0 0 20px;
	font-weight: 700;
	font-size: 14px;
	list-style: none;
}
.woocommerce-error { border-left-color: var(--coral); }
.woocommerce-info::before, .woocommerce-message::before, .woocommerce-error::before { content: none; }
.woocommerce-notices-wrapper:empty { display: none; }

/* My account */
.woocommerce-account .woocommerce {
	max-width: var(--wrap);
	margin: 0 auto;
	padding: 0 var(--gx) 72px;
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: 28px;
	align-items: start;
}
.woocommerce-account .woocommerce > * { min-width: 0; }
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.woocommerce-MyAccount-navigation a {
	display: block;
	padding: 12px 16px;
	border-radius: 14px;
	background: var(--white);
	font-weight: 800;
	font-size: 14px;
}
.woocommerce-MyAccount-navigation .is-active a { background: var(--brown); color: var(--cream); }
.woocommerce-MyAccount-content { background: var(--white); border-radius: 26px; padding: clamp(20px, 3vw, 32px); }
.woocommerce-account.logged-out .woocommerce { grid-template-columns: 1fr; max-width: 460px; }
.woocommerce-account .woocommerce form.login,
.woocommerce-account .woocommerce form.register {
	background: var(--white);
	border-radius: 26px;
	padding: clamp(20px, 3vw, 32px);
	border: 0;
}
@media (max-width: 900px) { .woocommerce-account .woocommerce { grid-template-columns: 1fr; } }

/* Generic tables (order details) */
.shop_table { width: 100%; border-collapse: collapse; }
.shop_table th, .shop_table td {
	padding: 12px 0;
	text-align: left;
	border-bottom: 1px solid var(--line);
	font-size: 14px;
	font-weight: 700;
}
.shop_table th { font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }

/* The related band is white and so is the footer; when they meet, the footer's rule and
   the gap above it read as a stray line between two identical surfaces. */
.related-band { margin-bottom: 0; }
main:has(> .related-band:last-child) + .site-footer {
	border-top: 0;
	margin-top: 0;
}

/* Shipping choice cards in checkout step 2 */
.co-shipping { margin-bottom: 18px; }
.co-shipping .shipping__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
	gap: 12px;
	align-items: stretch;
}
.ship-card {
	background: var(--white);
	border: 2px solid rgba(74, 55, 40, .12);
	border-radius: 18px;
	margin: 0;
	transition: border-color .15s;
}
.ship-card:has(input:checked),
.ship-card.is-selected { border-color: var(--brown); }
.ship-card > label {
	display: flex;
	flex-direction: column;
	/* A generic label rule centres its flex children; the card's text is left-aligned. */
	align-items: stretch;
	text-align: left;
	gap: 10px;
	padding: 16px;
	cursor: pointer;
	margin: 0;
	height: 100%;
	min-width: 0;
}
/* Any picker still inside a card is hidden; JS lifts the live one out below. */
.ship-card .form-row { display: none !important; }
.co-pickup[hidden] { display: none; }
/* The whole card is the control, so the radio itself is not drawn. */
.ship-card input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
/* The name sits on its own line and the price/term row is pushed to the card
   foot, so every card lines its content up no matter how long the carrier name
   wraps. Names and prices on one line overflowed the 212px card. */
.ship-card__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 10px;
	width: 100%;
	min-width: 0;
	margin-top: auto;
}
.ship-card__name {
	font-weight: 800;
	font-size: 15px;
	line-height: 1.3;
	min-width: 0;
	overflow-wrap: break-word;
}
.ship-card__price { font-weight: 900; font-size: 15px; white-space: nowrap; flex: 0 0 auto; }
.ship-card__hint { font-size: 13px; font-weight: 700; color: rgba(74, 55, 40, .6); white-space: nowrap; }

/* The locker picker belongs under the cards, full width. */
.co-shipping .shipping__list li > p.form-row,
.co-shipping .shipping__list li > .form-row { display: none; }
.co-pickup { margin: 0 0 18px; }
.co-pickup .form-row { margin: 0; }
.co-pickup label { font-size: 13px; font-weight: 800; display: block; margin-bottom: 6px; }
.co-pickup select,
.co-pickup .select2-container { width: 100% !important; }

.co-shipping__none { font-weight: 700; font-size: 14px; color: var(--ink-70); }

/* ==========================================================================
   Long-form copy (product descriptions, policy pages, accordion panels)
   ========================================================================== */

.prose {
	font-weight: 600;
	line-height: 1.65;
	color: var(--brown);
	font-size: 15.5px;
	max-width: 72ch;
}
.prose > :first-child { margin-top: 0; }
.prose > :last-child { margin-bottom: 0; }

.prose h2, .prose h3, .prose h4, .prose h5, .prose h6 {
	margin: 26px 0 10px;
	font-weight: 900;
	line-height: 1.25;
	letter-spacing: -.01em;
}
.prose h2 { font-size: 22px; }
.prose h3 { font-size: 19px; }
.prose h4 { font-size: 17px; }
.prose h5, .prose h6 { font-size: 16px; }

.prose p { margin: 0 0 14px; }
.prose ul, .prose ol { margin: 0 0 16px; padding-left: 22px; }
.prose li { margin-bottom: 6px; }
.prose li > p { margin: 0; }
.prose a { text-decoration: underline; }
.prose strong, .prose b { font-weight: 900; }
.prose img { border-radius: 16px; margin: 18px 0; max-width: 100%; height: auto; }
.prose table { width: 100%; border-collapse: collapse; margin: 0 0 18px; }
.prose th, .prose td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.prose hr { border: 0; border-top: 1px solid var(--line); margin: 24px 0; }

/* Label/value pairs, e.g. the company details. The old page faked the columns with
   runs of &nbsp; and they never lined up. */
.prose .deflist {
	display: grid;
	grid-template-columns: minmax(0, max-content) minmax(0, 1fr);
	gap: 12px 32px;
	margin: 0;
}
.prose .deflist dt { font-weight: 900; }
.prose .deflist dd { margin: 0; }
@media (max-width: 640px) {
	/* Two columns leave nothing for the value on a phone, so the label sits above it. */
	.prose .deflist { grid-template-columns: 1fr; gap: 0; }
	.prose .deflist dt { margin-top: 14px; }
	.prose .deflist dt:first-child { margin-top: 0; }
	.prose .deflist dd { margin-top: 2px; }
}

/* Inside a product accordion the panel already has its own heading, so anything within it
   should read as a sub-heading rather than compete with it. */
.pacc__panel .prose { font-size: 15px; color: rgba(74, 55, 40, .75); max-width: none; }
.pacc__panel .prose h2 { font-size: 17px; }
.pacc__panel .prose h3 { font-size: 16px; }
.pacc__panel .prose h4,
.pacc__panel .prose h5,
.pacc__panel .prose h6 { font-size: 15px; }
.pacc__panel .prose h2,
.pacc__panel .prose h3,
.pacc__panel .prose h4 { margin: 18px 0 8px; color: var(--brown); }

.single_add_to_cart_button.loading { opacity: .6; cursor: wait; }


/* Policy pages: the copy fills its card, as in the design.
 *
 * Note the lack of a space — the template puts both classes on the same element
 * (<article class="info-card prose">), so a descendant selector never matches and the
 * 72ch reading measure kept the card at 670px inside its 956px column. */
.info-card.prose,
.info-card .prose,
.checkout-panel.prose,
.checkout-panel .prose { max-width: none; }


/* About hero: the brand mark sits inside the morphing blob rather than filling it, so it
   reads as an illustration instead of a cropped photograph. */
.page-hero__blob--mark { display: grid; place-items: center; background: var(--tan); }
.page-hero__blob--mark img {
	width: 58%;
	height: auto;
	object-fit: contain;
	animation: bbBob 5s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) { .page-hero__blob--mark img { animation: none; } }

/* Stagger the About cards as the row reveals. */
.stat-grid.is-in .stat-card { animation: bbRise .55s cubic-bezier(.2, .8, .2, 1) backwards; }
.stat-grid.is-in .stat-card:nth-child(1) { animation-delay: .05s; }
.stat-grid.is-in .stat-card:nth-child(2) { animation-delay: .12s; }
.stat-grid.is-in .stat-card:nth-child(3) { animation-delay: .19s; }
.stat-grid.is-in .stat-card:nth-child(4) { animation-delay: .26s; }

.band.is-in .step { animation: bbRise .55s cubic-bezier(.2, .8, .2, 1) backwards; }
.band.is-in .step:nth-child(1) { animation-delay: .05s; }
.band.is-in .step:nth-child(2) { animation-delay: .14s; }
.band.is-in .step:nth-child(3) { animation-delay: .23s; }
.band.is-in .step:nth-child(4) { animation-delay: .32s; }
.band.is-in .step:nth-child(5) { animation-delay: .41s; }

@keyframes bbRise {
	from { opacity: 0; transform: translateY(18px); }
	to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	.stat-grid.is-in .stat-card,
	.band.is-in .step { animation: none; }
}

/* MultiParcels pickup-point picker, styled to match the checkout fields. */
.co-section .multiparcels-terminal-select,
.co-section .mp-terminal-select,
.co-section select[name*="terminal"],
.co-section .select2-container { margin-top: 4px; }
.co-section p.form-row label,
.co-section .form-row label { font-size: 13px; font-weight: 800; }
.woocommerce .select2-container--default .select2-selection--single {
	height: 50px;
	border-radius: 14px;
	border: 2px solid rgba(74, 55, 40, .12);
	background: var(--white);
}
.woocommerce .select2-dropdown {
	border: 2px solid rgba(74, 55, 40, .12);
	border-radius: 14px;
	overflow: hidden;
}
.woocommerce .select2-container--default .select2-results__option--highlighted[aria-selected] {
	background: var(--tan);
	color: var(--brown);
}

/* Select2 appends its dropdown to <body>, outside .woocommerce, so the brand styling
   above never reached it and the locker list rendered in the library's default blue. */
.select2-container--default .select2-selection--single {
	height: 50px;
	border-radius: 14px;
	border: 2px solid rgba(74, 55, 40, .12);
	background: var(--white);
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 46px;
	padding-left: 14px;
	font-size: 15px;
	font-weight: 700;
	color: var(--brown);
}
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: rgba(74, 55, 40, .45); }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 46px; right: 10px; }
.select2-container--open .select2-selection--single { border-color: var(--brown) !important; }
.select2-dropdown {
	border: 2px solid var(--brown);
	border-radius: 14px;
	overflow: hidden;
	background: var(--white);
	box-shadow: 0 18px 40px rgba(74, 55, 40, .12);
}
.select2-search--dropdown { padding: 10px; }
.select2-container--default .select2-search--dropdown .select2-search__field {
	height: 42px;
	border-radius: 10px;
	border: 2px solid rgba(74, 55, 40, .12);
	padding: 0 12px;
	font-size: 14px;
	font-weight: 700;
	color: var(--brown);
	outline: none;
}
.select2-results__options { padding: 0 6px 6px; }
.select2-container--default .select2-results__option {
	border-radius: 10px;
	padding: 9px 12px;
	font-size: 14px;
	font-weight: 700;
	color: var(--brown);
}
.select2-results__group {
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: rgba(74, 55, 40, .55);
	padding: 12px 12px 4px;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted {
	background: var(--tan);
	color: var(--brown);
}
.select2-container--default .select2-results__option[aria-selected="true"] {
	background: var(--brown);
	color: var(--white);
}
.select2-results__option .mp-second-line,
.select2-results__option small { font-weight: 700; color: rgba(74, 55, 40, .55); }

.co-pickup-slot:empty { display: none; }
.co-pickup-slot { margin-bottom: 16px; }

/* Pickup-point picker sitting inside its delivery option. */
.co-shipping .shipping__list li > p.form-row,
.co-shipping .shipping__list li > .form-row { margin: 12px 0 0; }
.co-shipping .shipping__list li .select2-container { width: 100% !important; }


/* Checkout field grid — two across, full-width rows where the design shows them. */
/* Two real columns. auto-fit used to open a third track that the full-width rows
   spanned but the paired rows did not, so Vardas/Pavardė ended up two thirds the
   width of the fields under them. */
.co-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 12px;
}
@media (max-width: 560px) {
	.co-grid { grid-template-columns: 1fr; }
}
.co-grid > .form-row-wide,
.co-grid > #billing_address_1_field,
.co-grid > #billing_address_2_field,
.co-grid > #billing_country_field { grid-column: 1 / -1; }
/* Contacts are four fields in two even rows — WooCommerce marks e-mail and phone as
   wide rows, which would otherwise stretch them past the name fields above. */
.co-grid--pairs > .form-row,
.co-grid--pairs > .form-row-wide { grid-column: auto; }
.co-address[hidden] { display: none; }
.co-address { margin-top: 4px; }
/* The design pairs town and post code on one row; WooCommerce marks both as wide. */
.co-address .co-grid > #billing_city_field,
.co-address .co-grid > #billing_postcode_field { grid-column: auto; }

.woocommerce-shipping-fields[hidden] { display: none; }
