/*
Theme Name: Shasitter
Theme URI: https://shasitter.ch
Author: Shasitter
Description: Theme vitrine et dashboard pour Shasitter.
Version: 2.2.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: shasitter
*/

:root {
	--ink: #1c2024;
	--text: #30383a;
	--muted: #697270;
	--bg: #f7f8f4;
	--panel: rgba(255, 255, 255, 0.84);
	--line: rgba(33, 46, 45, 0.14);
	--lavender: #b8a6ea;
	--lavender-deep: #7251b5;
	--gold: #c6a14c;
	--green: #25d366;
	--rose: #a974bf;
	--radius: 8px;
	--shadow: 0 24px 70px rgba(25, 38, 36, 0.13);
	--container: min(1140px, calc(100vw - 32px));
	--font: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--display: "Playfair Display", Georgia, serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body {
	margin: 0;
	font-family: var(--font);
	color: var(--text);
	background:
		linear-gradient(135deg, rgba(184,166,234,0.2), rgba(198,161,76,0.1)),
		var(--bg);
	line-height: 1.65;
	overflow-x: hidden;
}
body.dashboard-page { background: #100d18; }
body.dashboard-page {
	overscroll-behavior-y: none;
	-webkit-tap-highlight-color: transparent;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
[hidden] { display: none !important; }
:focus-visible {
	outline: 3px solid rgba(114,81,181,0.42);
	outline-offset: 3px;
}
.container { width: var(--container); margin-inline: auto; }
.skip-link {
	position: fixed;
	top: 16px;
	left: 16px;
	z-index: 10000;
	padding: 10px 14px;
	border-radius: var(--radius);
	background: white;
	color: var(--ink);
	font-weight: 900;
	box-shadow: var(--shadow);
	transform: translateY(-140%);
	transition: transform 0.2s ease;
}
.skip-link:focus { transform: none; }

.site-loader {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 18px;
	padding: 24px;
	overflow: hidden;
	background:
		radial-gradient(circle at 50% 22%, rgba(198,161,76,0.16), transparent 25rem),
		linear-gradient(125deg, rgba(17,22,24,0.98), rgba(25,39,36,0.98)),
		#111618;
	transition: opacity 0.42s ease, visibility 0.42s ease;
	animation: loader-auto-release 0.7s ease 3.4s forwards;
}
.site-loader::before,
.site-loader::after {
	content: "";
	position: absolute;
	inset: -20%;
	background:
		linear-gradient(115deg, transparent 34%, rgba(198,161,76,0.22) 44%, transparent 54%),
		linear-gradient(245deg, transparent 40%, rgba(141,168,160,0.26) 50%, transparent 60%);
	animation: loader-sweep 3.4s ease-in-out infinite alternate;
}
.site-loader::after {
	filter: blur(24px);
	opacity: 0.52;
	animation-duration: 4s;
	animation-direction: alternate-reverse;
}
.site-loader.hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	animation: none;
}
.loader-grid {
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(rgba(255,255,255,0.055) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,0.055) 1px, transparent 1px);
	background-size: 42px 42px;
	mask-image: radial-gradient(circle at center, black 0 42%, transparent 75%);
}
.loader-film {
	position: relative;
	z-index: 2;
	width: min(520px, calc(100vw - 36px));
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border: 1px solid rgba(255,255,255,0.22);
	border-radius: 18px;
	background: #111618;
	box-shadow: 0 30px 90px rgba(0,0,0,0.34);
}
.loader-film::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		linear-gradient(180deg, rgba(17,22,24,0.08), rgba(17,22,24,0.74)),
		linear-gradient(90deg, rgba(17,22,24,0.74), transparent 52%);
}
.loader-film::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,0.18) 46%, transparent 66%);
	transform: translateX(-120%);
	animation: loader-film-shine 2.6s ease-in-out infinite;
}
.loader-film img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.08);
	filter: saturate(0.92) contrast(1.04);
	animation: loader-film-zoom 4.4s ease-in-out infinite alternate;
}
.loader-film-glass {
	position: absolute;
	z-index: 3;
	left: 18px;
	bottom: 18px;
	display: grid;
	gap: 2px;
	padding: 12px 14px;
	border: 1px solid rgba(255,255,255,0.2);
	border-radius: var(--radius);
	background: rgba(255,255,255,0.12);
	backdrop-filter: blur(16px);
	color: white;
	text-align: left;
}
.loader-film-glass span {
	color: rgba(255,255,255,0.72);
	font-size: 0.74rem;
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: 0;
}
.loader-film-glass strong {
	font-family: var(--display);
	font-size: clamp(2rem, 7vw, 3.5rem);
	line-height: 0.94;
}
.loader-scene {
	position: relative;
	z-index: 2;
	width: min(390px, calc(100vw - 42px));
	height: 118px;
}
.loader-scene::before {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 12px;
	width: 76%;
	height: 18px;
	border-radius: 50%;
	background: rgba(0,0,0,0.24);
	filter: blur(12px);
	transform: translateX(-50%);
}
.loader-moon {
	position: absolute;
	top: 8px;
	right: 42px;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: linear-gradient(135deg, #fff7d8, var(--gold));
	box-shadow: 0 0 34px rgba(198,161,76,0.34);
}
.loader-path {
	position: absolute;
	left: 26px;
	right: 26px;
	bottom: 34px;
	display: flex;
	justify-content: space-between;
}
.loader-path i {
	width: 12px;
	height: 8px;
	border-radius: 50%;
	background: rgba(255,255,255,0.32);
	transform: rotate(-16deg);
	animation: loader-paw 1.7s ease-in-out infinite;
}
.loader-path i:nth-child(2) { animation-delay: 0.16s; }
.loader-path i:nth-child(3) { animation-delay: 0.32s; }
.loader-path i:nth-child(4) { animation-delay: 0.48s; }
.loader-path i:nth-child(5) { animation-delay: 0.64s; }
.loader-cat {
	position: absolute;
	left: 34px;
	bottom: 40px;
	width: 150px;
	height: 86px;
	animation: loader-cat-float 2.4s ease-in-out infinite;
}
.cat-body {
	position: absolute;
	left: 34px;
	bottom: 0;
	width: 92px;
	height: 54px;
	border-radius: 48px 56px 38px 34px;
	background: linear-gradient(135deg, #f7f2e8, #b9c8c2);
	box-shadow: inset -10px -9px 18px rgba(28,32,36,0.16);
}
.cat-head {
	position: absolute;
	left: 8px;
	bottom: 28px;
	width: 54px;
	height: 50px;
	border-radius: 50%;
	background: linear-gradient(135deg, #fff8eb, #d6ded9);
	box-shadow: inset -8px -8px 16px rgba(28,32,36,0.12);
}
.cat-head::before,
.cat-head::after {
	content: "";
	position: absolute;
	top: -11px;
	width: 22px;
	height: 24px;
	border-radius: 5px 14px 0 14px;
	background: #f6f0e5;
	transform: rotate(34deg);
}
.cat-head::before { left: 5px; }
.cat-head::after {
	right: 5px;
	transform: rotate(-34deg) scaleX(-1);
}
.cat-head i {
	position: absolute;
	top: 22px;
	width: 5px;
	height: 7px;
	border-radius: 50%;
	background: #1c2024;
}
.cat-head i:first-child { left: 17px; }
.cat-head i:last-child { right: 17px; }
.cat-tail {
	position: absolute;
	right: 8px;
	bottom: 18px;
	width: 54px;
	height: 54px;
	border: 10px solid #b9c8c2;
	border-left-color: transparent;
	border-bottom-color: transparent;
	border-radius: 50%;
	transform-origin: 8px 44px;
	animation: loader-tail 1.8s ease-in-out infinite;
}
.loader-rodent {
	position: absolute;
	right: 44px;
	bottom: 42px;
	width: 92px;
	height: 54px;
	animation: loader-rodent-hop 1.9s ease-in-out infinite;
}
.rodent-body {
	position: absolute;
	left: 12px;
	bottom: 0;
	width: 62px;
	height: 38px;
	border-radius: 34px 30px 24px 22px;
	background: linear-gradient(135deg, #c7a78e, #8e6f5c);
	box-shadow: inset -9px -7px 14px rgba(28,32,36,0.2);
}
.rodent-body::after {
	content: "";
	position: absolute;
	right: 9px;
	top: 12px;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #1c2024;
}
.rodent-ear {
	position: absolute;
	left: 22px;
	bottom: 28px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #d8bba2;
	box-shadow: inset -4px -4px 8px rgba(28,32,36,0.12);
}
.rodent-tail {
	position: absolute;
	left: 0;
	bottom: 12px;
	width: 28px;
	height: 12px;
	border-bottom: 4px solid #d8bba2;
	border-radius: 50%;
	transform: rotate(12deg);
}
.loader-panel {
	position: relative;
	z-index: 2;
	width: min(540px, calc(100vw - 36px));
	padding: 0;
	border: 0;
	border-radius: var(--radius);
	text-align: center;
}
.loader-kicker {
	display: block;
	margin-bottom: 10px;
	color: rgba(255,255,255,0.7);
	font-size: 0.78rem;
	font-weight: 950;
	letter-spacing: 0;
	text-transform: uppercase;
}
.loader-panel strong {
	display: block;
	font-family: var(--display);
	font-size: clamp(3.1rem, 12vw, 6.5rem);
	line-height: 0.92;
	color: white;
	text-shadow: 0 0 34px rgba(198,161,76,0.3);
}
.loader-panel p {
	margin: 16px auto 0;
	max-width: 360px;
	color: rgba(255,255,255,0.72);
	font-weight: 700;
}
.loader-bar {
	width: min(300px, 76%);
	height: 6px;
	margin: 26px auto 0;
	border-radius: 999px;
	background: rgba(255,255,255,0.16);
	overflow: hidden;
}
.loader-bar span {
	display: block;
	width: 42%;
	height: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, var(--lavender), var(--gold), white);
	animation: loader-progress 1.15s ease-in-out infinite;
}
@keyframes loader-auto-release {
	to {
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
	}
}
@keyframes loader-sweep {
	from { transform: translateX(-4%) rotate(0deg); }
	to { transform: translateX(4%) rotate(2deg); }
}
@keyframes loader-progress {
	0% { transform: translateX(-110%); }
	100% { transform: translateX(250%); }
}
@keyframes loader-film-zoom {
	from { transform: scale(1.08) translateX(0); }
	to { transform: scale(1.15) translateX(-1.8%); }
}
@keyframes loader-film-shine {
	0%, 34% { transform: translateX(-120%); opacity: 0; }
	50% { opacity: 1; }
	78%, 100% { transform: translateX(120%); opacity: 0; }
}
@keyframes loader-cat-float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-7px); }
}
@keyframes loader-tail {
	0%, 100% { transform: rotate(10deg); }
	50% { transform: rotate(-9deg); }
}
@keyframes loader-rodent-hop {
	0%, 100% { transform: translate(0, 0); }
	42% { transform: translate(-8px, -8px); }
	68% { transform: translate(-14px, 0); }
}
@keyframes loader-paw {
	0%, 100% { opacity: 0.22; transform: translateY(0) rotate(-16deg); }
	45% { opacity: 0.86; transform: translateY(-5px) rotate(-16deg); }
}

