/*
Theme Name: Raijanholvi
Theme URI: https://raijanholvi.fi
Author: Raijanholvi
Author URI: https://raijanholvi.fi
Description: Raijanholvin oma, kevyt lohkoteema (FSE). Korvaa Divi 4 -pohjaisen sivuston. Sisältää natiivin kieliparituksen (FI/EN), oman SEO/GEO-paneelin, evästesuostumuksen, reCAPTCHA v3 -suojauksen, uutiskirjejärjestelmän, lahjakorttisysteemin, web push -ilmoitukset ja lounaslistan PDF-latauksen. Ei riipu WPML:stä, Yoastista tai maksullisista lisäosista (paitsi Paytrail-maksut).
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 8.0
Version: 1.9.72
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: raijanholvi
Tags: food-and-drink, full-site-editing, block-patterns, custom-colors, editor-style, translation-ready

Raijanholvi WordPress-teema. Kaikki oikeudet Raijanholville.
*/

/*
Tämä tiedosto on WordPressin teemastandardin vaatima "header"-tiedosto.
Kaikki todellinen ulkoasu tulee theme.json:sta, lohkomalleista (templates/parts)
ja alla olevista pienistä täydentävistä säännöistä, joita ei voi ilmaista
theme.json:n kautta (esim. WooCommerce-yhteensopivuus, tulostustyylit,
saavutettavuusapuluokat).
*/

/* Ruudunlukija-teksti (WP-standardi) */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.skip-link {
	background: var(--wp--preset--color--surface-dark, #2B1D14);
	color: #fff;
	left: 8px;
	padding: 10px 16px;
	position: fixed;
	top: -60px;
	transition: top .15s ease-in-out;
	z-index: 100000;
	border-radius: 0 0 6px 6px;
}

.skip-link:focus {
	top: 0;
}

/* Fokusrenkaat kaikkialle - saavutettavuus */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 3px solid var(--wp--preset--color--accent-green, #1f9900);
	outline-offset: 2px;
}

@media print {
	.site-header, .site-footer, .rh-exception-banner, .rh-cookie-banner, .rh-push-badge, .rh-recaptcha-badge, nav {
		display: none !important;
	}
}

/* =========================================================
   RAVINTOLAMAINEN ULKOASU
   Tässä osiossa kaikki se, mitä theme.json ei voi ilmaista:
   asettelut, taustatekstuurit ja pienet "trattoria-tunnelman"
   yksityiskohdat, jotka erottavat sivuston geneerisistä
   ravintolapohjista.
   ========================================================= */

body {
	background-color: var(--wp--preset--color--cream);
	background-image:
		radial-gradient(rgba(112,72,48,.035) 1px, transparent 1px);
	background-size: 3px 3px;
}

/* --- Yläpalkki: osoite/puhelin/aukiolo + kieli + avoinna-tila --- */
.rh-topbar {
	background: var(--wp--preset--color--surface-dark);
	color: #EFE7DD;
	padding: 8px 5%;
	font-size: 0.85rem;
	flex-wrap: wrap;
	gap: 8px 20px;
}
.rh-topbar a { color: #EFE7DD; }
.rh-topbar-right { gap: 16px; align-items: center; }

.rh-open-status {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-weight: 600;
	font-size: 0.82rem;
}
.rh-status-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #8a8a8a;
	display: inline-block;
}
.rh-status-open .rh-status-dot { background: var(--wp--preset--color--accent-green); box-shadow: 0 0 0 3px rgba(31,153,0,.25); }
.rh-status-closed .rh-status-dot { background: #C0392B; }

.rh-lang-switch {
	border: 1px solid rgba(255,255,255,.35);
	border-radius: 999px;
	padding: 2px 12px;
	font-size: 0.78rem;
	text-decoration: none;
}

/* --- Poikkeustiedote (yksityistilaisuuden vuoksi muuttunut aukiolo) --- */
.rh-exception-banner {
	background: var(--wp--preset--color--amber-tint);
	border-top: 1px solid var(--wp--preset--color--amber);
	border-bottom: 1px solid var(--wp--preset--color--amber);
	color: #6b3a0f;
	padding: 10px 5%;
	text-align: center;
	font-weight: 600;
	font-size: 0.92rem;
}
.rh-exception-banner .ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--wp--preset--color--amber);
	color: #fff;
	margin-right: 8px;
	font-weight: 800;
}

/* --- Päätunniste: logo + valikko ---
   Kolme "saraketta" (grid, ei enää flex+order): vasen tyhjä tila, keskellä
   AINA VAAKAKESKITETTY logo+hampurilaispainike-ryhmä (.rh-brand-cluster),
   oikealla loput toimintopainikkeet. 1fr/auto/1fr-jako pitää keskiryhmän
   keskellä riippumatta siitä kuinka leveä oikean puolen sisältö on -
   ilman tätä pelkkä flex+order ei riitä oikeaan keskitykseen, koska oikea
   puoli veisi keskiryhmän mukanaan sivuun. */
.site-header {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	padding: 18px 5%;
	align-items: center;
	column-gap: 16px;
	row-gap: 16px;
	border-bottom: 3px solid var(--wp--preset--color--brown);
	background: var(--wp--preset--color--paper);
}
.wp-block-site-logo img { max-height: 52px; width: auto; }
.rh-header-actions { grid-column: 3; justify-self: end; }

/* Logo + hampurilaispainike samassa ryhmässä, keskisarakkeessa. */
.rh-brand-cluster {
	grid-column: 2;
	justify-self: center;
	display: flex;
	align-items: center;
	gap: 16px;
}

/* Headerin käsialalogo (assets/images/logo-wordmark.png) - korvaa
   Mukauta-sivun "Sivuston logo" -asetuksesta riippuvan wp:site-logo-lohkon
   headerissa (footerissa käytetään sitä yhä ennallaan). */
.rh-brand-logo {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	transition: opacity .2s ease, transform .2s ease;
}
.rh-brand-logo img {
	display: block;
	max-height: 52px;
	width: auto;
	filter: drop-shadow(0 2px 4px rgba(58, 33, 22, .18));
}
.rh-brand-logo:hover,
.rh-brand-logo:focus-visible {
	opacity: .85;
	transform: translateY(-1px);
}

/* --- Päävalikko: uniikki hampurilaisvalikko KAIKILLA laitteilla ---
   Koko päävalikko on aina piilossa hampurilaispainikkeen takana - myös
   työpöydällä - ja avautuu samana pudotuspaneelina joka koossa. Tämä on
   tietoinen, yhtenäinen ratkaisu (ei "työpöydällä auki, mobiilissa
   piilossa" -oletusmalli): sivusto on tunnistettavasti Raijanholvin oma,
   ei minkään valmiin teemapohjan oletusvalikko. Alavalikot ovat AINA
   pystysuunnassa allekkain haitarina (klikkaa auki, klikkaa uudestaan
   siirtyäksesi sivulle) - ei koskaan hoverilla avautuvaa, kosketus-
   näytöllä toimimatonta pudotusvalikkoa. */
