/*
Theme Name: Rothwild
Theme URI: https://rothwild.de
Description: Kadence Child Theme für Rothwild Immobilien (Sophie & Florian Hirschmann), Düren. Markenstil: tiefes Waldgrün, Bordeaux, Gold und Cremeweiß, kombiniert mit Halant (Headlines) und Nunito Sans (Fließtext).
Author: Rothwild Immobilien
Author URI: https://rothwild.de
Template: kadence
Version: 1.0.0
Text Domain: rothwild
*/

/* ==========================================================================
   1. Markenfarben & Variablen
   ========================================================================== */
:root {
	--rw-waldgruen: #1C2B1A;
	--rw-waldgruen-dunkel: #141F13;
	--rw-bordeaux: #6B3A2A;
	--rw-gold: #8B6914;
	--rw-warmbraun: #4A3728;
	--rw-creme: #F5F0E8;
	--rw-hellcreme: #FAF7F2;
	--rw-textgrau: #888880;
	--rw-weiss: #FFFFFF;

	--rw-font-heading: "Halant", Georgia, serif;
	--rw-font-body: "Nunito Sans", -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ==========================================================================
   2. Grundlagen
   ========================================================================== */
html {
	scroll-behavior: smooth;
}

body {
	background-color: var(--rw-creme);
	color: var(--rw-waldgruen);
	font-family: var(--rw-font-body);
	font-weight: 400;
	font-size: 17px;
	line-height: 1.8;
	-webkit-font-smoothing: antialiased;
}

a {
	color: var(--rw-bordeaux);
	transition: color 0.25s ease;
}

a:hover {
	color: var(--rw-gold);
}

::selection {
	background: var(--rw-gold);
	color: var(--rw-weiss);
}

/* ==========================================================================
   3. Typografie
   ========================================================================== */
h1, h2 {
	font-family: var(--rw-font-heading);
	font-weight: 700;
	color: var(--rw-waldgruen);
	line-height: 1.15;
}

h3 {
	font-family: var(--rw-font-heading);
	font-weight: 600;
	color: var(--rw-bordeaux);
	line-height: 1.25;
}

h4 {
	font-family: var(--rw-font-body);
	font-weight: 600;
	color: var(--rw-warmbraun);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 15px;
}

h5, h6 {
	font-family: var(--rw-font-body);
	font-weight: 600;
	color: var(--rw-warmbraun);
}

p, li, .entry-content {
	font-family: var(--rw-font-body);
	font-weight: 400;
	font-size: 17px;
	line-height: 1.8;
}

.rw-claim,
.rw-quote {
	font-family: var(--rw-font-heading);
	font-weight: 500;
	font-style: italic;
}

@media (max-width: 980px) {
	h1 { font-size: 90%; }
	h2 { font-size: 90%; }
	h3 { font-size: 90%; }
	body { font-size: 15.5px; }
	.rw-section { padding-top: 60px !important; padding-bottom: 60px !important; }
}

@media (max-width: 767px) {
	h1 { font-size: 80%; }
	h2 { font-size: 80%; }
	h3 { font-size: 80%; }
	body { font-size: 14.5px; }
	.rw-section { padding-top: 40px !important; padding-bottom: 40px !important; }
}

/* ==========================================================================
   4. Navigation / Header
   ========================================================================== */
.site-header,
.kadence-sticky-header {
	background-color: var(--rw-creme) !important;
}

.site-header.is-sticky,
.site-header.sticky-shrink {
	box-shadow: 0 2px 12px rgba(28, 43, 26, 0.12);
}

.main-navigation ul li a,
.menu-toggle-open,
#menu-toggle-primary {
	font-family: var(--rw-font-body);
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--rw-waldgruen) !important;
}

.main-navigation ul li a:hover,
.main-navigation ul li.current-menu-item > a {
	color: var(--rw-bordeaux) !important;
}

.site-title,
.site-title a,
.site-branding .site-title {
	font-family: var(--rw-font-heading) !important;
	font-weight: 700;
	font-style: italic;
	color: var(--rw-waldgruen) !important;
	letter-spacing: 0.01em;
}

.site-description {
	font-family: var(--rw-font-body);
	font-size: 12px;
	color: var(--rw-bordeaux);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

/* ==========================================================================
   5. Hero
   ========================================================================== */
.rw-hero {
	background-color: var(--rw-waldgruen);
	min-height: 85vh;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: relative;
	background-size: cover;
	background-position: center;
}

.rw-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(28, 43, 26, 0.6);
}

.rw-hero-inner {
	position: relative;
	z-index: 2;
	max-width: 900px;
	margin: 0 auto;
	padding: 0 24px;
}

.rw-hero h1 {
	font-family: var(--rw-font-heading);
	font-weight: 700;
	font-style: italic;
	color: var(--rw-creme);
	font-size: clamp(2.4rem, 6vw, 4.5rem);
	margin-bottom: 0.4em;
}

.rw-hero .rw-hero-subtitle {
	font-family: var(--rw-font-heading);
	font-weight: 500;
	font-style: italic;
	color: var(--rw-creme);
	opacity: 0.9;
	font-size: clamp(1.1rem, 2vw, 1.5rem);
	margin-bottom: 0.6em;
}

