/*
 * Nacht – Überschreibungen für das Float-Theme
 * ------------------------------------------------------------
 * Wird nach style.css geladen. Alle Farben stehen oben als Variablen.
 * Nachtwald in Tiefblau mit Waldgrün-Petrol, Laubgelb und Bernstein-Laternenlicht, Mondlicht, warme Laternen-Akzente.
 * Der Beitrag bleibt eine helle "Mondlicht-Pergament"-Seite mit dunklem Text.
 * Der Kopfbereich ist bewusst neutral (Seitenfarbe).
 */

/* ---------- Schriften (lokal, OFL) ---------- */
@font-face {
	font-family: "Cinzel";
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url(fonts/cinzel-latin-wght-normal.woff2) format("woff2");
}
@font-face {
	font-family: "Cormorant Garamond";
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url(fonts/cormorant-garamond-latin-wght-normal.woff2) format("woff2");
}
@font-face {
	font-family: "Cormorant Garamond";
	font-style: italic;
	font-weight: 300 700;
	font-display: swap;
	src: url(fonts/cormorant-garamond-latin-wght-italic.woff2) format("woff2");
}
@font-face {
	font-family: "Source Serif 4";
	font-style: normal;
	font-weight: 200 900;
	font-display: swap;
	src: url(fonts/source-serif-4-latin-wght-normal.woff2) format("woff2");
}
@font-face {
	font-family: "Source Serif 4";
	font-style: italic;
	font-weight: 200 900;
	font-display: swap;
	src: url(fonts/source-serif-4-latin-wght-italic.woff2) format("woff2");
}
@font-face {
	font-family: "Hanken Grotesk";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url(fonts/hanken-grotesk-latin-wght-normal.woff2) format("woff2");
}

/* ---------- Palette ---------- */
:root {
	--m-night: #0a1129;        /* Seite (passt zu images/background-*.jpg) */
	--m-night-2: #12224a;      /* Kopf oben */
	--m-dusk: #1b3566;         /* Kopf unten, Violett */
	--m-moon: #e8eefc;         /* Mondlicht: Schrift im Kopf/Seitenleiste */
	--m-moon-soft: #a9b8d8;    /* gedämpft */
	--m-lantern: #ffb347;      /* Laternenlicht */
	--m-lantern-deep: #d9822b;
	--m-violet: #2a4f9c;       /* Links auf Pergament: Nachtblau (Customizer überschreibt) */
	--m-violet-deep: #1c3874;
	--m-mint: #8fb4ff;         /* kühler Mondschimmer */
	--m-teal: #1f7a6c;         /* Petrol-Akzent */
	--m-leaf: #c8e56e;         /* Laubgelb-Grün auf dunklem Grund */
	--m-ink: #131826;          /* Text auf Pergament: fast schwarz, kühl */
	--m-ink-soft: #566078;
	--m-parchment: #f6f3ec;    /* passt zum Ende von images/hentry.jpg */
	--m-rule: #d3d8e4;
	--m-head: "Cormorant Garamond", Georgia, "Times New Roman", serif;
	--m-display: "Cinzel", "Cormorant Garamond", Georgia, serif;
	--m-body: "Source Serif 4", Georgia, "Times New Roman", serif;
	--m-sans: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
}

/* ---------- Grundlagen ---------- */
html {
	background-color: var(--m-night);
	overflow-x: clip;
}

body {
	color: var(--m-ink);
	font-size: 1.0625rem;
	line-height: 1.65;
	overflow-x: clip;
}

/* Keine Gravatare bei Kommentaren */
.comments .avatar,
.vcard .avatar {
	display: none !important;
}

/* ---------- Kopfbereich: Nachtwald ---------- */
header {
	position: relative;
	isolation: isolate;
}

/* Kopf: neutral, ohne eigenen Hintergrund (zeigt die Seitenfarbe) */

/* Logo */
body.float-light header .logo .logo-text,
body.float-light header .logo a {
	font-family: var(--m-display);
	font-weight: 600;
	font-size: 1.7rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--m-moon);
	text-shadow: 0 0 18px rgba(143, 180, 255, 0.5), 0 1px 2px rgba(5, 5, 25, 0.6);
}