.site-header { position: relative; }

.rh-nav-toggle {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 44px;
	height: 44px;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	padding: 0;
	flex-shrink: 0;
}
.rh-nav-toggle span {
	display: block;
	width: 20px;
	height: 2px;
	margin: 0 auto;
	background: var(--wp--preset--color--brown-deep);
	border-radius: 2px;
	transition: transform .2s ease, opacity .2s ease;
	pointer-events: none;
}
.rh-nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.rh-nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.rh-nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Valikko itse: piilossa oletuksena, aukeaa koko levyisenä paneelina
   headerin alle - kaikilla näyttökoilla, ei vain mobiilissa. */
.rh-nav {
	display: none;
	width: 100%;
	order: 5;
}
.rh-nav.is-open-mobile {
	display: block;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	background: #fff;
	border-top: 3px solid var(--wp--preset--color--accent-green);
	box-shadow: var(--wp--preset--shadow--menu-card);
	max-height: 80vh;
	overflow-y: auto;
	z-index: 40;
}
.rh-nav ul {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 8px 0;
}
.rh-nav li { position: relative; }

.rh-nav > ul > li > a {
	position: relative;
	text-decoration: none;
	color: var(--wp--preset--color--brown-deep);
	font-weight: 600;
	font-size: 1rem;
	padding: 13px 6% 13px 5%;
	width: 100%;
	display: block;
	border-bottom: 1px solid var(--wp--preset--color--line);
}
.rh-nav > ul > li:last-child > a { border-bottom: none; }
.rh-nav > ul > li > a:hover,
.rh-nav > ul > li > a:focus-visible {
	color: var(--wp--preset--color--accent-green-deep);
	background: var(--wp--preset--color--accent-green-tint);
}

.rh-nav li.menu-item-has-children > a {
	padding-right: 34px;
}
.rh-nav li.menu-item-has-children > a::before {
	content: "";
	position: absolute;
	right: 6%;
	top: 50%;
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-65%) rotate(45deg);
	opacity: .6;
	transition: transform .18s ease;
	pointer-events: none;
}
/* Nuoli kääntyy ylöspäin, kun alavalikko on auki - selkeä visuaalinen vihje. */
.rh-nav li.menu-item-has-children.is-open > a::before {
	transform: translateY(-35%) rotate(-135deg);
}

/* Alavalikot AINA pystysuunnassa allekkain - ei koskaan samalla rivillä,
   vaikka teksti olisi lyhyt. Avautuvat/sulkeutuvat haitarina klikkauksesta
   (nav-toggle.js), toimien identtisesti kosketuksella ja hiirellä. */
.rh-nav .sub-menu {
	display: none;
	flex-direction: column;
	position: static;
	box-shadow: none;
	border: none;
	border-radius: 0;
	background: var(--wp--preset--color--brown-tint);
	padding: 4px 0;
	min-width: 0;
}
.rh-nav li.menu-item-has-children.is-open > .sub-menu { display: flex; }
.rh-nav .sub-menu li { width: 100%; }
.rh-nav .sub-menu a {
	display: block;
	padding: 11px 8% 11px 9%;
	font-size: .92rem;
	font-weight: 500;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	border-left: 3px solid transparent;
}
.rh-nav .sub-menu a:hover,
.rh-nav .sub-menu a:focus-visible {
	background: var(--wp--preset--color--accent-green-tint);
	border-left-color: var(--wp--preset--color--accent-green);
	color: var(--wp--preset--color--accent-green-deep);
}

/* Yläosan toimintopainikkeet: sama leveys, korkeus ja tekstityyli, AINA
   samalla rivillä. HUOM: grid-auto-flow: column + grid-auto-columns: 1fr
   (ei kiinteää repeat(2, 1fr):ää eikä auto-fit/minmax:ia, joka rivittäisi
   napit allekkain jos tila on niukka) - näin napit pysyvät samalla rivillä
   ja saman levyisinä riippumatta siitä onko niitä kaksi vai kolme, koska
   valinnainen buffet-painike ([rh_buffet_button]) ilmestyy joukkoon vasta
   kun se on otettu käyttöön asetuksista. */
.rh-header-actions {
	display: grid !important;
	grid-auto-flow: column;
	grid-auto-columns: 1fr;
	flex-shrink: 0;
	align-items: center;
	gap: 10px;
}
.rh-header-actions > .rh-hours-popover-wrap,
.rh-header-actions > .rh-buffet-popover-wrap,
.rh-header-actions > .wp-block-buttons {
	flex: 1 1 0;
	margin: 0 !important;
	padding: 0;
}
.rh-header-actions .wp-block-buttons,
.rh-header-actions .wp-block-button {
	display: flex;
	align-items: center;
	width: 100%;
	margin: 0 !important;
	padding: 0;
}
.rh-header-actions .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	font-weight: 600 !important;
	line-height: 1.6 !important;
	padding: 0.85rem 1.7rem !important;
	border: 0 !important;
	border-radius: 999px !important;
	text-decoration: none;
	white-space: nowrap;
}

