/*
 * AdultGamesHub catalog stylesheet — layout/structure ported from the parsed
 * f95zone clone (PlayVault): 1360px column, 3-col card grid, 20px card
 * corners, hover swaps panel for accent, NO box-shadows. Palette and type
 * from the AdultGamesHub brand kit (PDF): Ink #15121E, Rose #E0457B,
 * Rose deep #C02A62, Paper #F7F5FA, Space Grotesk.
 */

:root {
	/* brand palette (brand kit) */
	--fg-bg: #15121e;        /* Ink */
	--fg-panel: #1d1928;
	--fg-panel-2: #262038;
	--fg-deep: #0f0d16;
	--fg-border: #322a46;
	--fg-text: #f7f5fa;      /* Paper */
	--fg-muted: #a79fb8;
	--fg-accent: #e0457b;    /* Rose */
	--fg-accent-deep: #c02a62; /* Rose deep */
	--fg-red: #ba4545;
	--fg-rose: #e0457b;
	/* legacy aliases (templates/plugins reference these) */
	--fg-teal: #e0457b;
	--fg-teal-dim: #c02a62;
	--fg-amber: #f7f5fa;
	--fg-radius: 20px;
	--fg-font-head: "Space Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
	/* clone metrics */
	--col: 1360px;
	--pad: 50px;
	--s-2: 8px;
	--s-4: 20px;
	--s-5: 25px;
	--s-6: 36px;
	--s-7: 40px;
	--s-8: 60px;
}
@media (max-width: 768px) { :root { --pad: 20px; } }
@media (max-width: 480px) { :root { --pad: 10px; } }

* { box-sizing: border-box; }

[hidden] { display: none !important; }

body {
	margin: 0;
	background: var(--fg-bg);
	color: var(--fg-text);
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 16px;
	line-height: 1.6;
}

h1, h2, h3, h4, .fg-site-title, .fg-title, .fg-nav-primary a, .fg-promo, .fg-card-title, .fg-pager-num, .fg-card-more {
	font-family: var(--fg-font-head);
}

a { color: var(--fg-accent); text-decoration: none; }
a:hover { text-decoration: underline; }

img { max-width: 100%; height: auto; }

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

/* ---------- Header (clone: grid 1fr auto 1fr, tall bar) ---------- */
.fg-site-header { background: var(--fg-bg); }
.fg-site-header-inner {
	max-width: var(--col);
	margin-inline: auto;
	padding-inline: var(--pad);
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: var(--s-4);
	min-height: 160px;
}
.fg-nav-primary ul, .fg-nav-primary {
	display: flex;
	align-items: center;
	gap: var(--s-2);
	list-style: none;
	margin: 0;
	padding: 0;
}
.fg-nav-primary a {
	display: inline-flex;
	align-items: center;
	height: 40px;
	padding: 0 var(--s-4);
	font-family: var(--fg-font-head);
	font-size: 16px;
	font-weight: 600;
	color: var(--fg-text);
	text-decoration: none;
}
.fg-nav-primary a:hover { color: var(--fg-accent); }

.fg-site-title { margin: 0; justify-self: center; }
.fg-site-title a {
	display: inline-flex;
	align-items: center;
	gap: 17px;
	color: var(--fg-text);
	text-decoration: none;
}
.fg-site-logo { width: 52px; height: 52px; flex: none; }
.fg-site-title .fg-word {
	font-family: var(--fg-font-head);
	font-size: 24px;
	font-weight: 700;
	letter-spacing: 0.06em;
}
.fg-site-title .fg-word span { color: var(--fg-accent); }

.fg-header-right { display: flex; align-items: center; justify-content: flex-end; gap: var(--s-5); }
.fg-promo {
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
	height: 36px;
	padding: 0 17px;
	border-radius: 6px;
	background: var(--fg-accent);
	font-family: var(--fg-font-head);
	font-size: 16px;
	font-weight: 600;
	color: var(--fg-bg);
	white-space: nowrap;
}
.fg-promo:hover { background: var(--fg-text); text-decoration: none; }