.rw-hero p {
	color: var(--rw-creme);
}

.rw-hero-small {
	min-height: 50vh;
}

/* ==========================================================================
   6. Buttons
   ========================================================================== */
.wp-block-button .wp-block-button__link,
.rw-btn {
	font-family: var(--rw-font-body) !important;
	font-weight: 600 !important;
	font-size: 13px !important;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	padding: 14px 28px !important;
	border-radius: 3px !important;
	background-color: var(--rw-bordeaux);
	color: var(--rw-creme) !important;
	border: none;
	transition: all 0.3s ease;
}

.wp-block-button .wp-block-button__link:hover,
.rw-btn:hover {
	background-color: var(--rw-waldgruen);
	color: var(--rw-creme) !important;
}

.wp-block-button.is-style-rw-ghost .wp-block-button__link,
.rw-btn-ghost {
	background-color: transparent;
	border: 1px solid var(--rw-creme);
	color: var(--rw-creme) !important;
}

.wp-block-button.is-style-rw-ghost .wp-block-button__link:hover,
.rw-btn-ghost:hover {
	background-color: var(--rw-creme);
	color: var(--rw-waldgruen) !important;
}

.wp-block-button.is-style-rw-gold .wp-block-button__link,
.rw-btn-gold {
	background-color: var(--rw-gold);
	color: var(--rw-waldgruen) !important;
}

.wp-block-button.is-style-rw-gold .wp-block-button__link:hover,
.rw-btn-gold:hover {
	background-color: var(--rw-waldgruen-dunkel);
	color: var(--rw-creme) !important;
}

/* ==========================================================================
   7. Karten
   ========================================================================== */
.rw-card {
	background-color: var(--rw-weiss);
	border-bottom: 3px solid var(--rw-bordeaux);
	padding: 32px 28px;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
	height: 100%;
}

.rw-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 28px rgba(28, 43, 26, 0.14);
}

.rw-card h3 {
	margin-top: 0;
}

/* ==========================================================================
   8. Sections / Helpers
   ========================================================================== */
.rw-section {
	padding-top: 90px;
	padding-bottom: 90px;
}

.rw-bg-waldgruen { background-color: var(--rw-waldgruen); }
.rw-bg-bordeaux { background-color: var(--rw-bordeaux); }
.rw-bg-creme { background-color: var(--rw-creme); }
.rw-bg-hellcreme { background-color: var(--rw-hellcreme); }
.rw-bg-gold { background-color: var(--rw-gold); }

.rw-text-creme, .rw-text-creme h1, .rw-text-creme h2, .rw-text-creme h3, .rw-text-creme p {
	color: var(--rw-creme) !important;
}

.rw-divider {
	width: 60px;
	height: 3px;
	background-color: var(--rw-gold);
	border: none;
	margin: 16px 0 28px;
}

.rw-divider.is-centered {
	margin: 16px auto 28px;
}

.rw-meta {
	color: var(--rw-textgrau);
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.rw-check-list {
	list-style: none;
	padding-left: 0;
}

.rw-check-list li {
	padding-left: 28px;
	position: relative;
	margin-bottom: 10px;
}

.rw-check-list li::before {
	content: "✓";
	color: var(--rw-bordeaux);
	font-weight: 700;
	position: absolute;
	left: 0;
}

.rw-stat-number {
	font-family: var(--rw-font-heading);
	font-weight: 700;
	font-size: 3rem;
	color: var(--rw-creme);
	display: block;
}

.rw-stat-label {
	font-family: var(--rw-font-body);
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--rw-gold);
}

/* Native accordion (wp:details) for FAQ */
.rw-faq details {
	border-bottom: 1px solid rgba(28, 43, 26, 0.15);
	padding: 18px 0;
}

.rw-faq summary {
	font-family: var(--rw-font-heading);
	font-weight: 600;
	color: var(--rw-bordeaux);
	font-size: 19px;
	cursor: pointer;
}

.rw-faq details p {
	margin-top: 12px;
	color: var(--rw-warmbraun);
}

/* ==========================================================================
   9. Footer
   ========================================================================== */
.site-footer,
footer.site-footer,
.footer-widgets {
	background-color: var(--rw-waldgruen) !important;
	color: var(--rw-creme);
}

.site-footer a,
.footer-widgets a {
	color: var(--rw-gold);
}

.site-footer a:hover,
.footer-widgets a:hover {
	color: var(--rw-creme);
}

.site-footer h4,
.footer-widgets h4,
.site-footer .widget-title,
.footer-widgets .widget-title {
	color: var(--rw-creme);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 14px;
}

.rw-footer-bottom {
	background-color: var(--rw-waldgruen-dunkel);
	color: var(--rw-creme);
	font-size: 13px;
	padding: 18px 0;
}

.rw-footer-bottom a {
	color: var(--rw-creme);
}

/* ==========================================================================
   10. Layout / Container
   ========================================================================== */
.wp-block-group,
.entry-content {
	max-width: 100%;
}

.rw-container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 24px;
}
