/**
 * Főoldali "Könyvkiadó" szekció — Figma node 183:2137 … 183:2131.
 *
 * A tervben a szekció a vászon y 1976–2960 sávja, fehér háttéren.
 * A kártya felépítése (a renderből mérve és a maszk-path-ból számolva):
 *   - narancs panel:  y 2391.05-től, 374.159 x 403.3, a JOBB ALSÓ sarka levágva
 *                     (a programkártya alakzata függőlegesen tükrözve)
 *   - borítófotó:     y 2280.3-tól 2553-ig, a panel tetejére ülve
 *   - kártya összesen: 514 px magas
 */

.kiado {
	position: relative;
	overflow: hidden;
	padding: 120px 0 94px;
	background: var(--color-bg);
	text-align: center;
}

.kiado__title {
	margin: 0;
	font-size: 50px;
	font-weight: var(--weight-bold);
	text-transform: uppercase;
	color: var(--color-teal);
}

.kiado__lead {
	max-width: 640px;
	margin: 1px auto 0;               /* Figma: gap-px */
	font-size: 20px;
	line-height: 1.2;
	color: var(--color-teal);
}

.kiado__grid {
	display: grid;
	grid-template-columns: repeat(3, 374.159px);
	gap: 34px;
	justify-content: center;
	margin-top: 60px;
	text-align: left;
}

/* -- Könyvkártya -- */

/* A tervben a kártya 514px, de az ott szereplő rövid szerzőlistákkal. A valódi
   adatban 15+ név is előfordul, ezért `min-height`: a rács a soron belül úgyis
   egyformára húzza a hármat, és a szöveg alatt marad hely a levágott saroknak. */
.book-card {
	position: relative;
	display: block;
	min-height: 514px;
	text-decoration: none;
}

/* A narancs alap: a programkártya alakzata FÜGGŐLEGESEN TÜKRÖZVE,
   így a levágott sarok jobb alul van. */
.book-card__panel {
	position: absolute;
	left: 0;
	top: 110.75px;                    /* 2391.05 - 2280.3 */
	right: 0;
	bottom: 0;
	background: var(--color-orange);
	/* Képpontban, nem százalékban: így a levágás 45 fokos marad akkor is, ha a
	   kártya a hosszabb szerzőlista miatt magasabbra nyúlik. */
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - 78.64px), calc(100% - 78.1px) 100%, 0 100%);
}

/* A levágott sarok fölött ülő sárga háromszög (Figma 183:2146). */
.book-card__corner {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 78.1px;                    /* 374.159 * 20.872% */
	height: 78.64px;
	background: var(--color-yellow);
	clip-path: polygon(0 0, 100% 0, 0 100%);
}

.book-card__photo {
	position: relative;
	z-index: 1;
	height: 272.7px;                  /* 2553 - 2280.3 */
	margin: 0;
	overflow: hidden;
}

/* A valódi tartalomban álló formátumú borítószkennek vannak, a terv doboza
   viszont fekvő. Felülre igazítva vágunk, hogy a borító címe látszódjon. */
.book-card__photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

.book-card__badge {
	position: absolute;
	top: 22px;
	left: 0;
	z-index: 2;
	padding: 5px 12px;
	font-size: 13px;
	font-weight: var(--weight-bold);
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #fff;
	background: var(--color-orange);
}

/* `display: block` kell: a jelölésben `span`, és soron belüli elemen a belső
   margó nem tolja beljebb a blokk-szintű gyerekeit — enélkül a cím és az
   adatsorok a narancs panel bal széléhez tapadtak. */
.book-card__body {
	position: relative;
	z-index: 1;
	display: block;
	padding: 32.95px 30px 92px;       /* alul a 78.64px-es sarok + 13px levegő */
}

.book-card__title {
	margin: 0 0 20px;
	font-size: 35px;
	font-weight: var(--weight-bold);
	line-height: 0.94445;             /* Figma: 94.445% */
	color: #fff;
	/* A terv két sorral számol; a valódi címek hosszabbak lehetnek. */
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	/* 1-nél kisebb sormagasságnál a szárak (g, j, y) a sordoboz ALÁ lógnak, és az
	   `overflow: hidden` levágná őket — a belső margó ad nekik helyet. A 20px-es
	   külső margó ez alatt jön, hogy a cím és az adatsorok ne folyjanak egybe. */
	padding-bottom: .2em;
}

.book-card__meta {
	margin: 0;                        /* a térközt a cím alsó margója adja */
	font-size: 18px;
	line-height: 1.25;
	color: rgba(255, 255, 255, .54);
}

.book-card__meta span { display: block; }

/* A szerzőlista a valódi adatban 15+ nevet is tartalmazhat – a tervben két sor.
   Vágjuk, hogy a narancs panelen ne folyjon túl. */
.book-card__meta span:first-child {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.kiado__more {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 373px;
	height: 74.814px;
	margin-top: 45px;
	padding: 0 32px;
	font-size: 27px;
	font-weight: var(--weight-bold);
	color: #fff;
	background: #009286;              /* Figma: bg-[#009286] */
	text-decoration: none;
	transition: background-color .15s ease;
}

.kiado__more:hover,
.kiado__more:focus-visible { background: var(--color-teal-dark); }

/* Sarokdíszek */
.kiado__decor { position: absolute; pointer-events: none; }
.kiado__decor--top-right { right: 0; top: 0; width: 10.4%; }
.kiado__decor--bottom-left { left: 0; bottom: 0; width: 11.6%; }

@media (max-width: 1230px) {
	.kiado__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		max-width: 1050px;
		margin-inline: auto;
		padding-inline: var(--gutter);
		gap: 24px;
	}
	.kiado__title { font-size: 40px; }
	.book-card__title { font-size: 27px; }
}

@media (max-width: 860px) {
	.kiado { padding: 72px 0 64px; }
	.kiado__grid { grid-template-columns: minmax(0, 1fr); max-width: 420px; }
	.kiado__title { font-size: 32px; }
	.kiado__more { min-width: 0; width: calc(100% - 2 * var(--gutter)); font-size: 20px; height: 62px; }
	.kiado__decor { display: none; }
}
