/* ═══════════════════════════════════════════════════
   VI NATURAL — FIRA DE VINS NATURALS
   vinatural.org · 2026
   ═══════════════════════════════════════════════════ */

/* ═══════════ HERO FIRA ═══════════ */

.fira-hero {
	background: var(--blanc);
	padding: calc(var(--sp-xl) + 4rem) var(--gutter) var(--sp-xl);
}

.fira-hero-inner {
	max-width: var(--max-w);
	margin: 0 auto;
}

.fira-hero-tag {
	font-family: var(--font-body);
	font-size: clamp(0.62rem, 0.75vw, 0.72rem);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--terra);
	margin-bottom: var(--sp-xs);
}

.fira-hero h1 {
	font-family: var(--font-display);
	font-size: clamp(2.4rem, 5.5vw, 4.5rem);
	font-weight: 300;
	line-height: 1.08;
	color: var(--vi-profund);
	max-width: 20ch;
	margin-bottom: var(--sp-sm);
}

.fira-hero h1 em {
	font-weight: 600;
	font-style: italic;
}

.fira-hero-desc {
	max-width: 64ch;
	font-family: var(--font-display);
	font-size: clamp(1.1rem, 1.5vw, 1.3rem);
	font-weight: 400;
	line-height: 1.7;
	color: var(--carbó);
	opacity: 0.7;
}

/* ═══════════ GRILLE ÉDITIONS ═══════════ */

.fira-editions {
	background: var(--blanc);
	padding: 0 var(--gutter) var(--sp-xl);
}

.fira-editions-inner {
	max-width: var(--max-w);
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
}

.fira-edition-card {
	display: block;
	text-decoration: none;
	color: inherit;
	border-top: 2px solid var(--vi);
	padding-top: var(--sp-sm);
	transition: opacity 0.25s;
}

.fira-edition-card:nth-child(n+2) {
	padding-left: var(--sp-md);
	border-left: 1px solid rgba(42,36,32,0.08);
}

.fira-edition-card:hover {
	opacity: 0.65;
}

.fira-edition-card--current {
	border-top-color: var(--terra);
}

.fira-edition-img {
	width: 100%;
	aspect-ratio: 3/4;
	object-fit: cover;
	display: block;
	margin-bottom: var(--sp-xs);
}

.fira-edition-num {
	font-family: var(--font-body);
	font-size: 0.68rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--terra);
	margin-bottom: 0.2rem;
}

.fira-edition-date {
	font-family: var(--font-display);
	font-size: clamp(1rem, 1.4vw, 1.2rem);
	font-weight: 400;
	color: var(--vi-profund);
}

.fira-edition-gallery {
	font-family: var(--font-body);
	font-size: 0.72rem;
	color: var(--carbó);
	opacity: 0.4;
	margin-top: 0.2rem;
}

/* ═══════════ HISTOIRE FIRA ═══════════ */

.fira-story {
	background: var(--carbó);
	padding: var(--sp-xl) var(--gutter);
}

.fira-story-inner {
	max-width: 68ch;
	margin: 0 auto;
}

.fira-story p {
	font-family: var(--font-display);
	font-size: clamp(1rem, 1.4vw, 1.2rem);
	font-weight: 300;
	line-height: 1.85;
	color: var(--blanc);
	opacity: 0.75;
}

/* ═══════════ PARTENAIRES ═══════════ */

.fira-partners {
	background: var(--blanc);
	padding: var(--sp-xl) var(--gutter);
}

.fira-partners-inner {
	max-width: var(--max-w);
	margin: 0 auto;
}

.fira-partners-title {
	font-family: var(--font-body);
	font-size: 0.7rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--carbó);
	opacity: 0.3;
	margin-bottom: var(--sp-md);
}

.fira-partners-grid {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-md) var(--sp-lg);
	align-items: center;
	justify-content: center;
}

.fira-partners-grid a img {
	height: 72px;
	width: auto;
	max-width: 180px;
	object-fit: contain;
	opacity: 0.5;
	transition: opacity 0.2s;
	filter: grayscale(1);
}

.fira-partners-grid a:hover img {
	opacity: 0.85;
}

/* ═══════════ PAGE ÉDITION ═══════════ */

.fira-ed-hero {
	background: var(--blanc);
	padding: calc(var(--sp-xl) + 4rem) var(--gutter) 0;
}

.fira-ed-hero-inner {
	max-width: calc(58ch + clamp(200px, 30vw, 380px) + var(--sp-lg));
	margin: 0 auto;
}

.fira-ed-hero-text {
	max-width: 58ch;
}

.fira-ed-cartell {
	margin-top: var(--sp-lg);
}