/* Aukioloajat- ja Buffet-painikkeet avaavat saman tyyppisen ponnahduspaneelin. */
.rh-hours-popover-wrap,
.rh-buffet-popover-wrap { position: relative; }
/* Shortcodejen wpautop-kappaleet eivät saa viedä tilaa painikerivissä. */
.rh-header-actions > p:empty,
.rh-header-actions > p:has(> script:only-child),
.rh-header-actions .rh-hours-popover-wrap > p:empty,
.rh-header-actions .rh-buffet-popover-wrap > p:empty {
	display: none !important;
}
.rh-hours-toggle,
.rh-buffet-toggle {
	background: var(--wp--preset--color--accent-green) !important;
	color: #fff !important;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}
.rh-header-actions .rh-hours-toggle,
.rh-header-actions .rh-buffet-toggle {
	padding-top: 0.85rem !important;
	padding-bottom: 0.85rem !important;
}
.rh-hours-toggle::-moz-focus-inner,
.rh-buffet-toggle::-moz-focus-inner { border: 0; padding: 0; }
.rh-hours-toggle:hover,
.rh-buffet-toggle:hover {
	background: var(--wp--preset--color--accent-green-deep) !important;
}
.rh-hours-toggle[aria-expanded="true"],
.rh-buffet-toggle[aria-expanded="true"] {
	background: var(--wp--preset--color--accent-green-deep) !important;
	color: #fff !important;
}
.rh-hours-panel {
	/* HUOM: ankkuroitu VASEMPAAN (ei oikeaan) reunaan, koska Aukioloajat-nappi
	   on headerin toimintopainikkeista VASEMMANPUOLEISIN ja sijaitsee siksi
	   lähellä sivun vasenta reunaa - "right:0" venytti paneelin vasemmalle
	   päin ja se leikkautui näytön ulkopuolelle (teksti "Maanantai" jne.
	   näkyi katkaistuna "anantai":na). Vasemmalle ankkurointi jättää tilaa
	   oikealle, missä sitä oikeasti on. */
	position: absolute;
	top: calc(100% + 10px);
	left: 0;
	z-index: 100;
	min-width: 240px;
	max-width: calc(100vw - 32px);
	background: #fff;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 12px;
	box-shadow: var(--wp--preset--shadow--menu-card, 0 8px 28px rgba(0,0,0,.14));
	padding: 14px 18px;
}
.rh-hours-table { width: 100%; border-collapse: collapse; }
.rh-hours-table th, .rh-hours-table td {
	text-align: left;
	padding: 5px 0;
	font-size: .88rem;
	font-weight: 400;
	white-space: nowrap;
}
.rh-hours-table th { padding-right: 16px; color: var(--wp--preset--color--brown-deep); font-weight: 600; }
.rh-hours-table tr.rh-hours-today th,
.rh-hours-table tr.rh-hours-today td { color: var(--wp--preset--color--accent-green-deep); font-weight: 700; }

.rh-buffet-panel {
	/* Ankkuroitu OIKEAAN reunaan (toisin kuin Aukioloajat-paneeli), koska
	   Buffet-nappi on headerin toimintopainikkeista OIKEANPUOLEISIN
	   (viimeisenä "Ota yhteyttä" -napin jälkeen) - "left:0" venyttäisi
	   paneelin oikealle päin ja se leikkautuisi näytön ulkopuolelle. */
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	z-index: 100;
	min-width: 240px;
	max-width: calc(100vw - 32px);
	background: #fff;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 12px;
	box-shadow: var(--wp--preset--shadow--menu-card, 0 8px 28px rgba(0,0,0,.14));
	padding: 14px 18px;
}
.rh-buffet-panel h4 { margin: 0 0 4px; color: var(--wp--preset--color--brown-deep); }
.rh-buffet-subtitle { margin: 0 0 10px; font-size: .85rem; color: var(--wp--preset--color--ink-soft); }
.rh-buffet-items { list-style: none; margin: 0; padding: 0; }
.rh-buffet-items li {
	padding: 5px 0;
	font-size: .88rem;
	border-bottom: 1px dashed var(--wp--preset--color--line);
}
.rh-buffet-items li:last-child { border-bottom: 0; }
.rh-buffet-price { margin: 10px 0 0; font-weight: 700; color: var(--wp--preset--color--amber); text-align: right; }

/* --- Päivän lounas -palkki: musta "menutaulu" --- */
.rh-menu-strip {
	background: var(--wp--preset--gradient--menu-board);
	color: #F6EFE6;
	padding: 12px 5%;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 24px;
	font-family: var(--wp--preset--font-family--display);
}
.rh-menu-strip-label {
	font-weight: 700;
	color: var(--wp--preset--color--amber-tint);
	text-transform: uppercase;
	letter-spacing: .05em;
	font-size: 0.85rem;
	font-family: var(--wp--preset--font-family--body);
}
.rh-menu-strip-items {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 26px;
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 1.05rem;
}
.rh-menu-strip-price { color: var(--wp--preset--color--accent-green); margin-left: 6px; font-weight: 700; }
.rh-menu-strip-empty { color: #cbbfae; font-style: italic; }
.rh-menu-strip-label--muted { color: #cbbfae; text-transform: none; letter-spacing: normal; font-style: italic; }
.rh-menu-strip-items--preview { opacity: .72; }
.rh-menu-strip-items--preview .rh-menu-strip-price { color: var(--wp--preset--color--amber-tint); }

/* --- Hero-osio --- */
.rh-hero {
	padding: 56px 5% 40px;
	background: var(--wp--preset--gradient--warm-glow);
	background-image: var(--wp--preset--gradient--warm-glow), var(--wp--custom--restaurant--gingham-accent);
}
.rh-eyebrow {
	color: var(--wp--preset--color--accent-green-deep);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	font-size: 0.85rem;
}
.rh-hero h1 { font-size: 2.6rem; line-height: 1.15; margin-top: 6px; }
.rh-lead { font-size: 1.1rem; color: var(--wp--preset--color--ink-soft); max-width: 46ch; }
.rh-hero-image img {
	border-radius: 16px;
	box-shadow: var(--wp--preset--shadow--menu-card);
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

/* --- Palvelukortit: myyvät, isommat kortit + oma "Kysy tarjous" -painike --- */
.rh-services { padding: 56px 5% 68px; }
.rh-services-lead {
	color: var(--wp--preset--color--ink-soft);
	max-width: 62ch;
	margin: -4px auto 8px;
}
.rh-services-row.wp-block-columns { gap: 32px; margin-top: 8px; }
.rh-service-card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 18px;
	padding: 40px 30px;
	box-shadow: var(--wp--preset--shadow--soft);
	text-align: center;
	height: 100%;
	transition: transform .18s ease, box-shadow .18s ease;
}
.rh-service-card:hover { transform: translateY(-4px); box-shadow: var(--wp--preset--shadow--menu-card); }
.rh-service-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 68px;
	height: 68px;
	border-radius: 50%;
	font-size: 1.9rem;
	margin: 0 auto 16px;
}
.rh-service-card--green .rh-service-icon { background: var(--wp--preset--color--accent-green-tint); }
.rh-service-card--amber .rh-service-icon { background: var(--wp--preset--color--amber-tint); }
.rh-service-card--purple .rh-service-icon { background: var(--wp--preset--color--accent-purple-tint); }
.rh-service-card h3 { margin: 4px 0 10px; font-size: 1.3rem; }
.rh-service-card p { color: var(--wp--preset--color--ink-soft); margin-bottom: 4px; }
.rh-service-card-actions.wp-block-buttons { justify-content: center; margin-top: 18px; }
.rh-service-card--green .rh-service-card-actions .wp-block-button__link {
	border-color: var(--wp--preset--color--accent-green);
	color: var(--wp--preset--color--accent-green-deep);
}
.rh-service-card--amber .rh-service-card-actions .wp-block-button__link {
	border-color: var(--wp--preset--color--amber);
	color: var(--wp--preset--color--amber);
}
.rh-service-card--purple .rh-service-card-actions .wp-block-button__link {
	border-color: var(--wp--preset--color--accent-purple);
	color: var(--wp--preset--color--accent-purple);
}

/* --- Alabrändit / kumppani-info: myyvät kortit, oma tunnusväri kummallekin --- */
.rh-brands { padding: 20px 5% 48px; }
/* Ohita WordPressin 720px sisältöraja vain alabrändien palstariviltä. */
.rh-brands > .wp-block-columns {
	width: 100%;
	max-width: var(--wp--style--global--wide-size, 1180px) !important;
	margin-inline: auto;
}
/* Alabrändien käytettävissä oleva leveys jaetaan tasan palstojen kesken. */
@media (min-width: 782px) {
	.rh-brands > .wp-block-columns {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.rh-brands > .wp-block-columns > .wp-block-column {
		min-width: 0;
		width: 100%;
	}
}

.rh-brands-lead { color: var(--wp--preset--color--ink-soft); max-width: 60ch; margin: -6px auto 8px; }

.rh-brand-card {
	border-radius: 16px;
	padding: 24px;
	height: 100%;
	box-shadow: var(--wp--preset--shadow--soft);
	transition: transform .18s ease, box-shadow .18s ease;
}
.rh-brand-card:hover { transform: translateY(-3px); box-shadow: var(--wp--preset--shadow--menu-card); }
.rh-brand-card--green { background: var(--wp--preset--color--accent-green-tint); }
.rh-brand-card--purple { background: var(--wp--preset--color--accent-purple-tint); }
.rh-brand-card-image {
	margin: 0 0 16px;
	border-radius: 12px;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	background: rgba(0,0,0,.05);
}
.rh-brand-card-image img { width: 100%; height: 100%; object-fit: cover; }
/* Logokuvat (Geonalle, Rakkaudesta luontoon) eivät saa rajautua kuin valokuvat -
   näytetään kokonaisina vaalealla taustalla. */
.rh-brand-card-image--logo { background: #fff; display: flex; align-items: center; justify-content: center; padding: 18px; }
.rh-brand-card-image--logo img { width: auto; max-width: 78%; height: auto; max-height: 78%; object-fit: contain; }
.rh-brand-card h3 { margin-bottom: 6px; }
.rh-brand-card--green h3 { color: var(--wp--preset--color--accent-green-deep); }
.rh-brand-card--purple h3 { color: var(--wp--preset--color--accent-purple); }
.rh-brand-card-actions.wp-block-buttons {
	margin-top: 16px;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.rh-brand-card--green .rh-brand-card-actions .wp-block-button:first-child .wp-block-button__link {
	background: var(--wp--preset--color--accent-green);
}
.rh-brand-card--purple .rh-brand-card-actions .wp-block-button:first-child .wp-block-button__link {
	background: var(--wp--preset--color--accent-purple);
}
.rh-brand-card-actions .wp-block-button__link { font-size: .92rem; padding: .65rem 1.3rem; }

.rh-partner-strip {
	background: var(--wp--preset--color--brown-tint);
	border-left: 4px solid var(--wp--preset--color--brown);
	border-radius: 10px;
	padding: 16px 20px;
	margin-top: 20px;
	align-items: flex-start;
	gap: 12px;
}
.rh-info-icon { font-size: 1.3rem; color: var(--wp--preset--color--brown); margin: 0; }

/* --- Arvostelut --- */
.rh-reviews { padding: 20px 5% 48px; text-align: center; }
.rh-google-rating { font-size: 1.15rem; }
.rh-stars { color: #E0A400; letter-spacing: 2px; }
.rh-rating-count { color: var(--wp--preset--color--ink-soft); font-size: .9rem; }

/* Yksittäiset Google-arvostelut ([rh_google_reviews_list], Arvostelut-sivu) */
.rh-google-reviews-list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 18px;
	margin: 24px 0;
	text-align: left;
}
.rh-google-review-card {
	background: var(--wp--preset--color--paper, #fff);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 10px;
	padding: 18px 20px;
}
.rh-google-review-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 10px; }
.rh-google-review-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.rh-google-review-headtext { min-width: 0; }
.rh-google-review-author { display: block; color: var(--wp--preset--color--brown-deep); }
.rh-google-review-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 2px; }
.rh-google-review-meta .rh-stars { font-size: .85rem; letter-spacing: 1px; }
.rh-google-review-time { color: var(--wp--preset--color--ink-soft); font-size: .82rem; }
.rh-google-review-text {
	margin: 0;
	color: var(--wp--preset--color--ink);
	font-size: .95rem;
	line-height: 1.5;
	overflow-wrap: break-word;
}
.rh-google-reviews-cta { text-align: center; margin-top: 8px; }

/* --- Etusivun nalle-maskotti (patterns/nalle-maskotti.php) ---
   Nalle huojuu hiljaa, aurinko hehkuu pehmeästi ja pieniä kuplia nousee
   nallen kuonosta kohti aurinkoa jatkuvana, lomittaisena virtana - jatkaa
   alkuperäisen Geonalle-kuvituksen ideaa elävänä. Kaikki animaatiot pois
   käytöstä jos kävijä on pyytänyt vähemmän liikettä (prefers-reduced-motion). */
.rh-mascot-section {
	display: flex;
	justify-content: center;
	padding: 4px 5% 32px;
	overflow: hidden;
}
.rh-mascot-scene {
	position: relative;
	width: min(280px, 55vw);
	aspect-ratio: 486 / 510;
}
.rh-mascot-sunglow {
	position: absolute;
	left: 46.4%;
	top: 23.1%;
	width: 42%;
	height: 42%;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255, 196, 0, .55) 0%, rgba(255, 196, 0, 0) 72%);
	filter: blur(2px);
	animation: rh-mascot-sunpulse 4.2s ease-in-out infinite;
	z-index: 1;
}
.rh-mascot-bear-img {
	position: relative;
	z-index: 2;
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
	animation: rh-mascot-bob 4.6s ease-in-out infinite;
	transform-origin: 55% 88%;
}
.rh-mascot-bubble {
	position: absolute;
	z-index: 3;
	border-radius: 50%;
	border: 2px solid var(--wp--preset--color--brown, #704830);
	background: rgba(255, 255, 255, .35);
	opacity: 0;
	pointer-events: none;
	animation-name: rh-mascot-bubble-float;
	animation-timing-function: ease-in;
	animation-iteration-count: infinite;
}
.rh-mascot-bubble--1 { left: 88%; top: 60%; width: 10px; height: 10px; --rh-bubble-tx: -70px; --rh-bubble-ty: -240px; animation-delay: 0s; animation-duration: 6.5s; }
.rh-mascot-bubble--2 { left: 84%; top: 55%; width: 7px; height: 7px; --rh-bubble-tx: -55px; --rh-bubble-ty: -210px; animation-delay: 1.4s; animation-duration: 5.8s; }
.rh-mascot-bubble--3 { left: 90%; top: 52%; width: 13px; height: 13px; --rh-bubble-tx: -80px; --rh-bubble-ty: -260px; animation-delay: 2.6s; animation-duration: 7.2s; }
.rh-mascot-bubble--4 { left: 86%; top: 63%; width: 6px; height: 6px; --rh-bubble-tx: -45px; --rh-bubble-ty: -190px; animation-delay: 3.6s; animation-duration: 5.2s; }
.rh-mascot-bubble--5 { left: 92%; top: 58%; width: 9px; height: 9px; --rh-bubble-tx: -65px; --rh-bubble-ty: -230px; animation-delay: 4.8s; animation-duration: 6.8s; }

@keyframes rh-mascot-bob {
	0%, 100% { transform: translateY(0) rotate(0deg); }
	50% { transform: translateY(-5px) rotate(-1.4deg); }
}
@keyframes rh-mascot-sunpulse {
	0%, 100% { opacity: .45; transform: translate(-50%, -50%) scale(1); }
	50% { opacity: .75; transform: translate(-50%, -50%) scale(1.12); }
}
@keyframes rh-mascot-bubble-float {
	0% { transform: translate(0, 0) scale(.4); opacity: 0; }
	15% { opacity: .8; }
	70% { opacity: .45; }
	100% { transform: translate(var(--rh-bubble-tx, -60px), var(--rh-bubble-ty, -220px)) scale(1.1); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.rh-mascot-sunglow, .rh-mascot-bear-img, .rh-mascot-bubble { animation: none !important; }
}

/* --- Alasivut: murupolku, header-kuva, loppu-CTA ---
   Huom: nämä ovat kaikki tavallisia (ei align:wide/full) lohkoja
   page.html:n sisällä, joten teeman omat asettelusäännöt (theme.json
   contentSize: 1180px) keskittävät ne jo automaattisesti - ei tarvita
   erillistä vaakapaddingia täällä. */
.rh-breadcrumbs { margin: 18px 0 6px; }
.rh-breadcrumbs ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 6px;
	font-size: .88rem;
	color: var(--wp--preset--color--ink-soft);
}
.rh-breadcrumbs a { color: var(--wp--preset--color--ink-soft); text-decoration: underline; text-underline-offset: 2px; }
.rh-breadcrumbs a:hover { color: var(--wp--preset--color--accent-green-deep); }
.rh-breadcrumbs [aria-current="page"] { color: var(--wp--preset--color--brown-deep); font-weight: 600; }
.rh-breadcrumbs-sep { opacity: .5; }

/* --- Sivun kaksipalstainen asettelu: vasemmalla osion sivupuu --- */
.rh-page-layout.wp-block-columns {
	gap: 36px;
	margin-top: 8px;
	align-items: flex-start;
}
.rh-page-sidebar { flex: 0 0 250px !important; }
.rh-page-main { flex: 1 1 auto !important; min-width: 0; }
/* Jos osiolla ei ole yhtään alasivua, [rh_page_sidebar_nav] ei tulosta
   mitään - piilotetaan silloin koko tyhjä sarake ettei jää turhaa rakoa. */
.rh-page-sidebar:empty { display: none; }

.rh-page-sidebar-nav {
	position: sticky;
	top: 20px;
	background: var(--wp--preset--color--brown-tint);
	border-radius: 16px;
	padding: 20px;
}
.rh-page-sidebar-nav h2 {
	margin: 0 0 10px;
	font-size: 1rem;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--wp--preset--color--brown-deep);
}
.rh-page-sidebar-nav a {
	display: block;
	text-decoration: none;
	color: var(--wp--preset--color--ink);
	padding: 7px 10px;
	border-radius: 8px;
	font-size: .95rem;
}
.rh-page-sidebar-nav a:hover { background: rgba(0,0,0,.05); }
.rh-page-sidebar-nav a[aria-current="page"] {
	background: var(--wp--preset--color--accent-green);
	color: #fff;
	font-weight: 600;
}
.rh-page-sidebar-nav .rh-page-sidebar-top { font-weight: 700; margin-bottom: 4px; }
.rh-page-sidebar-nav ul { list-style: none; margin: 0; padding: 0; }
.rh-page-sidebar-nav ul ul { padding-left: 14px; border-left: 2px solid var(--wp--preset--color--line); margin-left: 10px; }

@media (max-width: 782px) {
	.rh-page-layout.wp-block-columns { flex-wrap: wrap; }
	.rh-page-sidebar { flex-basis: 100% !important; }
	.rh-page-sidebar-nav { position: static; }
}

.rh-page-hero-image {
	margin: 14px 0 22px;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: var(--wp--preset--shadow--menu-card);
}
.rh-page-hero-image img {
	width: 100%;
	max-height: 420px;
	object-fit: cover;
}
/* Jos sivulla ei ole valittua "Artikkelikuvaa", lohko renderöityy tyhjänä -
   piilotetaan se kokonaan ettei jää tyhjää laatikkoa/varjoa näkyviin. */
.rh-page-hero-image:empty { display: none; margin: 0; box-shadow: none; }

.rh-page-subnav {
	margin: 36px 0 0;
	padding: 26px 24px;
	background: var(--wp--preset--color--brown-tint);
	border-radius: 16px;
}
.rh-page-subnav h2 { margin: 0 0 12px; font-size: 1.15rem; color: var(--wp--preset--color--brown-deep); }
.rh-page-subnav ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.rh-page-subnav a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 12px 16px;
	background: #fff;
	border-radius: 10px;
	text-decoration: none;
	color: var(--wp--preset--color--brown-deep);
	font-weight: 600;
	box-shadow: var(--wp--preset--shadow--soft);
	transition: transform .15s ease;
}
.rh-page-subnav a:hover { transform: translateY(-2px); color: var(--wp--preset--color--accent-green-deep); }
.rh-page-subnav-arrow { opacity: .6; }

/* --- Sivukartta ([rh_sitemap], Sivukartta-sivu) --- */
.rh-sitemap-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 20px;
	margin: 24px 0;
}
.rh-sitemap-section {
	background: var(--wp--preset--color--brown-tint);
	border-radius: 16px;
	padding: 22px 24px;
}
.rh-sitemap-section h3 {
	margin: 0 0 12px;
	font-size: 1.1rem;
}
.rh-sitemap-section h3 a {
	color: var(--wp--preset--color--brown-deep);
	text-decoration: none;
}
.rh-sitemap-section h3 a:hover,
.rh-sitemap-section h3 a:focus-visible { color: var(--wp--preset--color--accent-green-deep); }
.rh-sitemap-section ul { list-style: none; margin: 0; padding: 0; }
.rh-sitemap-section li { margin: 0 0 8px; }
.rh-sitemap-section a {
	color: var(--wp--preset--color--ink-soft);
	text-decoration: none;
}
.rh-sitemap-section a:hover,
.rh-sitemap-section a:focus-visible {
	color: var(--wp--preset--color--accent-green-deep);
	text-decoration: underline;
}