.site-header {
	position: fixed;
	inset: 14px 0 auto;
	z-index: 1000;
	pointer-events: none;
}
.header-inner {
	width: var(--container);
	height: 64px;
	margin-inline: auto;
	padding: 0 10px 0 14px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	border: 1px solid rgba(255,255,255,0.64);
	border-radius: 999px;
	background: rgba(255,255,255,0.78);
	backdrop-filter: blur(22px);
	box-shadow: 0 18px 50px rgba(25,38,36,0.14);
	pointer-events: auto;
}
.brand { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.brand-mark {
	width: 38px;
	height: 38px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--ink);
	color: white;
	font-weight: 900;
}
.brand-name {
	font-family: var(--display);
	font-size: clamp(1.25rem, 4vw, 1.65rem);
	font-weight: 800;
	color: var(--ink);
	letter-spacing: 0;
}
.header-actions { display: inline-flex; align-items: center; gap: 8px; }
.header-cta, .menu-toggle {
	height: 44px;
	border-radius: 999px;
	border: 1px solid var(--line);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	padding: 0 16px;
	font-weight: 800;
	color: var(--ink);
	background: white;
	cursor: pointer;
}
.header-cta {
	background: linear-gradient(135deg, var(--lavender-deep), #8e79d8);
	border-color: transparent;
	color: white;
	box-shadow: 0 14px 28px rgba(114,81,181,0.24);
}
.header-cta:hover { transform: translateY(-1px); box-shadow: 0 18px 36px rgba(114,81,181,0.3); }
.menu-toggle-lines { width: 18px; display: grid; gap: 4px; }
.menu-toggle-lines i { height: 2px; background: currentColor; border-radius: 9px; transition: 0.2s ease; }
.menu-toggle.open { background: var(--ink); color: white; border-color: transparent; }
.menu-toggle.open .menu-toggle-lines i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.menu-toggle.open .menu-toggle-lines i:nth-child(2) { opacity: 0; }
.menu-toggle.open .menu-toggle-lines i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.site-menu {
	position: fixed;
	top: 92px;
	right: max(16px, calc((100vw - 1140px) / 2));
	width: min(430px, calc(100vw - 32px));
	padding: 16px;
	border: 1px solid rgba(114,81,181,0.18);
	border-radius: 18px;
	background:
		linear-gradient(145deg, rgba(255,255,255,0.96), rgba(248,244,255,0.9)),
		white;
	backdrop-filter: blur(22px);
	box-shadow: 0 24px 70px rgba(35,26,56,0.18);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-14px) scale(0.98);
	transition: 0.22s ease;
	pointer-events: none;
}
.site-menu::before {
	content: "Menu Shasitter";
	display: block;
	margin: 0 0 10px;
	padding: 0 4px 8px;
	border-bottom: 1px solid rgba(114,81,181,0.14);
	color: var(--lavender-deep);
	font-size: 0.78rem;
	font-weight: 950;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}