.fira-ed-cartell img {
	width: 100%;
	max-width: 480px;
	height: auto;
	display: block;
}

.fira-ed-meta {
	display: flex;
	align-items: center;
	gap: var(--sp-xs);
	margin-bottom: var(--sp-sm);
}

.fira-ed-tag {
	font-family: var(--font-body);
	font-size: clamp(0.62rem, 0.75vw, 0.72rem);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--terra);
}

.fira-ed-date-tag {
	font-family: var(--font-body);
	font-size: clamp(0.62rem, 0.75vw, 0.72rem);
	letter-spacing: 0.1em;
	color: var(--carbó);
	opacity: 0.35;
}

.fira-ed-date-tag::before { content: '·'; margin-right: var(--sp-xs); }

.fira-ed-hero h1 {
	font-family: var(--font-display);
	font-size: clamp(2.4rem, 5vw, 4rem);
	font-weight: 300;
	line-height: 1.08;
	color: var(--vi-profund);
	margin-bottom: var(--sp-sm);
}

.fira-ed-hero h1 em { font-weight: 600; font-style: italic; }

.fira-ed-intro {
	max-width: 58ch;
	font-family: var(--font-display);
	font-size: clamp(1.05rem, 1.4vw, 1.2rem);
	font-weight: 400;
	line-height: 1.75;
	color: var(--carbó);
	opacity: 0.75;
}

.fira-ed-cartell img {
	width: 100%;
	height: auto;
	display: block;
}

/* Corps de la page édition */
.fira-ed-body {
	background: var(--blanc);
	padding: var(--sp-xl) var(--gutter);
}

.fira-ed-body-inner {
	max-width: 68ch;
	margin: 0 auto;
}

.fira-ed-section-title {
	font-family: var(--font-body);
	font-size: 0.7rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--terra);
	margin-bottom: var(--sp-xs);
	margin-top: var(--sp-lg);
}

.fira-ed-section-title:first-child { margin-top: 0; }

.fira-ed-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.2rem var(--sp-sm);
}

.fira-ed-list li {
	font-family: var(--font-display);
	font-size: clamp(0.95rem, 1.2vw, 1.05rem);
	line-height: 1.5;
	color: var(--carbó);
	padding-left: 1em;
	position: relative;
}

.fira-ed-list li::before {
	content: '·';
	position: absolute;
	left: 0;
	color: var(--vi);
	font-weight: 700;
}

.fira-ed-list--single {
	grid-template-columns: 1fr;
}

.fira-ed-definition {
	margin: var(--sp-md) 0;
	padding: var(--sp-sm) 0 var(--sp-sm) 1.2em;
	border-left: 2px solid var(--vi);
}

.fira-ed-definition p {
	font-family: var(--font-display);
	font-size: clamp(1rem, 1.3vw, 1.12rem);
	font-style: italic;
	line-height: 1.7;
	color: var(--vi-profund);
}

.fira-ed-ticket {
	display: inline-block;
	font-family: var(--font-body);
	font-size: 0.8rem;
	letter-spacing: 0.1em;
	color: var(--vi-profund);
	border: 1px solid rgba(96,24,42,0.25);
	border-radius: 2rem;
	padding: 0.4em 1.2em;
	margin: var(--sp-sm) 0;
}

.fira-ed-hashtags {
	font-family: var(--font-body);
	font-size: 0.72rem;
	color: var(--carbó);
	opacity: 0.3;
	margin-top: var(--sp-lg);
}

.fira-ed-back {
	background: var(--blanc);
	padding: var(--sp-sm) var(--gutter) var(--sp-md);
}

.fira-ed-back a {
	font-family: var(--font-body);
	font-size: clamp(0.78rem, 0.9vw, 0.85rem);
	letter-spacing: 0.08em;
	color: var(--carbó);
	opacity: 0.35;
	text-decoration: none;
	transition: opacity 0.3s;
}

.fira-ed-back a:hover { opacity: 0.7; }

/* ═══════════ RESPONSIVE ═══════════ */

@media (max-width: 900px) {
	.fira-editions-inner { grid-template-columns: 1fr 1fr; }
	.fira-edition-card:nth-child(n+2) { padding-left: 0; border-left: none; }
	.fira-edition-card:nth-child(even) { padding-left: var(--sp-md); border-left: 1px solid rgba(42,36,32,0.08); }
	.fira-ed-cartell { display: flex; justify-content: center; }
	.fira-ed-cartell img { max-width: 320px; }
}

@media (max-width: 600px) {
	.fira-editions-inner { grid-template-columns: 1fr; }
	.fira-edition-card:nth-child(even) { padding-left: 0; border-left: none; }
	.fira-ed-list { grid-template-columns: 1fr; }
}