/* ==========================================================================
   Kwiaciarnia „KWIATY” Chełm – full-screen video remake
   ========================================================================== */

:root {
	--ink: #0f1f17;          /* deep forest green */
	--ink-2: #16291f;
	--leaf: #8fc79a;         /* soft leaf green */
	--blush: #f0c9bd;        /* petal / peach accent */
	--blush-strong: #e7a996;
	--white: #fff;
	--text: rgba(255, 255, 255, .92);
	--muted: rgba(255, 255, 255, .7);
	--line: rgba(255, 255, 255, .22);
	--glass: rgba(15, 31, 23, .42);

	--sans: "Jost", "Futura", "Century Gothic", "Helvetica Neue", Arial, sans-serif;
	--serif: "Lora", Georgia, "Times New Roman", serif;

	--bar-h: 72px;
	--ease: cubic-bezier(.22, .61, .36, 1);
}

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

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

body {
	margin: 0;
	background: var(--ink);
	color: var(--text);
	font-family: var(--serif);
	font-size: 17px;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
	overflow-x: clip;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3 { margin: 0; font-weight: 500; }
p { margin: 0 0 1em; }

:focus-visible {
	outline: 2px solid var(--blush);
	outline-offset: 3px;
}

.skip-link {
	position: absolute;
	left: 1rem;
	top: -100px;
	z-index: 200;
	padding: .6rem 1rem;
	background: var(--white);
	color: var(--ink);
	font-family: var(--sans);
}
.skip-link:focus { top: 1rem; }

/* ----------------------------------------------------------------------------
   Fixed top menu
   ---------------------------------------------------------------------------- */
.topbar {
	position: fixed;
	inset: 0 0 auto 0;
	z-index: 100;
	height: var(--bar-h);
	transition: background .4s var(--ease), box-shadow .4s var(--ease), height .4s var(--ease);
}
.topbar.is-scrolled {
	--bar-h: 60px;
	background: rgba(15, 31, 23, .78);
	-webkit-backdrop-filter: blur(12px) saturate(140%);
	backdrop-filter: blur(12px) saturate(140%);
	box-shadow: 0 1px 0 var(--line);
}
.topbar__inner {
	max-width: 1240px;
	height: 100%;
	margin: 0 auto;
	padding: 0 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.brand {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	text-decoration: none;
	font-family: var(--sans);
	font-size: 1.45rem;
	font-weight: 500;
	letter-spacing: .04em;
	color: var(--white);
}
.brand img {
	width: 28px;
	height: 28px;
	filter: brightness(0) invert(1);
	transition: transform .6s var(--ease);
}
.brand:hover img { transform: rotate(72deg); }

.menu {
	display: flex;
	gap: .25rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.menu a {
	position: relative;
	display: block;
	padding: .5rem .9rem;
	font-family: var(--sans);
	font-size: .82rem;
	font-weight: 500;
	letter-spacing: .2em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--muted);
	transition: color .3s;
}
.menu a::after {
	content: "";
	position: absolute;
	left: .9rem;
	right: calc(.9rem - .2em);
	bottom: .2rem;
	height: 1px;
	background: var(--blush);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .4s var(--ease);
}
.menu a:hover,
.menu a.is-active { color: var(--white); }
.menu a:hover::after,
.menu a.is-active::after { transform: scaleX(1); }

.burger {
	display: none;
	width: 44px;
	height: 44px;
	padding: 10px;
	border: 0;
	background: none;
	cursor: pointer;
}
.burger span {
	display: block;
	height: 2px;
	margin: 5px 0;
	background: var(--white);
	transition: transform .35s var(--ease), opacity .2s;
}
.burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ----------------------------------------------------------------------------
   Full-screen sections with background video
   ---------------------------------------------------------------------------- */
.screen {
	position: relative;
	isolation: isolate;
	min-height: 100vh;
	min-height: 100svh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: calc(var(--bar-h) + 48px) 24px 128px;
	overflow: hidden;
	overflow: clip; /* can't be scrolled sideways by focus / scrollIntoView */
	scroll-margin-top: 0;
}

.bg {
	position: absolute;
	inset: 0;
	z-index: -1;
	background-color: var(--ink);
	background-size: cover;
	background-position: center;
}
/* overlay: hides compression artefacts + ensures text contrast; never blocks clicks */
.bg::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		radial-gradient(rgba(0, 0, 0, .28) 1px, transparent 1.4px) 0 0 / 3px 3px,
		radial-gradient(ellipse at center, rgba(10, 22, 15, .35) 0%, rgba(10, 22, 15, .72) 100%),
		linear-gradient(rgba(10, 22, 15, .35), rgba(10, 22, 15, .35));
}
.bg__video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 1.6s var(--ease);
}
.bg__video.is-playing { opacity: 1; }