.site-menu.open {
	opacity: 1;
	visibility: visible;
	transform: none;
	pointer-events: auto;
}
.site-menu a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 48px;
	margin-top: 8px;
	padding: 12px 14px;
	border: 1px solid rgba(114,81,181,0.1);
	border-radius: 12px;
	background: rgba(114,81,181,0.055);
	color: var(--ink);
	font-weight: 800;
	transition: 0.18s ease;
}
.site-menu a:hover {
	background: var(--ink);
	border-color: var(--ink);
	color: white;
	transform: translateX(3px);
}
.site-menu a::after {
	content: "";
	width: 8px;
	height: 8px;
	border-top: 2px solid currentColor;
	border-right: 2px solid currentColor;
	transform: rotate(45deg);
	opacity: 0.5;
}

.hero { min-height: 100svh; display: grid; align-items: center; padding: 118px 0 70px; }
.hero-inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(340px, 0.88fr);
	gap: clamp(28px, 5vw, 70px);
	align-items: center;
}
.hero h1, .section-title {
	font-family: var(--display);
	color: var(--ink);
	line-height: 1.02;
	letter-spacing: 0;
	margin: 0;
}
.hero h1 { font-size: clamp(3rem, 7vw, 6.2rem); max-width: 780px; }
.hero-desc {
	max-width: 620px;
	margin: 22px 0 0;
	font-size: clamp(1.05rem, 2vw, 1.24rem);
	color: var(--text);
}
.section-eyebrow {
	margin: 0 0 12px;
	color: var(--lavender-deep);
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-weight: 900;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.btn {
	min-height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 20px;
	border-radius: 999px;
	border: 1px solid var(--line);
	font-weight: 900;
	transition: 0.2s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn-brand { background: var(--ink); color: white; border-color: transparent; }
.btn-ghost { background: white; color: var(--ink); }
.btn-whatsapp {
	background: #25d366;
	color: white;
	border-color: transparent;
	box-shadow: 0 14px 30px rgba(37,211,102,0.24);
}
.hero-actions .btn-whatsapp {
	position: relative;
	min-height: 58px;
	padding-inline: 28px;
	font-size: 1.04rem;
	box-shadow: 0 18px 44px rgba(37,211,102,0.34);
	overflow: hidden;
}
.hero-actions .btn-whatsapp::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.28) 48%, transparent 72%);
	transform: translateX(-120%);
	transition: transform 0.55s ease;
	pointer-events: none;
}
.hero-actions .btn-whatsapp:hover::after { transform: translateX(120%); }
.btn-instagram {
	background: linear-gradient(135deg, #405de6, #c13584, #f56040);
	color: white;
	border: 0;
	box-shadow: 0 14px 30px rgba(193,53,132,0.2);
}
.btn-google {
	position: relative;
	overflow: hidden;
	background:
		linear-gradient(white, white) padding-box,
		linear-gradient(135deg, #4285f4, #34a853, #fbbc05, #ea4335) border-box;
	color: var(--ink);
	border: 2px solid transparent;
	box-shadow: 0 14px 30px rgba(66,133,244,0.13);
}
.btn-google::before {
	content: "G";
	width: 22px;
	height: 22px;
	display: inline-grid;
	place-items: center;
	margin-right: 8px;
	border-radius: 50%;
	background: linear-gradient(135deg, #4285f4, #34a853, #fbbc05, #ea4335);
	color: white;
	font-weight: 950;
	font-size: 0.8rem;
}
.btn-email {
	background: #ffffff;
	color: var(--ink);
	border-color: rgba(28,32,36,0.16);
	box-shadow: 0 14px 30px rgba(28,32,36,0.08);
}
.hero-visual { position: relative; }
.hero-visual img, .about-img {
	width: 100%;
	aspect-ratio: 4 / 4.2;
	object-fit: cover;
	border-radius: 16px;
	box-shadow: var(--shadow);
}
.hero-rating {
	position: absolute;
	left: 18px;
	bottom: 18px;
	padding: 14px 16px;
	border-radius: var(--radius);
	background: rgba(255,255,255,0.86);
	backdrop-filter: blur(16px);
	box-shadow: 0 14px 35px rgba(0,0,0,0.16);
}
.hero-rating span { display: block; font-weight: 950; color: var(--ink); }
.hero-rating small { color: var(--muted); font-weight: 800; }

.section { padding: clamp(70px, 10vw, 130px) 0; text-align: center; }
.section-alt { background: rgba(255,255,255,0.56); }
.section-title {
	font-size: clamp(2.2rem, 5vw, 4.2rem);
	max-width: 850px;
	margin-inline: auto;
}
.services-grid, .contact-grid, .trust-grid {
	display: grid;
	gap: 18px;
	margin-top: 38px;
}
.services-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.contact-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.trust-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.service-lead {
	max-width: 780px;
	margin: 22px auto 0;
	color: var(--text);
	font-size: 1.08rem;
}
.service-flow {
	position: relative;
	gap: 22px;
	align-items: stretch;
}
.service-flow::before {
	content: "";
	position: absolute;
	top: 64px;
	left: 8%;
	right: 8%;
	height: 2px;
	background: linear-gradient(90deg, transparent, rgba(63,111,103,0.36), rgba(198,161,76,0.48), transparent);
}
.glass-card {
	background: var(--panel);
	border: 1px solid rgba(255,255,255,0.72);
	box-shadow: 0 18px 45px rgba(25,38,36,0.08);
	backdrop-filter: blur(18px);
}
.service-card, .contact-card, .trust-item {
	position: relative;
	padding: 28px;
	border-radius: var(--radius);
	text-align: left;
}
.service-card {
	min-height: 360px;
	overflow: hidden;
	background:
		linear-gradient(145deg, rgba(255,255,255,0.92), rgba(255,255,255,0.68)),
		var(--panel);
}
.service-card::after {
	content: "";
	position: absolute;
	inset: auto 0 0;
	height: 4px;
	background: linear-gradient(90deg, rgba(114,81,181,0.28), var(--lavender), var(--lavender-deep), rgba(184,166,234,0.55));
	pointer-events: none;
}
.service-icon {
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--ink), var(--lavender-deep));
	color: white;
	font-weight: 900;
	margin-bottom: 22px;
	box-shadow: 0 16px 30px rgba(23,19,31,0.22);
}
.service-card h3, .contact-card h3, .trust-item h3 { margin: 0 0 10px; color: var(--ink); font-size: 1.3rem; }
.service-card p, .contact-card p, .trust-item p { margin: 0 0 18px; color: var(--muted); }
.service-card p { font-size: 0.98rem; }
.service-card strong { color: var(--lavender-deep); }
.trust-item {
	background: rgba(255,255,255,0.72);
	border: 1px solid var(--line);
	box-shadow: 0 18px 42px rgba(25,38,36,0.07);
}
.trust-item::before {
	content: "";
	display: block;
	width: 38px;
	height: 3px;
	margin-bottom: 18px;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--lavender), var(--lavender-deep));
}