/* --- Artikkelit: etusivun "Ajankohtaista"-nosto + Ajankohtaista-sivun ruudukko --- */
.rh-articles-teaser { padding: 20px 5% 8px; text-align: center; }
.rh-articles-grid.wp-block-query { margin-top: 12px; }
.rh-articles-grid ul.wp-block-post-template,
.rh-articles-grid .wp-block-post-template {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 26px;
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: left;
}
.rh-article-card {
	background: #fff;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: var(--wp--preset--shadow--soft);
	transition: transform .18s ease, box-shadow .18s ease;
	height: 100%;
}
.rh-article-card:hover { transform: translateY(-4px); box-shadow: var(--wp--preset--shadow--menu-card); }
.rh-article-card-image { margin: 0; }
.rh-article-card-image img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.rh-article-card-date {
	display: block;
	margin: 14px 16px 0;
	font-size: .82rem;
	color: var(--wp--preset--color--ink-soft);
	text-transform: uppercase;
	letter-spacing: .04em;
}
.rh-article-card h3 {
	margin: 6px 16px 8px;
	font-size: 1.15rem;
}
.rh-article-card h3 a { color: var(--wp--preset--color--brown-deep); text-decoration: none; }
.rh-article-card h3 a:hover { color: var(--wp--preset--color--accent-green-deep); }
.rh-article-card .wp-block-post-excerpt {
	margin: 0 16px 18px;
	color: var(--wp--preset--color--ink-soft);
	font-size: .95rem;
}
.rh-articles-grid .wp-block-query-pagination { margin-top: 26px; justify-content: center; }

