/*
 * Klubik-tema: kobler WordPress' blokke til designets komponenter (klubik-design.css).
 */

/* ---------- Grundlag ---------- */

html,
body {
	margin: 0;
	background: var(--sand);
}
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	--app-font-sans: "DM Sans", system-ui, sans-serif;
	font-family: var(--app-font-sans);
}
.wp-site-blocks {
	padding: 0;
}
.app-frame,
.main-column {
	margin: 0 !important;
}
.wp-block-group.main-column {
	display: flex;
	flex-direction: column;
	min-height: 100dvh;
}
.app-frame > .main-column > .content {
	flex: 1 0 auto;
	width: min(1160px, 100%);
	margin: 0 auto !important;
}
.app-frame > .main-column > .app-footer {
	margin: 0 !important;
}

/* Designet bygger på en nulstilling (Tailwind preflight). Den gælder kun app-rammen og Klubiks egne dele,
   ikke indhold skrevet i editoren. */
:where(.sidebar, .topbar, .app-footer, .klubik, .home-page, .page-intro, .news-query) :where(h1, h2, h3, h4, p, ul, ol, figure) {
	margin: 0;
}
:where(.sidebar, .topbar, .app-footer, .klubik, .home-page, .news-query) :where(a) {
	color: inherit;
	text-decoration: none;
}
:where(.sidebar, .topbar, .klubik, .home-page) :where(button) {
	background: none;
	border: 0;
	padding: 0;
	font: inherit;
	color: inherit;
	cursor: pointer;
}
:where(.sidebar, .topbar, .klubik) :where(input, select, textarea) {
	font: inherit;
	color: var(--ink);
}
.home-page :is(.is-layout-flow, .is-layout-constrained) > *,
.page-intro :is(.is-layout-flow, .is-layout-constrained) > *,
.news-query .is-layout-flow > * {
	margin-block-start: 0;
}
.sidebar a.nav-link,
.brand,
.help-link {
	text-decoration: none;
}
:focus-visible {
	outline: 2px solid #cfe05c;
	outline-offset: 2px;
}

/* ---------- App-ramme ---------- */

.wp-block-group.app-frame {
	display: flex;
}
.sidebar .nav-group {
	display: block;
}
.help-link {
	color: #bdcdca;
}
.help-link:hover {
	color: #fff;
}
.side-weather small::first-letter {
	text-transform: uppercase;
}
.top-user {
	color: #5e7175;
	font-size: 16px;
	font-weight: 600;
}
.profile-avatar {
	text-decoration: none;
}
.top-login {
	color: #315e61;
	font-size: 16px;
	font-weight: 700;
	text-decoration: none;
}
.top-login:hover {
	color: #da795f;
}
.top-join {
	min-height: 34px;
	text-decoration: none;
}
.button {
	text-decoration: none;
	cursor: pointer;
}
.content {
	display: block;
}
@media (max-width: 760px) {
	.top-user {
		display: none;
	}
}

/* ---------- Sideintro og almindelige sider ---------- */

.page-intro .wp-block-post-title,
.page-intro h1 {
	font: 700 clamp(31px, 4vw, 42px) / 1.05 var(--serif);
	letter-spacing: -1.8px;
	color: #203942;
	margin: 0;
}
.page-intro .eyebrow {
	margin-bottom: 9px;
}
.page-intro .intro-copy {
	margin-top: 11px;
}
.page-image img {
	border-radius: 9px;
	width: 100%;
	max-height: 420px;
	object-fit: cover;
	margin-bottom: 28px;
}
.entry-content {
	font-size: 18px;
	line-height: 1.7;
	color: #33494f;
}
.entry-content > * + * {
	margin-block-start: 1.1rem;
}
.entry-content a {
	text-underline-offset: 3px;
}
.app-content > * + * {
	margin-block-start: 0;
}
.article-meta {
	gap: 10px;
	align-items: center;
	margin-bottom: 12px;
}
.article-meta .eyebrow {
	margin: 0;
}
.article-single .page-intro {
	margin-bottom: 26px;
}
.klubik-search {
	max-width: 420px;
	margin-top: 10px;
}
.klubik-search .wp-block-search__input {
	border: 1px solid var(--line);
	border-radius: 5px;
	background: var(--paper);
	padding: 8px 10px;
}
.empty-note {
	color: #86928d;
	font-size: 16.5px;
	padding: 25px 0;
}