.content {
	width: 100%;
	margin: 0 auto;
	text-shadow: 0 1px 14px rgba(0, 0, 0, .45);
}
.content--narrow { max-width: 540px; }
.content--wide { max-width: 1020px; }
.content--full { max-width: none; }

/* reveal on scroll */
.content > * {
	opacity: 0;
	transform: translateY(26px);
	transition: opacity 1s var(--ease), transform 1s var(--ease);
}
.screen.is-visible .content > * { opacity: 1; transform: none; }
.screen.is-visible .content > *:nth-child(2) { transition-delay: .15s; }
.screen.is-visible .content > *:nth-child(3) { transition-delay: .3s; }
.screen.is-visible .content > *:nth-child(4) { transition-delay: .45s; }
.no-js .content > * { opacity: 1; transform: none; }

/* ----------------------------------------------------------------------------
   Titles – “Films by / BRETT JOHNSON” style
   ---------------------------------------------------------------------------- */
.title-block {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	margin-bottom: 1.8rem;
}
.title,
.section-head h2 {
	font-family: var(--sans);
	line-height: 1.15;
	color: var(--white);
}
.title__lead {
	display: block;
	font-size: clamp(1.5rem, 3.2vw, 2.1rem);
	font-weight: 500;
	letter-spacing: .01em;
}
.title__main {
	display: block;
	font-size: clamp(1.9rem, 4.6vw, 3rem);
	font-weight: 400;
	font-style: italic;
	text-transform: uppercase;
	letter-spacing: .02em;
}
.emblem {
	flex: none;
	display: grid;
	place-items: center;
	width: 84px;
	height: 84px;
	border: 2px solid var(--white);
	border-radius: 50%;
}
.emblem img {
	width: 42px;
	height: 42px;
	filter: brightness(0) invert(1);
	animation: spin 40s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

.section-head {
	text-align: center;
	margin-bottom: 2.4rem;
}
.section-head h2::after {
	content: "";
	display: block;
	width: 56px;
	height: 1px;
	margin: 1.1rem auto 0;
	background: var(--blush);
}
.section-sub {
	margin: 1rem 0 0;
	font-style: italic;
	color: var(--muted);
}

.meta-line {
	margin-top: 2rem;
	font-family: var(--sans);
	font-size: .8rem;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--muted);
}
.meta-line a { text-decoration: none; border-bottom: 1px solid var(--line); }
.meta-line a:hover { color: var(--white); border-color: var(--blush); }

/* ----------------------------------------------------------------------------
   Generic slider (all slides share one grid cell → height = tallest slide)
   ---------------------------------------------------------------------------- */
.slider { position: relative; }
.slider__track { display: grid; }
.slide {
	grid-area: 1 / 1;
	opacity: 0;
	visibility: hidden;
	transform: translateX(40px);
	transition: opacity .9s var(--ease), transform .9s var(--ease), visibility 0s .9s;
}
.slide.is-prev { transform: translateX(-40px); }
.slide.is-active {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity .9s var(--ease), transform .9s var(--ease), visibility 0s;
}
.no-js .slide { position: static; opacity: 1; visibility: visible; transform: none; grid-area: auto; }

.slider__ui {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-top: 1.4rem;
}
.slider__arrow {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	padding: 0;
	border: 1px solid var(--line);
	border-radius: 50%;
	background: transparent;
	color: var(--white);
	cursor: pointer;
	transition: background .3s, border-color .3s;
}
.slider__arrow:hover { background: rgba(255, 255, 255, .12); border-color: var(--white); }
.slider__arrow svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 3; }
.slider__dots { display: flex; gap: .55rem; }
.slider__dot {
	width: 26px;
	height: 26px;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	position: relative;
}
.slider__dot::before {
	content: "";
	position: absolute;
	left: 3px;
	right: 3px;
	top: 50%;
	height: 2px;
	background: rgba(255, 255, 255, .35);
	transition: background .3s;
}
.slider__dot[aria-current="true"]::before { background: var(--blush); }