@media screen and (min-width: 800px) {
	header {
		padding: 2.5rem 0 2rem;
		margin-bottom: 1.5rem;
	}
	body.float-light header .float-nav .float-nav-ul > li > a,
	body.float-light header .float-nav .float-nav-ul > li > button {
		font-family: var(--m-display);
		font-weight: 500;
		font-size: 0.78rem;
		letter-spacing: 0.16em;
		color: var(--m-moon);
		text-shadow: 0 1px 2px rgba(5, 5, 25, 0.6);
	}
	body.float-light header .float-nav .float-nav-ul > li > a:hover,
	body.float-light header .float-nav .float-nav-ul > li > button:hover {
		color: var(--m-lantern);
		text-shadow: 0 0 12px rgba(242, 179, 94, 0.65);
	}
	.float-nav-ul > li:after {
		content: "✦";
		font-size: 0.55rem;
		color: var(--m-leaf);
		opacity: 0.9;
		text-shadow: 0 0 8px rgba(200, 229, 110, 0.65);
	}
	.float-nav-ul > li:last-child:after {
		content: "";
	}
	.float-nav-ul .sub-menu li a {
		background: #101c40;
		color: var(--m-moon);
		border-right: 0;
		border-bottom: 1px solid rgba(150, 180, 235, 0.2);
	}
	.float-nav-ul .sub-menu li a:hover {
		background: #1d2d63;
		color: var(--m-lantern);
	}
	.float-nav-ul > li > .sub-menu:after {
		border-bottom-color: #101c40;
	}
}

/* Mobile Navigation */
body.float-light .float-nav-toggle,
body.float-light .float-nav a,
body.float-light .float-nav button,
body.float-light .float-nav {
	background: #101c40;
	color: var(--m-moon);
}

body.float-light .float-nav-ul li {
	border-top-color: rgba(150, 180, 235, 0.2);
}

body.float-light .float-nav-toggle {
	border-radius: 3px;
	padding-left: 1rem;
	padding-right: 1rem;
	text-align: left;
}

body.float-light .float-nav-ul > li.menu-item-has-children > a:after,
body.float-light .float-nav-ul > li.menu-item-has-children > button:after {
	border-top-color: var(--m-moon);
}

@media screen and (max-width: 799px) {
	header {
		padding-bottom: 1.25rem;
		margin-bottom: 1.25rem;
	}
}

/* Navigation: gleiche Schrift auf Desktop und Handy */
body.float-light header .float-nav .float-nav-ul > li > a,
body.float-light header .float-nav .float-nav-ul > li > button {
	font-family: var(--m-display);
	font-weight: 500;
	font-size: 0.78rem;
	letter-spacing: 0.16em;
}