/* ---------- Knapper (blokstile) ---------- */

.wp-block-button .wp-block-button__link {
	border-radius: 6px;
	min-height: 39px;
	padding: 0 15px;
	font-size: 16px;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	gap: 9px;
	transition: transform 0.18s, background 0.18s;
}
.wp-block-button .wp-block-button__link:hover {
	transform: translateY(-1px);
}
.wp-block-button.is-style-lime .wp-block-button__link {
	background: var(--lime);
	color: #253b3f;
}
.wp-block-button.is-style-lime .wp-block-button__link:hover {
	background: #e9f68a;
}
.wp-block-button.is-style-outline-klubik .wp-block-button__link {
	background: transparent;
	color: var(--deep);
	border: 1px solid #cbd5cd;
	min-height: 35px;
}
.wp-block-button.is-style-outline-klubik .wp-block-button__link:hover {
	background: #f2f2e8;
}
.wp-block-button.is-style-hero-link .wp-block-button__link {
	background: transparent;
	color: #e6eee7;
	padding: 0;
	font-weight: 600;
}
.wp-block-button.is-style-hero-link .wp-block-button__link::after {
	content: "→";
	color: var(--lime);
	margin-left: 2px;
}

/* Pil efter knapper og links med klassen has-arrow. */
.has-arrow .wp-block-button__link::after,
.has-arrow > a::after,
.news-arrow::after,
.contact-hours a::after {
	content: "";
	width: 14px;
	height: 14px;
	flex-shrink: 0;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- Forside: hero (Cover-blok) ---------- */

.wp-block-cover.hero-panel {
	padding: 58px 6% 0;
	min-height: 560px;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	border-radius: 0;
	overflow: hidden;
}
.wp-block-cover.hero-panel .wp-block-cover__image-background {
	z-index: 0;
	object-fit: cover;
}
.wp-block-cover.hero-panel::before {
	z-index: 1;
}
.wp-block-cover.hero-panel .wp-block-cover__background {
	z-index: 1;
}
.wp-block-cover.hero-panel .wp-block-cover__inner-container {
	z-index: 2;
	position: relative;
	width: 100%;
	flex: 1;
	display: flex;
	flex-direction: column;
	color: inherit;
}
.hero-copy > p.hero-kicker {
	font-size: 14px;
	line-height: 1.3;
	max-width: none;
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0;
}
.hero-copy .hero-kicker::before {
	content: "";
	background: var(--lime);
	width: 17px;
	height: 2px;
	display: block;
}
.hero-copy h1.wp-block-heading {
	font: 700 clamp(52px, 6.1vw, 76px) / 0.97 var(--serif);
	letter-spacing: -4.8px;
	color: #f7f4e8;
	margin: 24px 0 16px;
}
.hero-buttons {
	gap: 24px;
	margin-top: 24px !important;
}
.hero-copy > p.hero-proof {
	font-size: 14px;
	line-height: 1.6;
	color: #d3e2da;
	display: block;
	margin-top: 33px !important;
}
.hero-proof strong {
	color: #eff2e6;
	font-weight: 600;
}
.hero-photo .hero-bottom {
	margin-top: auto !important;
	gap: 9px;
}
.hero-bottom p {
	display: flex;
	align-items: center;
	gap: 7px;
	margin: 0;
}
.hero-place::before {
	content: "";
	width: 13px;
	height: 13px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E") center / contain no-repeat;
}
.open-label::before {
	content: "";
	background: var(--lime);
	border-radius: 50%;
	width: 6px;
	height: 6px;
}

/* ---------- Forside: nøgletal, hold, fællesskab ---------- */

.quick-stats .stat {
	display: flex;
}
.quick-stats .stat > p {
	margin: 0;
}
.quick-stats .stats-note strong {
	color: var(--deep);
	font-size: 16.5px;
}
.quick-stats .stats-note {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-end;
}
.section-heading {
	gap: 15px;
}
.text-link > a,
.contact-hours a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #315e61;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
}
.text-link > a:hover,
.contact-hours a:hover {
	color: #da795f;
}
.text-link {
	padding: 0;
}
.team-preview {
	display: block;
	text-decoration: none;
	color: inherit;
	transition: transform 0.18s;
}
.team-preview:hover {
	transform: translateY(-2px);
}
.team-preview > p.team-number {
	letter-spacing: 1.15px;
	color: #758779;
	font-size: 12.5px;
	margin: 0;
}
.team-preview > h3.wp-block-heading {
	font: 700 22.5px var(--serif);
	color: #28454b;
	letter-spacing: -0.5px;
	margin: 29px 0 4px;
}
.team-preview > p.preview-meta {
	justify-content: flex-start;
	color: #5c7474;
	border-top: 1px solid #344d3b1c;
	display: flex;
	align-items: center;
	gap: 5px;
	margin-top: 22px;
	padding-top: 12px;
	font-size: 14px;
}
.team-preview > p.preview-meta::before {
	content: "";
	width: 12px;
	height: 12px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E") center / contain no-repeat;
}
.feature-text h2.wp-block-heading {
	font: 700 36px / 1.07 var(--serif);
	letter-spacing: -1.7px;
	color: #263e45;
}
.feature-text .wp-block-buttons {
	margin: 0;
}
.feature-quote > p.quote-mark {
	color: #7fa18b;
	font: 700 62px / 1 Georgia, serif;
	margin: 0;
	max-width: none;
}
.feature-quote > p.quote-person {
	font: 400 14px / 1.5 var(--app-font-sans);
	color: #74877b;
	letter-spacing: 0;
	margin: 0;
	padding-left: 39px;
	position: relative;
}
.feature-quote > p.quote-person::before {
	content: "";
	position: absolute;
	left: 0;
	top: 2px;
	width: 29px;
	height: 29px;
	border-radius: 50%;
	background: #e8ad8f;
}
.feature-quote > p.quote-person strong {
	color: var(--ink);
	font-size: 15px;
}
.feature-quote > p.quote-graphic {
	color: #ffffff65;
	font: 800 137px var(--serif);
	letter-spacing: -12px;
	position: absolute;
	bottom: -54px;
	right: 4%;
	margin: 0;
	max-width: none;
	z-index: 0;
}