/* text slider – Start */
.slider--text h2 {
	font-family: var(--sans);
	font-size: 1.05rem;
	font-weight: 500;
	letter-spacing: .28em;
	text-transform: uppercase;
	color: var(--blush);
	margin-bottom: .8rem;
}
.slider--text p {
	font-size: 1.12rem;
	line-height: 1.75;
	margin: 0;
}

/* image + text slider – Witamy / Oferta */
.media-slide {
	display: grid;
	grid-template-columns: 1fr 1.05fr;
	gap: 3rem;
	align-items: center;
}
.media-slide__img {
	margin: 0;
	position: relative;
}
.media-slide__img::before {
	content: "";
	position: absolute;
	inset: 14px -14px -14px 14px;
	border: 1px solid var(--blush);
	z-index: -1;
}
.media-slide__img img {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .6);
}
.media-slide h3,
.card-slide h3 {
	font-family: var(--sans);
	font-size: 1.6rem;
	font-weight: 500;
	color: var(--white);
	margin-bottom: 1rem;
}
.media-slide p { color: var(--text); }
.bank {
	padding-left: 1rem;
	border-left: 1px solid var(--blush);
	font-family: var(--sans);
	font-size: .95rem;
	letter-spacing: .03em;
	line-height: 1.8;
}
.bank strong { font-weight: 500; letter-spacing: .06em; color: var(--white); }
.slider--media .slider__ui { justify-content: center; margin-top: 2.2rem; }

/* card slider – Witamy specialities */
.slider--cards {
	max-width: 640px;
	margin: 4.5rem auto 0;
	text-align: center;
	padding: 2.4rem 2.4rem 1.8rem;
	border: 1px solid var(--line);
	background: var(--glass);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}
.card-slide__icon {
	width: 58px;
	height: 58px;
	margin: 0 auto 1rem;
	filter: brightness(0) invert(1);
	opacity: .9;
}
.card-slide p { margin-bottom: 1.4rem; }
.slider--cards .slider__ui { justify-content: center; }

.link-pill,
.btn {
	display: inline-block;
	padding: .65rem 1.6rem;
	border: 1px solid var(--white);
	border-radius: 999px;
	background: transparent;
	color: var(--white);
	font-family: var(--sans);
	font-size: .78rem;
	font-weight: 500;
	letter-spacing: .24em;
	text-transform: uppercase;
	text-decoration: none;
	text-shadow: none;
	cursor: pointer;
	transition: background .35s var(--ease), color .35s var(--ease), border-color .35s;
}
.link-pill:hover,
.btn:hover { background: var(--blush); border-color: var(--blush); color: var(--ink); }

.invite {
	margin: 3.5rem 0 0;
	text-align: center;
	font-style: italic;
	color: var(--muted);
}
.invite span {
	display: block;
	font-family: var(--sans);
	font-style: normal;
	font-size: clamp(1.5rem, 3vw, 2rem);
	color: var(--white);
}

/* ----------------------------------------------------------------------------
   Wieńce grid
   ---------------------------------------------------------------------------- */
.wreaths {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.4rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.wreaths a {
	position: relative;
	display: block;
	overflow: hidden;
	box-shadow: 0 24px 50px -18px rgba(0, 0, 0, .65);
}
.wreaths a::after {
	content: "";
	position: absolute;
	inset: 10px;
	border: 1px solid rgba(255, 255, 255, .0);
	transition: border-color .5s var(--ease), inset .5s var(--ease);
}
.wreaths img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	transition: transform 1.2s var(--ease);
}
.wreaths a:hover img { transform: scale(1.06); }
.wreaths a:hover::after { border-color: rgba(255, 255, 255, .8); inset: 14px; }
.wreaths li:nth-child(even) { transform: translateY(28px); }

/* ----------------------------------------------------------------------------
   Galeria – centre-focused carousel
   ---------------------------------------------------------------------------- */