body.float-light header .float-nav-toggle {
	font-family: var(--m-display);
	font-size: 0.78rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

/* ---------- Überschriften ---------- */
h1, h2, h3, h4, h5, h6 {
	color: var(--m-ink);
}

h1, h2, h3,
.hentry h1, .hentry h2, .hentry h3 {
	font-family: var(--m-head);
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
}

h1 {
	font-size: 2.55rem;
	line-height: 1.08;
}

h2 { font-size: 1.8rem; line-height: 1.15; }
h3 { font-size: 1.4rem; line-height: 1.2; }

h1 a,
h2 a,
.main h1 a {
	color: var(--m-ink);
	font-weight: inherit;
}

.main h1 a:hover,
.main h2 a:hover {
	color: var(--m-violet);
}

/* ---------- Die Pergamentseite im Mondlicht ---------- */
.hentry {
	background-color: var(--m-parchment);   /* passt zum Ende von images/hentry.jpg */
	border: 1px solid rgba(150, 185, 245, 0.45);
	border-radius: 3px;
	box-shadow:
		0 0 0 1px rgba(10, 10, 40, 0.5),
		0 0 28px -4px rgba(90, 140, 240, 0.32),
		0 18px 34px -20px rgba(0, 0, 0, 0.75);
}

.hentry-header,
.hentry-header.hentry-header__archive {
	background-image: none;
}

.meta li {
	background: var(--m-parchment);
	color: var(--m-ink-soft);
}

.meta a {
	color: var(--m-ink-soft);
}

.meta a:hover {
	color: var(--m-violet);
}

@media screen and (min-width: 500px) {
	.meta li:after {
		content: " ✦";
		font-size: 0.6em;
		color: var(--m-teal);
	}
	.meta li:last-child:after {
		content: "";
	}
}

/* Textlinks im Beitrag */
.hentry p a,
.hentry li a,
.hentry td a {
	font-weight: inherit;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
	text-decoration-color: rgba(42, 79, 156, 0.45);
}

.hentry p a:hover,
.hentry li a:hover {
	text-decoration-color: currentColor;
}

/* Zitate */
blockquote {
	border-left: 2px solid var(--m-teal);
	padding-left: 1.25rem;
}

blockquote p {
	font-family: var(--m-head);
	font-style: italic;
	font-weight: 500;
	font-size: 1.45rem;
	line-height: 1.35;
	color: #2b3550;
}

/* Code */
pre {
	background: #e6e9f2;
	border: 1px dashed var(--m-rule);
	color: var(--m-ink);
	border-radius: 2px;
}

code, kbd {
	background: #e6e9f2;
	padding: 0 0.25em;
	border-radius: 2px;
}

/* Bildunterschriften */
.wp-caption-text,
.wp-element-caption,
figcaption {
	font-style: italic;
	color: var(--m-ink-soft);
}

/* Kommentare */
.comments {
	background: none;
	border-top: 1px dashed var(--m-rule);
	margin-top: 2.5rem;
}

.vcard cite {
	color: var(--m-ink);
	font-family: var(--m-head);
	font-weight: 700;
}

.vcard,
.comment-time,
.comment-reply-link {
	color: var(--m-ink-soft);
}

/* ---------- Schlagwörter ---------- */
.meta-tags a {
	color: #fff;
}

/* ---------- Seitenleiste: dunkles Glas im Wald ---------- */
aside {
	position: relative;
	color: var(--m-moon);
}

@media screen and (min-width: 500px) {
	body.float-light aside {
		background: rgba(10, 20, 52, 0.74);
		border: 1px solid rgba(130, 170, 240, 0.28);
		border-radius: 4px;
		box-shadow: 0 0 22px -6px rgba(70, 120, 230, 0.30), 0 16px 28px -18px rgba(0, 0, 0, 0.8);
	}
}

body.float-light aside,
body.float-light aside a {
	color: var(--m-moon);
}

body.float-light aside a {
	font-weight: 500;
	border-bottom: 1px dotted rgba(143, 180, 255, 0.55);
}

body.float-light aside a:hover {
	color: var(--m-lantern);
	text-shadow: 0 0 10px rgba(242, 179, 94, 0.55);
}

body.float-light aside h3 {
	font-family: var(--m-display);
	font-size: 0.8rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	color: var(--m-lantern);
	padding-bottom: 0.55rem;
	border-bottom: 1px solid rgba(242, 179, 94, 0.3);
}

.copyright,
body.float-light .copyright {
	color: var(--m-moon-soft);
}

body.float-light .copyright a {
	color: var(--m-moon);
}

/* ---------- Formulare, Buttons ---------- */
.main input[type="text"],
.main input[type="email"],
.main input[type="url"],
.main input[type="search"],
.main textarea {
	background-color: #edeff6;
	border-color: var(--m-rule);
	color: var(--m-ink);
}

aside input[type="search"],
aside input[type="text"] {
	background-color: rgba(5, 10, 32, 0.6);
	border-color: rgba(130, 170, 240, 0.35);
	color: var(--m-moon);
}

.main input:focus,
.main textarea:focus {
	background-color: #fafbff;
	border-color: var(--m-violet);
}

aside input:focus {
	border-color: var(--m-lantern);
}

.button,
#submit,
.wpcf7-submit,
button.button {
	background: var(--m-teal);
	color: #fff;
}

.button:hover,
#submit:hover,
.wpcf7-submit:hover {
	background: #175a50;
	color: #fff;
	box-shadow: 0 0 14px rgba(120, 230, 170, 0.4);
}

/* ---------- Seitennavigation (auf dunklem Grund) ---------- */
body.float-light .page-navi a,
body.float-light .navigation.pagination a.page-numbers,
body.float-light .page-numbers.current {
	background-color: rgba(130, 170, 240, 0.14);
	color: var(--m-moon);
}

body.float-light .page-navi a:hover,
body.float-light .navigation.pagination a.page-numbers:hover {
	background-color: rgba(242, 179, 94, 0.2);
	color: var(--m-lantern);
}

body.float-light .page-numbers.current {
	background-color: var(--m-lantern-deep);
	color: #1a1209;
}

/* Seitenleiste bündig mit der Oberkante der Beitragsbox */
@media screen and (min-width: 800px) {
	aside {
		margin-top: 10px;
	}
}

/* ---------- Widget "Nacht: Notiz" – kleine Pergamentkarte mit Laternenlicht ---------- */
aside .nacht-widget-note {
	background: var(--m-parchment);
	border: 1px solid rgba(242, 179, 94, 0.55);
	border-top: 3px solid var(--m-lantern);
	border-radius: 2px;
	padding: 1.1rem 1.25rem 1.2rem;
	box-shadow: 0 0 22px -4px rgba(242, 179, 94, 0.35), 0 12px 22px -16px rgba(0, 0, 0, 0.7);
	color: var(--m-ink);
}

body.float-light aside .nacht-widget-note h3 {
	margin: 0 0 0.6rem;
	padding: 0;
	border-bottom: 0;
	font-size: 0.74rem;
	letter-spacing: 0.18em;
	color: var(--m-lantern-deep);
}

aside .nacht-note-text {
	font-size: 0.9375rem;
	line-height: 1.6;
	color: var(--m-ink);
}

body.float-light aside .nacht-note-text a {
	color: var(--m-violet);
	border-bottom-color: rgba(42, 79, 156, 0.45);
}

body.float-light aside .nacht-note-text a:hover {
	color: var(--m-violet-deep);
	text-shadow: none;
}

aside .nacht-note-text p {
	margin: 0 0 0.75rem;
}

aside .nacht-note-text > :last-child {
	margin-bottom: 0;
}

/* ---------- Sans-Serif für Mikrotypografie ---------- */
.meta,
.meta li,
.meta a {
	font-family: var(--m-sans);
	font-weight: 500;
}

@media screen and (min-width: 650px) {
	.meta {
		font-size: 0.78rem;
		letter-spacing: 0.1em;
	}
}

.meta-tags a,
.meta-comments,
.comment-time,
.comment-reply-link,
.bypostauthor .comment-by-author {
	font-family: var(--m-sans);
}

.meta-tags a {
	font-weight: 500;
	letter-spacing: 0.1em;
}

.comment-time,
.comment-reply-link {
	font-weight: 500;
	font-size: 0.78rem;
	letter-spacing: 0.1em;
}

aside .tagcloud a,
.copyright,
body.float-light .copyright {
	font-family: var(--m-sans);
}

.button,
#submit,
.wpcf7-submit,
button.button,
.page-navi,
.navigation.pagination,
.comment-form label,
#respond label,
.main input,
.main textarea,
aside input[type="search"],
aside input[type="text"] {
	font-family: var(--m-sans);
}

.button,
#submit,
.wpcf7-submit,
button.button {
	font-weight: 600;
	letter-spacing: 0.06em;
}

.float-widget-latest-date,
.float-widget-latest-comments {
	font-family: var(--m-sans);
	font-weight: 500;
	font-size: 0.78rem;
	letter-spacing: 0.06em;
	color: var(--m-moon-soft);
}

/* ---------- Abstand zwischen Titelbereich und Text ---------- */
.hentry-header:not(.hentry-header__archive) {
	padding-bottom: 1.5rem;
	margin-bottom: 0.5rem;
}

.hentry-header:not(.hentry-header__archive) ~ .featured-image {
	margin-top: -0.5rem;
}

/* ---------- Goldrahmen: eine Haarlinie, in den Ecken je ein kleiner Kringel innen ---------- */
.hentry::before,
body.float-light aside::before {
	content: "";
	position: absolute;
	inset: 8px;
	z-index: 3;
	pointer-events: none;
	border: 1px solid rgba(201, 146, 58, 0.5);
	background:
		url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2228%22 height=%2228%22 viewBox=%220 0 28 28%22%3E%3Cg transform=%22translate%280 0%29 scale%281,1%29%22 fill=%22none%22 stroke=%22%23d4a04a%22 stroke-width=%221.15%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M3 15 C3 8 8 3 15 3%22/%3E%3Cpath d=%22M8 17 C8 12 12 8 17 8 C20.5 8 22 11 20 13 C18.5 14.5 16 13.5 16.5 11.5%22/%3E%3Ccircle cx=%223%22 cy=%223%22 r=%221.6%22 fill=%22%23d4a04a%22 stroke=%22none%22/%3E%3C/g%3E%3C/svg%3E") left 6px top 6px / 28px 28px no-repeat,
		url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2228%22 height=%2228%22 viewBox=%220 0 28 28%22%3E%3Cg transform=%22translate%2828 0%29 scale%28-1,1%29%22 fill=%22none%22 stroke=%22%23d4a04a%22 stroke-width=%221.15%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M3 15 C3 8 8 3 15 3%22/%3E%3Cpath d=%22M8 17 C8 12 12 8 17 8 C20.5 8 22 11 20 13 C18.5 14.5 16 13.5 16.5 11.5%22/%3E%3Ccircle cx=%223%22 cy=%223%22 r=%221.6%22 fill=%22%23d4a04a%22 stroke=%22none%22/%3E%3C/g%3E%3C/svg%3E") right 6px top 6px / 28px 28px no-repeat,
		url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2228%22 height=%2228%22 viewBox=%220 0 28 28%22%3E%3Cg transform=%22translate%280 28%29 scale%281,-1%29%22 fill=%22none%22 stroke=%22%23d4a04a%22 stroke-width=%221.15%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M3 15 C3 8 8 3 15 3%22/%3E%3Cpath d=%22M8 17 C8 12 12 8 17 8 C20.5 8 22 11 20 13 C18.5 14.5 16 13.5 16.5 11.5%22/%3E%3Ccircle cx=%223%22 cy=%223%22 r=%221.6%22 fill=%22%23d4a04a%22 stroke=%22none%22/%3E%3C/g%3E%3C/svg%3E") left 6px bottom 6px / 28px 28px no-repeat,
		url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2228%22 height=%2228%22 viewBox=%220 0 28 28%22%3E%3Cg transform=%22translate%2828 28%29 scale%28-1,-1%29%22 fill=%22none%22 stroke=%22%23d4a04a%22 stroke-width=%221.15%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M3 15 C3 8 8 3 15 3%22/%3E%3Cpath d=%22M8 17 C8 12 12 8 17 8 C20.5 8 22 11 20 13 C18.5 14.5 16 13.5 16.5 11.5%22/%3E%3Ccircle cx=%223%22 cy=%223%22 r=%221.6%22 fill=%22%23d4a04a%22 stroke=%22none%22/%3E%3C/g%3E%3C/svg%3E") right 6px bottom 6px / 28px 28px no-repeat;
}

@media screen and (max-width: 499px) {
	.hentry::before {
		inset: 5px;
	}
}

body.float-light aside::before {
	inset: 6px;
	border-color: rgba(242, 179, 94, 0.38);
}

/* ---------- Hintergrund: einfarbig Nachtblau mit feiner, diffuser Körnung ---------- */
html {
	background-color: var(--m-night);
	background-image: url(images/background-1.jpg);
	background-repeat: repeat;
	background-position: 0 0;
	min-height: 100%;
}

body,
body.custom-background {
	background: transparent !important;
}


/* ---------- Suchfeld in der dunklen Seitenleiste (klassisches Widget und Such-Block) ---------- */
body.float-light aside .searchform,
body.float-light aside .wp-block-search__inside-wrapper {
	background: rgba(5, 10, 32, 0.55);
	border: 1px solid rgba(143, 180, 255, 0.4);
	border-radius: 3px;
}

body.float-light aside .searchform input.s,
body.float-light aside .wp-block-search__input,
body.float-light aside input[type="search"],
body.float-light aside input[type="text"] {
	background: transparent;
	border: 0;
	color: var(--m-moon);
}

body.float-light aside input::placeholder,
body.float-light aside input.s::placeholder,
body.float-light aside .wp-block-search__input::placeholder {
	color: var(--m-moon-soft);
	opacity: 1;
}

body.float-light aside input.s::-webkit-input-placeholder,
body.float-light aside .wp-block-search__input::-webkit-input-placeholder {
	color: var(--m-moon-soft);
}

body.float-light aside .searchsubmit .float-svg-icon,
body.float-light aside .wp-block-search__button svg {
	fill: var(--m-lantern);
	color: var(--m-lantern);
}

body.float-light aside .wp-block-search__button {
	background: transparent;
	border: 0;
	color: var(--m-lantern);
}

body.float-light aside .searchform:focus-within,
body.float-light aside .wp-block-search__inside-wrapper:focus-within {
	border-color: var(--m-lantern);
	box-shadow: 0 0 12px rgba(242, 179, 94, 0.35);
}

body.float-light aside .widget_search .searchsubmit .float-svg-icon,
body.float-light aside .searchsubmit .float-svg-icon {
	fill: var(--m-lantern) !important;
}

/* ---------- Materialcharakter: Leinen im Hintergrund, Papierstapel, Filz-/Lederpaneel ---------- */

/* Beitragsseiten: liegen wie Blätter auf dem Stoff – feine Papierkanten und ein Kontaktschatten */
.hentry {
	border-color: rgba(120, 130, 160, 0.55);
	box-shadow:
		0 1px 0 #d9d5c9,
		0 2px 0 #c9c4b6,
		0 3px 0 rgba(0, 0, 0, 0.35),
		0 16px 22px -10px rgba(0, 0, 0, 0.75),
		0 0 26px -6px rgba(110, 160, 235, 0.28);
}

/* Seitenleiste: gepolstertes Paneel aus dunklem Grund mit Innenschatten und feiner Kante */
@media screen and (min-width: 500px) {
	body.float-light aside {
		background:
			linear-gradient(rgba(8, 18, 46, 0.80), rgba(6, 14, 36, 0.86)),
			url(images/background-1.jpg) repeat;
		border: 1px solid rgba(150, 175, 230, 0.35);
		box-shadow:
			inset 0 1px 0 rgba(255, 255, 255, 0.07),
			inset 0 0 36px rgba(0, 0, 0, 0.45),
			0 1px 0 rgba(0, 0, 0, 0.5),
			0 16px 24px -10px rgba(0, 0, 0, 0.8);
	}
}

/* Notiz-Widget: aufgeklebter Zettel mit leichtem Schatten */
aside .nacht-widget-note {
	box-shadow:
		0 1px 0 #c9c4b6,
		0 2px 0 rgba(0, 0, 0, 0.3),
		0 10px 16px -6px rgba(0, 0, 0, 0.65),
		0 0 18px -4px rgba(242, 179, 94, 0.30);
}

/* Eingabefelder wirken eingelassen */
body.float-light aside .searchform,
body.float-light aside .wp-block-search__inside-wrapper {
	box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.55), 0 1px 0 rgba(150, 175, 230, 0.18);
}

/* Schlagwort-Etiketten und Blase: etwas Tiefe */
/* Kommentar-Blase: etwas Tiefe (die Schlagwort-Etiketten haben eine Pfeilspitze und bleiben flach) */
.meta-comments {
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}