/* ---------- Nyheder (Query Loop) ---------- */

.news-list {
	list-style: none;
	padding: 0;
	margin: 0;
	border-top: 1px solid var(--line);
}
.news-list > li {
	margin: 0;
}
.news-item .news-date {
	font: 700 16px var(--serif);
	color: #41595c;
	text-transform: uppercase;
}
.news-item .news-tag {
	background: none;
	padding: 0;
	display: flex;
	gap: 4px;
	flex-wrap: wrap;
}
.news-item .news-tag a,
.article-meta .news-tag a {
	color: #51735f;
	letter-spacing: 0.9px;
	background: #e7edda;
	border-radius: 3px;
	padding: 4px 6px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
}
.news-item .news-tag .wp-block-post-terms__separator {
	display: none;
}
.news-item .news-tag:empty {
	display: none;
}
.news-item h3.wp-block-post-title {
	font: 700 19px var(--serif);
	letter-spacing: -0.3px;
	margin: 7px 0 4px;
}
.news-item h3.wp-block-post-title a:hover {
	color: #da795f;
}
.news-item .wp-block-post-excerpt {
	margin: 0;
}
.news-item .wp-block-post-excerpt__excerpt {
	color: #81908d;
	margin: 0;
	font-size: 15px;
}
.news-item .wp-block-post-excerpt__more-text {
	display: none;
}
a.news-arrow {
	border: 1px solid var(--line);
	color: #45696b;
	border-radius: 50%;
	width: 31px;
	height: 31px;
	display: grid;
	place-items: center;
	font-size: 0;
	text-decoration: none;
}
a.news-arrow:hover {
	background: #eef4e6;
}
.news-pagination {
	margin-top: 18px;
	font-size: 16px;
	font-weight: 700;
}