.carousel {
	--w: min(62vw, 860px);
	--gap: 28px;
	position: relative;
	width: 100%;
	overflow: hidden;
	overflow: clip;
}
.carousel__stage {
	position: relative;
	height: calc(var(--w) * 2 / 3);
	touch-action: pan-y;
	user-select: none;
}
.carousel__item {
	position: absolute;
	top: 0;
	left: 50%;
	width: var(--w);
	margin: 0 0 0 calc(var(--w) / -2);
	transform: translateX(calc(var(--pos, 0) * (var(--w) + var(--gap)))) scale(.82);
	opacity: .45;
	cursor: pointer;
	transition: transform .8s var(--ease), opacity .8s var(--ease), filter .8s var(--ease);
	filter: saturate(.7);
}
.carousel__item.is-current {
	transform: translateX(0) scale(1);
	opacity: 1;
	filter: none;
	cursor: default;
	z-index: 2;
}
.carousel__item.no-anim { transition: none; }
.carousel__item.is-far { opacity: 0; pointer-events: none; }
.carousel__item img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	box-shadow: 0 40px 80px -25px rgba(0, 0, 0, .75);
	pointer-events: none;
}
.carousel__btn {
	position: absolute;
	top: calc(var(--w) / 3);
	z-index: 3;
	display: grid;
	place-items: center;
	width: 58px;
	height: 58px;
	padding: 0;
	margin-top: -29px;
	border: 1px solid rgba(255, 255, 255, .7);
	border-radius: 50%;
	background: rgba(15, 31, 23, .45);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	color: var(--white);
	cursor: pointer;
	transition: background .3s, transform .3s var(--ease);
}
.carousel__btn:hover { background: var(--blush); color: var(--ink); border-color: var(--blush); }
.carousel__btn svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 3; }
/* arrows sit on the left / right edge of the current image */
.carousel__btn--prev { left: calc(50% - var(--w) / 2 - 29px); }
.carousel__btn--next { right: calc(50% - var(--w) / 2 - 29px); }
.carousel__btn--prev:hover { transform: translateX(-3px); }
.carousel__btn--next:hover { transform: translateX(3px); }
.carousel__count {
	margin: 1.6rem 0 0;
	text-align: center;
	font-family: var(--sans);
	font-size: .85rem;
	letter-spacing: .3em;
	color: var(--muted);
}
.carousel__current { color: var(--white); }

/* ----------------------------------------------------------------------------
   Kontakt
   ---------------------------------------------------------------------------- */
.contact {
	display: grid;
	grid-template-columns: 1.25fr 1fr;
	gap: 2.4rem;
	align-items: start;
	text-shadow: none;
}
.contact__form-wrap,
.contact__info {
	padding: 2rem;
	border: 1px solid var(--line);
	background: var(--glass);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}
