/**
 * Arab Nomad Fest — desert-heritage accents (fest page only).
 * Loaded only on page-fest.php, AFTER main.css, so `.fest-page` scoping wins.
 * The hero keeps the original Taghazout photo treatment (from main.css); this
 * file adds the Berber patterns, the dune-backed Discover section, and the
 * partners styling. Palette pulled from the dune illustration.
 * Fonts (Alexandria + IBM Plex Sans Arabic) are the site fonts, already loaded.
 */

.fest-page{
	--f-terra:#B15F40;
	--f-teal:#1A455E;
	--f-gold:#C89A4E;
	--f-sand:#F3ECD9;
	--f-cream:#F4ECD9;
	--f-ink:#2C2117;
	/* Gold Berber zigzag used as section dividers. */
	--f-berber:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='14' viewBox='0 0 44 14'%3E%3Cpath d='M0 12 L11 2 L22 12 L33 2 L44 12' fill='none' stroke='%23C89A4E' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ---- Palette: drop the green band, keep sand + dark + teal only -------- */
.fest-page .fest-olive{ background:linear-gradient(160deg,#1A455E,#123143); }

/* ---- Fest page: the site header auto-hides on scroll (class from nav.js) */
.site-header{ transition:transform .32s ease; will-change:transform; }
.site-header.is-hidden{ transform:translateY(-105%); }

/* ---- Discover Morocco: plain sand, gold-framed photo ------------------- */
.fest-page .fest-discover .fest-split__img{
	border:3px solid rgba(200,154,78,.55);
	box-shadow:0 18px 40px -20px rgba(44,33,23,.6);
}

/* ---- Floating section rail (scroll-spy) -------------------------------- */
.fest-page .fest-rail{
	position:fixed; z-index:40;
	inset-block-start:50%; inset-inline-end:1.1rem;
	transform:translateY(-50%);
	display:flex; flex-direction:column; gap:.15rem;
	padding:.6rem .5rem;
	background:rgba(255,251,240,.82);
	-webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
	border:1px solid rgba(200,154,78,.4);
	border-radius:999px;
	box-shadow:0 14px 34px -18px rgba(44,33,23,.55);
}
/* The rail stays a constant narrow width (dots only); the label is a tooltip
   that pops out to the side and never changes the rail's footprint. */
.fest-page .fest-rail__link{
	position:relative;
	display:flex; align-items:center; justify-content:center;
	width:22px; height:22px;
	text-decoration:none; color:#6b5636;
	border-radius:50%;
}
.fest-page .fest-rail__dot{
	width:10px; height:10px; flex:none;
	border-radius:50%;
	background:transparent;
	border:2px solid rgba(107,86,54,.45);
	transition:background .2s ease, border-color .2s ease, transform .2s ease;
}
.fest-page .fest-rail__label{
	position:absolute; inset-inline-end:calc(100% + 10px); top:50%;
	transform:translateY(-50%) translateX(6px);
	white-space:nowrap;
	font-size:.78rem; font-weight:600; line-height:1; color:#3a2f22;
	background:rgba(255,251,240,.96);
	border:1px solid rgba(200,154,78,.4);
	padding:.32rem .6rem; border-radius:999px;
	box-shadow:0 8px 20px -12px rgba(44,33,23,.5);
	opacity:0; pointer-events:none;
	transition:opacity .18s ease, transform .18s ease;
}
.fest-page .fest-rail__link:hover .fest-rail__label,
.fest-page .fest-rail__link:focus-visible .fest-rail__label{
	opacity:1; transform:translateY(-50%) translateX(0);
}
.fest-page .fest-rail__link:hover .fest-rail__dot{
	border-color:var(--f-terra); transform:scale(1.2);
}
.fest-page .fest-rail__link.is-active{ color:var(--f-terra); }
.fest-page .fest-rail__link.is-active .fest-rail__dot{
	background:var(--f-terra); border-color:var(--f-terra); transform:scale(1.2);
}
/* Land anchors below the sticky site header. */
.fest-page .section, .fest-page .fest-hero{ scroll-margin-top:84px; }

@media (max-width:900px){
	.fest-page .fest-rail{ display:none; } /* header nav covers small screens */
}
@media (prefers-reduced-motion: reduce){
	.fest-page .fest-rail__dot, .fest-page .fest-rail__label{ transition:none; }
}

/* ---- Section rhythm: Berber divider between bands ---------------------- */
.fest-page .section{ position:relative; }
.fest-page .section + .section::before{
	content:""; position:absolute; inset-inline:0; inset-block-start:0;
	height:14px;
	background-image:var(--f-berber);
	background-repeat:repeat-x;
	background-position:center;
	opacity:.9;
	transform:translateY(-50%);
	pointer-events:none;
}

/* Faint star-lattice texture over the darker bands. */
.fest-page .fest-teal,
.fest-page .fest-dark,
.fest-page .fest-olive{ position:relative; overflow:hidden; }
.fest-page .fest-teal::after,
.fest-page .fest-dark::after,
.fest-page .fest-olive::after{
	content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
	opacity:.06;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cpath d='M30 4 L36 24 L56 30 L36 36 L30 56 L24 36 L4 30 L24 24 Z' fill='none' stroke='%23F4ECD9' stroke-width='1.2'/%3E%3C/svg%3E");
	background-size:60px 60px;
}
.fest-page .fest-teal > .container,
.fest-page .fest-dark > .container,
.fest-page .fest-olive > .container{ position:relative; z-index:1; }

/* Centered headings get a small gold flourish beneath. */
.fest-page .fest-h2.fest-center::after{
	content:""; display:block; width:96px; height:12px; margin:.7rem auto 0;
	background:
		radial-gradient(circle at 50% 50%, var(--f-gold) 0 2.5px, transparent 3.5px) center/100% no-repeat,
		linear-gradient(90deg, transparent, var(--f-gold) 20%, var(--f-gold) 80%, transparent) center/100% 2px no-repeat;
}

/* ---- Interactive day-by-day program ----------------------------------- */
/* Reset the legacy `.fest-prog` card look (terracotta panel) from main.css;
   our program is a clean layout on the sand section, not a coloured card. */
.fest-page .fest-prog{
	margin-block-start:2rem;
	background:none; color:inherit;
	padding:0; min-height:0; display:block; border-radius:0;
}
.fest-page .fest-prog:hover{ transform:none; }
.fest-page .fest-prog__days{
	display:flex; flex-wrap:wrap; justify-content:center; gap:.6rem;
	margin-block-end:2rem;
}
.fest-page .fest-prog__day{
	display:flex; flex-direction:column; align-items:center; gap:.15rem;
	min-width:88px;
	padding:.6rem 1rem;
	border:1px solid rgba(200,154,78,.5);
	border-radius:14px;
	background:#fff;
	color:#6b5636;
	cursor:pointer;
	font-family:inherit;
	transition:background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.fest-page .fest-prog__day:hover{ transform:translateY(-2px); box-shadow:0 10px 22px -14px rgba(44,33,23,.5); }
.fest-page .fest-prog__day.is-active{
	background:var(--f-terra); border-color:var(--f-terra); color:#fff;
	box-shadow:0 12px 26px -14px rgba(177,95,64,.9);
}
.fest-page .fest-prog__daynum{ font-weight:800; font-size:1.02rem; }
.fest-page .fest-prog__daydate{ font-size:.78rem; opacity:.85; }

.fest-page .fest-prog__panel{
	max-width:760px; margin-inline:auto;
	animation:festProgIn .35s ease both;
}
.fest-page .fest-prog__panel[hidden]{ display:none; }
@keyframes festProgIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
.fest-page .fest-prog__title{
	text-align:center; color:var(--f-teal); font-weight:800;
	margin-block-end:1.4rem;
}
.fest-page .fest-prog__timeline{ list-style:none; margin:0; padding:0; display:grid; gap:.6rem; }
.fest-page .fest-prog__row{
	display:grid; grid-template-columns:auto minmax(112px,140px) 1fr; align-items:center;
	gap:.9rem;
	background:#fff;
	border-radius:14px;
	padding:.85rem 1.1rem;
	box-shadow:0 8px 22px -20px rgba(44,33,23,.5);
}
.fest-page .fest-prog__icon{
	width:40px; height:40px; flex:none;
	display:grid; place-items:center;
	border-radius:50%; font-size:1.15rem;
	background:rgba(200,154,78,.16);
	box-shadow:inset 0 0 0 1.5px rgba(200,154,78,.5);
}
.fest-page .fest-prog__time{
	font-weight:700; color:#8a6f42; font-size:.9rem;
	font-variant-numeric:tabular-nums;
}
.fest-page .fest-prog__act{ font-weight:600; color:var(--f-ink); }
/* Three cohesive accent families: gold (active), teal (learning), terra (social). */
.fest-page .fest-prog__row[data-cat="talks"] .fest-prog__icon,
.fest-page .fest-prog__row[data-cat="ceremony"] .fest-prog__icon{
	background:rgba(26,69,94,.12); box-shadow:inset 0 0 0 1.5px rgba(26,69,94,.45);
}
.fest-page .fest-prog__row[data-cat="meal"] .fest-prog__icon,
.fest-page .fest-prog__row[data-cat="social"] .fest-prog__icon,
.fest-page .fest-prog__row[data-cat="party"] .fest-prog__icon{
	background:rgba(177,95,64,.14); box-shadow:inset 0 0 0 1.5px rgba(177,95,64,.5);
}

@media (max-width:520px){
	.fest-page .fest-prog__row{ grid-template-columns:auto 1fr; gap:.5rem .7rem; }
	.fest-page .fest-prog__time{ grid-column:2; }
	.fest-page .fest-prog__act{ grid-column:2; }
	.fest-page .fest-prog__day{ min-width:74px; padding:.5rem .7rem; }
}
@media (prefers-reduced-motion: reduce){
	.fest-page .fest-prog__panel{ animation:none; }
	.fest-page .fest-prog__day{ transition:none; }
}

/* ---- Taghazout guide: facts, lists, budget ---------------------------- */
.fest-page .guide-facts{
	display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:1rem;
	margin-block-start:1.8rem;
}
.fest-page .guide-fact{
	display:flex; flex-direction:column; gap:.25rem;
	background:#fff; border-radius:14px; padding:1.1rem 1.2rem;
	border-inline-start:5px solid var(--f-gold);
	box-shadow:0 10px 26px -20px rgba(44,33,23,.55);
}
.fest-page .guide-fact__icon{ font-size:1.4rem; }
.fest-page .guide-fact__k{ font-size:.8rem; font-weight:700; color:#9a7b46; text-transform:uppercase; letter-spacing:.04em; }
.fest-page .guide-fact__v{ font-weight:600; color:var(--f-ink); }

.fest-page .guide-list{ margin:1.2rem 0 0; padding-inline-start:1.1rem; display:grid; gap:.7rem; }
.fest-page .guide-list li{ line-height:1.6; }
.fest-page .guide-list--light li{ color:#f4ecd9; }
.fest-page .guide-list--light li strong{ color:#fff; }

.fest-page .guide-budget{ margin-block-start:1.6rem; display:grid; gap:.5rem; }
.fest-page .guide-budget__row{
	display:flex; justify-content:space-between; align-items:center; gap:1rem;
	background:#fff; border-radius:12px; padding:.85rem 1.15rem;
	box-shadow:0 8px 22px -18px rgba(44,33,23,.5);
}
.fest-page .guide-budget__k{ font-weight:600; color:var(--f-ink); }
.fest-page .guide-budget__v{ font-weight:700; color:var(--f-teal); font-variant-numeric:tabular-nums; white-space:nowrap; }
.fest-page .guide-budget__row--total{
	background:var(--f-terra);
	box-shadow:0 12px 26px -14px rgba(177,95,64,.8);
}
.fest-page .guide-budget__row--total .guide-budget__k,
.fest-page .guide-budget__row--total .guide-budget__v{ color:#fff; }

/* ---- Community & media partners: big, full-colour, presentable -------- */
.fest-page .fest-partners{ text-align:center; }
.fest-page .fest-partners__grid{
	display:flex; flex-wrap:wrap; justify-content:center; align-items:center;
	gap:clamp(2rem,5vw,4rem);
	margin-block-start:2.2rem;
}
.fest-page .fest-partners__grid figure,
.fest-page .fest-partners__grid p{ margin:0; }
.fest-page .fest-partners__grid img{
	max-height:clamp(120px,20vw,190px);
	width:auto; height:auto;
	border-radius:16px;
	background:#fff;
	padding:clamp(1rem,2.5vw,1.6rem) clamp(1.4rem,3.5vw,2.4rem);
	box-shadow:0 16px 38px -20px rgba(44,33,23,.5);
	transition:transform .25s ease, box-shadow .25s ease;
}
.fest-page .fest-partners__grid a:hover img,
.fest-page .fest-partners__grid img:hover{
	transform:translateY(-3px);
	box-shadow:0 22px 48px -20px rgba(44,33,23,.6);
}
.fest-page .fest-partners__note{
	margin-block-start:1.8rem; color:#6b5636;
}
.fest-page .fest-partners__note a{ color:var(--f-terra); font-weight:600; }

@media (prefers-reduced-motion: reduce){
	.fest-page .fest-partners__grid img{ transition:none; }
}