/* ---------- Tilmelding og kontakt ---------- */

.join-banner {
	display: flex;
}
.join-banner > p.join-orbit {
	color: #5a8072;
	border: 1px solid #bac99f;
	border-radius: 50%;
	flex-shrink: 0;
	width: 69px;
	height: 69px;
	margin: 0;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235a8072' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.67 19a2 2 0 0 0 1.416-.588l6.154-6.172a6 6 0 0 0-8.49-8.49L5.586 9.914A2 2 0 0 0 5 11.328V18a1 1 0 0 0 1 1z'/%3E%3Cpath d='M16 8 2 22'/%3E%3Cpath d='M17.5 15H9'/%3E%3C/svg%3E") center / 30px no-repeat;
}
.join-banner .join-text {
	flex: 1;
}
.join-banner .join-text h2 {
	font: 700 32px var(--serif);
	letter-spacing: -1px;
	margin: 0;
}
.join-banner .wp-block-buttons {
	flex-shrink: 0;
}
.home-contact h2.wp-block-heading {
	font: 700 29px var(--serif);
	letter-spacing: -0.7px;
	margin: 0 0 8px;
}
.contact-main > p:last-child {
	color: #7e8b88;
	font-size: 15px;
	line-height: 1.6;
}
.contact-hours > p.contact-label {
	letter-spacing: 1.1px;
	color: #909b94;
	margin: 4px 0 11px;
	font-size: 12.5px;
}
.contact-hours > p.contact-value {
	font-size: 16px;
	font-weight: 700;
	margin: 0;
}

@media (max-width: 760px) {
	.wp-block-cover.hero-panel {
		padding: 36px 22px 0;
		min-height: 540px !important;
	}
	.hero-copy h1.wp-block-heading {
		font-size: clamp(42px, 12.5vw, 59px);
		letter-spacing: -3.3px;
	}
	.join-banner {
		flex-direction: column;
		align-items: flex-start;
	}
	.feature-text h2.wp-block-heading {
		font-size: 31px;
	}
}

/* ---------- Rettelser ---------- */

/* Overskrifter i mørke flader arver ikke editorens overskriftsfarve. */
.member-card h3,
.sidebar h1,
.sidebar h2,
.sidebar h3 {
	color: #f8f4e9;
}
/* WordPress' admin-bjælke for redaktører. */
.admin-bar .sidebar,
.admin-bar .topbar {
	top: 32px;
}
.admin-bar .sidebar {
	height: calc(100dvh - 32px);
	min-height: calc(100dvh - 32px);
}
@media (max-width: 782px) {
	.admin-bar .sidebar,
	.admin-bar .topbar {
		top: 46px;
	}
}

/* Større skrift: små justeringer af layout. */
.brand small {
	font-size: 12px;
	letter-spacing: 1.1px;
}
.stat-label {
	max-width: 120px;
}

/* ---------- Offentlig ramme ---------- */