@media (max-width: 1040px) {
	.fg-site-header-inner { grid-template-columns: auto 1fr auto; min-height: 80px; gap: var(--s-2); }
	.fg-nav-primary { display: none; }
	.fg-site-logo { width: 38px; height: 38px; }
	.fg-site-title .fg-word { font-size: 18px; }
}

/* ---------- Nav (tag pills, home) ---------- */
.fg-nav { max-width: var(--col); margin: 0 auto; padding: 0 var(--pad); }
.fg-nav ul { list-style: none; display: flex; flex-wrap: wrap; gap: var(--s-2); margin: 0; padding: 0; }
.fg-nav a {
	display: inline-flex;
	align-items: center;
	height: 40px;
	padding: 0 var(--s-4);
	border: 0;
	border-radius: 100%;
	background: var(--fg-panel);
	color: var(--fg-text);
	font-family: var(--fg-font-head);
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	text-decoration: none;
}
.fg-nav a:hover { background: var(--fg-accent); }

/* ---------- Layout ---------- */
main, .fg-archive, article.fg-game {
	max-width: var(--col);
	margin: 0 auto;
	padding: 0 var(--pad);
}
.fg-archive-head, article.fg-game { padding-top: var(--s-6); }

/* ---------- Hero (home) ---------- */
.fg-hero {
	display: block;
	background: none;
	border: 0;
	border-radius: 0;
	padding: var(--s-8) 0 var(--s-6);
	margin-bottom: 0;
}
.fg-hero-brand { font-size: 36px; font-weight: 700; margin: 0; letter-spacing: 0.02em; }
.fg-hero-brand span { color: var(--fg-accent); }
.fg-hero-sub { margin: var(--s-2) 0 0; max-width: 760px; font-size: 18px; color: var(--fg-muted); }
.fg-search { display: flex; gap: var(--s-2); margin-top: var(--s-4); }
.fg-search input {
	background: var(--fg-panel);
	border: 0;
	border-radius: 6px;
	padding: 10px 14px;
	color: var(--fg-text);
	min-width: 240px;
}
.fg-search button {
	background: var(--fg-accent);
	border: 0;
	border-radius: 6px;
	padding: 10px 18px;
	color: var(--fg-bg);
	font-family: var(--fg-font-head);
	font-weight: 600;
	cursor: pointer;
}

/* ---------- Archive head ---------- */
.fg-archive-head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: var(--s-6);
	padding-top: var(--s-8);
}
.fg-archive-title { font-size: 30px; font-weight: 700; margin: 0; letter-spacing: 0.02em; }

/* ---------- Card grid (clone: 3/2/1, gap 40/60, no borders/shadows) ---------- */
.fg-card-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--s-7) var(--s-8);
	align-items: start;
	padding-bottom: var(--s-8);
}
@media (max-width: 1199px) { .fg-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-6) var(--s-7); } }
@media (max-width: 768px)  { .fg-card-grid { grid-template-columns: minmax(0, 1fr); gap: var(--s-6); } }

