/* ================================================
   AMOTZ — SITE FOOTER  (Figma 538:3478 → "Frame 2147227072")
   ================================================
   band     1440x600 · photo · col · gap 57 · space-between · padding 50/60
   share    1320x27 · 18/600 centred · #FCFCF7 @ .85
   columns  1320x223 · row · gap 40 · space-between · four columns, padding 24
   heading  12/600 · #ECC55A       link  16/500 · #FFFFFF · gap 12
   rule     1320 hairline at y335
   base     brand + logo 80 · disclaimer 12/500 @ .5 · copyright 12/500 @ .8
   ================================================ */

.az-footer {
	display: flex;
	flex-direction: column;
	/* RTL start = right, the file's `cross:MAX` on an LTR canvas. */
	align-items: flex-start;
	justify-content: space-between;
	gap: 57px;
	min-height: 600px;
	padding: 50px var(--az-edge);
	background-color: var(--az-ink);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.az-footer__inner {
	display: flex;
	flex-direction: column;
	gap: 57px;
	width: 100%;
	max-width: 1320px;
	margin: 0 auto;
}

/* ------------------------------------------------
   SHARE LINE
   ------------------------------------------------ */
.az-footer__share {
	margin: 0;
	width: 100%;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.5;
	text-align: center;
	color: #FCFCF7;
	opacity: 0.85;
}

/* ------------------------------------------------
   LINK COLUMNS
   ------------------------------------------------ */
.az-footer__cols {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: space-between;
	gap: 40px;
	width: 100%;
}

.az-footer__col {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	padding: 24px;
	/* CONTENT-SIZED, NOT EQUAL-WIDTH — this was wrong in the first build and is worth spelling
	   out. The file gives 280 / 280 / 280 / 329 inside a 1320 row: they sum to 1169, and the
	   remaining 151px falls into three gaps of ~50. In other words Figma hugs each column to
	   its longest link and `space-between` spreads what is left over. The courses column is
	   329 because "איך לצאת מדכאון וחרדות בעזרת תזונה" is the longest string in the footer,
	   not because that column is special.

	   `flex: 1 1 0` — what was here before — divides the row into four equal 300px columns
	   instead, which squeezes the courses links and leaves the short columns padded out. So:
	   basis auto, no grow. `space-between` on the parent then reproduces the ~50px gaps by
	   itself, and the `gap` there is only a floor for when the content gets long. */
	flex: 0 1 auto;
	min-width: 0;
}

.az-footer__heading {
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	/* No tracking and no case change: the file has plain 12/600. An earlier build added
	   letter-spacing 0.6px and uppercase that are not in the design. */
	text-align: right;
	color: #ECC55A;
}

.az-footer__list {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}

.az-footer__link {
	font-size: 16px;
	font-weight: 500;
	line-height: 1.2;
	text-align: right;
	color: #FFFFFF;
	text-decoration: none;
	transition: color 0.15s ease;
}

.az-footer__link:hover,
.az-footer__link:focus-visible {
	color: #ECC55A;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ------------------------------------------------
   HAIRLINE  (Line 7, y335)
   ------------------------------------------------ */
.az-footer__rule {
	width: 100%;
	height: 1px;
	background-color: rgba(252, 252, 247, 0.2);
	border: 0;
	margin: 0;
}

/* ------------------------------------------------
   BASE ROW
   ------------------------------------------------ */
.az-footer__base {
	display: flex;
	flex-direction: column;
	gap: 32px;
	width: 100%;
}

.az-footer__baserow {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 40px;
	width: 100%;
}

/* Brand lockup — FIRST in source so it lands on the right (the file puts it at x1109 against
   the signature block at x60), and logo before text so the mark sits rightmost of the pair. */
.az-footer__brand {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 11.87px;
}

.az-section .az-footer__logo {
	display: block;
	width: 80px;
	height: 80px;
	object-fit: contain;
}

.az-footer__brandtext {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.az-footer__brandname {
	font-size: 25.6px;
	font-weight: 600;
	line-height: 1.2;
	text-align: right;
	color: #FFFFFF;
}

.az-footer__sig {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
}

.az-footer__signature {
	font-size: 24px;
	font-weight: 700;
	line-height: 1;
	text-align: right;
	color: #ECC55A;
}

.az-footer__social {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 16px;
}

.az-footer__social a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	color: #FCFCF7;
	opacity: 0.8;
	transition: opacity 0.15s ease;
}

.az-footer__social a:hover { opacity: 1; }

.az-footer__social svg {
	display: block;
	width: 20px;
	height: 20px;
}

/* ------------------------------------------------
   FINE PRINT
   ------------------------------------------------
   The medical disclaimer is the one thing in this footer that is not decoration: it states
   that Dr. Ziv-Av is a PhD and not a physician. Its 50% opacity is the design's, and it is
   left alone rather than "improved" — but it is a <p> in the document flow, never an image or
   a tooltip, so it is always readable and always selectable. */
.az-footer__disclaimer {
	margin: 0;
	width: 100%;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.55;
	text-align: right;
	color: #FCFCF7;
	opacity: 0.5;
}

.az-footer__copyright {
	margin: 0;
	width: 100%;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.35;
	/* LEFT in the file, and physical — this is a © line with a Latin year, not Hebrew prose. */
	text-align: left;
	color: #FCFCF7;
	opacity: 0.8;
}

/* ------------------------------------------------
   RESPONSIVE
   ------------------------------------------------ */
@media (max-width: 1100px) {
	.az-footer__cols {
		flex-wrap: wrap;
	}

	.az-footer__col {
		flex: 1 1 40%;
		min-width: 200px;
	}
}

@media (max-width: 900px) {
	.az-footer {
		gap: 36px;
		min-height: 0;
		padding: 40px 20px;
	}

	.az-footer__inner { gap: 36px; }

	.az-footer__share {
		font-size: 16px;
		text-align: right;
	}

	.az-footer__col {
		flex: 1 1 100%;
		padding: 0;
	}

	.az-footer__cols { gap: 28px; }

	.az-footer__baserow {
		flex-direction: column;
		align-items: flex-start;
		gap: 24px;
	}

	.az-footer__copyright { text-align: right; }
}