/*
Theme Name:   Kadence Child
Theme URI:    https://www.erotische-schweiz.ch/
Description:  Child-Theme für erotische-schweiz.ch (Erotikseiten-Verzeichnis Schweiz). Basiert auf Kadence.
Author:       erotische-schweiz.ch
Template:     kadence
Version:      1.0.0
Text Domain:  kadence-child
*/

/* ============================================================
   erotische-schweiz.ch – Webkatalog-Styles
   Farbschema: dunkel + Schweizer-Rot
   ============================================================ */

:root {
	--esch-bg:        #14121a;
	--esch-card:      #1e1b26;
	--esch-card-2:    #272230;
	--esch-red:       #e2001a;   /* Schweizer Rot */
	--esch-pink:      #ff3d6e;
	--esch-green:     #1faf5a;   /* Check-Grün */
	--esch-text:      #ece9f1;
	--esch-muted:     #a59fb5;
	--esch-border:    #322c3d;
}

/* ---------- Hero ---------- */
.esch-hero {
	position: relative;
	margin: 0 0 3rem;
	padding: 4.5rem 1.5rem 4rem;
	text-align: center;
	border-radius: 0;
	background:
		linear-gradient(180deg, rgba(255,255,255,.12), transparent 22%),
		radial-gradient(1200px 420px at 50% -10%, rgba(226,0,26,.42), transparent 62%),
		linear-gradient(160deg, #2a2030 0%, #14121a 72%);
	border: 1px solid rgba(255,255,255,.10);
	box-shadow:
		0 30px 60px -30px rgba(0,0,0,.9),
		inset 0 1px 0 rgba(255,255,255,.12);
	overflow: hidden;
}
/* feiner Glanz-Bogen oben */
.esch-hero::before {
	content: "";
	position: absolute;
	top: -60%;
	left: -10%;
	width: 120%;
	height: 120%;
	background: radial-gradient(closest-side, rgba(255,255,255,.08), transparent 70%);
	pointer-events: none;
}
.esch-hero h1 {
	margin: 0 0 .6rem;
	font-size: clamp(2rem, 5vw, 3.2rem);
	line-height: 1.1;
	color: #fff;
	letter-spacing: -.5px;
}
.esch-hero h1 .accent { color: var(--esch-pink); }
.esch-hero p {
	margin: 0 auto;
	max-width: 620px;
	font-size: 1.15rem;
	color: var(--esch-muted);
}
.esch-hero .esch-badge {
	display: inline-block;
	margin-bottom: 1.1rem;
	padding: .35rem .9rem;
	font-size: .8rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #ffd0d8;
	background: rgba(226,0,26,.18);
	border: 1px solid rgba(226,0,26,.45);
	border-radius: 0;
}

/* ---------- Katalog-Grid ---------- */
.esch-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 1.4rem;
	margin: 0 0 3.5rem;
}
.esch-section-title {
	margin: 0 0 1.3rem;
	font-size: 1.7rem;
	color: #fff;
	position: relative;
	padding-left: .9rem;
}
.esch-section-title::before {
	content: "";
	position: absolute;
	left: 0; top: .15em; bottom: .15em;
	width: 4px;
	background: linear-gradient(180deg, var(--esch-red), var(--esch-pink));
}
.esch-card {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 1.6rem 1.6rem 1.5rem;
	border-radius: 0;
	background:
		linear-gradient(160deg, #241f2e 0%, #15111c 100%);
	border: 1px solid rgba(255,255,255,.10);
	box-shadow:
		0 14px 32px -18px rgba(0,0,0,.95),
		inset 0 1px 0 rgba(255,255,255,.18);
	text-decoration: none;
	color: var(--esch-text);
	transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
	overflow: hidden;
}
/* glänzender Glas-Reflex oben (weniger matt) */
.esch-card::after {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 58%;
	background: linear-gradient(180deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,.05) 38%, transparent 100%);
	pointer-events: none;
}
/* Akzentlinie oben */
.esch-card::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	z-index: 1;
	background: linear-gradient(90deg, var(--esch-red), var(--esch-pink));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .3s ease;
}
.esch-card:hover {
	transform: translateY(-7px);
	border-color: rgba(255,61,110,.55);
	box-shadow:
		0 24px 50px -20px rgba(226,0,26,.65),
		inset 0 1px 0 rgba(255,255,255,.14);
	color: var(--esch-text);
}
.esch-card:hover::before { transform: scaleX(1); }