.contact__form label {
	display: block;
	margin: 0 0 .35rem;
	font-family: var(--sans);
	font-size: .78rem;
	font-weight: 500;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--muted);
}
.contact__form input,
.contact__form textarea {
	width: 100%;
	margin: 0 0 1.2rem;
	padding: .8rem 1rem;
	border: 1px solid var(--line);
	border-radius: 0;
	background: rgba(255, 255, 255, .07);
	color: var(--white);
	font: inherit;
	font-size: 1rem;
	transition: border-color .3s, background .3s;
}
.contact__form textarea { resize: vertical; min-height: 130px; }
.contact__form input::placeholder,
.contact__form textarea::placeholder { color: rgba(255, 255, 255, .45); }
.contact__form input:focus,
.contact__form textarea:focus {
	outline: none;
	border-color: var(--blush);
	background: rgba(255, 255, 255, .12);
}
.contact__form .btn { margin-top: .4rem; }
.contact__form .btn[disabled] { opacity: .6; cursor: wait; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.form-msg {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin: 0 0 1.6rem;
	padding: 1.1rem 1.3rem;
	border: 1px solid var(--blush);
	background: rgba(240, 201, 189, .14);
	font-family: var(--sans);
	color: var(--white);
	animation: msg-in .8s var(--ease) both;
}
.form-msg[hidden] { display: none; }
.form-msg strong { display: block; font-size: 1.25rem; font-weight: 500; }
.form-msg span { color: var(--muted); font-size: .92rem; }
.form-msg svg {
	flex: none;
	width: 44px;
	height: 44px;
	fill: none;
	stroke: var(--blush);
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}
.form-msg svg path {
	stroke-dasharray: 60;
	stroke-dashoffset: 60;
	animation: draw .9s .3s var(--ease) forwards;
}
.form-msg.is-error { border-color: #f19a9a; background: rgba(241, 154, 154, .14); }
.form-msg.is-error svg { stroke: #f19a9a; }
@keyframes msg-in {
	from { opacity: 0; transform: translateY(-14px) scale(.98); }
	to { opacity: 1; transform: none; }
}
@keyframes draw { to { stroke-dashoffset: 0; } }

.map {
	position: relative;
	aspect-ratio: 4 / 3;
	margin-bottom: 1.5rem;
}
.map iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	filter: grayscale(.35) contrast(1.05);
}
.address { font-style: normal; }
.address h3 {
	font-family: var(--sans);
	font-size: 1.2rem;
	margin-bottom: .7rem;
	color: var(--white);
}
.address ul { margin: 0; padding: 0; list-style: none; }
.address li {
	display: flex;
	align-items: center;
	gap: .7rem;
	margin-bottom: .5rem;
}
.address svg {
	flex: none;
	width: 20px;
	height: 20px;
	fill: none;
	stroke: var(--blush);
	stroke-width: 1.6;
	stroke-linejoin: round;
}
.address a { text-decoration: none; border-bottom: 1px solid var(--line); }
.address a:hover { border-color: var(--blush); }

/* ----------------------------------------------------------------------------
   Big “next section” arrow
   ---------------------------------------------------------------------------- */
.next {
	position: absolute;
	left: 50%;
	bottom: 28px;
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	margin-left: -27px;
	color: var(--white);
	border: 1px solid rgba(255, 255, 255, .5);
	border-radius: 50%;
	transition: background .35s, border-color .35s, color .35s;
	animation: nudge 2.4s var(--ease) infinite;
}
.next svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 3; }
.next:hover { background: var(--blush); border-color: var(--blush); color: var(--ink); }
.next--big {
	width: 86px;
	height: 86px;
	margin-left: -43px;
	bottom: 36px;
	border-width: 2px;
	border-color: var(--white);
}
.next--big svg { width: 40px; height: 40px; stroke-width: 2.6; }
@keyframes nudge {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(9px); }
}

/* ----------------------------------------------------------------------------
   Video pause toggle
   ---------------------------------------------------------------------------- */
.video-toggle {
	position: fixed;
	left: 20px;
	bottom: 20px;
	z-index: 90;
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .45);
	border-radius: 50%;
	background: rgba(15, 31, 23, .55);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	color: var(--white);
	cursor: pointer;
	transition: background .3s, border-color .3s;
}
.video-toggle:hover { border-color: var(--white); background: rgba(15, 31, 23, .8); }
.video-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linejoin: round; }
.video-toggle .i-play { fill: currentColor; stroke-width: 1; }
.video-toggle .i-play,
.video-toggle[aria-pressed="true"] .i-pause { display: none; }
.video-toggle[aria-pressed="true"] .i-play { display: block; }
.video-toggle[hidden] { display: none; }

/* ----------------------------------------------------------------------------
   Lightbox
   ---------------------------------------------------------------------------- */
.lightbox {
	position: fixed;
	inset: 0;
	z-index: 300;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 60px 80px;
	background: rgba(8, 16, 11, .92);
	animation: fade .35s var(--ease);
}
.lightbox[hidden] { display: none; }
.lightbox__img {
	max-width: 100%;
	max-height: 100%;
	box-shadow: 0 30px 80px rgba(0, 0, 0, .6);
}
.lightbox__close {
	position: absolute;
	top: 14px;
	right: 18px;
	width: 48px;
	height: 48px;
	border: 0;
	background: none;
	color: var(--white);
	font-size: 2.4rem;
	line-height: 1;
	cursor: pointer;
}
.lightbox__nav {
	position: absolute;
	top: 50%;
	width: 52px;
	height: 52px;
	margin-top: -26px;
	display: grid;
	place-items: center;
	border: 1px solid rgba(255, 255, 255, .5);
	border-radius: 50%;
	background: none;
	color: var(--white);
	cursor: pointer;
}
.lightbox__nav svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 3; }
.lightbox__nav--prev { left: 18px; }
.lightbox__nav--next { right: 18px; }
@keyframes fade { from { opacity: 0; } }