.about-grid {
	display: grid;
	grid-template-columns: 0.9fr 1fr;
	gap: clamp(28px, 5vw, 64px);
	align-items: center;
	text-align: left;
}
.about-copy .section-title { margin-inline: 0; }
.about-copy p:not(.section-eyebrow) { color: var(--text); font-size: 1.05rem; }
.about-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin-top: 28px;
}
.about-stats div {
	position: relative;
	overflow: hidden;
	border-radius: var(--radius);
	background:
		linear-gradient(145deg, rgba(255,255,255,0.98), rgba(255,255,255,0.82)),
		linear-gradient(135deg, rgba(184,166,234,0.24), rgba(114,81,181,0.12));
	border: 1px solid rgba(114,81,181,0.16);
	padding: 22px 18px;
	text-align: center;
	box-shadow: 0 18px 42px rgba(25,38,36,0.1);
}
.about-stats div::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 4px;
	background: linear-gradient(90deg, var(--lavender), var(--lavender-deep), rgba(184,166,234,0.55));
}
.about-stats strong { display: block; font-size: 2.15rem; line-height: 1; color: var(--ink); }
.about-stats span { display: block; margin-top: 8px; color: var(--muted); font-size: 0.9rem; font-weight: 900; }

.companion-nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin: 30px auto;
}
.companion-btn {
	border: 1px solid var(--line);
	border-radius: 999px;
	background: white;
	color: var(--ink);
	padding: 12px 18px;
	font-weight: 900;
	cursor: pointer;
	box-shadow: 0 10px 28px rgba(25,38,36,0.08);
}
.companion-btn.active { background: var(--ink); color: white; border-color: var(--ink); }
.companion-stage {
	min-height: 520px;
	border-radius: var(--radius);
	background: rgba(255,255,255,0.62);
	border: 1px solid rgba(255,255,255,0.72);
	box-shadow: var(--shadow);
	overflow: hidden;
}
.companion-panel {
	display: none;
	grid-template-columns: 0.92fr 1fr;
	gap: 0;
	align-items: stretch;
	text-align: left;
	min-height: 520px;
}
.companion-panel.active { display: grid; }
.companion-panel img {
	width: 100%;
	height: 100%;
	min-height: 520px;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: center;
}
.companion-info { padding: clamp(28px, 5vw, 56px); align-self: center; }
.companion-info h3 {
	font-family: var(--display);
	font-size: clamp(2.5rem, 5vw, 4.4rem);
	line-height: 1;
	margin: 0 0 14px;
	color: var(--ink);
}
.companion-info p { color: var(--text); font-size: 1.05rem; }
.companion-info ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 0;
	margin: 22px 0 28px;
}
.companion-info li {
	border-radius: 999px;
	background: rgba(141,168,160,0.16);
	color: var(--lavender-deep);
	padding: 8px 12px;
	font-weight: 900;
	font-size: 0.86rem;
}