.rh-page-cta {
	margin: 40px 0 0;
	background: var(--wp--preset--color--accent-green-tint);
	border: 1px solid var(--wp--preset--color--accent-green);
	border-radius: 18px;
	overflow: hidden;
}
.rh-page-cta-inner {
	max-width: 620px;
	margin: 0 auto;
	padding: 36px 24px;
	text-align: center;
}
.rh-page-cta-inner h2 { margin: 0 0 8px; color: var(--wp--preset--color--brown-deep); }
.rh-page-cta-inner p { margin: 0 0 18px; color: var(--wp--preset--color--ink-soft); }
.rh-page-cta-button {
	display: inline-block;
	background: var(--wp--preset--color--accent-green);
	color: #fff;
	text-decoration: none;
	font-weight: 700;
	padding: 14px 32px;
	border-radius: 999px;
	transition: background .15s ease, transform .15s ease;
}
.rh-page-cta-button:hover { background: var(--wp--preset--color--accent-green-deep); transform: translateY(-2px); }

/* Valikossa nostetaan "Tilaa lahjakortti" omaksi myyväksi napiksi tavallisten
   linkkien joukosta, koska se on suora konversiopolku (ostotapahtuma). */
.rh-nav li.menu-item a[href*="tilaa-lahjakortti"],
.rh-nav li.menu-item a[href*="order-a-gift-card"] {
	color: var(--wp--preset--color--accent-green-deep);
	font-weight: 700;
}