.fg-card { background: none; border: 0; border-radius: 0; overflow: hidden; display: flex; flex-direction: column; }
.fg-card-link { display: flex; flex-direction: column; height: 100%; color: var(--fg-text); }
.fg-card-link:hover { text-decoration: none; }
.fg-card-cover {
	display: block;
	width: 100%;
	aspect-ratio: 600 / 338;
	object-fit: cover;
	background: var(--fg-panel-2);
	border-radius: 20px 20px 0 0;
}
.fg-card-cover-wrap { display: block; border-radius: 20px 20px 0 0; overflow: hidden; background: var(--fg-panel-2); }
.fg-card-body {
	display: flex;
	flex-direction: column;
	gap: var(--s-2);
	padding: 23px var(--s-5) var(--s-5);
	background: var(--fg-panel);
	border-radius: 0 0 20px 20px;
	transition: background-color 0.18s ease;
	flex: 1;
}
.fg-card:hover .fg-card-body { background: var(--fg-accent); }
.fg-card:hover .fg-card-title a,
.fg-card:hover .fg-card-meta,
.fg-card:hover .fg-card-tags,
.fg-card:hover .fg-tag,
.fg-card:hover .fg-card-more,
.fg-card:hover .fg-card-meta * { color: var(--fg-bg); }
.fg-card-title { font-weight: 700; font-size: 24px; line-height: 1.28; }
.fg-card-title a { color: var(--fg-text); text-decoration: none; }
.fg-card-meta { display: flex; gap: var(--s-3, 17px); flex-wrap: wrap; margin-top: var(--s-2); font-size: 14px; color: var(--fg-muted); }
.fg-card-tags { display: flex; gap: 5px; flex-wrap: wrap; justify-content: center; margin-top: 10px; font-size: 14px; font-weight: 600; text-transform: uppercase; color: var(--fg-text); }
.fg-tag { font-size: 11px; color: var(--fg-muted); border: 0; padding: 0; background: none; }
.fg-card:hover .fg-tag { color: var(--fg-bg); }
.fg-card-more, .fg-card-btn {
	margin-top: var(--s-4);
	display: inline-block;
	text-align: left;
	background: none;
	border: 0;
	border-radius: 0;
	padding: 0;
	font-family: var(--fg-font-head);
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	color: var(--fg-text);
	text-decoration: none;
}
.fg-card-btn:hover, .fg-card-more:hover { text-decoration: underline; }
.fg-card:hover .fg-card-btn { background: none; }

/* ---------- Chips ---------- */
.fg-chip {
	display: inline-block;
	font-size: 12px;
	padding: 1px 9px;
	border-radius: 100%;
	border: 0;
	background: var(--fg-panel-2);
	color: var(--fg-muted);
}
.fg-chip-ver { color: var(--fg-text); }
.fg-chip-official { color: var(--fg-accent); }
.fg-chip-18 { color: var(--fg-rose); }
.fg-chip-dev { color: var(--fg-text); }

/* ---------- Single game ---------- */
.fg-breadcrumbs { font-size: 13px; color: var(--fg-muted); margin-bottom: 14px; padding-top: var(--s-6); }
.fg-breadcrumbs a { text-decoration: underline; text-underline-offset: 2px; }
.fg-breadcrumbs span { margin: 0 6px; }

.fg-top { display: grid; grid-template-columns: minmax(280px, 420px) 1fr; gap: var(--s-6); margin-bottom: var(--s-6); }
@media (max-width: 800px) { .fg-top { grid-template-columns: 1fr; } }

.fg-cover-wrap { align-self: start; }
.fg-cover { width: 100%; border-radius: var(--fg-radius); border: 0; display: block; }
.fg-cover-fallback {
	aspect-ratio: 600 / 338;
	display: flex; align-items: center; justify-content: center;
	background: var(--fg-panel);
	font-size: 64px; font-weight: 700; color: var(--fg-accent-deep);
}

.fg-title { font-size: 30px; line-height: 1.2; margin: 0 0 10px; letter-spacing: 0.02em; }
.fg-meta-row { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-bottom: 16px; }

.fg-glance { border: 0; border-radius: var(--fg-radius); background: var(--fg-panel); padding: 14px 16px; margin-bottom: 16px; }
.fg-glance-title { font-weight: 600; margin-bottom: 8px; color: var(--fg-text); }
.fg-glance-grid { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
@media (max-width: 600px) { .fg-glance-grid { grid-template-columns: 1fr; } }
.fg-glance-grid dt { font-size: 12px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--fg-muted); }
.fg-glance-grid dd { margin: 0; font-size: 14px; }