.wp-block-group.klubik-public {
	display: flex;
	flex-direction: column;
	min-height: 100dvh;
}
.klubik-public > .public-content {
	flex: 1 0 auto;
	margin: 0 !important;
}
.klubik-public > .app-footer {
	margin: 0 !important;
}
.klubik-public .public-header {
	margin: 0 !important;
}
.admin-bar .klubik-public .public-header {
	top: 32px;
}
@media (max-width: 782px) {
	.admin-bar .klubik-public .public-header {
		top: 46px;
	}
}
.klubik-public .public-brand,
.klubik-public .public-nav a {
	text-decoration: none;
}
.klubik-public .public-nav a {
	border: 0;
	padding: 10px 0;
	background: transparent;
	color: #50656a;
	font-weight: 600;
	white-space: nowrap;
	transition: color 0.18s;
}
.klubik-public .public-nav a.public-login {
	border-radius: 6px;
}
.klubik-public .public-brand small {
	letter-spacing: 1.15px;
}
.public-content.public-page {
	width: min(1160px, 100%);
	margin: 0 auto !important;
	padding: 48px clamp(24px, 5.3vw, 80px) 70px;
}
.klubik-public .public-content p.hero-proof {
	display: block;
}
.klubik-public .public-content .home-page {
	margin: 0;
}
.klubik-public .wp-block-cover.hero-panel {
	padding-left: clamp(24px, 5.3vw, 80px);
	padding-right: clamp(24px, 5.3vw, 80px);
}
.klubik-public .quick-stats,
.klubik-public .home-section,
.klubik-public .home-news,
.klubik-public .home-contact {
	padding-left: clamp(24px, 5.3vw, 80px);
	padding-right: clamp(24px, 5.3vw, 80px);
}
.klubik-public .join-banner {
	margin-left: clamp(24px, 5.3vw, 80px);
	margin-right: clamp(24px, 5.3vw, 80px);
}
.klubik-public .feature-text {
	padding-left: clamp(24px, 5.3vw, 80px);
}
.klubik-public .feature-quote {
	padding-right: clamp(24px, 5.3vw, 80px);
}
.klubik-public :target {
	scroll-margin-top: 100px;
}
html {
	scroll-behavior: smooth;
}
@media (max-width: 760px) {
	.public-content.public-page {
		padding: 30px 18px 50px;
	}
	.klubik-public .public-nav a {
		text-align: left;
		padding: 12px 0;
		border-bottom: 1px solid #eeeadf;
	}
	.klubik-public .public-nav a.public-login {
		align-self: flex-start;
		margin-top: 12px;
		padding: 0 15px;
		border-bottom: 0;
	}
	.klubik-public .quick-stats {
		grid-template-columns: 1fr 1fr;
	}
}
.feature-quote > p.quote-person {
	min-height: 29px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.feature-quote > p.quote-person br {
	display: none;
}
.feature-quote > p.quote-person strong {
	display: block;
}
@media (max-width: 760px) {
	.klubik-public .quick-stats .stats-note {
		display: none;
	}
	.klubik-public .quick-stats {
		grid-template-columns: 1fr 1fr;
	}
}

/* ---------- Klubbens eget logo ---------- */
.brand.has-logo { gap: 12px; letter-spacing: 0; }
.brand-logo-tile { flex: 0 0 auto; display: grid; place-items: center; width: 58px; height: 50px; padding: 4px; border-radius: 12px; background: #fffef9; }
.brand-logo-tile img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.brand-club { font: 800 18px/1.15 var(--serif); letter-spacing: -0.4px; }
.brand-club small { margin-top: 4px; }
.klubik-public .public-brand.has-logo { gap: 12px; letter-spacing: -0.4px; }
.klubik-public .public-brand-logo { display: block; height: 52px; width: auto; }
.klubik-public .public-brand-club { font: 800 19px/1.1 Manrope, sans-serif; }
@media (max-width: 760px) {
  .klubik-public .public-brand-logo { height: 42px; }
  .klubik-public .public-brand-club { font-size: 17px; }
}

/* ---------- Padel: nøgletal som mørkt bånd og varme fremhævninger ---------- */
.klubik-sport-padel .klubik-public .quick-stats { background: var(--deep2); border-bottom: 0; }
.klubik-sport-padel .quick-stats > div:not(:last-child) { border-right-color: #ffffff2e; }
.klubik-sport-padel .quick-stats .stat-num { color: var(--lime); }
.klubik-sport-padel .quick-stats .stat-label,
.klubik-sport-padel .quick-stats .stats-note { color: #ffffffb3; }
.klubik-sport-padel .quick-stats .stats-note strong { color: #fff; }
.klubik-sport-padel .section-heading h2 em,
.klubik-sport-padel .feature-text h2 em { color: var(--coral); }
.klubik-sport-padel .join-banner > p.join-orbit {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235a8072' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10' cy='9.5' r='6.5'/%3E%3Cpath d='m14.6 14.1 6.4 6.4'/%3E%3Cpath d='M8 7.5h.01M12 7.5h.01M10 11h.01M7.5 11h.01M12.5 11h.01'/%3E%3C/svg%3E");
}

/* ---------- Sidefod: privatliv og cookies ---------- */
.app-footer .footer-links { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 20px; }
.app-footer .footer-links a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.app-footer .footer-links a:hover { color: var(--deep); }
.brand-logo-tile img { height: 42px; width: auto; max-width: 50px; object-fit: contain; }

/* ---------- Hovedsitet: salgssiden for Klubik ---------- */
.klubik-salg { --salg-pad: clamp(24px, 5.3vw, 80px); }
.klubik-salg .salg-hero .hero-copy { max-width: 700px; }
.klubik-salg .salg-hero .hero-copy > p { max-width: 520px; }
.klubik-salg .salg-strip { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--deep); color: #b7c9c4; padding: 22px var(--salg-pad); gap: 0; }
.klubik-salg .salg-strip p { margin: 0; padding: 4px 22px; border-left: 1px solid #ffffff1f; font-size: 15px; line-height: 1.35; }
.klubik-salg .salg-strip p:first-child { border-left: 0; padding-left: 0; }
.klubik-salg .salg-strip strong { display: block; color: var(--lime); font: 800 26px/1.1 var(--serif); letter-spacing: -0.8px; margin-bottom: 4px; }
.klubik-salg .salg-section { padding: 84px var(--salg-pad); margin: 0; }
.klubik-salg .salg-section h2 { font: 800 clamp(30px, 3.6vw, 44px)/1.08 var(--serif); letter-spacing: -1.6px; color: #263e45; margin: 0 0 18px; }
.klubik-salg .salg-section h2 em { font-style: normal; color: var(--moss, #61897d); }
.klubik-salg .salg-section h3 { font: 800 21px/1.25 var(--serif); letter-spacing: -0.4px; color: var(--deep); margin: 0 0 8px; }
.klubik-salg .salg-section p { font-size: 16.5px; line-height: 1.65; color: #44595e; margin: 0 0 12px; }
.klubik-salg .salg-sublead { max-width: 720px; font-size: 18px !important; }
.klubik-salg .salg-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 34px; }
.klubik-salg .salg-pillar { background: #fffdf6; border: 1px solid var(--line); border-radius: 18px; padding: 26px; }
.klubik-salg .salg-pillar:before { content: ""; display: block; width: 38px; height: 38px; border-radius: 12px 12px 12px 4px; background: var(--lime); margin-bottom: 16px; transform: rotate(-4deg); }
.klubik-salg .salg-demo { background: var(--deep); }
.klubik-salg .salg-demo h2 { color: #f7f4e8; }
.klubik-salg .salg-demo h2 em { color: var(--lime); }
.klubik-salg .salg-demo .eyebrow { color: #a8c6bd; }
.klubik-salg .salg-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 30px; }
.klubik-salg .salg-demo-card h3 { color: #fff; margin-top: 18px; }
.klubik-salg .salg-demo-card h3 a { color: inherit; text-decoration: none; }
.klubik-salg .salg-demo-card h3 a:after { content: " →"; color: var(--lime); }
.klubik-salg .salg-demo-card p { color: #b7c9c4; }
.klubik-salg .salg-shot { margin: 0; border-radius: 14px; overflow: hidden; border: 1px solid #ffffff22; box-shadow: 0 24px 50px -24px rgba(9, 35, 42, .55); background: #fff; }
.klubik-salg .salg-shot img { display: block; width: 100%; height: auto; transition: transform .4s ease; }
.klubik-salg .salg-demo-card .salg-shot a:hover img { transform: scale(1.02); }
.klubik-salg .salg-features { display: grid; gap: 80px; }
.klubik-salg .salg-feature { display: grid; grid-template-columns: 1.3fr 1fr; gap: 56px; align-items: center; }
.klubik-salg .salg-feature.is-reversed .salg-shot { order: 2; }
.klubik-salg .salg-feature .salg-shot { border-color: var(--line); }
.klubik-salg .salg-feature.is-tall .salg-shot { max-width: 380px; justify-self: center; }
.klubik-salg .salg-role { display: inline-block; background: var(--lime); color: var(--deep) !important; font: 700 12.5px/1 var(--app-font-sans, "DM Sans") !important; letter-spacing: 1.3px; padding: 7px 12px !important; border-radius: 30px; margin-bottom: 14px !important; }
.klubik-salg .salg-feature h3 { font-size: 28px; letter-spacing: -0.8px; }
.klubik-salg .salg-checks { list-style: none; padding: 0; margin: 14px 0 0; }
.klubik-salg .salg-checks li { position: relative; padding: 6px 0 6px 30px; font-size: 16px; color: #33494f; }
.klubik-salg .salg-checks li:before { content: ""; position: absolute; left: 0; top: 9px; width: 18px; height: 18px; border-radius: 50%; background: var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23173e48' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 11px no-repeat; }
.klubik-salg .salg-all { background: #f3f0e7; }
.klubik-salg .salg-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 30px; }
.klubik-salg .salg-tile { background: #fffef9; border: 1px solid var(--line); border-radius: 16px; padding: 22px 24px; }
.klubik-salg .salg-tile h3 { font-size: 18px; }
.klubik-salg .salg-tile p { font-size: 15px; margin: 0; }
.klubik-salg .salg-band { background: #fffef9; border: 1px solid var(--line); border-radius: 20px; padding: 28px 30px; margin-top: 22px; }
.klubik-salg .salg-band.is-deep { background: var(--deep); border-color: var(--deep); }
.klubik-salg .salg-band.is-deep h3 { color: #fff; }
.klubik-salg .salg-band.is-deep p { color: #cddcd9; }
.klubik-salg .salg-duo-text { margin-top: 0; gap: 22px; }
.klubik-salg .salg-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0 !important; }
.klubik-salg .salg-tags span { display: inline-block; font-size: 14px; font-weight: 700; padding: 8px 14px; border-radius: 30px; background: #f3f0e7; color: var(--deep); border: 1px solid var(--line); }
.klubik-salg .is-deep .salg-tags span { background: #ffffff14; color: #fff; border-color: #ffffff33; }
.klubik-salg .salg-price-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr; gap: 16px; margin: 30px 0 18px; }
.klubik-salg .salg-price { background: #fffdf6; border: 1px solid var(--line); border-radius: 18px; padding: 26px 24px; }
.klubik-salg .salg-price.is-main { background: var(--deep); border-color: var(--deep); }
.klubik-salg .salg-price-label { font: 700 12.5px/1.3 var(--app-font-sans, "DM Sans") !important; letter-spacing: 1.3px; color: var(--moss, #61897d) !important; margin-bottom: 12px !important; }
.klubik-salg .is-main .salg-price-label { color: var(--lime) !important; }
.klubik-salg .salg-price-num { font: 800 38px/1 var(--serif) !important; letter-spacing: -1.2px; color: var(--deep) !important; margin-bottom: 10px !important; }
.klubik-salg .is-main .salg-price-num { color: #fff !important; }
.klubik-salg .salg-price p { font-size: 15px; margin: 0; }
.klubik-salg .is-main p { color: #c8d6d3; }
.klubik-salg .salg-fine { font-size: 14.5px !important; color: #6b7c80 !important; }
.klubik-salg .salg-steps-section { background: #f3f0e7; }
.klubik-salg .salg-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 28px; }
.klubik-salg .salg-step { border-top: 4px solid var(--lime); padding-top: 18px; }
.klubik-salg .salg-step-num { font: 800 30px/1 var(--serif) !important; color: var(--moss, #61897d) !important; margin-bottom: 10px !important; }
.klubik-salg .salg-contact { display: grid; grid-template-columns: 1fr 1.1fr; gap: 56px; align-items: start; }
.klubik-salg .salg-who { margin-top: 22px !important; font-size: 16px !important; }
.klubik-salg .salg-who a { color: var(--deep); }
.klubik-contact { background: #fffdf6; border: 1px solid var(--line); border-radius: 20px; padding: 28px; display: grid; gap: 14px; }
.klubik-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.klubik-contact label { display: grid; gap: 6px; font-size: 14px; font-weight: 700; color: #33494f; }
.klubik-contact input, .klubik-contact textarea { font: 400 16px/1.4 inherit; font-family: inherit; padding: 12px 14px; border: 1px solid #d9d3c5; border-radius: 10px; background: #fff; color: var(--ink); }
.klubik-contact input:focus, .klubik-contact textarea:focus { outline: 3px solid var(--lime); outline-offset: 1px; border-color: var(--deep); }
.klubik-contact-submit { justify-self: start; display: inline-flex; align-items: center; gap: 8px; background: var(--lime); color: var(--deep); border: 0; border-radius: 10px; padding: 14px 22px; font: 700 16px/1 inherit; font-family: inherit; cursor: pointer; }
.klubik-contact-submit:hover { filter: brightness(.95); }
.klubik-contact-note { font-size: 13.5px !important; color: #6b7c80 !important; margin: 0 !important; }
.klubik-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.klubik-contact-done { background: var(--deep); color: #fff; border-radius: 20px; padding: 30px; }
.klubik-contact-done b { font: 800 22px/1.2 var(--serif); color: var(--lime); }
.klubik-contact-done p { color: #cddcd9 !important; margin: 8px 0 0 !important; }
.app-footer a { color: inherit; }
@media (max-width: 900px) {
	.klubik-salg .salg-strip { grid-template-columns: 1fr 1fr; row-gap: 16px; }
	.klubik-salg .salg-strip p:nth-child(3) { border-left: 0; padding-left: 0; }
	.klubik-salg .salg-pillars, .klubik-salg .salg-tiles { grid-template-columns: 1fr; }
	.klubik-salg .salg-duo, .klubik-salg .salg-feature, .klubik-salg .salg-contact { grid-template-columns: 1fr; gap: 26px; }
	.klubik-salg .salg-feature.is-reversed .salg-shot { order: 0; }
	.klubik-salg .salg-price-grid, .klubik-salg .salg-steps { grid-template-columns: 1fr 1fr; }
	.klubik-salg .salg-section { padding: 60px 22px; }
	.klubik-contact-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
	.klubik-salg .salg-price-grid, .klubik-salg .salg-steps, .klubik-salg .salg-strip { grid-template-columns: 1fr; }
	.klubik-salg .salg-strip p { border-left: 0; padding-left: 0; }
}
.klubik-salg :is(.salg-pillars, .salg-tiles, .salg-steps, .salg-price-grid, .salg-duo, .salg-strip, .salg-features) > * { margin-top: 0 !important; margin-bottom: 0 !important; }