.avis-carousel { max-width: 760px; margin: 36px auto 0; }
.avis-actions { margin-top: 24px; }
.avis-card {
	display: none;
	padding: clamp(28px, 5vw, 46px);
	border-radius: var(--radius);
	background: white;
	box-shadow: var(--shadow);
}
.avis-card.active { display: block; }
.avis-card p { color: var(--text); font-size: 1.25rem; margin: 0 0 18px; }
.avis-controls { display: flex; justify-content: center; gap: 12px; margin-top: 18px; }
.avis-controls button {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	border: 0;
	background: var(--ink);
	color: white;
	font-size: 1.6rem;
	cursor: pointer;
}
.area-lead {
	max-width: 760px;
	margin: 22px auto 0;
	color: var(--text);
	font-size: 1.08rem;
}
.area-showcase {
	margin-top: 42px;
	display: grid;
	gap: 16px;
	justify-items: center;
}
.area-showcase-note {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	max-width: 680px;
	margin: 0;
	padding: 10px 16px;
	border: 1px solid rgba(114,81,181,0.14);
	border-radius: 999px;
	background: rgba(255,255,255,0.78);
	color: var(--lavender-deep);
	font-size: clamp(0.95rem, 1.5vw, 1.08rem);
	font-weight: 900;
	line-height: 1.3;
	text-align: center;
	box-shadow: 0 12px 30px rgba(35,26,56,0.07);
}
.area-panel {
	position: relative;
	width: min(980px, 100%);
	display: grid;
	gap: clamp(22px, 4vw, 34px);
	padding: clamp(28px, 5vw, 56px);
	border: 1px solid rgba(255,255,255,0.22);
	border-radius: 16px;
	background:
		radial-gradient(circle at 50% 0%, rgba(255,255,255,0.16), transparent 18rem),
		radial-gradient(circle at 12% 20%, rgba(184,166,234,0.24), transparent 16rem),
		linear-gradient(145deg, rgba(28,32,36,0.98), rgba(86,58,142,0.94)),
		var(--ink);
	color: white;
	box-shadow: 0 32px 90px rgba(35,26,56,0.28);
	overflow: hidden;
	text-align: center;
}
.area-panel::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
	background-size: 34px 34px;
	mask-image: linear-gradient(120deg, rgba(0,0,0,0.8), transparent 64%);
	pointer-events: none;
}
.area-panel-copy,
.area-village-cloud {
	position: relative;
	z-index: 1;
}
.area-panel-copy {
	display: grid;
	align-content: center;
	justify-items: center;
	gap: 14px;
}
.area-panel-copy span {
	color: rgba(255,255,255,0.72);
	font-size: 0.82rem;
	font-weight: 950;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}
.area-panel-copy strong {
	font-family: var(--display);
	font-size: clamp(3.2rem, 7vw, 5.8rem);
	line-height: 0.95;
	color: white;
	max-width: 660px;
}
.area-panel-copy p {
	max-width: 640px;
	margin: 0;
	color: rgba(255,255,255,0.82);
	font-size: 1.05rem;
	font-weight: 850;
}
.area-village-cloud {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 10px;
	align-content: center;
}
.area-village-cloud span {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	min-height: 42px;
	padding: 9px 13px;
	border: 1px solid rgba(255,255,255,0.14);
	border-radius: 999px;
	background: rgba(255,255,255,0.09);
	color: rgba(255,255,255,0.92);
	font-size: 0.83rem;
	font-weight: 900;
	line-height: 1.1;
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
	transition: 0.18s ease;
}
.area-village-cloud span::before {
	content: "";
	width: 8px;
	height: 8px;
	margin-right: 7px;
	border-radius: 50%;
	background: var(--lavender);
	box-shadow: 0 0 0 4px rgba(184,166,234,0.16);
	flex: 0 0 auto;
}
.area-village-cloud span:hover {
	background: rgba(255,255,255,0.15);
	border-color: rgba(255,255,255,0.28);
	transform: translateY(-1px);
}
.contact-card {
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.contact-lead {
	max-width: 760px;
	margin: 22px auto 0;
	color: var(--text);
	font-size: 1.08rem;
}
.contact-card p { margin-bottom: 24px; }
.contact-button {
	width: 100%;
	margin-top: auto;
}

.site-footer { padding: 54px 0; background: var(--ink); color: white; text-align: center; }
.footer-inner { width: var(--container); margin-inline: auto; display: grid; gap: 22px; }
.footer-brand p, .footer-copy { margin: 0; color: rgba(255,255,255,0.7); }
.footer-nav, .footer-social { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.footer-nav a, .footer-social a, .footer-link-button {
	border: 1px solid rgba(255,255,255,0.14);
	border-radius: 999px;
	padding: 8px 12px;
	color: rgba(255,255,255,0.86);
	font-weight: 800;
	font-size: 0.9rem;
}
.footer-link-button {
	background: transparent;
	cursor: pointer;
}
.footer-nav a:hover, .footer-social a:hover, .footer-link-button:hover {
	border-color: rgba(255,255,255,0.34);
	color: white;
}
.footer-platform.footer-whatsapp { background: rgba(37,211,102,0.18); border-color: rgba(37,211,102,0.34); }
.footer-platform.footer-instagram { background: rgba(193,53,132,0.18); border-color: rgba(193,53,132,0.34); }
.footer-platform.footer-email { background: rgba(255,255,255,0.08); }
.floating-wa {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 999;
	width: 54px;
	height: 54px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--green);
	color: white;
	font-weight: 950;
	box-shadow: 0 18px 40px rgba(37,211,102,0.34);
}

.cookie-consent {
	position: fixed;
	left: 16px;
	right: 16px;
	bottom: 16px;
	z-index: 1600;
	opacity: 0;
	transform: translateY(16px);
	transition: opacity 0.22s ease, transform 0.22s ease;
}
.cookie-consent.is-visible {
	opacity: 1;
	transform: none;
}
.cookie-consent-inner {
	width: min(960px, 100%);
	margin-inline: auto;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 18px;
	align-items: center;
	padding: 18px;
	border: 1px solid rgba(255,255,255,0.72);
	border-radius: var(--radius);
	background: rgba(255,255,255,0.94);
	backdrop-filter: blur(18px);
	box-shadow: var(--shadow);
}
.cookie-title {
	margin: 0 0 4px;
	color: var(--ink);
	font-weight: 950;
}
.cookie-consent p:not(.cookie-title) {
	margin: 0;
	color: var(--muted);
	font-size: 0.94rem;
	line-height: 1.5;
}
.cookie-actions, .cookie-modal-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: flex-end;
}
.cookie-actions .btn, .cookie-modal-actions .btn {
	min-height: 42px;
	padding: 10px 16px;
}
.cookie-modal {
	position: fixed;
	inset: 0;
	z-index: 1700;
	display: grid;
	place-items: center;
	padding: 18px;
	background: rgba(15, 18, 20, 0.58);
}
.cookie-modal-box {
	width: min(640px, 100%);
	max-height: min(760px, calc(100svh - 36px));
	overflow-y: auto;
	padding: 24px;
	border-radius: var(--radius);
	background: white;
	box-shadow: 0 34px 100px rgba(0,0,0,0.28);
}
.cookie-modal-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 18px;
}
.cookie-modal-head h2 {
	margin: 0;
	color: var(--ink);
	font-family: var(--display);
	font-size: clamp(2rem, 4vw, 3rem);
	line-height: 1;
}
.cookie-close {
	width: 42px;
	height: 42px;
	border: 1px solid var(--line);
	border-radius: 50%;
	background: white;
	color: var(--ink);
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
}
.cookie-options {
	display: grid;
	gap: 12px;
	margin: 20px 0;
}
.cookie-option {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 12px;
	align-items: flex-start;
	padding: 16px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: #fbfcf8;
}
.cookie-option input {
	width: 20px;
	height: 20px;
	margin-top: 3px;
	accent-color: var(--lavender-deep);
}
.cookie-option strong {
	display: block;
	color: var(--ink);
}
.cookie-option small {
	display: block;
	margin-top: 4px;
	color: var(--muted);
	line-height: 1.45;
}
body.cookie-modal-open { overflow: hidden; }