/* Buttons: official = Rose pill (like clone promo), mirrors = panel chips */
.fg-buttons { display: flex; flex-direction: column; gap: 12px; }
.fg-btn { display: flex; flex-direction: column; border-radius: 6px; padding: 10px 16px; border: 0; }
.fg-btn:hover { text-decoration: none; }
.fg-btn-official { background: var(--fg-accent); color: var(--fg-bg); }
.fg-btn-official:hover { background: var(--fg-text); }
.fg-btn-main { font-family: var(--fg-font-head); font-weight: 700; font-size: 16px; }
.fg-btn-sub { font-size: 12px; color: inherit; opacity: 0.8; }
.fg-dl-group-title { font-size: 12px; text-transform: uppercase; color: var(--fg-muted); margin-bottom: 4px; }
.fg-dl-group-btns { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.fg-btn-mirror {
	flex-direction: row;
	background: var(--fg-panel);
	color: var(--fg-text);
	font-family: var(--fg-font-head);
	font-size: 14px;
	padding: 9px 16px;
}
.fg-btn-mirror:hover { background: var(--fg-accent); color: var(--fg-bg); }

.fg-devlinks { font-size: 13px; color: var(--fg-muted); }
.fg-devlinks a { text-decoration: underline; text-underline-offset: 2px; }

.fg-description h2, .fg-gallery h2, .fg-gameinfo h2, .fg-faq h2, .fg-howto h2, .fg-related h2 {
	font-size: 24px;
	border: 0;
	border-bottom: 1px solid var(--fg-border);
	padding-bottom: var(--s-2);
	margin: var(--s-7) 0 14px;
	letter-spacing: 0.02em;
}

.fg-gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.fg-gallery-grid img { border-radius: 10px; border: 0; width: 100%; }

.fg-meta-table { border-collapse: collapse; width: 100%; max-width: 720px; }
.fg-meta-table th, .fg-meta-table td { text-align: left; padding: 8px 12px; border-bottom: 1px solid var(--fg-border); vertical-align: top; }
.fg-meta-table th { color: var(--fg-muted); width: 140px; font-weight: 500; }

.fg-rating { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.fg-rating-label { font-size: 12px; color: var(--fg-muted); text-transform: uppercase; }
.fg-rating-stars { display: flex; gap: 4px; }
.fg-star {
	background: none; border: 0; font-size: 20px; color: var(--fg-border); cursor: pointer;
	min-width: 24px; min-height: 24px; display: inline-flex; align-items: center; justify-content: center; padding: 2px;
}
.fg-star:focus-visible { outline: 2px solid var(--fg-accent); outline-offset: 2px; border-radius: 4px; }
.fg-star.active { color: var(--fg-accent); }
.fg-rating-value { font-weight: 700; color: var(--fg-accent); }
.fg-rating-count { font-size: 13px; color: var(--fg-muted); }

.fg-faq-item { border: 0; border-radius: 10px; background: var(--fg-panel); margin-bottom: 8px; overflow: hidden; }
.fg-faq-item summary { cursor: pointer; padding: 12px 16px; font-weight: 600; list-style-position: inside; }
.fg-faq-item p { margin: 0; padding: 0 16px 14px; color: var(--fg-text); }

.fg-changelog details { border: 0; border-radius: 10px; padding: 12px 16px; background: var(--fg-panel); }
.fg-changelog summary { cursor: pointer; font-weight: 600; }
.fg-source { font-size: 13px; color: var(--fg-muted); }

/* Pagination (clone: circular buttons) */
.fg-pagination { margin: var(--s-8) 0; display: flex; gap: var(--s-2); flex-wrap: wrap; justify-content: center; }
.fg-pagination .page-numbers {
	min-width: 40px; height: 40px; padding: 0 8px;
	display: inline-flex; align-items: center; justify-content: center;
	border: 0; border-radius: 100%; background: var(--fg-panel);
	color: var(--fg-text);
	font-family: var(--fg-font-head); font-size: 14px; font-weight: 600;
}
.fg-pagination .page-numbers:hover { background: var(--fg-panel-2); text-decoration: none; }
.fg-pagination .page-numbers.current { background: var(--fg-accent); }
.fg-empty { margin-top: var(--s-7); text-align: center; font-size: 15px; color: var(--fg-muted); }

/* ---------- Footer (clone: deep bg, centered menu) ---------- */
.fg-site-footer { background: var(--fg-deep); margin-top: var(--s-8); }
.fg-site-footer-inner {
	max-width: var(--col);
	margin: 0 auto;
	padding: var(--s-6) var(--pad) var(--s-7);
	text-align: center;
	font-size: 14px;
	color: var(--fg-muted);
}
.fg-site-footer a { color: var(--fg-text); text-decoration: none; }
.fg-site-footer a:hover { color: var(--fg-accent); }
.fg-footer-18 { color: var(--fg-muted); }

/* ---------- 18+ age gate (spec §A) ---------- */
.fg-age-gate {
	position: fixed;            /* never shifts content: CLS 0 */
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--pad);
	background: rgba(21, 18, 30, 0.85);
	backdrop-filter: blur(8px);
}
html.fg-age-gate-on { overflow: hidden; }
.fg-age-gate-box {
	max-width: 520px;
	background: var(--fg-panel);
	border-radius: 20px;
	padding: var(--s-7) var(--s-6);
	text-align: center;
}
.fg-age-gate-title {
	margin: 0 0 var(--s-2);
	font-family: var(--fg-font-head);
	font-size: 44px;
	font-weight: 700;
	color: var(--fg-accent);
}
.fg-age-gate-text { margin: 0 0 var(--s-5); color: var(--fg-text); }
.fg-age-gate-btns { display: flex; gap: var(--s-3); justify-content: center; flex-wrap: wrap; }
.fg-age-gate-enter {
	height: 48px;
	padding: 0 var(--s-6);
	border: 0;
	border-radius: 6px;
	background: var(--fg-accent);
	color: var(--fg-bg);
	font-family: var(--fg-font-head);
	font-size: 17px;
	font-weight: 600;
	cursor: pointer;
}
.fg-age-gate-enter:hover { background: var(--fg-text); }
.fg-age-gate-leave {
	display: inline-flex;
	align-items: center;
	height: 48px;
	padding: 0 var(--s-6);
	border-radius: 6px;
	background: var(--fg-panel-2);
	color: var(--fg-text);
	font-family: var(--fg-font-head);
	font-size: 17px;
	font-weight: 600;
	text-decoration: none;
}
.fg-age-gate-leave:hover { background: var(--fg-border); }
.fg-age-gate-noscript {
	background: var(--fg-accent);
	color: var(--fg-bg);
	font-family: var(--fg-font-head);
	font-weight: 600;
	padding: 10px var(--pad);
	text-align: center;
}

/* ---------- Language switcher ---------- */
.fg-lang-switcher {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: var(--s-2);
	margin: var(--s-4) 0 0;
	font-family: var(--fg-font-head);
	font-size: 14px;
	font-weight: 600;
}
.fg-lang-switcher a {
	color: var(--fg-muted);
	text-decoration: none;
	padding: 2px 4px;
}
.fg-lang-switcher a:hover { color: var(--fg-accent); }
.fg-lang-switcher a.fg-lang-cur { color: var(--fg-accent); }
.fg-lang-sep { color: var(--fg-border); }

/* ---------- Footer menu (clone) ---------- */
.fg-footer-menu {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--s-3, 17px);
	margin-bottom: var(--s-4);
}
.fg-footer-menu a { color: var(--fg-text); }
.fg-footer-menu a:hover { color: var(--fg-accent); text-decoration: none; }
.fg-site-footer-inner > p { margin: var(--s-2) 0 0; }
.fg-site-footer-inner a { text-decoration: none; }
.fg-site-footer-inner a:hover { color: var(--fg-accent); }

/* Static pages (trust pages) */
.fg-page { max-width: 760px; margin: 0 auto; padding: var(--s-6) var(--pad) var(--s-8); }
.fg-page h1 { font-size: 28px; }