/* Kopfzeile: Icon + Titel in einer Zeile */
.esch-card-head {
	display: flex;
	align-items: center;
	gap: .8rem;
	margin-bottom: .85rem;
}
.esch-card .esch-ico {
	flex: 0 0 auto;
	width: 2.8rem;
	height: 2.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	line-height: 1;
	border-radius: 0;
	background: #000;
	border: none;
	box-shadow: none;
}
.esch-card h3 {
	margin: 0;
	font-size: 1.22rem;
	line-height: 1.2;
	color: #fff;
}
.esch-card p {
	margin: 0 0 1.2rem;
	font-size: .95rem;
	color: var(--esch-muted);
	flex: 1;
}
.esch-card .esch-go {
	align-self: flex-start;
	font-weight: 600;
	font-size: .92rem;
	color: var(--esch-pink);
}
.esch-card .esch-go::after {
	content: " →";
	transition: margin-left .2s ease;
}
.esch-card:hover .esch-go::after { margin-left: .35rem; }

/* ---------- Masonry Link-Cards (Money-Links) ---------- */
.esch-masonry {
	columns: 2;
	column-gap: 1.4rem;
	margin: .4rem 0 1.6rem;
}
@media (max-width: 600px) { .esch-masonry { columns: 1; } }
.esch-link {
	break-inside: avoid;
	display: block;
	margin: 0 0 1.4rem;
	background: linear-gradient(160deg, #241f2e 0%, #15111c 100%);
	border: 1px solid rgba(255,255,255,.10);
	box-shadow:
		0 14px 32px -18px rgba(0,0,0,.95),
		inset 0 1px 0 rgba(255,255,255,.16);
	text-decoration: none;
	color: var(--esch-text);
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.esch-link:hover {
	border-color: rgba(255,61,110,.55);
	box-shadow: 0 20px 44px -22px rgba(226,0,26,.55);
	color: var(--esch-text);
}
.esch-link-thumb {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	min-height: 175px;
	padding: 1.6rem 1rem;
	text-align: center;
	color: #fff;
	background-color: #15111c;
	background-size: cover;
	background-position: top center;
	overflow: hidden;
}
/* Screenshot voll sichtbar; Text sitzt auf schwarzem Halbtransparenz-Klotz */
.esch-link-thumb > * { position: relative; z-index: 1; }
.esch-link-cap {
	position: relative;
	z-index: 1;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: .35rem;
	padding: .8rem 1.15rem;
	background: rgba(0,0,0,.58);
	backdrop-filter: blur(1px);
}
.esch-link-thumb .ico { font-size: 2.5rem; line-height: 1; text-shadow: 0 2px 8px rgba(0,0,0,.7); }
.esch-link-thumb .kw {
	font-size: 1.15rem;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-shadow: 0 2px 10px rgba(0,0,0,.8);
}
.esch-link-thumb .host {
	font-size: .78rem;
	color: rgba(255,255,255,.88);
	letter-spacing: .03em;
	text-shadow: 0 1px 6px rgba(0,0,0,.8);
}
.esch-link-body { padding: 1.1rem 1.3rem 1.4rem; }
.esch-link-body h3 { margin: 0 0 .5rem; color: #fff; font-size: 1.18rem; }
.esch-link-body p {
	margin: 0 0 1.1rem;
	color: var(--esch-muted);
	font-size: .95rem;
	line-height: 1.5;
	min-height: 2.85em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* "Seite besuchen"-Button (statt klickbarer Card) */
.esch-btn {
	display: block;
	width: fit-content;
	margin: 0 auto;
	padding: .62rem 1.45rem;
	background: var(--esch-red);
	color: #fff !important;
	font-weight: 700;
	font-size: .92rem;
	text-align: center;
	text-decoration: none;
	border: 1px solid rgba(255,255,255,.14);
	box-shadow: 0 3px 9px -5px rgba(0,0,0,.7);
	transition: background .2s ease, transform .2s ease;
}
.esch-btn:hover { background: var(--esch-pink); transform: translateY(-1px); color: #fff !important; }
.esch-btn::before {
	content: "";
	display: inline-block;
	width: 1em; height: 1em;
	margin-right: .5rem;
	vertical-align: -0.15em;
	background: url("tap.svg") center / contain no-repeat;
}

/* ---------- SEO-Content in Boxen ---------- */
.esch-seo {
	color: var(--esch-text);
	display: grid;
	gap: 1.4rem;
	margin-top: 1rem;
}
.esch-seo h2, .esch-seo h3 { color: #fff; }

.esch-box {
	position: relative;
	background:
		linear-gradient(165deg, rgba(255,255,255,.045), rgba(255,255,255,0) 40%),
		linear-gradient(155deg, #272230, #1a1722);
	border: 1px solid rgba(255,255,255,.08);
	border-left: 3px solid var(--esch-red);
	border-radius: 0;
	padding: 1.7rem 1.9rem;
	box-shadow:
		0 16px 36px -24px rgba(0,0,0,.85),
		inset 0 1px 0 rgba(255,255,255,.07);
	transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.esch-box:hover {
	border-left-color: var(--esch-pink);
	box-shadow:
		0 22px 44px -24px rgba(226,0,26,.4),
		inset 0 1px 0 rgba(255,255,255,.1);
}
.esch-box > :first-child { margin-top: 0; }
.esch-box > :last-child { margin-bottom: 0; }
.esch-box h2 { font-size: 1.55rem; margin: 0 0 .9rem; }
.esch-box h3 { font-size: 1.2rem; margin: 0 0 .5rem; }
.esch-box p { margin: 0 0 .8rem; }

/* Akzent-Box (Kantönligeist) */
.esch-box--accent {
	background:
		radial-gradient(700px 220px at 0% 0%, rgba(226,0,26,.22), transparent 60%),
		var(--esch-card);
	border-left-color: var(--esch-pink);
}

/* Check-Liste (Vorteile) */
.esch-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.esch-checks li {
	position: relative;
	padding-left: 1.9rem;
	line-height: 1.5;
}
.esch-checks li::before {
	content: "";
	position: absolute;
	left: 0; top: 0;
	width: 1.3rem; height: 1.3rem;
	border-radius: 50%;
	background:
		url("check.svg") center / .72rem .72rem no-repeat,
		linear-gradient(135deg, #168a47, var(--esch-green));
}

/* Nischen als nummerierte Chips */
.esch-niches { list-style: none; margin: 0; padding: 0; counter-reset: niche;
	display: grid; gap: .55rem; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.esch-niches li {
	counter-increment: niche;
	position: relative;
	padding: .65rem .9rem .65rem 3rem;
	background: var(--esch-bg);
	border: 1px solid var(--esch-border);
	border-radius: 0;
	font-size: .95rem;
}
.esch-niches li::before {
	content: counter(niche);
	position: absolute; left: .65rem; top: 50%; transform: translateY(-50%);
	width: 1.75rem; height: 1.75rem; border-radius: 50%;
	background: linear-gradient(135deg, var(--esch-red), var(--esch-pink));
	color: #fff; font-weight: 700; font-size: .82rem;
	display: flex; align-items: center; justify-content: center;
}
.esch-niches li:hover { border-color: rgba(255,61,110,.5); }
.esch-niches a { color: #fff; }
.esch-niches a:hover { color: var(--esch-pink); }

/* Kategorie-Liste mit Pfeil */
.esch-catlist { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.esch-catlist li { padding-left: 1.5rem; position: relative; }
.esch-catlist li::before { content: "→"; position: absolute; left: 0; color: var(--esch-pink); font-weight: 700; }
.esch-catlist a { color: #fff; }
.esch-catlist a:hover { color: var(--esch-pink); }

/* Schritt-Liste */
.esch-steps { margin: 0; padding-left: 1.3rem; display: grid; gap: .5rem; }
.esch-steps li::marker { color: var(--esch-pink); font-weight: 700; }

/* FAQ-Boxen */
.esch-faq { display: grid; gap: .9rem; }
.esch-faq .esch-q {
	background: var(--esch-bg);
	border: 1px solid var(--esch-border);
	border-radius: 0;
	padding: 1rem 1.2rem;
}
.esch-faq .esch-q h3 { margin: 0 0 .4rem; font-size: 1.08rem; }
.esch-faq .esch-q p { margin: 0; color: var(--esch-muted); }

/* ============================================================
   Globales Dark-Theme (überschreibt Kadence-Defaults robust)
   ============================================================ */
body,
#wrapper.site,
.content-bg.loop-entry,
.wp-site-blocks {
	background-color: var(--esch-bg) !important;
	color: var(--esch-text);
}

/* Boxen / Content-Wrapper transparent, damit Dark durchscheint */
.content-bg,
.content-container,
.entry-content-wrap,
.single-content,
.entry-content,
.hentry {
	background: transparent !important;
	box-shadow: none !important;
}

/* Header dunkel */
#masthead.site-header,
.site-header-row-container-inner,
.site-top-header-wrap .site-header-row-container-inner,
.site-main-header-wrap .site-header-row-container-inner {
	background-color: #0f0d14 !important;
	border-color: var(--esch-border) !important;
}
.site-branding .site-title,
.site-branding .site-title a { color: #fff !important; }
.site-branding .site-description { color: var(--esch-muted) !important; }

/* Berggipfel-Logo (Schweizer Fahne) vor dem Seitentitel */
.site-branding .site-title {
	display: inline-flex !important;
	align-items: center;
}
.site-branding .site-title::before {
	content: "";
	display: inline-block;
	width: 1.95em;
	height: 1.65em;
	margin-right: .5rem;
	flex: 0 0 auto;
	background: url("logo.svg") no-repeat center / contain;
}

/* Navigation */
.header-navigation .menu > li > a,
.header-navigation a { color: var(--esch-text) !important; }
.header-navigation .menu > li > a:hover,
.header-navigation .menu > li.current-menu-item > a { color: var(--esch-pink) !important; }

/* Footer dunkel */
#colophon.site-footer,
.site-footer-row-container-inner,
.site-middle-footer-wrap .site-footer-row-container-inner,
.site-bottom-footer-wrap .site-footer-row-container-inner {
	background-color: #0f0d14 !important;
	border-color: var(--esch-border) !important;
	color: var(--esch-muted) !important;
}
#colophon a, .site-footer a { color: var(--esch-muted) !important; }
#colophon a:hover, .site-footer a:hover { color: var(--esch-pink) !important; }

/* Überschriften & Links im Content */
.entry-content h1, .entry-content h2, .entry-content h3,
.entry-content h4, h1.entry-title, .page-title { color: #fff; }
.entry-content a { color: var(--esch-pink); }
.entry-content a:hover { color: #fff; }

/* Standard-Buttons im Schweizer-Rot */
.wp-block-button__link,
.button, button, input[type="submit"] {
	background-color: var(--esch-red) !important;
	border-color: var(--esch-red) !important;
	color: #fff !important;
}

/* Redundanten Kadence-Seitentitel auf der Startseite ausblenden (Hero ersetzt ihn) */
body.home .entry-hero-container,
body.home .entry-hero,
body.home header.entry-header,
body.page-id-7 .entry-hero-container {
	display: none !important;
}
/* Abstand Header -> erste Box (Hero) minimal halten */
body.home .content-container,
body.home .content-container.site-container-inner { padding-top: 0 !important; }
body.home #inner-wrap .content-container { margin-top: 0 !important; }
body.home .entry-content { margin-top: 0 !important; }
body.home .entry-content > .esch-hero:first-child { margin-top: 0; }
.esch-hero { margin-top: 0; }

/* ---------- Scroll-to-Top ---------- */
#esch-totop {
	position: fixed;
	right: 1.4rem;
	bottom: 1.4rem;
	z-index: 999;
	width: 2.9rem;
	height: 2.9rem;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	background: var(--esch-red);
	color: #fff;
	border: 1px solid rgba(255,255,255,.16);
	font-size: 1.35rem;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 8px 18px -6px rgba(0,0,0,.75);
	opacity: 0;
	visibility: hidden;
	transform: translateY(14px);
	transition: opacity .25s ease, transform .25s ease, visibility .25s ease, background .2s ease;
}
#esch-totop.show {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
#esch-totop:hover {
	background: var(--esch-pink);
	color: #fff;
}
@media (max-width: 480px) {
	#esch-totop { right: 1rem; bottom: 1rem; width: 2.6rem; height: 2.6rem; }
}

/* ---------- Responsive ---------- */
@media (max-width: 480px) {
	.esch-hero { padding: 3.2rem 1.1rem; }
}

/* Mobile/Tablet: 2-Zeilen-Clamp aufheben, damit Kachel-Text nicht abgeschnitten wird */
@media (max-width: 782px) {
	.esch-link-body p,
	.esch-card p {
		display: block;
		-webkit-line-clamp: unset;
		-webkit-box-orient: unset;
		min-height: 0;
		overflow: visible;
	}
}