[data-reveal] { opacity: 0; transform: translateY(18px); transition: 0.55s ease; }
[data-reveal="right"] { transform: translateX(18px); }
[data-reveal="left"] { transform: translateX(-18px); }
[data-reveal].revealed { opacity: 1; transform: none; }

@media (max-width: 1100px) {
	.services-grid, .trust-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.contact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.service-flow::before { display: none; }
}

@media (max-width: 900px) {
	.header-cta { display: none; }
	.hero { min-height: auto; padding-top: 108px; }
	.hero-inner, .about-grid, .companion-panel { grid-template-columns: 1fr; text-align: center; }
	.hero-copy, .about-copy { text-align: center; }
	.hero h1, .hero-desc, .about-copy .section-title { margin-inline: auto; }
	.hero-actions { justify-content: center; }
	.services-grid, .contact-grid, .trust-grid { grid-template-columns: 1fr; }
	.service-flow::before { display: none; }
	.service-card { min-height: 0; text-align: center; }
	.service-icon { margin-inline: auto; }
	.about-stats { grid-template-columns: 1fr; }
	.companion-stage, .companion-panel { min-height: 0; }
	.companion-panel img { min-height: 300px; aspect-ratio: 16 / 11; }
	.companion-info { text-align: center; }
	.companion-info ul { justify-content: center; }
	.area-panel-copy p { margin-inline: auto; }
	.area-village-cloud { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cookie-consent-inner { grid-template-columns: 1fr; }
	.cookie-actions { justify-content: stretch; }
	.cookie-actions .btn { flex: 1 1 160px; }
}

@media (max-width: 520px) {
	.header-inner { height: 58px; padding-left: 10px; }
	.brand-mark { width: 34px; height: 34px; }
	.menu-toggle { padding: 0 12px; }
	.site-menu {
		inset: 78px 10px auto;
		width: auto;
		max-height: calc(100svh - 92px);
		overflow-y: auto;
	}
	.hero h1 { font-size: 2.75rem; }
	.btn { width: 100%; }
	.companion-btn { flex: 1 1 calc(50% - 10px); }
	.area-showcase { margin-top: 32px; }
	.area-panel { padding: 24px 18px; }
	.area-showcase-note { border-radius: 14px; }
	.area-panel-copy strong { font-size: 3.35rem; }
	.area-panel-copy p { font-size: 0.98rem; }
	.area-village-cloud { grid-template-columns: 1fr; }
	.area-village-cloud span { min-height: 38px; }
	.cookie-modal-box { padding: 18px; }
	.cookie-modal-head { align-items: flex-start; }
	.cookie-modal-actions .btn { flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
	[data-reveal] {
		opacity: 1;
		transform: none;
	}
}

/* Dashboard */
.dashboard-page .site-header,
.dashboard-page .site-footer,
.dashboard-page .floating-wa,
.dashboard-page .cookie-consent,
.dashboard-page .cookie-modal { display: none !important; }
.dash-app {
	min-height: 100vh;
	min-height: 100svh;
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	background:
		radial-gradient(circle at top right, rgba(141,168,160,0.24), transparent 34rem),
		#100d18;
	color: #f7f2ff;
}
.dash-sidebar {
	position: sticky;
	top: 0;
	height: 100vh;
	padding: 22px;
	border-right: 1px solid rgba(255,255,255,0.1);
	background: rgba(13,10,20,0.82);
	backdrop-filter: blur(20px);
	display: flex;
	flex-direction: column;
	gap: 26px;
}
.dash-logo {
	display: flex;
	align-items: center;
	gap: 10px;
	color: white;
}
.dash-logo span {
	width: 42px;
	height: 42px;
	border-radius: var(--radius);
	display: grid;
	place-items: center;
	background: linear-gradient(135deg, var(--lavender), var(--lavender-deep));
	color: white;
	font-weight: 950;
}
.dash-nav { display: grid; gap: 8px; }
.dash-nav-item, .dash-logout, .dash-menu-toggle, .dash-primary, .dash-secondary, .btn-icon {
	border: 0;
	border-radius: var(--radius);
	cursor: pointer;
	font-weight: 900;
}
.dash-nav-item, .dash-logout {
	width: 100%;
	padding: 13px 14px;
	text-align: left;
	background: transparent;
	color: rgba(255,255,255,0.72);
}
.dash-nav-item.active, .dash-nav-item:hover, .dash-logout:hover {
	background: rgba(255,255,255,0.1);
	color: white;
}
.dash-logout { margin-top: auto; }
.dash-main { min-width: 0; padding: 24px; }
.dash-topbar {
	min-height: 78px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 24px;
}
.dash-topbar-copy { min-width: 0; }
.dash-topbar-actions { display: inline-flex; align-items: center; gap: 10px; }
.dash-topbar p { margin: 0; color: #bfb4d5; font-weight: 800; }
.dash-topbar h1 { margin: 0; color: white; font-size: clamp(1.8rem, 4vw, 3rem); }
.dash-menu-toggle { display: none; padding: 12px 14px; background: rgba(255,255,255,0.1); color: white; }
.dash-primary {
	min-height: 46px;
	padding: 12px 16px;
	background: linear-gradient(135deg, var(--lavender), var(--lavender-deep));
	color: white;
	box-shadow: 0 16px 34px rgba(114,81,181,0.24);
}
.dash-secondary {
	min-height: 46px;
	padding: 12px 16px;
	background: rgba(255,255,255,0.1);
	color: white;
}
.dash-primary:disabled, .dash-secondary:disabled { opacity: 0.6; cursor: wait; }
.dash-view { display: none; }
.dash-view.active { display: grid; gap: 18px; }
.dash-grid { display: grid; gap: 16px; }
.kpi-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dash-card {
	border: 1px solid rgba(255,255,255,0.12);
	border-radius: var(--radius);
	background: rgba(255,255,255,0.075);
	box-shadow: 0 24px 70px rgba(0,0,0,0.24);
	backdrop-filter: blur(18px);
	padding: 22px;
}
.dash-card span, .dash-card small, .dash-card p { color: #bfb4d5; }
.dash-card strong { display: block; color: white; font-size: clamp(1.6rem, 3vw, 2.4rem); margin-top: 8px; }
.dash-card-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 18px;
}
.dash-card-head h2 { margin: 0; color: white; }
.dash-card-head p { margin: 4px 0 0; }
.dash-card-actions {
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 10px;
}
.dash-card-actions .dash-primary,
.dash-card-actions .dash-secondary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
}
.dash-chart-wrap { height: clamp(260px, 38vw, 360px); }
.dash-filters { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.dash-filter-label {
	display: grid;
	gap: 7px;
	color: #d8cfee;
	font-size: 0.84rem;
	font-weight: 900;
}
.dash-filter-wide { flex: 1 1 300px; }
.dash-filters input, .dash-filters select,
.dash-modal input, .dash-modal select, .dash-modal textarea {
	width: 100%;
	border: 1px solid rgba(255,255,255,0.14);
	border-radius: var(--radius);
	background: rgba(255,255,255,0.08);
	color: white;
	padding: 12px 14px;
	outline: 0;
	min-height: 46px;
	font-size: 16px;
}
.dash-modal textarea { min-height: 92px; resize: vertical; }
.dash-filters input:focus, .dash-filters select:focus,
.dash-modal input:focus, .dash-modal select:focus, .dash-modal textarea:focus {
	border-color: rgba(198,161,76,0.7);
	box-shadow: 0 0 0 3px rgba(198,161,76,0.12);
}
.dash-filters input, .dash-filters select { max-width: 260px; }
.dash-table-wrap { overflow-x: auto; }
.dash-table { width: 100%; border-collapse: collapse; min-width: 840px; }
.dash-table th, .dash-table td {
	padding: 14px 12px;
	border-bottom: 1px solid rgba(255,255,255,0.08);
	text-align: left;
}
.dash-table th { color: #bfb4d5; font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.08em; }
.dash-table td { color: white; }
.td-empty { text-align: center !important; color: #bfb4d5 !important; }
.td-actions { text-align: right !important; white-space: nowrap; }
.btn-icon {
	min-width: 38px;
	height: 38px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding-inline: 12px;
	margin-left: 6px;
	background: rgba(255,255,255,0.1);
	color: white;
	text-decoration: none;
}
.btn-calendar {
	background: rgba(184,166,234,0.18);
	color: #efe8ff;
}
.btn-danger, .btn-icon.btn-danger { color: #ff9a9a; }
.time-slot-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 30px;
	padding: 5px 10px;
	border-radius: 999px;
	background: rgba(184,166,234,0.16);
	color: #efe8ff !important;
	font-weight: 950;
	font-size: 0.8rem;
}
.badge-payment {
	display: inline-flex;
	padding: 5px 9px;
	border-radius: 999px;
	background: rgba(184,166,234,0.18);
	color: #e6dcff;
	font-weight: 900;
	font-size: 0.8rem;
}
.upcoming-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.upcoming-item {
	display: grid;
	grid-template-columns: 120px 1fr auto auto;
	gap: 12px;
	align-items: center;
	padding: 12px;
	border-radius: var(--radius);
	background: rgba(255,255,255,0.07);
	color: white;
}
.upcoming-item > span:first-child small {
	display: block;
	margin-top: 2px;
	color: #d8cfee;
	font-weight: 900;
}
.dash-calendar-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	padding: 8px 11px;
	border-radius: var(--radius);
	background: rgba(184,166,234,0.18);
	color: white;
	font-size: 0.8rem;
	font-weight: 950;
	text-decoration: none;
}
.upcoming-empty { color: #bfb4d5; }
.dash-modal {
	position: fixed;
	inset: 0;
	z-index: 2000;
	display: none;
	place-items: center;
	padding: 18px;
	background: rgba(8,6,12,0.72);
}
.dash-modal.open { display: grid; }
.dash-modal-box {
	width: min(560px, 100%);
	max-height: min(820px, calc(100svh - 36px));
	overflow-y: auto;
	display: grid;
	gap: 14px;
	padding: 22px;
	border: 1px solid rgba(255,255,255,0.16);
	border-radius: var(--radius);
	background: #181222;
	box-shadow: 0 30px 90px rgba(0,0,0,0.4);
}
body.dash-modal-open { overflow: hidden; }
.dash-modal-head, .dash-modal-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}
.dash-modal-head h2 { margin: 0; color: white; }
.dash-modal-head button {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	border: 0;
	background: rgba(255,255,255,0.1);
	color: white;
	font-size: 1.7rem;
	cursor: pointer;
}
.dash-modal label { display: grid; gap: 7px; color: #d8cfee; font-weight: 800; position: relative; }
.autocomplete-list {
	position: absolute;
	z-index: 3;
	top: calc(100% + 5px);
	left: 0;
	right: 0;
	display: none;
	border-radius: var(--radius);
	background: #241b32;
	border: 1px solid rgba(255,255,255,0.14);
	overflow: hidden;
}
.autocomplete-list.open { display: block; }
.ac-item { padding: 12px 14px; cursor: pointer; color: white; }
.ac-item:hover { background: rgba(255,255,255,0.1); }
.ac-create { color: #f5d977; font-weight: 900; }
.dash-toast {
	position: fixed;
	right: 18px;
	bottom: calc(18px + env(safe-area-inset-bottom));
	z-index: 3000;
	padding: 13px 16px;
	border-radius: var(--radius);
	background: white;
	color: #120e18;
	font-weight: 900;
	box-shadow: 0 18px 50px rgba(0,0,0,0.25);
	opacity: 0;
	transform: translateY(10px);
	pointer-events: none;
	transition: 0.2s ease;
}
.dash-toast.show { opacity: 1; transform: none; }
.dash-toast.error { background: #ffd6d6; }
.dash-bottom-nav {
	display: none;
	position: fixed;
	left: 10px;
	right: 10px;
	bottom: calc(10px + env(safe-area-inset-bottom));
	z-index: 1400;
	grid-template-columns: repeat(4, 1fr);
	gap: 6px;
	padding: 8px;
	border: 1px solid rgba(255,255,255,0.13);
	border-radius: 18px;
	background: rgba(18, 14, 24, 0.92);
	backdrop-filter: blur(18px);
	box-shadow: 0 18px 50px rgba(0,0,0,0.35);
}
.dash-bottom-nav button {
	min-height: 46px;
	border: 0;
	border-radius: 12px;
	background: transparent;
	color: rgba(255,255,255,0.72);
	font-size: 0.78rem;
	font-weight: 900;
	cursor: pointer;
}
.dash-bottom-nav button.active,
.dash-bottom-nav button:hover {
	background: rgba(255,255,255,0.1);
	color: white;
}
.dash-busy .dash-card { opacity: 0.82; }

@media (max-width: 980px) {
	.dash-app { grid-template-columns: 1fr; }
	.dash-sidebar {
		position: fixed;
		inset: 0 auto 0 0;
		z-index: 1500;
		width: min(290px, 86vw);
		height: 100svh;
		transform: translateX(-102%);
		transition: 0.2s ease;
	}
	.dash-sidebar.open { transform: none; }
	.dash-menu-toggle { display: inline-flex; }
	.kpi-grid { grid-template-columns: repeat(2, 1fr); }
	.upcoming-item { grid-template-columns: 1fr; }
	.dash-bottom-nav { display: grid; }
	.dash-main { padding-bottom: calc(98px + env(safe-area-inset-bottom)); }
}
@media (max-width: 620px) {
	.dash-main { padding: 14px 12px calc(98px + env(safe-area-inset-bottom)); }
	.dash-topbar {
		position: sticky;
		top: 0;
		z-index: 30;
		align-items: flex-start;
		padding: 10px 0 12px;
		background: linear-gradient(180deg, #100d18 82%, rgba(16,13,24,0));
	}
	.dash-topbar-actions { gap: 8px; }
	.dash-topbar .dash-primary { display: none; }
	.dash-refresh { padding-inline: 12px; }
	.kpi-grid { grid-template-columns: 1fr; }
	.dash-card { padding: 18px; }
	.dash-card-head { align-items: flex-start; flex-direction: column; }
	.dash-card-actions {
		width: 100%;
		justify-content: stretch;
	}
	.dash-card-actions .dash-primary,
	.dash-card-actions .dash-secondary {
		flex: 1 1 150px;
	}
	.dash-filters input, .dash-filters select { max-width: none; }
	.dash-filter-label { flex: 1 1 100%; }
	.dash-chart-wrap { height: 280px; }
	.dash-table-wrap { overflow: visible; }
	.dash-table {
		min-width: 0;
		border-collapse: separate;
		border-spacing: 0 12px;
	}
	.dash-table thead { display: none; }
	.dash-table, .dash-table tbody, .dash-table tr, .dash-table td { display: block; width: 100%; }
	.dash-table tr {
		padding: 12px;
		border: 1px solid rgba(255,255,255,0.1);
		border-radius: var(--radius);
		background: rgba(255,255,255,0.065);
	}
	.dash-table td {
		display: grid;
		grid-template-columns: 104px minmax(0, 1fr);
		gap: 10px;
		padding: 8px 0;
		border: 0;
	}
	.dash-table td::before {
		content: attr(data-label);
		color: #bfb4d5;
		font-size: 0.72rem;
		font-weight: 900;
		text-transform: uppercase;
		letter-spacing: 0.08em;
	}
	.td-actions {
		text-align: left !important;
		white-space: normal;
	}
	.td-actions .btn-icon {
		min-width: 92px;
		margin: 0 8px 8px 0;
	}
	.dash-modal {
		align-items: end;
		padding: 0;
	}
	.dash-modal-box {
		width: 100%;
		max-height: calc(92svh - env(safe-area-inset-bottom));
		border-radius: 18px 18px 0 0;
		padding: 18px 16px calc(18px + env(safe-area-inset-bottom));
	}
	.dash-modal-actions {
		position: sticky;
		bottom: calc(-18px - env(safe-area-inset-bottom));
		margin-inline: -16px;
		padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
		background: rgba(24,18,34,0.96);
	}
	.dash-modal-actions .dash-secondary,
	.dash-modal-actions .dash-primary {
		flex: 1 1 0;
	}
	.autocomplete-list {
		max-height: 230px;
		overflow-y: auto;
	}
}