/* ----------------------------------------------------------------------------
   Footer
   ---------------------------------------------------------------------------- */
.footer {
	position: relative;
	background: var(--ink);
	border-top: 1px solid var(--line);
	color: var(--muted);
	font-size: .97rem;
}
.footer__grid {
	max-width: 1140px;
	margin: 0 auto;
	padding: 4.5rem 24px 3rem;
	display: grid;
	grid-template-columns: 1.6fr 1fr 1.1fr;
	gap: 3rem;
}
.footer h3 {
	margin-bottom: 1.1rem;
	font-family: var(--sans);
	font-size: .82rem;
	font-weight: 500;
	letter-spacing: .26em;
	text-transform: uppercase;
	color: var(--blush);
}
.footer ul { margin: 0; padding: 0; list-style: none; }
.footer li { margin-bottom: .35rem; }
.footer a { text-decoration: none; transition: color .3s; }
.footer a:hover { color: var(--white); }
.footer nav a::before { content: "›"; margin-right: .5rem; color: var(--blush); }
.brand--footer { margin-bottom: 1.1rem; }
.hours { font-family: var(--sans); font-size: .9rem; letter-spacing: .04em; }
.hours strong { font-weight: 500; letter-spacing: .18em; color: var(--white); }
.footer__copy {
	border-top: 1px solid var(--line);
	padding: 1.4rem 24px;
	text-align: center;
	font-family: var(--sans);
	font-size: .82rem;
	letter-spacing: .06em;
}
.footer__copy p { margin: 0; }
.footer__copy a { color: var(--blush); }

/* ----------------------------------------------------------------------------
   Responsive
   ---------------------------------------------------------------------------- */
@media (max-width: 960px) {
	.media-slide { grid-template-columns: 1fr; gap: 2rem; }
	.media-slide__img { max-width: 560px; margin: 0 auto; width: 100%; }
	.wreaths { grid-template-columns: repeat(2, 1fr); }
	.contact { grid-template-columns: 1fr; }
	.carousel { --w: min(76vw, 700px); }
}

@media (max-width: 820px) {
	.burger { display: block; position: relative; z-index: 2; }
	.menu {
		position: fixed;
		inset: 0;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: .6rem;
		background: rgba(15, 31, 23, .97);
		opacity: 0;
		visibility: hidden;
		transition: opacity .4s var(--ease), visibility 0s .4s;
	}
	.menu.is-open { opacity: 1; visibility: visible; transition: opacity .4s var(--ease), visibility 0s; }
	.menu a { font-size: 1.1rem; padding: .7rem 1rem; }
	.topbar.menu-open { background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; }
}

@media (max-width: 640px) {
	body { font-size: 16px; }
	.screen { padding: calc(var(--bar-h) + 28px) 16px 110px; }
	.emblem { width: 64px; height: 64px; }
	.emblem img { width: 32px; height: 32px; }
	.slider--cards { padding: 1.8rem 1.2rem 1.4rem; margin-top: 3rem; }
	.wreaths { gap: .8rem; }
	.wreaths li:nth-child(even) { transform: translateY(16px); }
	.carousel { --w: 72vw; --gap: 10px; }
	.carousel__btn { width: 44px; height: 44px; margin-top: -22px; }
	.carousel__btn--prev { left: calc(50% - var(--w) / 2 - 22px); }
	.carousel__btn--next { right: calc(50% - var(--w) / 2 - 22px); }
	.contact__form-wrap, .contact__info { padding: 1.3rem; }
	.footer__grid { grid-template-columns: 1fr; gap: 2rem; padding-top: 3.2rem; }
	.next--big { width: 70px; height: 70px; margin-left: -35px; }
	.lightbox { padding: 60px 12px; }
	.lightbox__nav { top: auto; bottom: 14px; margin-top: 0; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}