/* --- Uutiskirje --- */
.rh-newsletter {
	background: var(--wp--preset--color--surface-dark);
	color: #F6EFE6;
	padding: 48px 5%;
	text-align: center;
}
.rh-newsletter h2 { color: #fff; }
.rh-newsletter-row { display: flex; gap: 10px; max-width: 420px; margin: 0 auto; flex-wrap: wrap; justify-content: center; }
.rh-newsletter-form input[type="email"] {
	flex: 1;
	min-width: 220px;
	padding: 12px 16px;
	border-radius: 999px;
	border: none;
}

/* --- Footer --- */
.site-footer {
	background: var(--wp--preset--color--surface-dark);
	color: #D9CFC2;
	padding: 48px 5% 24px;
}
.site-footer h4 { color: #fff; }
.site-footer a { color: #D9CFC2; }
.footer-logo { filter: brightness(0) invert(1); opacity: .92; }
.rh-footer-copy { color: #9C8F80; font-size: .85rem; margin-top: 24px; }

/* Uudet "Pikalinkit" ([rh_quicklinks], viisi käsivalittua sivua). */
.rh-footer-quicklinks {
	list-style: none;
	margin: 0 0 10px;
	padding: 0;
}
.rh-footer-quicklinks li { margin: 0 0 6px; }
.rh-footer-quicklinks a { text-decoration: none; }
.rh-footer-quicklinks a:hover,
.rh-footer-quicklinks a:focus-visible { color: #fff; text-decoration: underline; }

/* [rh_nav_menu location="footer"] (Tietosuojaseloste, Sivukartta) tulostaa
   saman .rh-nav-komponentin kuin päävalikon hampurilaisvalikko, joka on
   OLETUKSENA display:none (ks. .rh-nav yllä, tarkoitettu vain headerin
   pudotuspaneelille) - ilman tätä korjausta nämä kaksi linkkiä olivat
   käytännössä näkymättömissä footerissa. Nollataan tässä pudotusvalikon
   asettelu ja tehdään siitä tavallinen, aina näkyvä listaus. */
.site-footer .rh-nav {
	display: block;
	width: auto;
	position: static;
	order: initial;
}
.site-footer .rh-nav ul {
	display: block;
	padding: 4px 0 0;
}
.site-footer .rh-nav > ul > li > a {
	padding: 0 0 6px;
	border-bottom: none;
	font-weight: 400;
	font-size: .92rem;
}
.site-footer .rh-nav > ul > li > a:hover,
.site-footer .rh-nav > ul > li > a:focus-visible {
	color: #fff;
	background: none;
}

/* --- Yhteydenottolomake ---
   Sama kortti-ilme kuin lahjakorttilomakkeessa (assets/css/gift-card.css,
   ladataan joka sivulla), jotta [rh_contact_form] näyttää yhtä "upealta"
   kuin [custom_gift_card] eikä enää paljaalta Divi-siivouksen jäljiltä. */
.rh-newsletter-form { max-width: 560px; }

.rh-contact-wrapper { margin-top: 12px; }

.rh-contact-card {
	max-width: 560px;
	background: var(--rh-white, #fff);
	border: 1px solid var(--rh-border, var(--wp--preset--color--line));
	border-radius: 16px;
	box-shadow: var(--rh-shadow, 0 4px 24px rgba(43, 29, 20, 0.12));
	overflow: hidden;
	padding-top: 26px;
}

.rh-contact-card .rh-form-header {
	background: var(--rh-pine, var(--wp--preset--color--surface-dark));
	padding: 32px 28px 28px;
	text-align: center;
	color: #fff;
}
.rh-contact-icon { font-size: 40px; line-height: 1; margin-bottom: 10px; }
.rh-contact-card .rh-form-header h3 {
	margin: 0 0 8px;
	font-size: 26px;
	font-weight: 700;
	letter-spacing: -0.3px;
	color: #fff;
	border: none;
	padding: 0;
}
.rh-contact-card .rh-subtitle { margin: 0; font-size: 14px; opacity: .85; line-height: 1.5; }

.rh-contact-card .rh-field-hp { position: absolute; left: -9999px; }

.rh-contact-card .rh-field-group { padding: 18px 28px 0; }
.rh-contact-card .rh-field-group--last { padding-bottom: 4px; }

.rh-contact-card label {
	display: block;
	margin-bottom: 7px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.3px;
	text-transform: uppercase;
	color: var(--rh-ink, inherit);
}

.rh-contact-card input,
.rh-contact-card textarea {
	width: 100%;
	padding: 11px 14px;
	font-size: 15px;
	font-family: inherit;
	color: var(--rh-ink, inherit);
	background: var(--rh-mist, #F7F3EE);
	border: 1.5px solid var(--rh-border, var(--wp--preset--color--line));
	border-radius: 10px;
	box-sizing: border-box;
	transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
	outline: none;
}
.rh-contact-card input:focus,
.rh-contact-card textarea:focus {
	background: #fff;
	border-color: var(--rh-leaf, var(--wp--preset--color--accent-green-deep));
	box-shadow: 0 0 0 3px rgba(31, 153, 0, 0.15);
}
.rh-contact-card textarea { resize: vertical; min-height: 96px; line-height: 1.6; }

.rh-contact-card .rh-submit-btn {
	display: block;
	position: relative;
	width: calc(100% - 56px);
	margin: 24px 28px 12px;
	padding: 15px 20px;
	background: var(--rh-leaf, var(--wp--preset--color--accent-green-deep));
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.2px;
	border: none;
	border-radius: 999px;
	cursor: pointer;
	transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
	box-shadow: 0 3px 12px rgba(31, 153, 0, 0.3);
	min-height: 52px;
}
.rh-contact-card .rh-submit-btn:hover {
	background: var(--rh-leaf-deep, var(--wp--preset--color--accent-green-deep));
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(22, 111, 0, 0.32);
}
.rh-contact-card .rh-submit-btn.loading { opacity: .88; pointer-events: none; cursor: not-allowed; }
.rh-contact-card .rh-submit-btn.loading .rh-btn-text { visibility: hidden; }
.rh-contact-card .rh-spinner {
	display: none;
	position: absolute;
	top: 50%; left: 50%;
	width: 22px; height: 22px;
	margin-top: -11px; margin-left: -11px;
	border: 2.5px solid rgba(255,255,255,.35);
	border-top-color: #fff;
	border-radius: 50%;
	animation: rh-spin 0.65s linear infinite;
}
.rh-contact-card .rh-submit-btn.loading .rh-spinner { display: block; }

.rh-form-status {
	display: block;
	margin: 0 28px 20px;
	font-size: .9rem;
	color: var(--rh-leaf-deep, var(--wp--preset--color--accent-green-deep));
}

/* --- "Toast"-ilmoitus: näkyvä kuittaus lomakkeen lähetyksestä näytön
   alareunan keskellä (yhteydenottolomake + uutiskirjeliittyminen). --- */
#rh-toast-container {
	position: fixed;
	left: 50%;
	bottom: 28px;
	transform: translateX(-50%);
	z-index: 100000;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	max-width: calc(100% - 32px);
	pointer-events: none;
}
.rh-toast {
	pointer-events: auto;
	padding: 14px 22px;
	border-radius: 999px;
	box-shadow: 0 8px 24px rgba(0,0,0,.18);
	font-size: .95rem;
	font-weight: 600;
	color: #fff;
	background: var(--wp--preset--color--accent-green-deep, #1f9900);
	opacity: 0;
	transform: translateY(12px);
	transition: opacity .3s ease, transform .3s ease;
	max-width: 90vw;
	text-align: center;
}
.rh-toast.is-visible {
	opacity: 1;
	transform: translateY(0);
}
.rh-toast--error {
	background: #b32d2e;
}

@media (max-width: 600px) {
	#rh-toast-container { bottom: 18px; }
	.rh-toast { font-size: .88rem; padding: 12px 18px; }
}

@media (max-width: 600px) {
	.rh-contact-card .rh-form-header { padding: 24px 20px 20px; }
	.rh-contact-card .rh-form-header h3 { font-size: 22px; }
	.rh-contact-card .rh-field-group { padding-left: 18px; padding-right: 18px; }
	.rh-contact-card .rh-submit-btn { width: calc(100% - 36px); margin-left: 18px; margin-right: 18px; }
	.rh-form-status { margin-left: 18px; margin-right: 18px; }
}

/* --- Tuotteen ID-merkki (näkyy vain kirjautuneille ylläpitäjille) --- */
.rh-product-id-badge {
	display: inline-block;
	margin-bottom: 4px;
	padding: 1px 7px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .3px;
	color: #6b5c4d;
	background: #F7F3EE;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 999px;
	font-family: monospace;
}

/* --- Lomake-sivut (lahjakortti, yhteydenotto): lomake vasemmalla, tiedot
   oikealla - yhteinen luokkasarja, jotta molemmat käyttävät samaa CSS:ää. --- */
.rh-split-form-layout.wp-block-columns { gap: 40px; align-items: flex-start; margin-top: 8px; }
.rh-split-form-col { flex: 0 0 460px !important; max-width: 460px; }
.rh-split-info-col { flex: 1 1 auto !important; min-width: 0; padding-top: 6px; }
@media (max-width: 782px) {
	.rh-split-form-layout.wp-block-columns { flex-wrap: wrap; }
	.rh-split-form-col,
	.rh-split-info-col { flex-basis: 100% !important; max-width: 100%; }
}

/* --- Ei-osiollisten alasivujen (ei sivupalkkia) leveys aina täysi 1180px:
   flex-grow:1 riittäisi periaatteessa yksinään, mutta varmistetaan tämä
   myös selaimissa jotka tukevat :has()-valitsinta, jotta sisältö ei koskaan
   jää turhaan kapeaksi kun [rh_page_sidebar_nav] ei tulosta mitään. --- */
.rh-page-layout:has(> .rh-page-sidebar:empty) > .rh-page-main {
	flex-basis: 100% !important;
	max-width: 100%;
}

/* --- Galleriat (ydin wp:gallery-lohko sivun sisällössä) - lisäys ja poisto
   hoituu suoraan lohkoeditorista, tämä vain tyylittää tuloksen upeaksi. --- */
.rh-page-main .wp-block-gallery {
	margin: 22px 0;
	gap: 14px !important;
}
.rh-page-main .wp-block-gallery .wp-block-image { margin: 0; }
.rh-page-main .wp-block-gallery .wp-block-image img {
	border-radius: 12px;
	box-shadow: 0 2px 10px rgba(43, 29, 20, .08);
	transition: transform .22s ease, box-shadow .22s ease;
}
.rh-page-main .wp-block-gallery .wp-block-image:hover img {
	transform: translateY(-3px) scale(1.015);
	box-shadow: 0 10px 26px rgba(43, 29, 20, .18);
}
.rh-page-main .wp-block-gallery figcaption {
	margin-top: 6px;
	font-size: .82rem;
	color: var(--wp--preset--color--brown-deep);
	text-align: center;
}

/* --- Poikkeava aukiolo -kortti (etusivu) --- */
.rh-exception-column {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin: 18px 0;
	padding: 16px 20px;
	background: #FBEEE0;
	border: 1px solid #E8C79A;
	border-radius: 12px;
}
.rh-exception-column-icon {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: var(--rh-gold, #B5651D);
	color: #fff;
	font-weight: 700;
}
.rh-exception-column strong { display: block; margin-bottom: 2px; }
.rh-exception-column p { margin: 0; }

/* --- Google-kartta, kiinni footerissa --- */
.rh-map-embed { width: 100%; line-height: 0; }
.rh-map-embed iframe { display: block; width: 100%; }

/* --- Evästebanneri (vasen alakulma) --- */
.rh-cookie-banner {
	position: fixed;
	left: 20px;
	bottom: 20px;
	max-width: 340px;
	background: #fff;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 14px;
	box-shadow: var(--wp--preset--shadow--menu-card);
	padding: 18px 20px;
	z-index: 9000;
	font-size: .88rem;
}
.rh-cookie-actions { display: flex; gap: 10px; margin-top: 10px; }
.rh-cookie-accept, .rh-cookie-decline {
	border: none;
	border-radius: 999px;
	padding: 8px 16px;
	font-weight: 600;
	cursor: pointer;
	font-size: .85rem;
}
.rh-cookie-accept { background: var(--wp--preset--color--accent-green); color: #fff; }
.rh-cookie-decline { background: var(--wp--preset--color--line); color: var(--wp--preset--color--ink); }

/* --- Push-kehote --- */
.rh-push-prompt {
	position: fixed;
	right: 20px;
	bottom: 90px;
	max-width: 260px;
	background: var(--wp--preset--color--brown-deep);
	color: #fff;
	border: none;
	border-radius: 12px;
	padding: 14px 16px;
	font-size: .85rem;
	text-align: left;
	cursor: pointer;
	box-shadow: var(--wp--preset--shadow--menu-card);
	z-index: 8900;
}

/* --- Lahjakortti- ja lounaslistanäkymät --- */
/* font-family pakotetaan tähän erikseen leipätekstin fontiksi (Open Sans),
   koska sivun sisältöön lyhytkoodi [rh_lounaslista] on saatettu lisätä esim.
   "Koodi"-tyyppiseen lohkoon, joka muuten pakottaisi koko listan
   tasavälistetyllä (monospace) fontilla riippumatta tästä tyylitiedostosta. */
.rh-lounaslista-full,
.rh-lounaslista-full *,
.rh-lounas-intro,
.rh-lounas-intro * {
	font-family: var(--wp--preset--font-family--body), "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif !important;
}
.rh-lounaslista-full {
	max-width: 720px;
}
.rh-lounas-page-heading {
	margin-top: 0;
}
.rh-lounaslista-day-block ul { list-style: none; margin: 0 0 20px; padding: 0; }
.rh-lounaslista-day-block li.rh-lounas-item {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 8px 0;
	border-bottom: 1px dashed var(--wp--preset--color--line);
}
.rh-lounaslista-day-block .rh-dish { display: block; }
.rh-price { color: var(--wp--preset--color--amber); font-weight: 700; }
.rh-lounas-pdf-btn { display: inline-block; margin-top: 12px; }

/* =========================================================
   RESPONSIIVISUUS - kattava läpikäynti kaikille osioille.
   Kolme rajapistettä: 960px (tabletti/valikko), 782px (WP:n
   oma mobiilirajapiste), 480px (pienet puhelimet).
   ========================================================= */

@media (max-width: 960px) {
	.rh-hero .wp-block-columns,
	.rh-services .wp-block-columns,
	.rh-brands .wp-block-columns,
	.site-footer .wp-block-columns {
		flex-direction: column;
	}
	.rh-hero-image { margin-top: 24px; }
	.wp-block-buttons { justify-content: flex-start; }
}

@media (max-width: 782px) {
	.rh-hero { padding: 40px 6% 32px; }
	.rh-hero h1 { font-size: 2rem; }
	.rh-lead { max-width: 100%; }
	.site-header { align-items: center; }
	.rh-header-actions { margin-left: auto; }
	.rh-topbar { font-size: .78rem; padding: 8px 6%; justify-content: center; text-align: center; }
	.rh-topbar-info { width: 100%; text-align: center; }
	.rh-topbar-right { width: 100%; justify-content: center; }
	.rh-menu-strip { flex-direction: column; align-items: flex-start; padding: 12px 6%; }
	.rh-menu-strip-items { gap: 4px 18px; font-size: .95rem; }
	.rh-shop ul.products,
	.rh-shop .rh-product-grid { grid-template-columns: repeat(2, 1fr) !important; }
	.rh-cookie-banner { left: 12px; right: 12px; bottom: 12px; max-width: none; }
	.rh-push-prompt { right: 12px; left: 12px; bottom: 84px; max-width: none; }
}

@media (max-width: 480px) {
	.rh-hero h1 { font-size: 1.6rem; }
	.wp-block-buttons { flex-direction: column; align-items: stretch; }
	.wp-block-buttons .wp-block-button__link { text-align: center; }
	.rh-shop ul.products,
	.rh-shop .rh-product-grid { grid-template-columns: 1fr !important; }
	.rh-brand-card-actions.wp-block-buttons { flex-direction: column; align-items: stretch; }
}
