/*
Theme Name: Customer Foundry
Theme URI: https://customer-foundry.com
Author: Customer Foundry
Author URI: https://customer-foundry.com
Description: Block theme for Customer Foundry, built on The Cut brand identity (Brand Book v2.0, 29 Aug 2026 — supersedes v1.0). Dark primary, Montserrat 725 display, Inter body, warm amber/copper/cream system. Bilingual-ready (EN now, HU via Polylang).
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.23.7
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: customer-foundry
Tags: block-theme, full-site-editing, business, dark-mode, one-column, custom-colors, custom-logo, custom-menu, blog
*/

/* ==========================================================================
   Customer Foundry — component layer
   Token rules from Brand Book v2.0 ("The Cut", 29 Aug 2026 — supersedes v1.0):
   - no shadows anywhere; elevation = raised surface + 1px border + radius
   - amber is dark-only; on light grounds it becomes Copper Light #C0721F
   - text on an amber fill is always warm black, never white
   - Montserrat display / Inter body — the two never swap jobs
   ========================================================================== */

:root {
	--cf-bg:        #0E0C09;
	--cf-raised:    #1A1610;
	--cf-border:    #2C261D;
	--cf-text:      #F0E9DE;
	--cf-heading:   #F6F0E5;
	--cf-sec:       #B3AA9A;
	--cf-muted:     #8F8676;
	--cf-prose:     #DCD4C6;
	--cf-accent:      #DB8A3E;
	--cf-accent-text: #DB8A3E;
	--cf-accent-hi:   #E6994B;
	--cf-on-accent:   #15130F;
	--cf-pass:      #7FB57F;
	--cf-fail:      #D98A6A;
	--cf-pass-mark: #7FB57F;
	--cf-fail-mark: #D98A6A;
	--cf-divider:   #1A1610;

	--cf-r-card:  18px;
	--cf-r-stage: 16px;
	--cf-r-pill:  100px;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background: var(--cf-bg);
	color: var(--cf-text);
}

:where(.wp-site-blocks) > * { margin-block-start: 0; }

/* --------------------------------------------------------------------------
   1. Bands — a section flips the whole token set, so every component inside
      recolours itself correctly. Applied as block style variations too.
   -------------------------------------------------------------------------- */

.cf-band { padding-block: clamp(56px, 8vw, 88px); }

.cf-band--dark    { background: var(--cf-bg); }
.cf-band--raised  { background: #12100C; border-block: 1px solid var(--cf-border); }

.cf-band--cream,
.is-style-cf-cream,
.cf-panel--cream {
	--cf-bg:        #F0E9DE;
	--cf-raised:    #E7DBC7;
	--cf-border:    rgba(21, 19, 15, 0.16);
	--cf-text:      #15130F;
	--cf-heading:   #15130F;
	--cf-prose:     rgba(21, 19, 15, 0.82);
	--cf-sec:       rgba(21, 19, 15, 0.74);
	--cf-muted:     rgba(21, 19, 15, 0.66);
	/* Copper Light is the book's amber substitute on light, but it measures
	   3.07:1 on cream — large text and graphics only. Small text on a light
	   ground uses warm black, which is the only AA-safe option in the palette. */
	--cf-accent:      #C0721F;
	--cf-accent-text: #15130F;
	--cf-accent-hi:   #A85F17;
	--cf-on-accent:   #15130F;
	--cf-pass:      #15130F;
	--cf-fail:      #15130F;
	--cf-pass-mark: #15130F;
	--cf-fail-mark: #B5561F;
	--cf-divider:   rgba(21, 19, 15, 0.16);
	background: #F0E9DE;
	color: #15130F;
}

.cf-band--amber,
.is-style-cf-amber {
	--cf-bg:        #DB8A3E;
	--cf-raised:    #E39A55;
	--cf-border:    rgba(21, 19, 15, 0.24);
	--cf-text:      #15130F;
	--cf-heading:   #15130F;
	--cf-prose:     rgba(21, 19, 15, 0.86);
	--cf-sec:       rgba(21, 19, 15, 0.80);
	--cf-muted:     rgba(21, 19, 15, 0.70);
	--cf-accent:      #15130F;
	--cf-accent-text: #15130F;
	--cf-accent-hi:   #000000;
	/* a button on the amber band is a warm-black pill with cream type —
	   never white-on-amber, and never warm-black-on-warm-black */
	--cf-on-accent: #F0E9DE;
	--cf-pass:      #15130F;
	--cf-fail:      #15130F;
	background: #DB8A3E;
	color: #15130F;
}

.cf-band--cream :is(h1, h2, h3, h4, h5),
.cf-band--amber :is(h1, h2, h3, h4, h5),
.is-style-cf-cream :is(h1, h2, h3, h4, h5),
.is-style-cf-amber :is(h1, h2, h3, h4, h5) { color: var(--cf-heading); }

.cf-band--cream a:not(.cf-btn):not(.wp-block-button__link),
.is-style-cf-cream a:not(.cf-btn):not(.wp-block-button__link),
.cf-panel--cream a:not(.cf-btn) {
	color: var(--cf-accent-text);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* --------------------------------------------------------------------------
   2. The lockup — Brand Book §03/§04, built live to spec.
      Montserrat 725 · CUSTOMER = 0.80 × FOUNDRY · tracking .310em / .200em
      baseline 1 → cap line 2 = 0.30 × FOUNDRY size · both lines flush both edges
      mark height = wordmark block (1.56 × FOUNDRY size) · gap = 1.15 bar heights
      kerning off.  --cf-lockup is the FOUNDRY size; everything derives from it.
   -------------------------------------------------------------------------- */

.cf-logo {
	--cf-lockup: 20px;
	display: inline-flex;
	align-items: flex-start;
	line-height: 1;
	text-decoration: none;
}

.cf-logo__mark {
	flex: none;
	display: block;
	height: calc(var(--cf-lockup) * 1.56);
	width: calc(var(--cf-lockup) * 1.56 * 44 / 38);
	margin-top: calc(var(--cf-lockup) * 0.1268); /* cap line of CUSTOMER */
	overflow: visible;
}

.cf-logo__type {
	display: block;
	/* 1.15 × one bar height, where one bar = block height × 10/38 */
	margin-left: calc(var(--cf-lockup) * 1.56 * 10 / 38 * 1.15);
}

.cf-logo__l1,
.cf-logo__l2 {
	display: block;
	font-family: Montserrat, 'Avenir Next', 'Century Gothic', system-ui, sans-serif;
	font-variation-settings: 'wght' 725;
	font-weight: 725;
	font-kerning: none;
	font-feature-settings: 'kern' 0;
	line-height: 1;
	white-space: nowrap;
}

.cf-logo__l1 {
	font-size: calc(var(--cf-lockup) * 0.8);
	letter-spacing: 0.310em;
	margin-right: -0.310em;
	color: #F0E9DE;
}

.cf-logo__l2 {
	font-size: var(--cf-lockup);
	letter-spacing: 0.200em;
	margin-right: -0.200em;
	margin-top: calc(var(--cf-lockup) * 0.0283);
	color: #DB8A3E;
}

/* on light grounds: warm black + copper light (Book §03 colour on light) */
.cf-band--cream .cf-logo__l1,
.is-style-cf-cream .cf-logo__l1,
.cf-band--amber .cf-logo__l1,
.is-style-cf-amber .cf-logo__l1 { color: #15130F; }

.cf-band--cream .cf-logo__l2,
.is-style-cf-cream .cf-logo__l2 { color: #C0721F; }

.cf-band--amber .cf-logo__l2,
.is-style-cf-amber .cf-logo__l2 { color: #15130F; }

.cf-band--amber .cf-logo__mark .cf-bar,
.is-style-cf-amber .cf-logo__mark .cf-bar { fill: #15130F; }

.cf-band--cream .cf-logo__mark .cf-bar-1,
.is-style-cf-cream .cf-logo__mark .cf-bar-1 { fill: #C0721F; }
.cf-band--cream .cf-logo__mark .cf-bar-2,
.is-style-cf-cream .cf-logo__mark .cf-bar-2 { fill: #15130F; }
.cf-band--cream .cf-logo__mark .cf-bar-3,
.is-style-cf-cream .cf-logo__mark .cf-bar-3 { fill: #B5561F; }

/* --------------------------------------------------------------------------
   3. Header
   -------------------------------------------------------------------------- */

/* The header sits inside a .wp-block-template-part wrapper. A sticky element only
   travels inside its own containing block, and that wrapper is exactly as tall as
   the header, so sticking the header itself does nothing. Stick the wrapper.
   No backdrop-filter anywhere here either: a filtered ancestor becomes the
   containing block for position:fixed children and traps the mobile overlay. */
.wp-site-blocks > .wp-block-template-part:first-child,
.wp-block-template-part:has(> .cf-header) {
	position: sticky;
	top: 0;
	z-index: 60;
}

.admin-bar .wp-site-blocks > .wp-block-template-part:first-child,
.admin-bar .wp-block-template-part:has(> .cf-header) { top: 32px; }
@media (max-width: 782px) {
	.admin-bar .wp-site-blocks > .wp-block-template-part:first-child,
	.admin-bar .wp-block-template-part:has(> .cf-header) { top: 46px; }
}

.cf-header {
	position: relative;
	z-index: 60;
	background: #0E0C09;
	border-bottom: 1px solid #2C261D;
}

.cf-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	max-width: 1080px;
	margin-inline: auto;
	padding: 14px 28px;
}

.cf-nav ul {
	display: flex;
	align-items: center;
	gap: 26px;
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 14px;
	font-weight: 500;
}

.cf-nav a {
	color: #B3AA9A;
	text-decoration: none;
	transition: color 0.18s ease;
}

.cf-nav a:hover,
.cf-nav .current-menu-item > a { color: #DB8A3E; text-decoration: none; }

/* Mobile menu is handled by the core Navigation block's own overlay —
   see §16 for the overlay styling. */

/* --------------------------------------------------------------------------
   4. Buttons
   -------------------------------------------------------------------------- */

.cf-btn {
	display: inline-block;
	font-family: Inter, system-ui, sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	padding: 12px 22px;
	border-radius: var(--cf-r-pill);
	border: 1px solid transparent;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}
.cf-btn:hover { text-decoration: none; }
.cf-btn:active { transform: translateY(1px); }
.cf-btn:focus-visible { outline: 2px solid var(--cf-text); outline-offset: 2px; }

.cf-btn--primary { background: var(--cf-accent); color: var(--cf-on-accent); border-color: var(--cf-accent); }
.cf-btn--primary:hover { background: var(--cf-accent-hi); border-color: var(--cf-accent-hi); color: var(--cf-on-accent); }

.cf-btn--ghost { background: transparent; color: var(--cf-text); border-color: #4A4030; }
.cf-btn--ghost:hover { border-color: var(--cf-accent); color: var(--cf-accent); }
.cf-band--cream .cf-btn--ghost,
.is-style-cf-cream .cf-btn--ghost { border-color: rgba(21, 19, 15, 0.3); }

.cf-btn--black { background: #15130F; color: #F0E9DE; border-color: #15130F; }
.cf-btn--black:hover { background: #000; border-color: #000; color: #F0E9DE; }

.cf-btn--lg { padding: 15px 28px; font-size: 15px; }

/* --------------------------------------------------------------------------
   5. Section furniture
   -------------------------------------------------------------------------- */

.cf-eyebrow {
	font-family: Inter, system-ui, sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--cf-accent-text);
	margin: 0 0 14px;
}

.cf-lead {
	font-size: 16.5px;
	color: var(--cf-sec);
	padding-right: max(0px, calc(min(100%, 1080px) - 64ch));
	margin-top: 16px;
}

.cf-note {
	font-size: 14px;
	color: var(--cf-muted);
	padding-right: max(0px, calc(min(100%, 1080px) - 72ch));
	margin-top: 24px;
}
.cf-note b { color: var(--cf-text); }

.cf-measure { padding-right: max(0px, calc(min(100%, 1080px) - 60ch)); }

/* --------------------------------------------------------------------------
   6. Hero
   -------------------------------------------------------------------------- */

.cf-hero {
	position: relative;
	overflow: hidden;
	background: radial-gradient(120% 120% at 82% -10%, #241D15 0%, #0E0C09 62%);
	border-bottom: 1px solid #2C261D;
	padding-block: clamp(40px, 8vw, 104px) clamp(52px, 9vw, 96px);
}

/* On a phone the hero used to open with ~145px of empty ground above the eyebrow. */
@media (max-width: 700px) {
	.cf-header__inner { padding-block: 10px; }
	.cf-hero { padding-block: 34px 46px; }
	.cf-hero__intro { margin-top: 18px; }
	.cf-hero__cta { margin-top: 26px; }
	.cf-hero__meta { margin-top: 22px; }
	.cf-band { padding-block: 56px; }
}

.cf-hero__inner { position: relative; z-index: 1; }

.cf-hero h1 { padding-right: max(0px, calc(min(100%, 1080px) - 15ch)); }

/* The hero eyebrow carries the positioning line, so it runs a size up from the
   12px used in every other band. */
.cf-hero .cf-eyebrow { font-size: 14px; color: var(--cf-accent); }

.cf-hero__intro {
	font-size: 18px;
	color: var(--cf-sec);
	padding-right: max(0px, calc(min(100%, 1080px) - 58ch));
	margin-top: 24px;
}

.cf-hero__cta { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin-top: 34px; }

.cf-hero__meta { margin-top: 28px; font-size: 13.5px; color: var(--cf-muted); }

.cf-hero__mark {
	position: absolute;
	right: 48px;
	top: 50%;
	transform: translateY(-50%);
	width: 382px;
	/* Watermark, not decoration to read: visible on the dark ground but well
	   under the headline. 0.07 was effectively invisible. */
	opacity: 0.18;
	pointer-events: none;
	z-index: 0;
}
@media (max-width: 1000px) { .cf-hero__mark { display: none; } }

.cf-breadcrumb {
	font-size: 13px;
	color: var(--cf-muted);
	margin-bottom: 18px;
}
.cf-breadcrumb a { color: var(--cf-muted); text-decoration: none; }
.cf-breadcrumb a:hover { color: var(--cf-accent); }
.cf-breadcrumb [aria-current] { color: var(--cf-accent); }

/* --------------------------------------------------------------------------
   7. Cards & grids
   -------------------------------------------------------------------------- */

.cf-grid { display: grid; gap: 18px; margin-top: 40px; }
.cf-grid--2 { grid-template-columns: repeat(2, 1fr); }
.cf-grid--3 { grid-template-columns: repeat(3, 1fr); }
.cf-grid--5 { grid-template-columns: repeat(5, 1fr); gap: 14px; }

@media (max-width: 980px) { .cf-grid--5 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 860px) { .cf-grid--2, .cf-grid--3 { grid-template-columns: 1fr; } }
@media (max-width: 580px) { .cf-grid--5 { grid-template-columns: 1fr; } }

.cf-card {
	background: var(--cf-raised);
	border: 1px solid var(--cf-border);
	border-radius: var(--cf-r-card);
	padding: 26px;
}

.cf-card__n {
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 0.06em;
	color: var(--cf-accent-text);
}

:where(.cf-card) h3 { margin: 12px 0 8px; }
:where(.cf-card) p { font-size: 14.5px; color: var(--cf-sec); margin: 0; }
:where(.cf-card) p + p { margin-top: 10px; }

/* service tiles */
.cf-svc {
	position: relative;
	background: var(--cf-raised);
	border: 1px solid var(--cf-border);
	border-radius: var(--cf-r-stage);
	padding: 22px 20px;
	transition: border-color 0.18s ease;
}
.cf-svc:hover { border-color: #5A4526; }
.cf-svc--feature { background: #1E1810; border-color: #6A4F28; }
.cf-svc--current { background: var(--cf-accent); border-color: var(--cf-accent); }
.cf-svc--current :is(h3, p, .cf-svc__step) { color: #15130F; }

.cf-svc__step {
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.08em;
	color: var(--cf-accent);
}
:where(.cf-svc) h3 { margin: 10px 0 8px; font-size: 17.5px; }
:where(.cf-svc) p { font-size: 13.5px; color: var(--cf-sec); margin: 0; }

/* The tag floats in the corner, so it must not open a flow gap before the
   step number. Without this, cards 02 and 04 sit lower than the rest. */
.cf-svc > .cf-tag + * { margin-top: 0; }

.cf-tag {
	position: absolute;
	top: 16px;
	right: 16px;
	font-size: 9.5px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--cf-muted);
	border: 1px solid var(--cf-border);
	border-radius: var(--cf-r-pill);
	padding: 3px 9px;
}

.cf-pill {
	display: inline-block;
	font-size: 12px;
	color: var(--cf-sec);
	border: 1px solid var(--cf-border);
	border-radius: var(--cf-r-pill);
	padding: 5px 13px;
	margin: 0 6px 8px 0;
}

/* do / don't pair */
.cf-dd h4 {
	font-size: 12.5px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0 0 12px;
}
.cf-dd--do h4  { color: var(--cf-pass); }
.cf-dd--not h4 { color: var(--cf-fail); }
.cf-dd ul { list-style: none; margin: 0; padding: 0; }
.cf-dd li {
	position: relative;
	font-size: 13.5px;
	color: var(--cf-sec);
	padding: 6px 0 6px 22px;
}
.cf-dd li::before { position: absolute; left: 0; top: 6px; }
.cf-dd--do li::before  { content: "\2713"; color: var(--cf-pass-mark); }
.cf-dd--not li::before { content: "\2715"; color: var(--cf-fail-mark); }

/* --------------------------------------------------------------------------
   8. Timeline / steps
   -------------------------------------------------------------------------- */

.cf-steps { margin-top: 40px; border-top: 1px solid var(--cf-border); }

.cf-step {
	display: grid;
	grid-template-columns: 84px 1fr;
	gap: 24px;
	padding: 26px 0;
	border-bottom: 1px solid var(--cf-border);
}
@media (max-width: 640px) { .cf-step { grid-template-columns: 1fr; gap: 8px; } }

.cf-step__n {
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 30px;
	line-height: 1;
	color: var(--cf-muted);
}
.cf-step h3 { margin: 0 0 8px; }
:where(.cf-step) p { margin: 0; font-size: 14.5px; color: var(--cf-sec); }

.cf-feel {
	margin-top: 14px;
	padding-left: 16px;
	border-left: 2px solid var(--cf-accent);
	font-style: italic;
	font-size: 14px;
	color: var(--cf-sec);
}

/* --------------------------------------------------------------------------
   9. FAQ
   -------------------------------------------------------------------------- */

.cf-faq { margin-top: 36px; border-top: 1px solid var(--cf-border); }
.cf-faq__item { padding: 22px 0; border-bottom: 1px solid var(--cf-border); }
.cf-faq__item h3 { margin: 0 0 8px; }
:where(.cf-faq__item) p { margin: 0; font-size: 14.5px; color: var(--cf-sec); }

/* -------------------------------------------------------------------------
   10. Quote / pull card
   ------------------------------------------------------------------------- */

.cf-quote { text-align: center; }
.cf-quote__q {
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: clamp(22px, 3.2vw, 32px);
	line-height: 1.3;
	letter-spacing: -0.01em;
	color: var(--cf-heading);
	max-width: 24ch;
	margin: 0 auto;
}
.cf-quote__who { margin-top: 22px; font-size: 14px; color: var(--cf-muted); }

.cf-panel {
	background: var(--cf-raised);
	border: 1px solid var(--cf-border);
	border-radius: var(--cf-r-card);
	padding: 32px;
}
.cf-panel--cream :is(h2, h3, h4) { color: var(--cf-heading); }
:where(.cf-panel--cream) p { color: var(--cf-sec); }

.cf-sign { margin-top: 20px; font-family: Montserrat, system-ui, sans-serif; font-weight: 700; font-size: 14px; }

/* -------------------------------------------------------------------------
   11. CTA band
   ------------------------------------------------------------------------- */

.cf-cta__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
}
.cf-cta h2 { max-width: 16ch; margin: 0; }
.cf-cta p { margin-top: 12px; font-size: 16px; color: rgba(21, 19, 15, 0.78); max-width: 46ch; }

/* -------------------------------------------------------------------------
   12. Blog
   ------------------------------------------------------------------------- */

.cf-posts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 980px) { .cf-posts { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 700px)  { .cf-posts { grid-template-columns: 1fr; } }

.cf-post-card {
	background: var(--cf-raised);
	border: 1px solid var(--cf-border);
	border-radius: var(--cf-r-card);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: border-color 0.18s ease;
}
.cf-post-card:hover { border-color: #5A4526; }
.cf-post-card .wp-block-post-featured-image { margin: 0; }
.cf-post-card .wp-block-post-featured-image img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.cf-post-card .wp-block-post-title { font-size: 19px; line-height: 1.3; margin: 0 0 8px; }
.cf-post-card .wp-block-post-title a { color: var(--cf-heading); text-decoration: none; }
.cf-post-card .wp-block-post-title a:hover { color: var(--cf-accent); }
.cf-post-card .wp-block-post-excerpt { font-size: 14px; color: var(--cf-sec); margin: 0; }
.cf-post-card .wp-block-post-excerpt__more-text { display: none; }

.cf-post-meta { font-size: 12.5px; color: var(--cf-muted); display: flex; gap: 10px; flex-wrap: wrap; }

.cf-prose > * + * { margin-top: 1.1em; }
.cf-prose :is(h2, h3, h4) { margin-top: 1.8em; }
.cf-prose p, .cf-prose li { font-size: 16.5px; line-height: 1.7; color: var(--cf-prose); }
.cf-prose :is(ul, ol) { padding-left: 1.3em; }
.cf-prose img { border-radius: var(--cf-r-stage); }
.cf-prose blockquote {
	border-left: 2px solid var(--cf-accent);
	padding-left: 22px;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 20px;
	line-height: 1.4;
	color: var(--cf-heading);
}
.cf-prose a { color: var(--cf-accent-text); text-decoration: underline; text-underline-offset: 3px; }

.wp-block-post-terms a,
.cf-topic {
	display: inline-block;
	font-size: 11.5px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--cf-accent);
	text-decoration: none;
}

/* -------------------------------------------------------------------------
   13. Footer
   ------------------------------------------------------------------------- */

.cf-footer {
	background: var(--cf-bg);
	border-top: 1px solid #2C261D;
	padding: 64px 0 36px;
	color: #8F8676;
}
.cf-footer__top { display: flex; justify-content: space-between; gap: 36px; flex-wrap: wrap; }
.cf-footer__brand p { margin-top: 16px; font-size: 14px; color: #8F8676; max-width: 36ch; }
.cf-footer__cols { display: flex; gap: 56px; flex-wrap: wrap; }
.cf-footer__col h4 {
	font-family: Montserrat, system-ui, sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #B3AA9A;
	margin: 0 0 14px;
}
.cf-footer__col ul { list-style: none; margin: 0; padding: 0; }
.cf-footer__col a { display: block; font-size: 14px; color: #8F8676; padding: 4px 0; text-decoration: none; }
.cf-footer__col a:hover { color: #DB8A3E; text-decoration: none; }
.cf-footer__bottom {
	margin-top: 44px;
	padding-top: 22px;
	border-top: 1px solid #2C261D;
	display: flex;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	font-size: 12.5px;
	color: #8F8676;
}

/* -------------------------------------------------------------------------
   14. Forms
   ------------------------------------------------------------------------- */

.cf-form label { display: block; font-size: 13px; font-weight: 600; color: var(--cf-text); margin-bottom: 6px; }
.cf-form :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], textarea, select) {
	width: 100%;
	background: var(--cf-raised);
	border: 1px solid var(--cf-border);
	border-radius: 12px;
	color: var(--cf-text);
	font: inherit;
	font-size: 15px;
	padding: 12px 14px;
	margin-bottom: 18px;
}
.cf-form :is(input, textarea):focus {
	outline: none;
	border-color: var(--cf-accent);
}
.cf-form textarea { min-height: 140px; resize: vertical; }
.cf-form input[type="submit"],
.cf-form button[type="submit"] {
	background: var(--cf-accent);
	color: var(--cf-on-accent);
	border: 0;
	border-radius: var(--cf-r-pill);
	font-weight: 600;
	font-size: 14px;
	padding: 13px 26px;
	cursor: pointer;
}

/* -------------------------------------------------------------------------
   15. Accessibility helpers
   ------------------------------------------------------------------------- */

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

.skip-link:focus {
	position: fixed;
	top: 12px;
	left: 12px;
	z-index: 999;
	background: #DB8A3E;
	color: #15130F;
	padding: 10px 18px;
	border-radius: var(--cf-r-pill);
	font-weight: 600;
	clip-path: none;
	width: auto;
	height: auto;
	margin: 0;
}

:where(a, button, input, textarea, select, summary):focus-visible {
	outline: 2px solid var(--cf-accent);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	* { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* -------------------------------------------------------------------------
   16. Layout helpers used by template parts and patterns
   ------------------------------------------------------------------------- */

.cf-wrap { max-width: 1080px; margin-inline: auto; padding-inline: 28px; }

@media (max-width: 420px) {
	.cf-header__inner { gap: 10px; }
}

/* core navigation block inside the header */
.cf-nav .wp-block-navigation__container { gap: 26px; }
.cf-nav .wp-block-navigation-item__content { color: #B3AA9A; font-size: 14px; font-weight: 500; text-decoration: none; }
.cf-nav .wp-block-navigation-item__content:hover,
.cf-nav .current-menu-item .wp-block-navigation-item__content { color: #DB8A3E; text-decoration: none; }
.cf-nav .wp-block-navigation__responsive-container-open,
.cf-nav .wp-block-navigation__responsive-container-close { color: #F0E9DE; }
.wp-block-navigation.cf-nav .wp-block-navigation__responsive-container.is-menu-open {
	/* core paints the overlay with `background-color: inherit`, which resolves to
	   white when no overlay colour is set on the Navigation block itself */
	background-color: #0E0C09 !important;
	color: #F0E9DE !important;
	padding: 28px;
}
.wp-block-navigation.cf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	color: #F0E9DE;
	font-size: 20px;
	font-family: Montserrat, 'Avenir Next', system-ui, sans-serif;
	font-weight: 600;
	padding: 10px 0;
}
.wp-block-navigation.cf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover {
	color: #DB8A3E;
}
.wp-block-navigation.cf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	color: #F0E9DE;
}
.wp-block-navigation.cf-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
	max-width: 100%;
}

/* page title band for simple pages */
.cf-pagehead {
	border-bottom: 1px solid #2C261D;
	padding-block: clamp(48px, 7vw, 72px);
	background: radial-gradient(120% 120% at 82% -10%, #241D15 0%, #0E0C09 62%);
}

.cf-archive-head { padding-block: clamp(48px, 7vw, 80px); border-bottom: 1px solid #2C261D; }

.cf-pagination { margin-top: 44px; font-size: 14px; }
.cf-pagination a { color: #DB8A3E; text-decoration: none; }
.cf-pagination .page-numbers { padding: 6px 10px; color: #B3AA9A; }
.cf-pagination .page-numbers.current { color: #F0E9DE; font-weight: 600; }

/* -------------------------------------------------------------------------
   17. Core button block, styled as the brand pill
   ------------------------------------------------------------------------- */

.wp-block-button__link {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	padding: 12px 22px;
	border-radius: var(--cf-r-pill);
	text-decoration: none;
	transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
.wp-block-button__link:hover { text-decoration: none; }

.wp-block-button:not(.is-style-outline) .wp-block-button__link {
	background: var(--cf-accent);
	color: var(--cf-on-accent);
	border: 1px solid var(--cf-accent);
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
	background: var(--cf-accent-hi);
	border-color: var(--cf-accent-hi);
	color: var(--cf-on-accent);
}

.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--cf-text);
	border: 1px solid #4A4030;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
	border-color: var(--cf-accent);
	color: var(--cf-accent);
	background: transparent;
}
.cf-band--cream .wp-block-button.is-style-outline .wp-block-button__link,
.is-style-cf-cream .wp-block-button.is-style-outline .wp-block-button__link,
.cf-band--amber .wp-block-button.is-style-outline .wp-block-button__link {
	border-color: rgba(21,19,15,.3);
	color: #15130F;
}

/* dark pill, for use on the amber band */
.wp-block-button.cf-btn-dark .wp-block-button__link {
	background: #15130F;
	color: #F0E9DE;
	border-color: #15130F;
	padding: 15px 28px;
	font-size: 15px;
}
.wp-block-button.cf-btn-dark .wp-block-button__link:hover { background: #000; border-color: #000; color: #F0E9DE; }

/* section heading rhythm inside bands */
.cf-band h2 { margin-top: 10px; }
.cf-band > .wp-block-group > .cf-eyebrow:first-child { margin-top: 0; }

/* -------------------------------------------------------------------------
   18. Remaining brand components
   ------------------------------------------------------------------------- */

/* cream-band pull line (Book: copper light on light, never amber) */
.cf-pull {
	margin-top: 26px;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 22px;
	line-height: 1.3;
	padding-right: max(0px, calc(min(100%, 1080px) - 28ch));
	color: var(--cf-accent);
}

.cf-succ-foot {
	margin-top: 36px;
	text-align: center;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: clamp(19px, 2.6vw, 24px);
	letter-spacing: -0.01em;
	color: #E6DCC9;
}
.cf-succ-foot b { color: var(--cf-accent-text); }

/* service tile "explore" link */
.cf-more { margin-top: 12px; font-family: Montserrat, system-ui, sans-serif; font-weight: 700; font-size: 12.5px; }
.cf-more a { color: var(--cf-accent-text); text-decoration: none; }
.cf-more a:hover { text-decoration: underline; }

/* people */
.cf-avatar {
	width: 58px;
	height: 58px;
	border-radius: 22%;        /* Book §08 app-tile radius */
	background: #DB8A3E;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 18px;
}
.cf-avatar svg { width: 30px; height: auto; }
.cf-avatar .cf-bar { fill: #15130F; }   /* warm black mark on amber tile */

.cf-role {
	display: inline-block;
	padding: 3px 10px 4px;
	border: 1px solid rgba(219, 138, 62, 0.34);
	border-radius: 7px;
	background: rgba(219, 138, 62, 0.09);
	font-family: Montserrat, system-ui, sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: var(--cf-accent-text);
	margin: 6px 0 13px;
}
.cf-ph { color: var(--cf-muted); font-style: italic; }

/* manifesto — Book v2.0 §01a */
.cf-manifesto {
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: clamp(20px, 2.6vw, 27px);
	line-height: 1.38;
	letter-spacing: -0.01em;
	color: var(--cf-heading);
	padding-right: max(0px, calc(min(100%, 1080px) - 30ch));
}
.cf-manifesto em { font-style: normal; color: var(--cf-accent-text); }

.cf-manifesto-body {
	font-size: 16.5px;
	line-height: 1.7;
	color: var(--cf-sec);
	padding-right: max(0px, calc(min(100%, 1080px) - 62ch));
}
.cf-manifesto-body strong { color: var(--cf-text); font-weight: 600; }

/* mission / vision bilingual card */
.cf-bilingual i {
	display: block;
	margin-top: 12px;
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--cf-muted);
}

/* two-column contrast lists, timeline "you feel", trigger cards */
.cf-trigger {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	background: var(--cf-raised);
	border: 1px solid var(--cf-border);
	border-radius: var(--cf-r-stage);
	padding: 18px 20px;
}
.cf-trigger::before {
	content: "?";
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	margin-top: 1px;
	border: 1px solid var(--cf-accent);
	border-radius: 50%;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 13px;
	line-height: 1;
	color: var(--cf-accent);
}
:where(.cf-trigger) p { margin: 0; font-size: 14px; color: var(--cf-sec); }

.cf-aside {
	margin-top: 26px;
	padding: 18px 22px;
	border-left: 2px solid var(--cf-accent);
	background: var(--cf-raised);
	border-radius: 0 var(--cf-r-stage) var(--cf-r-stage) 0;
	font-size: 14.5px;
	color: var(--cf-sec);
}
.cf-aside b { color: var(--cf-text); }

/* engagement two-column panel */
.cf-cols2 { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
@media (max-width: 780px) { .cf-cols2 { grid-template-columns: 1fr; gap: 28px; } }
.cf-cols2 h4 {
	font-family: Montserrat, system-ui, sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cf-accent-text);
	margin: 0 0 14px;
}
.cf-arrowlist { list-style: none; margin: 0; padding: 0; }
.cf-arrowlist li {
	position: relative;
	padding: 7px 0 7px 22px;
	font-size: 14px;
	color: var(--cf-sec);
}
.cf-arrowlist li::before { content: "→"; position: absolute; left: 0; color: var(--cf-accent); }

/* --------------------------------------------------------------------------
   Audit follow-ups: prose tables, and mobile touch targets (CF-11).
   Fingers are about 9mm wide, so a 24px icon is not a target. 44 x 44 is the
   floor, with 8px of clear space between neighbours.
   -------------------------------------------------------------------------- */

.cf-prose table { width: 100%; border-collapse: collapse; font-size: 15px; }
.cf-prose :is(th, td) {
	text-align: left;
	padding: 11px 16px 11px 0;
	border: 0;
	border-bottom: 1px solid var(--cf-border);
	vertical-align: top;
}
.cf-prose th {
	color: var(--cf-text);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.cf-prose td { color: var(--cf-prose); }
.cf-prose .wp-block-table { overflow-x: auto; }

/* The hamburger and the close cross. Only where core actually shows them,
   otherwise a display rule here would bring the hamburger back on desktop. */
@media (max-width: 600px) {
	.cf-nav .wp-block-navigation__responsive-container-open,
	.cf-nav .wp-block-navigation__responsive-container-close {
		display: flex;
		align-items: center;
		justify-content: center;
		min-width: 44px;
		min-height: 44px;
	}
}

/* Footer links: real targets, not 20px lines of text. */
.cf-footer__col a { padding: 10px 0; }
.cf-footer__brand p,
.cf-footer__col a { font-size: 15px; }
.cf-footer__bottom { line-height: 1.8; }

@media (max-width: 700px) {
	/* Body copy inside cards and steps at a comfortable reading size. */
	:where(.cf-card) p,
	:where(.cf-step) p,
	:where(.cf-faq__item) p,
	:where(.cf-trigger) p,
	.cf-arrowlist li,
	.cf-post-card .wp-block-post-excerpt { font-size: 16px; line-height: 1.6; }

	.cf-footer__col a { padding: 12px 0; font-size: 16px; }
	.cf-footer__cols { gap: 32px; }

	/* Inline links in prose get a little more room to be hit. */
	.cf-prose a { padding: 2px 0; }
}

/* Roomier variant for the thank you page: 16px body and a 44px tap target,
   per the audit's mobile findings. */
.cf-arrowlist--roomy li {
	font-size: 16px;
	line-height: 1.6;
	padding: 11px 0 11px 26px;
	color: var(--cf-text);
}
.cf-card h3 a {
	display: inline-block;
	padding: 9px 0;
	text-decoration: none;
}
.cf-card h3 a:hover,
.cf-card h3 a:focus-visible { text-decoration: underline; }

.cf-pricenote { margin-top: 16px; font-size: 13.5px; font-style: italic; color: var(--cf-muted); }

/* contact grid */
.cf-contact { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 44px; }
@media (max-width: 860px) { .cf-contact { grid-template-columns: 1fr; gap: 32px; } }
.cf-contact__direct a { color: var(--cf-accent); }

/* -------------------------------------------------------------------------
   19. Interop with core layout CSS
   ------------------------------------------------------------------------- */

/* Core's flow layout puts margin-block-start on every child but the first.
   Inside a CSS grid that pushes items 2..n down out of alignment. */
.cf-grid > *,
.cf-steps > *,
.cf-posts > *,
.cf-cols2 > *,
.cf-contact > *,
.cf-cta__inner > * { margin-block-start: 0; }

/* Constrained layout centres anything with a max-width. Measure-limited text
   blocks are meant to sit against the left edge of the column. */
.wp-site-blocks .cf-quote__q { margin-inline: auto; }

/* -------------------------------------------------------------------------
   20. Third-party chrome, brought into the brand
   ------------------------------------------------------------------------- */

/* CookieAdmin's re-consent button ships as a 50px cobalt-blue circle bottom-left.
   Quiet it down: small, warm, low-contrast until you look for it. */
.cookieadmin_re_consent {
	width: 34px !important;
	height: 34px !important;
	min-width: 0 !important;
	min-height: 0 !important;
	padding: 0 !important;
	background: #1A1610 !important;
	border: 1px solid #2C261D !important;
	border-radius: 50% !important;
	box-shadow: none !important;
	opacity: 0.5;
	inset-inline-start: 14px !important;
	inset-block-end: 14px !important;
	transition: opacity 0.2s ease, border-color 0.2s ease;
}
.cookieadmin_re_consent:hover,
.cookieadmin_re_consent:focus-visible {
	opacity: 1;
	border-color: #DB8A3E !important;
}
.cookieadmin_re_consent img,
.cookieadmin_re_consent svg {
	width: 17px !important;
	height: 17px !important;
	filter: grayscale(1) brightness(1.7) sepia(0.35) saturate(1.6) hue-rotate(-12deg);
}

/* -------------------------------------------------------------------------
   21. Bands sit flush
   ------------------------------------------------------------------------- */

/* Core's flow layout puts a 26px block gap between the sections inside <main>.
   That left a strip of page background between each band, so a band's hairline
   border and the next band's edge read as two separate rules a few pixels apart.
   Bands are full-bleed blocks: they butt up against each other. */
.wp-site-blocks main > .cf-band,
.wp-site-blocks main > .cf-hero,
.wp-site-blocks main > .cf-pagehead,
.wp-site-blocks .entry-content > .cf-band,
.wp-site-blocks .entry-content > .cf-hero { margin-block-start: 0; }

/* -------------------------------------------------------------------------
   22. Discovery call form
   ------------------------------------------------------------------------- */

.cf-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
@media (max-width: 640px) { .cf-form__row { grid-template-columns: 1fr; } }

.cf-form label { display: block; font-size: 13px; font-weight: 600; color: var(--cf-text); margin-bottom: 6px; }
.cf-form input::placeholder, .cf-form textarea::placeholder { color: var(--cf-muted); }

.cf-check {
	display: flex !important;
	align-items: flex-start;
	gap: 10px;
	margin: 4px 0 22px;
	font-weight: 400 !important;
	font-size: 13.5px !important;
	color: var(--cf-sec) !important;
	cursor: pointer;
}
.cf-check input {
	width: 17px;
	height: 17px;
	margin: 2px 0 0;
	accent-color: var(--cf-accent);
	flex: none;
}

.cf-form button[type="submit"] { border: 0; cursor: pointer; font-family: inherit; }

.cf-form__small { margin-top: 14px; font-size: 12.5px; color: var(--cf-muted); }

/* honeypot: off-screen, never focusable by sighted users */
.cf-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.cf-form__note {
	border-radius: var(--cf-r-stage);
	border: 1px solid var(--cf-border);
	background: var(--cf-raised);
	padding: 16px 18px;
	margin-bottom: 24px;
	font-size: 14.5px;
	color: var(--cf-sec);
}
.cf-form__note strong { color: var(--cf-text); }
.cf-form__note--ok { border-color: #3E5A3E; }
.cf-form__note--err { border-color: #6A3A28; }
/* The header is sticky, so an in-page anchor has to stop below it,
   or the jump hides the top of whatever was linked to. */
html { scroll-padding-top: 114px; }
html:has(body.admin-bar) { scroll-padding-top: 146px; }

@media (max-width: 700px) {
	html { scroll-padding-top: 88px; }
	html:has(body.admin-bar) { scroll-padding-top: 134px; }
}

.cf-form__note p { margin: 0; }
.cf-form__note p + p { margin-top: 10px; }

/* A sent message leaves the note standing alone, so it gets a little more room. */
.cf-form__note--ok:only-child {
	padding: 26px 26px 24px;
	margin-bottom: 0;
}

/* --------------------------------------------------------------------------
   17. Elements handed over from the Hungarian home page build
   (CF-EN-Site-Handoff). Class names carry the cf- prefix, everything else is
   the handover's own CSS with the theme's tokens in place of the raw hex.
   -------------------------------------------------------------------------- */

/* Source popovers on the numbers. Hover or focus, never a link. */
.cf-fn {
	position: relative;
	display: inline-block;
	margin-left: 2px;
	padding: 0 1px;
	font-size: 10.5px;
	font-weight: 700;
	line-height: 1;
	color: var(--cf-accent);
	vertical-align: super;
	cursor: help;
}
.cf-band--cream .cf-fn,
.is-style-cf-cream .cf-fn { color: #A25422; }

.cf-fn__pop {
	position: absolute;
	bottom: calc(100% + 12px);
	left: 50%;
	transform: translateX(-50%);
	width: min(262px, 72vw);
	padding: 15px 17px;
	border: 1px solid #6A4F28;
	border-radius: 12px;
	background: #1A1610;
	font-family: Inter, system-ui, sans-serif;
	font-size: 12.5px;
	font-weight: 400;
	line-height: 1.55;
	color: #B3AA9A;
	text-align: left;
	vertical-align: baseline;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.15s;
	z-index: 30;
}
.cf-fn:hover .cf-fn__pop,
.cf-fn:focus .cf-fn__pop,
.cf-fn:focus-within .cf-fn__pop { opacity: 1; visibility: visible; }
.cf-fn__pop b { display: block; margin-bottom: 6px; font-weight: 600; color: #DB8A3E; }
.cf-fn__pop em { font-style: normal; color: #8F8676; }

/* Three figures with a copper rule, on the cream band. */
.cf-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 38px; }
@media (max-width: 860px) { .cf-stats { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .cf-stats { grid-template-columns: 1fr; } }
.cf-stat { border-left: 2px solid #C0721F; padding: 2px 0 2px 18px; }
.cf-stat__fig {
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 38px;
	line-height: 1;
	letter-spacing: -0.02em;
	color: #A25422;
	font-variant-numeric: tabular-nums;
}
.cf-stat p { margin-top: 10px; font-size: 14.5px; color: #4C4638; }

/* A figure inside a sentence, not a block of its own. */
.cf-neutral-note { margin-top: 26px; max-width: 70ch; font-size: 14px; color: var(--cf-muted); }
.cf-neutral-note b { color: var(--cf-text); }

/* The sector band under the hero: drifts left, can be grabbed and spun. */
.cf-proof { background: #12100C; border-bottom: 1px solid var(--cf-border); padding: 24px 0; }
.cf-proof__lbl {
	display: block;
	max-width: 1136px;
	margin-inline: auto;
	padding-inline: 28px;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--cf-muted);
}
.cf-marquee {
	overflow: hidden;
	margin-top: 16px;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	cursor: grab;
	touch-action: pan-y;
	-webkit-user-select: none;
	user-select: none;
}
.cf-marquee.is-grabbing { cursor: grabbing; }
.cf-marquee__track { display: flex; width: max-content; padding: 4px 0; will-change: transform; }
.cf-marquee__track span {
	/* margin, not gap: gap throws the 50% loop half a gap out and the seam shows */
	margin-right: 12px;
	padding: 10px 20px 11px;
	border: 1px solid var(--cf-border);
	border-radius: 999px;
	background: var(--cf-raised);
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.02em;
	color: var(--cf-sec);
	white-space: nowrap;
	transition: border-color 0.18s, color 0.18s;
}
.cf-marquee:hover .cf-marquee__track span { border-color: #3C3320; }
.cf-marquee__track span:hover { border-color: var(--cf-accent); color: var(--cf-text); }

/* Good fit / probably not us. */
.cf-fit { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 34px; margin-top: 40px; }
@media (max-width: 820px) { .cf-fit { grid-template-columns: 1fr; } }
.cf-fit__col { border-left: 2px solid var(--cf-accent); padding: 2px 0 2px 20px; }
.cf-fit__col--no { border-left-color: #3C3320; }
.cf-fit__col h4 {
	margin-bottom: 9px;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cf-accent);
}
.cf-fit__col--no h4 { color: var(--cf-muted); }
.cf-fit__col p { font-size: 15px; color: var(--cf-sec); }
.cf-fit__note { margin-top: 24px; font-size: 14px; color: var(--cf-muted); }

/* Team card: amber edge, bookmark tab, biography that opens in place. */
.cf-person--tagged {
	position: relative;
	background: #1C1710;
	border: 1px solid var(--cf-accent);
}
.cf-bookmark {
	position: absolute;
	top: -1px;
	right: 24px;
	padding: 9px 13px 10px;
	border-radius: 0 0 3px 3px;
	background: var(--cf-accent);
	color: #15130F;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 10.5px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	white-space: nowrap;
}
.cf-person details { margin-top: 13px; }
.cf-person summary {
	display: inline-block;
	list-style: none;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.04em;
	color: var(--cf-accent);
	cursor: pointer;
}
.cf-person summary::-webkit-details-marker { display: none; }
.cf-person summary::after { content: "Read more →"; }
.cf-person details[open] summary::after { content: "Close ←"; }
.cf-person summary:hover { text-decoration: underline; }
.cf-person details[open] summary { margin-bottom: 11px; }
:where(.cf-person) details p { font-size: 14px; color: var(--cf-sec); }

/* The sources, quietly, at the bottom of the footer. */
.cf-foot-sources {
	display: flex;
	flex-wrap: wrap;
	gap: 5px 22px;
	margin-top: 34px;
	padding-top: 18px;
	border-top: 1px solid var(--cf-border);
	font-size: 11.5px;
	line-height: 1.6;
	color: #6A6150;
}


/* ============================================================
   18. Hungarian site: language switcher and HU-only labels
   ============================================================ */

.cf-lang {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--cf-font-ui, inherit);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.06em;
	white-space: nowrap;
}

.cf-lang a {
	color: var(--cf-sec);
	text-decoration: none;
	padding: 4px 2px;
	border-bottom: 1px solid transparent;
	transition: color 0.18s ease, border-color 0.18s ease;
}

.cf-lang a:hover,
.cf-lang a:focus-visible {
	color: var(--cf-text);
	border-bottom-color: var(--cf-accent);
}

.cf-lang a[aria-current="page"] {
	color: var(--cf-text);
	font-weight: 700;
}

.cf-lang i {
	font-style: normal;
	color: var(--cf-muted);
}

.cf-lang--foot {
	font-size: 13px;
	letter-spacing: 0.04em;
}

.cf-people--hu details summary::after {
	content: "Bővebben →";
}

@media (max-width: 600px) {
	.cf-header__inner .cf-lang { font-size: 11.5px; gap: 4px; }
}

/* Language pair as the last two navigation items. Reads as one control:
   a hairline before HU, a dot between the two, the current one lit. */
.cf-nav .cf-nav-lang > a,
.cf-nav .cf-nav-lang .wp-block-navigation-item__content {
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.08em;
	color: var(--cf-muted);
}

.cf-nav .cf-nav-lang--on > a,
.cf-nav .cf-nav-lang--on .wp-block-navigation-item__content { color: var(--cf-text); }

.cf-nav .cf-nav-lang > a:hover,
.cf-nav .cf-nav-lang .wp-block-navigation-item__content:hover { color: var(--cf-accent); }

.cf-nav .cf-nav-lang { position: relative; }

.cf-nav .cf-nav-lang--first::before {
	content: "";
	position: absolute;
	left: -14px;
	top: 50%;
	width: 1px;
	height: 14px;
	transform: translateY(-50%);
	background: var(--cf-border);
}

.cf-nav .cf-nav-lang--first + .cf-nav-lang::before {
	content: "·";
	position: absolute;
	left: -10px;
	color: var(--cf-muted);
}

@media (max-width: 600px) {
	.cf-nav .cf-nav-lang--first::before,
	.cf-nav .cf-nav-lang--first + .cf-nav-lang::before { display: none; }
}

/* Percentages inside a sentence sit in a small box, so the eye finds them
   without the paragraph turning into a wall of bold. */
.cf-inline-fig {
	display: inline-block;
	padding: 2px 8px 3px;
	border: 1px solid var(--cf-border);
	border-radius: 7px;
	background: var(--cf-raised);
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 0.94em;
	line-height: 1.35;
	color: var(--cf-accent);
	white-space: nowrap;
}

.cf-band--cream .cf-inline-fig,
.is-style-cf-cream .cf-inline-fig {
	border-color: #D8C9AE;
	background: #F7F2E9;
	color: #A25422;
}

/* Nothing scrolls sideways. The sector band is wider than the screen on
   purpose and is clipped; without this, iOS lets the whole page be dragged
   left. clip rather than hidden, so the sticky header keeps working. */
html,
body {
	overflow-x: clip;
	overscroll-behavior-x: none;
	max-width: 100%;
}

/* The cookie table is the only table on the site and it is four columns wide.
   On a phone it stops being a table and becomes one labelled block per cookie,
   so nothing is hidden behind a sideways scroll. */
@media (max-width: 640px) {
	.cf-prose .wp-block-table table,
	.cf-prose .wp-block-table tbody,
	.cf-prose .wp-block-table tr,
	.cf-prose .wp-block-table td {
		display: block;
		width: 100%;
	}

	.cf-prose .wp-block-table thead { display: none; }

	.cf-prose .wp-block-table tr {
		border: 1px solid var(--cf-border);
		border-radius: 12px;
		margin-bottom: 14px;
		padding: 6px 0 10px;
	}

	.cf-prose .wp-block-table td {
		border: 0;
		padding: 8px 16px;
		font-size: 14.5px;
	}

	.cf-prose .wp-block-table td::before {
		content: attr(data-label);
		display: block;
		margin-bottom: 3px;
		font-family: Montserrat, system-ui, sans-serif;
		font-size: 10.5px;
		font-weight: 700;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--cf-muted);
	}
}

/* On a touch screen the menu items need a finger-sized hit area. The header
   keeps roughly the same height: the padding moves from the bar to the links. */
@media (pointer: coarse) {
	.cf-header__inner { padding-block: 8px; }

	.cf-nav a,
	.cf-nav .wp-block-navigation-item__content {
		display: inline-flex;
		align-items: center;
		min-height: 40px;
	}

	.cf-footer__col a,
	.cf-lang a {
		display: inline-flex;
		align-items: center;
		min-height: 36px;
	}
}

/* One quiet line between the service arc and the method section. The header
   has no button any more, and this page is long on a phone. */
.cf-midcta {
	margin-top: 30px;
	padding-top: 22px;
	border-top: 1px solid var(--cf-border);
	font-size: 15px;
	color: var(--cf-sec);
}

.cf-midcta a {
	color: var(--cf-accent-text);
	text-decoration: none;
	border-bottom: 1px solid rgba(219, 138, 62, 0.45);
}

.cf-midcta a:hover { color: var(--cf-text); border-bottom-color: var(--cf-accent); }

/* Contact is the only action in the menu, so it reads as one. */
.cf-nav li:has(> a[href*="kapcsolat"]) > a,
.cf-nav li:has(> a[href$="/contact/"]) > a { color: var(--cf-accent-text); }

/* ============================================================
   19. The massif: twenty years of the customer field as one range
   (from the "A customer terület" page concept). A single ridge drawn
   once, with a fainter range behind it for depth. The summits are HTML
   so they stay round while the ridge stretches to any width; the
   columns line up because both sit in the same five-column grid.
   ============================================================ */

.cf-massif {
	position: relative;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	margin-top: 38px;
}

.cf-massif__svg {
	position: absolute;
	inset: 0 0 auto;
	width: 100%;
	height: 300px;
	display: block;
	pointer-events: none;
}

.cf-col {
	position: relative;
	display: grid;
	grid-template-rows: 300px auto;
}

.cf-summit {
	position: relative;
	align-self: end;
	justify-self: center;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.cf-col--1 .cf-summit { margin-bottom: 66px; }
.cf-col--2 .cf-summit { margin-bottom: 108px; }
.cf-col--3 .cf-summit { margin-bottom: 156px; }
.cf-col--4 .cf-summit { margin-bottom: 210px; }
.cf-col--5 .cf-summit { margin-bottom: 270px; }

.cf-summit b {
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 13.5px;
	letter-spacing: 0.04em;
	color: var(--cf-sec);
	transition: color 0.18s ease;
}

.cf-summit i {
	width: 7px;
	height: 7px;
	margin-top: 7px;
	border-radius: 50%;
	background: var(--cf-accent);
	box-sizing: border-box;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.cf-cap {
	margin: 0;
	padding: 14px 10px 0;
	border-top: 1px solid var(--cf-border);
	font-size: 13px;
	line-height: 1.5;
	color: var(--cf-sec);
	text-align: center;
	transition: color 0.18s ease, border-color 0.18s ease;
}

.cf-col:hover .cf-summit b,
.cf-col:focus-within .cf-summit b { color: var(--cf-text); }

.cf-col:hover .cf-summit i,
.cf-col:focus-within .cf-summit i {
	transform: scale(1.5);
	box-shadow: 0 0 0 5px rgba(219, 138, 62, 0.16);
}

.cf-col:hover .cf-cap,
.cf-col:focus-within .cf-cap {
	color: var(--cf-text);
	border-top-color: var(--cf-accent);
}


/* Hovering a summit throws out what the landscape looked like that year.
   Category names, not vendor logos: the point is how many there are, and the
   site deliberately carries no third-party marks. Decorative, so it is hidden
   from screen readers and calmed down where motion is unwelcome. */
.cf-burst {
	position: absolute;
	left: 50%;
	bottom: 3px;
	width: 0;
	height: 0;
	pointer-events: none;
}

.cf-burst b {
	position: absolute;
	left: 0;
	top: 0;
	padding: 4px 9px 5px;
	border: 1px solid rgba(219, 138, 62, 0.38);
	border-radius: 999px;
	background: #16120D;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 600;
	font-size: 10.5px;
	line-height: 1;
	letter-spacing: 0.03em;
	white-space: nowrap;
	color: var(--cf-sec);
	opacity: 0;
	transform: translate(-50%, -50%) scale(0.4);
	transition: transform 0.38s cubic-bezier(0.2, 0.9, 0.3, 1.25), opacity 0.18s ease;
	transition-delay: var(--d, 0ms);
}

.cf-burst b.is-more {
	border-color: var(--cf-accent);
	color: var(--cf-accent);
}

.cf-col:hover .cf-burst b,
.cf-col:focus-within .cf-burst b {
	opacity: 1;
	transform: translate(calc(-50% + var(--x)), calc(-50% + var(--y))) scale(1);
}

@media (prefers-reduced-motion: reduce) {
	.cf-burst b { transition: opacity 0.2s ease; }
}

@media (max-width: 760px) {
	.cf-burst { display: none; }
}

.cf-massif__after {
	margin: 14px 0 0;
	max-width: 62ch;
	font-size: 15.5px;
	line-height: 1.65;
	color: var(--cf-sec);
}

.cf-massif__after b {
	font-weight: 600;
	color: var(--cf-text);
}

.cf-massif__note {
	margin: 30px 0 0;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: clamp(17px, 2.1vw, 21px);
	line-height: 1.4;
	color: var(--cf-accent);
	max-width: 46ch;
}

/* On a phone the range stands up and becomes a plain timeline. */
@media (max-width: 760px) {
	.cf-massif { display: block; margin-top: 26px; }
	.cf-massif__svg { display: none; }

	.cf-col {
		grid-template-rows: none;
		grid-template-columns: 58px 1fr;
		gap: 14px;
		align-items: start;
		padding: 13px 0;
		border-top: 1px solid var(--cf-border);
	}

	.cf-summit {
		margin-bottom: 0 !important;
		align-self: start;
		justify-self: start;
		flex-direction: row;
		align-items: center;
		gap: 0;
	}

	.cf-summit b { font-size: 15px; color: var(--cf-accent-text); }
	.cf-summit i { display: none; }

	.cf-cap {
		border-top: 0;
		padding: 0;
		font-size: 14px;
		text-align: left;
	}
}

/* Core gives any child narrower than the content width automatic side margins,
   which centres these two. They are pull lines, not centred text: keep them
   hanging on the same left edge as the headings. */
.cf-band .cf-massif__note,
.cf-band .cf-massif__after,
.cf-band .cf-neutral-note,
.cf-band .cf-midcta,
.cf-band .cf-measure {
	/* Core emits margin-left:auto !important on constrained children, which
	   centres anything narrower than the content width. These are pull lines
	   and body copy, not centred text — they hang on the same left edge as the
	   headings. The band's content column is 1080px, so the start margin is the
	   same gap core would give a full-width child, and 0 once the band is
	   narrower than the column. */
	margin-inline-start: max(0px, calc((100% - 1080px) / 2)) !important;
	margin-inline-end: auto !important;
}

/* The postscript: one line under the CTA, the last thing anyone reads.
   No frame, no band styling, quiet on purpose. */
.cf-postscript {
	background: var(--cf-bg);
	padding: 26px 28px 30px;
}

.cf-ps {
	margin: 0;
	max-width: 78ch;
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--cf-muted);
}

/* ============================================================
   20. Light-ground variants for the two blocks that moved onto cream
   The team card is the only hard-coded dark surface on the site, and the
   book keeps amber for dark grounds only, so on cream the tile becomes
   Copper Light and every piece of small accent text becomes warm black,
   which is the one option in the palette that passes AA at that size.
   ============================================================ */

.cf-band--cream .cf-person--tagged,
.is-style-cf-cream .cf-person--tagged {
	background: var(--cf-raised);
}

.cf-band--cream .cf-avatar,
.is-style-cf-cream .cf-avatar { background: var(--cf-accent); }

.cf-band--cream .cf-role,
.is-style-cf-cream .cf-role {
	border-color: rgba(162, 84, 34, 0.42);
	background: rgba(162, 84, 34, 0.08);
}

.cf-band--cream .cf-person summary,
.is-style-cf-cream .cf-person summary { color: var(--cf-accent-text); }

.cf-band--cream .cf-fit__col--no,
.is-style-cf-cream .cf-fit__col--no { border-left-color: rgba(21, 19, 15, 0.24); }

.cf-band--cream .cf-fit__col h4,
.is-style-cf-cream .cf-fit__col h4 { color: var(--cf-accent-text); }

.cf-band--cream .cf-fit__col--no h4,
.is-style-cf-cream .cf-fit__col--no h4 { color: var(--cf-muted); }

/* ============================================================
   21. "Hol tartotok most?" — the two entry points, right after the
   sector band. A router, not a pitch: one card for people with no
   system yet, one for people whose system is not paying its way.
   ============================================================ */

.cf-entries {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 22px;
	margin-top: 26px;
}

@media (max-width: 820px) {
	.cf-entries { grid-template-columns: 1fr; gap: 16px; }
}

.cf-entry {
	background: var(--cf-raised);
	border: 1px solid var(--cf-border);
	border-radius: var(--cf-r-card);
	padding: 30px 32px 26px;
	transition: border-color 0.18s ease;
}

.cf-entry:hover { border-color: #5A4526; }

.cf-entry__tag {
	margin: 0;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 11.5px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--cf-accent);
}

.cf-entry h3 {
	margin: 12px 0 14px;
	font-size: clamp(20px, 2.4vw, 25px);
	line-height: 1.25;
}

.cf-entry__lead {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--cf-sec);
}

.cf-entry__note {
	margin: 14px 0 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--cf-muted);
}

.cf-entry .cf-more { margin-top: 20px; }

@media (max-width: 600px) {
	.cf-entry { padding: 24px 22px 22px; }
}

/* Two mirrors under the problem heading: one for the reader who is about to
   buy, one for the reader who already owns a system. Neutral rules, not the
   good/bad pair used further down the page. */
.cf-split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 22px 34px;
	margin-top: 28px;
}

@media (max-width: 820px) {
	.cf-split { grid-template-columns: 1fr; gap: 20px; }
}

.cf-split__col {
	border-left: 2px solid var(--cf-border);
	padding: 2px 0 2px 20px;
}

.cf-split__col h4 {
	margin: 0 0 8px;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cf-accent-text);
}

.cf-split__col p {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--cf-prose);
}

/* --------------------------------------------------------------------------
   21. 2026-09-02 — Janka módosítási listája (Modositas_v1)
   -------------------------------------------------------------------------- */

/* 21.1 Hero: kevesebb üres tér a fejléc alatt, nincs záróvonal. */
.cf-hero {
	padding-block: clamp(26px, 4vw, 52px) clamp(46px, 7.5vw, 80px);
	border-bottom: 0;
}
@media (max-width: 700px) { .cf-hero { padding-block: 22px 38px; } }

/* A márkajel jobb oldalt: látható, de a cím alatt marad. Egy fénysáv fut át
   rajta, amikor a hero fölé ér az egér. */
.cf-hero__mark { opacity: 0.26; overflow: hidden; }
.cf-hero__mark::after {
	content: "";
	position: absolute;
	inset: -30% -70%;
	background: linear-gradient(105deg, transparent 44%, rgba(240, 233, 222, 0.55) 50%, transparent 56%);
	mix-blend-mode: screen;
	transform: translateX(-120%);
	pointer-events: none;
}
.cf-hero:hover .cf-hero__mark::after { animation: cf-shine 1.15s ease-out; }
@keyframes cf-shine { from { transform: translateX(-120%); } to { transform: translateX(120%); } }
@media (prefers-reduced-motion: reduce) { .cf-hero:hover .cf-hero__mark::after { animation: none; } }

/* Lefelé mutató jelzés a hero gombjai mellett. */
.cf-scrollcue {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-left: 4px;
	border: 1px solid #4A4030;
	border-radius: 50%;
	color: var(--cf-accent);
	text-decoration: none;
	transition: border-color 0.18s ease, color 0.18s ease;
}
.cf-scrollcue svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.cf-scrollcue:hover { border-color: var(--cf-accent); }
@media (prefers-reduced-motion: no-preference) {
	.cf-scrollcue svg { animation: cf-nudge 2.4s ease-in-out infinite; }
	@keyframes cf-nudge { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(3px); } }
}

/* 21.2 Területsáv: a két hajszálvonal el, kevesebb üres tér. */
.cf-proof { border-bottom: 0; padding: 15px 0 17px; }
.cf-marquee { margin-top: 10px; }

/* 21.3 A sávok is közelebb ülnek egymáshoz, hogy a következő szekció széle
   már látsszon a hajtás fölött. */
.cf-band { padding-block: clamp(46px, 6vw, 70px); }
.cf-band[id], .cf-slide[id] { scroll-margin-top: 22px; }

/* 21.4 Szolgáltatás-slider: öt egyforma doboz, fülek, nyilak, pöttyök. */
.cf-slider { margin-top: 32px; }
.cf-slider__tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.cf-slider__tab {
	appearance: none;
	background: transparent;
	cursor: pointer;
	border: 1px solid var(--cf-border);
	border-radius: 999px;
	padding: 8px 16px 9px;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 11.5px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cf-sec);
	transition: border-color 0.18s ease, color 0.18s ease, background 0.18s ease;
}
.cf-slider__tab:hover { border-color: #5A4526; color: var(--cf-text); }
.cf-slider__tab.is-active { background: var(--cf-accent); border-color: var(--cf-accent); color: #15130F; }
.cf-slider__viewport { overflow: hidden; }
.cf-slider__track { display: flex; align-items: stretch; transition: transform 0.42s cubic-bezier(0.4, 0, 0.2, 1); }
@media (prefers-reduced-motion: reduce) { .cf-slider__track { transition: none; } }
.cf-slide {
	flex: 0 0 100%;
	min-width: 100%;
	box-sizing: border-box;
	background: var(--cf-raised);
	border: 1px solid var(--cf-border);
	border-radius: 14px;
	padding: 30px 32px 32px;
	display: flex;
	flex-direction: column;
}
.cf-slide__head { display: flex; align-items: center; gap: 12px; }
.cf-slide__tag {
	margin: 0;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--cf-accent);
}
.cf-slide h3 { margin: 14px 0 12px; font-size: clamp(21px, 2.2vw, 28px); max-width: 24ch; }
.cf-slide p { margin: 0; font-size: 15.5px; color: var(--cf-sec); max-width: 64ch; }
.cf-slide p + p { margin-top: 12px; }
.cf-slide__note { font-size: 14px; color: var(--cf-muted); }
.cf-slide .cf-btn { margin-top: auto; align-self: flex-start; }
.cf-slide h3 + p { margin-bottom: 24px; }
.cf-slider__nav { display: flex; align-items: center; gap: 16px; margin-top: 20px; }
.cf-slider__arrow {
	appearance: none;
	cursor: pointer;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1px solid var(--cf-border);
	background: transparent;
	color: var(--cf-sec);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: border-color 0.18s ease, color 0.18s ease;
}
.cf-slider__arrow svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cf-slider__arrow:hover { border-color: var(--cf-accent); color: var(--cf-accent); }
.cf-slider__dots { display: flex; align-items: center; gap: 8px; }
.cf-slider__dot {
	appearance: none;
	cursor: pointer;
	padding: 0;
	border: 0;
	width: 8px;
	height: 8px;
	border-radius: 999px;
	background: #3A3227;
	transition: width 0.2s ease, background 0.2s ease;
}
.cf-slider__dot.is-active { width: 24px; background: var(--cf-accent); }
@media (max-width: 640px) {
	.cf-slide { padding: 24px 22px 26px; }
	.cf-slider__tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
	.cf-slider__tabs::-webkit-scrollbar { display: none; }
	.cf-slider__tab { flex: 0 0 auto; }
}

/* 21.5 Csapatkártya: fotó helye, és a „Bővebben" a kártya aljára ül, hogy
   nyitáskor a többi kártyában ne maradjon lyuk alatta. */
.cf-photo {
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: 12px;
	border: 1px solid var(--cf-border);
	background: linear-gradient(135deg, rgba(219, 138, 62, 0.22), rgba(219, 138, 62, 0.05));
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 18px;
	font-family: Montserrat, system-ui, sans-serif;
	font-weight: 700;
	font-size: 26px;
	letter-spacing: 0.12em;
	color: rgba(240, 233, 222, 0.5);
}
.cf-band--cream .cf-photo,
.is-style-cf-cream .cf-photo {
	border-color: rgba(21, 19, 15, 0.16);
	background: linear-gradient(135deg, rgba(192, 114, 31, 0.26), rgba(192, 114, 31, 0.07));
	color: rgba(21, 19, 15, 0.42);
}
#csapat .cf-person { display: flex; flex-direction: column; }
.cf-person details { margin-top: auto; padding-top: 13px; }
.cf-person details[open] > p { max-height: 42vh; overflow-y: auto; }

/* 21.6 Köztes ajánlat: rendes gomb, egy sorban a szöveggel. */
.cf-midcta { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 22px; }
.cf-midcta p { margin: 0; font-size: 15px; color: var(--cf-sec); max-width: 60ch; }

/* 21.7 A hegyvonulat mobilon: lefelé mélyülő jéghegy-él, évszámok egymás alatt. */
@media (max-width: 760px) {
	.cf-massif { display: block; position: relative; margin-top: 24px; }
	.cf-massif__svg { display: none; }
	.cf-col {
		display: block;
		position: relative;
		z-index: 1;
		padding: 0 0 24px 22px;
		border-left: 2px solid rgba(219, 138, 62, 0.55);
	}
	.cf-col--1 { margin-left: 0; }
	.cf-col--2 { margin-left: 14px; }
	.cf-col--3 { margin-left: 28px; }
	.cf-col--4 { margin-left: 42px; }
	.cf-col--5 { margin-left: 56px; padding-bottom: 0; border-left-color: var(--cf-accent); }
	.cf-summit {
		position: relative;
		display: flex;
		flex-direction: row;
		align-items: center;
		gap: 10px;
		margin: 0 0 8px !important;
		align-self: auto;
		justify-self: start;
	}
	.cf-summit i { position: absolute; left: -28px; margin: 0; width: 10px; height: 10px; }
	.cf-summit b { font-size: 15px; color: var(--cf-text); }
	.cf-cap { text-align: left; padding: 0; border-top: 0; }
	.cf-burst { display: none; }
}

/* 21.8 Mindig látszik, mi jön ezután. */
.cf-nextcue {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 40;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 16px 11px;
	border-radius: 999px;
	border: 1px solid var(--cf-border);
	background: rgba(28, 23, 16, 0.88);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	color: var(--cf-muted);
	font-size: 12.5px;
	text-decoration: none;
	opacity: 0;
	transform: translateY(8px);
	pointer-events: none;
	transition: opacity 0.25s ease, transform 0.25s ease;
}
.cf-nextcue.is-on { opacity: 1; transform: none; pointer-events: auto; }
.cf-nextcue b { color: var(--cf-text); font-weight: 600; }
.cf-nextcue svg { width: 14px; height: 14px; fill: none; stroke: var(--cf-accent); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cf-nextcue:hover { border-color: var(--cf-accent); }
@media (max-width: 900px) { .cf-nextcue { display: none; } }

/* 21.9 Lábléc: a márka alatt a kapcsolat, a bekezdés helyett. */
.cf-footer__contact { list-style: none; margin: 15px 0 20px; padding: 0; display: grid; gap: 9px; }
.cf-footer__contact a { color: var(--cf-sec); text-decoration: none; font-size: 14.5px; }
.cf-footer__contact a:hover { color: var(--cf-accent); }
.cf-footer__brand .cf-btn { margin-top: 2px; }


/* ============================================================
   22. 2026-09-02 — Janka módosítási listája (Modositas_v2)
   ============================================================ */

/* 22.1 Fejléc: alacsonyabb sticky sáv. */
.cf-header__inner { padding: 3px 28px; }
.cf-header .cf-nav a, .cf-header .wp-block-navigation-item__content { font-size: 14.5px; }
/* Csak 601px felett: a szűrt ősréteg containing blockká válik a position:fixed
   gyerekeknek, és mobilon ebbe ragadna bele a nyitott hamburger menü. */
@media (min-width: 601px) {
	.wp-block-template-part:has(> .cf-header) {
		-webkit-backdrop-filter: saturate(140%) blur(8px);
		backdrop-filter: saturate(140%) blur(8px);
	}
}

/* 22.2 Coverflow: a középső kártya nagy, a szomszédok kikandikálnak. */
.cf-slider { position: relative; }
.cf-slider__viewport { overflow: hidden; padding: 6px 0 10px; }
.cf-slider__track { display: flex; align-items: stretch; gap: 20px; will-change: transform; }
.cf-slide {
	flex: 0 0 auto;
	width: min(660px, 62%);
	min-width: 0;
	opacity: 0.34;
	transform: scale(0.9);
	transform-origin: center center;
	cursor: pointer;
	transition: transform 0.42s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.42s ease, border-color 0.2s ease;
}
.cf-slide.is-near { opacity: 0.5; }
.cf-slide.is-active { opacity: 1; transform: scale(1); cursor: default; border-color: rgba(219, 138, 62, 0.4); }
.cf-slide:not(.is-active) .cf-btn { pointer-events: none; }
.cf-slide:not(.is-active):hover { opacity: 0.68; }
@media (prefers-reduced-motion: reduce) { .cf-slide { transition: none; } }
.cf-slider__nav { justify-content: center; gap: 12px; margin-top: 16px; }
.cf-slider__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	width: 46px;
	height: 46px;
	background: rgba(14, 12, 9, 0.82);
	backdrop-filter: blur(3px);
}
.cf-slider__arrow[data-dir="-1"] { left: -4px; }
.cf-slider__arrow[data-dir="1"] { right: -4px; }
.cf-slider__tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-padding-inline: 24px; }
.cf-slider__tabs::-webkit-scrollbar { display: none; }
.cf-slider__tab { flex: 0 0 auto; }
@media (max-width: 900px) {
	.cf-slide { width: 84%; }
	.cf-slider__track { gap: 14px; }
	.cf-slider__arrow { position: static; transform: none; width: 40px; height: 40px; background: transparent; }
	.cf-slider__nav { justify-content: space-between; }
	.cf-slider__dots { flex: 1 1 auto; justify-content: center; }
}

/* 22.3 Hero: hármas, animált nyíl. */
.cf-scrollcue { width: 42px; height: 50px; border: 0; border-radius: 0; margin-left: 6px; }
.cf-scrollcue:hover { border: 0; color: var(--cf-cream, #F0E9DE); }
.cf-scrollcue svg { width: 26px; height: 32px; animation: none; }
.cf-scrollcue svg path { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; opacity: 0.2; }
@media (prefers-reduced-motion: no-preference) {
	.cf-scrollcue svg { animation: none; }
	.cf-scrollcue .cf-chev { animation: cf-chev 1.9s ease-in-out infinite; }
	.cf-scrollcue .cf-chev--2 { animation-delay: 0.16s; }
	.cf-scrollcue .cf-chev--3 { animation-delay: 0.32s; }
	@keyframes cf-chev { 0%, 100% { opacity: 0.16; } 42% { opacity: 1; } }
}

/* 22.4 Csapatfotók. */
img.cf-photo { display: block; object-fit: cover; object-position: center 22%; background: var(--cf-raised); font-size: 0; }
.cf-midcta--solo { margin-top: 26px; }

/* 22.5 „Miért nehéz ez" desktopon egy képernyőre. */
@media (min-width: 1000px) {
	#honnan { padding-block: clamp(28px, 3vw, 42px); }
	#honnan h2 { font-size: clamp(26px, 2.7vw, 38px); max-width: 23ch; margin-bottom: 8px; }
	#honnan .cf-lead { font-size: 16px; max-width: 78ch; margin-bottom: 10px; }
	#honnan .cf-massif { margin-top: 16px; }
	#honnan .cf-massif > svg { height: 215px; }
	#honnan .cf-massif__note { margin-top: 10px; }
}

/* 22.6 Lábléc desktopon: az oszlopok nem szorulnak a jobb szélre. */
@media (min-width: 860px) {
	.cf-footer__top { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 40px; align-items: start; }
	.cf-footer__cols { display: contents; }
}

/* 22.7 „Következik" felirat nélkül. */
.cf-nextcue { padding: 9px 15px; }

/* 22.8 Papírrepülő a CTA sávban. */
.cf-cta__inner { position: relative; }
.cf-plane {
	position: absolute;
	left: 46%;
	right: 8%;
	top: 50%;
	transform: translateY(-52%);
	height: 118px;
	pointer-events: none;
	overflow: visible;
	color: rgba(21, 19, 15, 0.62);
}
.cf-plane__trail { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-dasharray: 3 8; clip-path: inset(0 100% 0 0); }
.cf-plane__ship { fill: currentColor; offset-path: path("M8 108 C 64 108, 48 62, 100 58 C 152 54, 138 20, 192 18 C 228 17, 250 22, 268 30"); offset-rotate: auto; offset-distance: 100%; opacity: 0; }
.cf-plane.is-on .cf-plane__trail, .cf-plane.is-done .cf-plane__trail { animation: cf-wipe 1.7s linear 1 both; }
.cf-plane.is-on .cf-plane__ship, .cf-plane.is-done .cf-plane__ship { animation: cf-fly 1.7s cubic-bezier(0.42, 0, 0.3, 1) 1 both; }
.cf-plane.is-done .cf-plane__trail, .cf-plane.is-done .cf-plane__ship { animation-duration: 0.01s; }
@keyframes cf-wipe { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 -6% 0 0); } }
@keyframes cf-fly { 0% { offset-distance: 0%; opacity: 0; } 8% { opacity: 1; } 100% { offset-distance: 100%; opacity: 1; } }
@media (max-width: 900px) { .cf-plane { display: none; } }

/* 22.9 Sütisáv a márka szerint. */
.cookieadmin_law_container.cookieadmin_box {
	background: var(--cf-raised, #1A1610) !important;
	border: 1px solid var(--cf-border, #2C261D) !important;
	border-radius: 14px !important;
	box-shadow: none !important;
	color: var(--cf-sec, #B3AA9A) !important;
	font-family: Inter, system-ui, sans-serif !important;
	max-width: 420px;
}
.cookieadmin_law_container.cookieadmin_box p,
.cookieadmin_law_container.cookieadmin_box span { color: var(--cf-sec, #B3AA9A) !important; font-size: 14px !important; line-height: 1.55 !important; }
.cookieadmin_law_container .cookieadmin_policy_link a,
.cookieadmin_law_container a { color: var(--cf-accent, #DB8A3E) !important; text-decoration: none !important; }
.cookieadmin_law_container .cookieadmin_btn {
	border-radius: 999px !important;
	font-family: Inter, system-ui, sans-serif !important;
	font-size: 13.5px !important;
	font-weight: 600 !important;
	padding: 9px 18px !important;
	box-shadow: none !important;
	border: 1px solid var(--cf-border, #2C261D) !important;
	background: transparent !important;
	color: var(--cf-text, #F0E9DE) !important;
	transition: border-color 0.18s ease, color 0.18s ease;
}
.cookieadmin_law_container .cookieadmin_btn:hover { border-color: var(--cf-accent, #DB8A3E) !important; color: var(--cf-accent, #DB8A3E) !important; }
.cookieadmin_law_container .cookieadmin_accept_btn,
.cookieadmin_cookie_modal .cookieadmin_accept_btn {
	background: var(--cf-accent, #DB8A3E) !important;
	border-color: var(--cf-accent, #DB8A3E) !important;
	color: #15130F !important;
}
.cookieadmin_cookie_modal {
	background: var(--cf-bg2, #12100C) !important;
	border: 1px solid var(--cf-border, #2C261D) !important;
	border-radius: 16px !important;
	box-shadow: none !important;
	color: var(--cf-text, #F0E9DE) !important;
}
.cookieadmin_cookie_modal, .cookieadmin_cookie_modal * { font-family: Inter, system-ui, sans-serif !important; }
.cookieadmin_cookie_modal .cookieadmin_preference_title,
.cookieadmin_cookie_modal .stitle { color: var(--cf-text, #F0E9DE) !important; }
.cookieadmin_cookie_modal .cookieadmin_desc,
.cookieadmin_cookie_modal .cookieadmin_remark { color: var(--cf-sec, #B3AA9A) !important; }
.cookieadmin_cookie_modal .cookieadmin_types,
.cookieadmin_cookie_modal .cookieadmin_mod_head,
.cookieadmin_cookie_modal .cookieadmin_modal_footer { border-color: var(--cf-border, #2C261D) !important; }
.cookieadmin_modal_overlay { background: rgba(14, 12, 9, 0.72) !important; }
.cookieadmin_re_consent { box-shadow: none !important; }


/* 22.10 Utólagos igazítások (2026-09-02, tesztelés után). */
img.cf-photo { height: auto; }
.cf-plane { left: auto; right: 118px; width: 295px; transform: translateY(-28%); }
@media (min-width: 1000px) {
	#honnan { padding-block: clamp(24px, 2.4vw, 34px); }
	#honnan h2 { font-size: clamp(25px, 2.5vw, 34px); margin-bottom: 6px; }
	#honnan .cf-lead { font-size: 15.5px; margin-bottom: 8px; }
	#honnan .cf-massif { margin-top: 12px; }
	#honnan .cf-massif > svg { height: 190px; }
	#honnan .cf-massif__note { margin-top: 8px; font-size: 13.5px; }
}


/* 22.11 Süti-ikon: márkaszín, kisebb, nem takarja a gombokat. */
.cookieadmin_re_consent {
	background-color: var(--cf-raised, #1A1610) !important;
	border: 1px solid var(--cf-border, #2C261D) !important;
	width: 34px !important;
	height: 34px !important;
	opacity: 0.55;
	transition: opacity 0.18s ease, border-color 0.18s ease;
}
.cookieadmin_re_consent:hover { opacity: 1; border-color: var(--cf-accent, #DB8A3E) !important; }
.cookieadmin_reconsent_img { filter: grayscale(1) brightness(1.7); width: 18px !important; height: 18px !important; }


/* 22.12 Mobil: kényelmesebb érintőfelületek. */
@media (max-width: 900px) {
	.cf-slider__tab { min-height: 40px; padding-block: 9px; }
	.cf-slider__dots { gap: 4px; }
	.cf-slider__dot { position: relative; }
	.cf-slider__dot::after { content: ""; position: absolute; inset: -14px -8px; }
	.cf-header__inner { padding: 2px 20px; }
}


/* ============================================================
   23. 2026-09-02 — Janka módosítási listája (Modositas_3)
   ============================================================ */

/* 23.1 Fejléc: a menü függőlegesen középen. */
.cf-header__inner { align-items: center; }
.cf-header__inner > * { align-self: center; }
.cf-header .wp-block-navigation,
.cf-header .wp-block-navigation__container,
.cf-header .wp-block-navigation-item { margin-block: 0; align-items: center; }
.cf-header .wp-block-navigation__responsive-container-open { align-self: center; }

/* 23.2 Hero: a nyilak középen, a gombok alatt. */
.cf-hero__cue { display: flex; justify-content: center; margin-top: 16px; }
.cf-hero__cue .cf-scrollcue { margin-left: 0; }

/* 23.3 A hero logójáról lekerül a csillanás. */
.cf-hero__mark::after { content: none !important; }
.cf-hero:hover .cf-hero__mark::after { animation: none !important; }

/* 23.4 Carousel: tömörebb, keskenyebb kártya, mobilon is kilátszó szomszédok. */
.cf-slider { margin-top: 22px; }
.cf-slider__tabs { margin-bottom: 16px; }
.cf-slider__viewport { padding: 4px 0 8px; }
.cf-slider__track { gap: 18px; }
.cf-slider__nav { margin-top: 12px; }
.cf-slide {
	width: min(560px, 54%);
	padding: 22px 26px 24px;
}
.cf-slide__head { gap: 10px; }
.cf-slide h3 { margin: 10px 0 8px; font-size: clamp(19px, 1.85vw, 24px); max-width: 22ch; }
.cf-slide p { font-size: 15px; line-height: 1.55; max-width: 58ch; }
.cf-slide p + p { margin-top: 9px; }
.cf-slide h3 + p { margin-bottom: 0; }
.cf-slide__note { font-size: 13.5px; }
.cf-slide .cf-btn { margin-top: 18px; }
.cf-slide[data-clone] { user-select: none; }
@media (max-width: 900px) {
	.cf-slide { width: 70%; padding: 20px 20px 22px; }
	.cf-slider__track { gap: 10px; }
}

/* 23.5 A carousel-szekció is elfér egy képernyőn. */
@media (min-width: 1000px) {
	#szolgaltatasok { padding-block: clamp(24px, 2.4vw, 36px); }
	#szolgaltatasok h2 { font-size: clamp(25px, 2.5vw, 34px); margin-bottom: 6px; }
	#szolgaltatasok .cf-lead { font-size: 15.5px; margin-bottom: 8px; }
}

/* 23.6 Csapatkártya: kis kép, mellette a név és a pozíció, alatta a szöveg. */
.cf-person__head {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 8px 0 14px;
	padding-right: 96px;
}
.cf-person__id { min-width: 0; }
.cf-person__id h3 { margin: 0 0 6px; font-size: 19px; line-height: 1.25; }
.cf-person__id .cf-role { margin: 0; }
img.cf-photo {
	width: 78px;
	height: 78px;
	flex: 0 0 78px;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	margin-bottom: 0;
	object-position: center 18%;
}
@media (max-width: 900px) {
	.cf-person__head { padding-right: 84px; }
}

/* 23.7 A hegyvonulat magasabbról indul, és a csúcsok a gerincen ülnek. */
#honnan .cf-massif { margin-top: 2px; }
#honnan .cf-massif > svg.cf-massif__svg { height: 300px; }
#honnan .cf-massif__note { margin-top: 10px; font-size: 13.5px; }

/* 23.8 Mobil hero: kevesebb üres tér a nyilak alatt. */
@media (max-width: 700px) {
	.cf-hero { padding-block: 20px 24px; }
	.cf-hero__cue { margin-top: 12px; }
}

/* 23.9 Papírrepülő: desktopon oldalról, mobilon fentről érkezik a gombra. */
.cf-plane--wide {
	display: block;
	left: auto;
	right: 150px;
	top: 50%;
	transform: translateY(-52%);
	transform-origin: 100% 50%;
	width: 520px;
	height: 120px;
}
@media (max-width: 1180px) {
	.cf-plane--wide { transform: translateY(-52%) scale(0.68); }
}
.cf-plane--wide .cf-plane__ship {
	offset-path: path("M62 106 C 120 106, 156 102, 196 94 C 244 86, 272 64, 300 56 C 348 42, 402 48, 402 78 C 402 106, 358 112, 346 92 C 334 72, 368 42, 410 44 C 452 46, 486 60, 520 62");
}
.cf-plane--tall {
	display: none;
	position: absolute;
	left: auto;
	right: 10px;
	top: auto;
	bottom: 2px;
	transform: none;
	width: 176px;
	height: 78px;
}
.cf-plane--tall .cf-plane__ship {
	offset-path: path("M174 12 C 166 14, 158 17, 146 22 C 126 30, 100 33, 80 44 C 62 54, 70 70, 84 64 C 98 58, 90 40, 70 42 C 46 44, 36 68, 6 68");
}
@media (max-width: 900px) {
	.cf-plane--wide { display: none; }
	.cf-plane--tall { display: block; }
}
@keyframes cf-wipe-rtl { from { clip-path: inset(0 0 0 100%); } to { clip-path: inset(0 0 0 -6%); } }
.cf-plane--tall.is-on .cf-plane__trail,
.cf-plane--tall.is-done .cf-plane__trail { animation-name: cf-wipe-rtl; }


/* 23.10 Mobil carousel: tömörebb szedés a keskenyebb kártyán. */
@media (max-width: 700px) {
	.cf-slide { padding: 18px 17px 20px; }
	.cf-slide h3 { font-size: 18px; margin: 8px 0 6px; }
	.cf-slide p { font-size: 14.5px; line-height: 1.5; }
	.cf-slide__note { font-size: 13px; }
	.cf-slide .cf-btn { margin-top: 14px; }
}


/* 23.11 Alacsony ablak: a szekciók így is elférnek egy képernyőn. */
@media (min-width: 1000px) and (max-height: 820px) {
	#szolgaltatasok { padding-block: 18px; }
	#szolgaltatasok .cf-eyebrow { margin-bottom: 4px; }
	#szolgaltatasok h2 { font-size: clamp(22px, 2.1vw, 30px); margin-bottom: 4px; }
	#szolgaltatasok .cf-lead { font-size: 14.5px; margin-bottom: 4px; }
	#szolgaltatasok .cf-slider { margin-top: 14px; }
	#szolgaltatasok .cf-slider__tabs { margin-bottom: 10px; }
	#szolgaltatasok .cf-slider__tab { padding-block: 7px; font-size: 11.5px; }
	#szolgaltatasok .cf-slider__viewport { padding: 3px 0 5px; }
	#szolgaltatasok .cf-slide { padding: 16px 20px 18px; }
	#szolgaltatasok .cf-slide h3 { font-size: 19px; margin: 6px 0 6px; }
	#szolgaltatasok .cf-slide p { font-size: 14px; line-height: 1.5; }
	#szolgaltatasok .cf-slide__note { font-size: 13px; }
	#szolgaltatasok .cf-slide .cf-btn { margin-top: 12px; }
	#szolgaltatasok .cf-slider__nav { margin-top: 8px; }
	#szolgaltatasok .cf-slider__arrow { width: 40px; height: 40px; }

	#honnan { padding-block: 18px; }
	#honnan .cf-eyebrow { margin-bottom: 4px; }
	#honnan h2 { font-size: clamp(22px, 2.1vw, 30px); margin-bottom: 4px; }
	#honnan .cf-lead { font-size: 14.5px; margin-bottom: 4px; }
	
	#honnan .cf-massif__note { margin-top: 6px; font-size: 13px; }
}
@media (min-width: 1000px) and (max-height: 700px) {
	
	#honnan .cf-slide, #szolgaltatasok .cf-slide { padding: 14px 18px 16px; }
	#szolgaltatasok .cf-slide h3 { font-size: 18px; }
	#szolgaltatasok .cf-slide p { font-size: 13.5px; }
}

/* 23.12 Csapatkártya: a név és a pozíció egy-egy sorban, a szalag alatt. */
.cf-person__head { margin: 42px 0 14px; padding-right: 0; }
.cf-person__id h3 { font-size: 18.5px; }


/* 23.13 Csapatkártya: a pozíció is elfér egy sorban. */
img.cf-photo { width: 66px; height: 66px; flex: 0 0 66px; }
.cf-person__head { gap: 12px; }
.cf-person__id .cf-role { white-space: nowrap; font-size: 11.5px; padding-inline: 9px; }
@media (max-width: 520px) {
	.cf-person__id .cf-role { white-space: normal; }
}


/* 23.14 Kevesebb üres tér a szekciók között; és amikor szekcióra ugrunk,
   a sárga felirat közvetlenül a sticky fejléc alá kerül. */
.cf-band { padding-block: clamp(30px, 3.2vw, 46px); }
.cf-band[id], .cf-slide[id] { scroll-margin-top: 82px; }
#honnan .cf-massif__note { margin-bottom: 0; }
.cf-proof { padding: 13px 0 15px; }
@media (min-width: 1000px) and (max-height: 820px) {
	.cf-band { padding-block: 22px; }
}
@media (max-width: 700px) {
	.cf-band { padding-block: clamp(26px, 6vw, 38px); }
}


/* 23.15 A csapatrész alatti gomb fölül nem kell elválasztó vonal. */
.cf-midcta { border-top: 0; padding-top: 0; margin-top: 26px; }


/* 23.16 A „MarTech körkép" bevezetője a teljes szélességét használja. */
#honnan .cf-lead { padding-right: 0; max-width: 74ch; }

/* 23.17 „Miben hiszünk": tömörebb elhelyezés. */
@media (min-width: 1000px) and (max-height: 900px) {
	#amit-kapsz h2 { font-size: clamp(24px, 2.3vw, 32px); margin-bottom: 6px; max-width: 26ch; }
	#amit-kapsz .cf-lead { font-size: 15px; margin-bottom: 6px; max-width: 82ch; padding-right: 0; }
	#amit-kapsz .cf-grid { margin-top: 18px; gap: 16px; }
	#amit-kapsz .cf-card { padding: 20px 22px 22px; }
	#amit-kapsz .cf-card h3 { font-size: 18px; margin: 10px 0 8px; }
	#amit-kapsz .cf-card p { font-size: 14.5px; line-height: 1.55; }
}

/* 23.18 Süti-beállítások ablak: minden gomb a márka szerint. */
.cookieadmin_cookie_modal .cookieadmin_btn,
.cookieadmin_modal_footer .cookieadmin_btn {
	border-radius: 999px !important;
	font-family: Inter, system-ui, sans-serif !important;
	font-size: 13.5px !important;
	font-weight: 600 !important;
	padding: 9px 18px !important;
	box-shadow: none !important;
	border: 1px solid var(--cf-border, #2C261D) !important;
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;
	color: var(--cf-text, #F0E9DE) !important;
}
.cookieadmin_cookie_modal .cookieadmin_btn:hover,
.cookieadmin_modal_footer .cookieadmin_btn:hover {
	border-color: var(--cf-accent, #DB8A3E) !important;
	color: var(--cf-accent, #DB8A3E) !important;
}
.cookieadmin_cookie_modal .cookieadmin_accept_btn,
.cookieadmin_modal_footer .cookieadmin_accept_btn,
.cookieadmin_law_container .cookieadmin_accept_btn {
	background: var(--cf-accent, #DB8A3E) !important;
	background-color: var(--cf-accent, #DB8A3E) !important;
	border-color: var(--cf-accent, #DB8A3E) !important;
	color: #15130F !important;
}
.cookieadmin_cookie_modal .cookieadmin_accept_btn:hover,
.cookieadmin_modal_footer .cookieadmin_accept_btn:hover,
.cookieadmin_law_container .cookieadmin_accept_btn:hover {
	background-color: #E59B55 !important;
	border-color: #E59B55 !important;
	color: #15130F !important;
}
.cookieadmin_cookie_modal .cookieadmin_btn *,
.cookieadmin_modal_footer .cookieadmin_btn * { color: inherit !important; }
.cookieadmin_cookie_modal .cookieadmin_slider { background-color: #3A3227 !important; }
.cookieadmin_cookie_modal input:checked + .cookieadmin_slider { background-color: var(--cf-accent, #DB8A3E) !important; }


/* 23.19 A carousel a képernyő széléig fut, a szomszédok is látszanak. */
.cf-slider__viewport {
	position: relative;
	margin-inline: calc(50% - 50vw);
	padding-inline: 0;
}
.cf-slider__arrow[data-dir="-1"] { left: calc(50% - 50vw + 10px); }
.cf-slider__arrow[data-dir="1"] { right: calc(50% - 50vw + 10px); }
@media (max-width: 900px) {
	.cf-slider__arrow[data-dir="-1"], .cf-slider__arrow[data-dir="1"] { left: auto; right: auto; }
}


/* 23.20 Csapatkártya: a név egy sorban, a fotó kisebb, a pozíció keskenyebb. */
img.cf-photo { width: 60px; height: 60px; flex: 0 0 60px; }
.cf-person__head { gap: 12px; margin: 40px 0 12px; }
.cf-person__id { min-width: 0; flex: 1 1 auto; }
.cf-person__id h3 { font-size: 17.5px; white-space: nowrap; margin: 0 0 6px; }
.cf-person__id .cf-role { white-space: normal; font-size: 11px; padding: 3px 8px 4px; }


/* ============================================================
   24. 2026-09-02 este — chat-korrekciók
   ============================================================ */

/* 24.1 A hegyvonulat teljes méretben, csak feljebb húzva. */
#honnan .cf-massif { transform: none; margin-top: -46px; }
#honnan .cf-massif__note { margin-top: 12px; }
@media (max-width: 760px) { #honnan .cf-massif { margin-top: 18px; } }

/* 24.2 „Miben hiszünk": a cím és a bevezető balra marad. */
#amit-kapsz h2, #amit-kapsz .cf-lead {
	max-width: none;
	margin-inline-start: max(0px, calc((100% - 1080px) / 2)) !important;
	margin-inline-end: auto !important;
	text-align: left;
}

/* 24.3 Csapatfotó: lekerekített négyzet, a kártyához illő formában. */
img.cf-photo { width: 64px; height: 64px; flex: 0 0 64px; border-radius: 12px; object-position: center 30%; }

/* 24.4 Süti-beállítások: fejlesztés alatt jelzés. */
.cookieadmin_preference_title::after { content: " (FEJLESZTÉS ALATT)"; font-size: 11px; letter-spacing: 0.08em; opacity: 0.7; }


/* 24.5 A csapat szekció is elfér egy alacsonyabb képernyőn. */
@media (min-width: 1000px) and (max-height: 820px) {
	#csapat h2 { font-size: clamp(22px, 2.1vw, 30px); margin-bottom: 4px; }
	#csapat .cf-lead { font-size: 14.5px; margin-bottom: 4px; }
	#csapat .cf-grid { margin-top: 12px; }
	#csapat .cf-qa__kicker { margin-bottom: 18px; }
	#csapat .cf-qa__q { font-size: 16px; }
	#csapat .cf-qa__a { font-size: 13px; }
	#csapat .cf-qa__list { gap: 22px; }
	#csapat .cf-qa__back { padding-top: 24px; }
	#csapat.cf-band { padding-block: 18px; }
	#csapat .cf-lead { margin-top: 12px; }
	#csapat .cf-midcta { margin-top: 12px; }
	#csapat .cf-people .cf-person__bio { font-size: 14px; line-height: 1.42; }
	#csapat .cf-people .cf-person--tagged { padding: 20px; }
	#csapat .cf-person .cf-person__head img.cf-photo { width: 84px; height: 84px; flex: 0 0 84px; border-radius: 21px; }
	#csapat .cf-people .cf-person__head { margin: 0 0 12px; }
	#csapat .cf-people .cf-person__id h3 { font-size: 20px; margin: 2px 0 8px; }
	#csapat .cf-people .cf-person__foot { margin-top: 12px; }
	#csapat .cf-people .cf-person__more { font-size: 14px; }
	#csapat .cf-midcta { margin-top: 16px; }
}


/* 24.6 Minden szekció címe és bevezetője a bal oldali vonalon marad.
   (A WordPress magja középre húzza azt, ami keskenyebb a tartalomoszlopnál.) */
.cf-band:not(.cf-cta) > h2,
.cf-band:not(.cf-cta) > .cf-lead,
.cf-band:not(.cf-cta) > .cf-eyebrow {
	margin-inline-start: max(0px, calc((100% - 1080px) / 2)) !important;
	margin-inline-end: auto !important;
	text-align: left;
}


/* ============================================================
   25. Osztott színpad a csapatnál + arányok
   ============================================================ */

/* 25.1 A csapatkártya: fotó, név, szerep, bemutatkozás, kapcsolat-sor, „Bővebben". */
#csapat .cf-people { gap: 24px; }
#csapat .cf-person--tagged { padding: 26px; border: 1px solid var(--cf-border); }
#csapat .cf-person { display: flex; flex-direction: column; }
#csapat .cf-person__head { display: flex; gap: 18px; align-items: flex-start; margin: 0 0 20px; padding-right: 0; }
#csapat img.cf-photo {
	width: 104px; height: 104px; flex: 0 0 104px;
	border-radius: 26px; object-fit: cover; object-position: center 28%;
}
.cf-person__id { min-width: 0; }
#csapat .cf-person__id h3 { margin: 4px 0 10px; font-size: 22px; line-height: 1.15; font-weight: 700; white-space: normal; }
#csapat .cf-person .cf-role {
	display: block; margin: 0;
	font-family: Montserrat, "Avenir Next", "Century Gothic", system-ui, sans-serif;
	font-weight: 600; font-size: 14px; line-height: 1.4; letter-spacing: 0.01em; text-transform: none;
	padding: 0; border: 0; border-radius: 0; background: none; color: var(--cf-sec);
	white-space: normal;
}
#csapat .cf-person__foot {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	margin-top: 18px;
}
#csapat .cf-person__foot .cf-person__more {
	align-self: center;
	display: inline-flex; align-items: center; gap: 6px;
	height: 34px; line-height: 1;
}
.cf-person__bio { margin: 0 0 auto; }
.cf-todo { color: #B5561F; font-style: italic; }

.cf-person__links { display: flex; flex-wrap: nowrap; gap: 8px; margin-top: 0; }
.cf-chip {
	display: inline-flex; align-items: center; justify-content: center;
	width: 34px; height: 34px; padding: 0; flex: none;
	border: 1px solid rgba(21, 19, 15, 0.28); border-radius: 999px;
	font-family: Montserrat, "Avenir Next", "Century Gothic", system-ui, sans-serif;
	font-weight: 600; font-size: 12.5px; color: var(--cf-text); text-decoration: none;
	transition: background 0.2s ease, border-color 0.2s ease;
}
.cf-chip:hover, .cf-chip:focus-visible { background: #EAD9C2; border-color: #C0721F; }
.cf-chip span { display: none; }
.cf-ic { width: 15px; height: 15px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cf-ic--li { width: 13px; height: 13px; fill: currentColor; stroke: none; }

.cf-person__more {
	appearance: none; background: none; border: 0;
	padding: 0; margin: 0; white-space: nowrap;
	font-family: Montserrat, "Avenir Next", "Century Gothic", system-ui, sans-serif;
	font-size: 15px; font-weight: 700; color: var(--cf-text);
	cursor: pointer; text-align: left; align-self: flex-start;
}
.cf-person__more span { display: inline-block; transition: transform 0.18s ease; }
.cf-person__more:hover span { transform: translateX(3px); }
.cf-person__more:focus-visible, .cf-qa__back:focus-visible { outline: 2px solid #C0721F; outline-offset: 4px; border-radius: 4px; }

/* 25.2 A kérdés-válasz panel. */
.cf-qa { display: none; }
.cf-qa__kicker {
	margin: 0 0 30px;
	font-family: Montserrat, "Avenir Next", "Century Gothic", system-ui, sans-serif;
	font-weight: 800; font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: #C0721F;
}
.cf-qa__list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 34px; max-width: 62ch; }
.cf-qa__list li { display: grid; grid-template-columns: 44px 1fr; column-gap: 16px; }
.cf-qa__n {
	font-family: Montserrat, "Avenir Next", "Century Gothic", system-ui, sans-serif;
	font-weight: 800; font-size: 15px; color: #C0721F;
	padding-top: 5px; border-top: 2px solid #C0721F; height: fit-content;
}
.cf-qa__q { font-family: Montserrat, "Avenir Next", "Century Gothic", system-ui, sans-serif; font-weight: 700; font-size: 17px; line-height: 1.3; color: var(--cf-text); margin: 0 0 8px; }
.cf-qa__a { font-size: 15px; line-height: 1.6; color: var(--cf-sec); margin: 0; }
.cf-qa__a.is-ph { font-style: italic; opacity: 0.75; }
.cf-qa__back {
	appearance: none; background: none; border: 0;
	margin-top: auto; padding: 40px 0 0;
	font-family: Montserrat, "Avenir Next", "Century Gothic", system-ui, sans-serif;
	font-weight: 700; font-size: 16px; color: var(--cf-text);
	cursor: pointer; text-align: left; align-self: flex-start;
}
.cf-qa__bm { display: none; }

/* 25.2b Asztali színpad: az aktív balra, a panel középen, a másik kettő jobbra. */
@media (min-width: 881px) {
	#csapat .cf-people {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		align-items: stretch;
		transition: grid-template-columns 0.5s cubic-bezier(0.4, 0, 0.2, 1);
	}
	#csapat .cf-people.is-open { grid-template-columns: 320px minmax(0, 1fr) 232px; grid-template-rows: auto 1fr; }
	#csapat .cf-people.is-open .cf-person.is-active { grid-column: 1; grid-row: 1 / 3; }
	.cf-people.is-open .cf-person.is-active .cf-person__more { visibility: hidden; }
	#csapat .cf-people.is-open > .cf-qa--stage { grid-column: 2; grid-row: 1 / 3; display: flex; flex-direction: column; }
	.cf-qa--stage { padding: 4px 8px 4px 44px; border-left: 1px solid rgba(181, 86, 31, 0.35); }

	#csapat .cf-people.is-open .cf-person:not(.is-active) {
		grid-column: 3; grid-row: 1; align-self: start;
		padding: 16px; min-height: 0; cursor: pointer;
	}
	#csapat .cf-people.is-open .cf-person:not(.is-active) ~ .cf-person:not(.is-active) { grid-row: 2; }
	#csapat .cf-people.is-open .cf-person:not(.is-active):hover { background: #EAD9C2; }
	#csapat .cf-people.is-open .cf-person:not(.is-active) .cf-bookmark,
	#csapat .cf-people.is-open .cf-person:not(.is-active) .cf-person__bio,
	#csapat .cf-people.is-open .cf-person:not(.is-active) .cf-person__more { display: none; }
	#csapat .cf-people.is-open .cf-person:not(.is-active) .cf-person__head { gap: 14px; align-items: center; margin: 0; }
	#csapat .cf-people.is-open .cf-person:not(.is-active) img.cf-photo { width: 56px; height: 56px; flex: 0 0 56px; border-radius: 14px; }
	#csapat .cf-people.is-open .cf-person:not(.is-active) .cf-person__id h3 { font-size: 16px; margin: 0 0 4px; line-height: 1.2; }
	#csapat .cf-people.is-open .cf-person:not(.is-active) .cf-person__id { min-width: 0; overflow: hidden; }
	#csapat .cf-people.is-open .cf-person:not(.is-active) .cf-person__id h3 { overflow-wrap: anywhere; }
	#csapat .cf-people.is-open .cf-person:not(.is-active) .cf-role {
		display: block; border: 0; padding: 0; background: none;
		font-family: inherit; font-weight: 500; font-size: 13px; line-height: 1.35;
		white-space: normal; overflow-wrap: anywhere; color: var(--cf-sec);
	}
	#csapat .cf-people.is-open .cf-person:not(.is-active) .cf-person__foot { margin: 10px 0 0 70px; justify-content: flex-start; }
	#csapat .cf-people.is-open .cf-person:not(.is-active) .cf-person__links { margin: 0; gap: 6px; }
	.cf-people.is-open .cf-person:not(.is-active) .cf-chip { width: 28px; height: 28px; padding: 0; justify-content: center; }
	.cf-people.is-open .cf-person:not(.is-active) .cf-chip span { display: none; }
	.cf-people.is-open .cf-person:not(.is-active) .cf-ic { width: 13px; height: 13px; }
	.cf-people.is-open .cf-person:not(.is-active) .cf-ic--li { width: 11px; height: 11px; }
}

/* 25.2c Mobil: a panel a kártyán belül nyílik. */
@media (max-width: 880px) {
	#csapat .cf-people, #csapat .cf-people.is-open { display: block; }
	.cf-person { margin-bottom: 16px; }
	.cf-person:last-of-type { margin-bottom: 0; }
	.cf-qa--stage { display: none !important; }
	.cf-person.is-active .cf-qa {
		display: flex; flex-direction: column;
		margin-top: 22px; padding-top: 22px;
		border-top: 1px solid rgba(181, 86, 31, 0.35);
	}
	#csapat .cf-person.is-active .cf-person__more { display: none; }
	#csapat img.cf-photo { width: 72px; height: 72px; flex: 0 0 72px; border-radius: 18px; }
	#csapat .cf-person__head { margin: 0 0 18px; }
	#csapat .cf-person--tagged { padding: 22px 20px; }
	.cf-person__id h3 { font-size: 20px; }
	.cf-qa__kicker { margin-bottom: 22px; }
	.cf-qa__list { gap: 26px; }
	.cf-qa__list li { grid-template-columns: 32px 1fr; column-gap: 12px; }
	.cf-qa__q { font-size: 15.5px; }
	.cf-qa__a { font-size: 14px; }
	.cf-qa__back { padding-top: 28px; }
	.cf-qa__bd { display: none; }
	.cf-qa__bm { display: inline; }
}
@media (prefers-reduced-motion: reduce) {
	.cf-people, .cf-person, .cf-chip { transition: none; }
}

/* 25.3 A CTA-sáv legyen levegősebb, a papírrepülő is elfér benne. */
.cf-band.cf-cta { padding-block: clamp(56px, 6vw, 84px); }
@media (min-width: 1000px) and (max-height: 820px) { .cf-band.cf-cta { padding-block: 72px; } }

/* 25.4 A carousel-szekció kaphat még egy kis levegőt. */
@media (min-width: 1000px) and (max-height: 820px) {
	#amit-kapsz { padding-block: 58px; }
	#amit-kapsz .cf-grid { margin-top: 24px; }
	#siker { padding-block: 74px; }
	#siker .cf-grid { margin-top: 24px; }
	#szolgaltatasok { padding-block: 24px; }
	#szolgaltatasok h2 { font-size: clamp(25px, 2.4vw, 34px); margin-bottom: 6px; }
	#szolgaltatasok .cf-lead { font-size: 15.5px; margin-bottom: 10px; }
	#szolgaltatasok .cf-slider { margin-top: 16px; }
	#szolgaltatasok .cf-slider__tabs { margin-bottom: 16px; }
	#szolgaltatasok .cf-slider__tab { padding-block: 9px; font-size: 12px; }
	#szolgaltatasok .cf-slide { padding: 22px 26px 22px; }
	#szolgaltatasok .cf-slide h3 { font-size: 21px; margin: 9px 0 10px; }
	#szolgaltatasok .cf-slide p { font-size: 15px; line-height: 1.6; }
	#szolgaltatasok .cf-slide .cf-btn { margin-top: 16px; }
	#szolgaltatasok .cf-slider__nav { margin-top: 12px; }
}

/* ---------- §25.5 Carousel card index (1/5 … 5/5) ---------- */
.cf-slide { position: relative; }
.cf-slide__num {
	position: absolute;
	right: 18px;
	bottom: 14px;
	font-size: 12px;
	letter-spacing: 0.06em;
	font-variant-numeric: tabular-nums;
	color: var(--cf-muted);
	opacity: 0.5;
	pointer-events: none;
}
@media (max-width: 640px) {
	.cf-slide__num { right: 14px; bottom: 10px; font-size: 11px; }
}

/* ---------- §26 MarTech körkép: mobil gerinc (max 719px) ---------- */
.cf-ridge, .cf-ridge-tl { display: none; }

@media (max-width: 719px) {
	#honnan .cf-massif { display: none; }

	.cf-ridge {
		--cf-ridge-h: 130px;
		--cf-sky-h: 142px;
		display: block;
		position: relative;
		height: calc(var(--cf-sky-h) + var(--cf-ridge-h));
		margin-block: 18px 0;
	}
	#honnan .cf-ridge {
		margin-left: calc(50% - 50vw) !important;
		margin-right: calc(50% - 50vw) !important;
		max-width: none;
	}
	.cf-ridge > svg {
		position: absolute; left: 0; bottom: 0;
		width: 100%; height: var(--cf-ridge-h); display: block;
	}
	.cf-ridge__dot {
		position: absolute;
		left: var(--x);
		top: calc(var(--cf-sky-h) + var(--cf-ridge-h) * var(--y));
		width: 26px; height: 26px; margin: -13px 0 0 -13px;
		border-radius: 50%; background: none; border: 0; padding: 0; cursor: pointer;
	}
	.cf-ridge__dot::before {
		content: ""; position: absolute; inset: 8px; border-radius: 50%;
		background: #B5561F;
		transition: transform .3s, background .3s, box-shadow .3s;
	}
	.cf-ridge__dot.is-on::before {
		background: var(--cf-accent);
		transform: scale(1.35);
		box-shadow: 0 0 0 7px rgba(219, 138, 62, .22);
	}
	.cf-ridge__dot:focus-visible { outline: 2px solid var(--cf-accent); outline-offset: 2px; }
	.cf-ridge__yr {
		position: absolute;
		left: var(--x);
		top: calc(var(--cf-sky-h) + var(--cf-ridge-h) * var(--y) - 34px);
		transform: translateX(-50%);
		font-family: Montserrat, "Avenir Next", "Century Gothic", system-ui, sans-serif;
		font-weight: 800; font-size: 19px; color: #FFFFFF;
		opacity: .4; transition: opacity .3s; pointer-events: none; white-space: nowrap;
	}
	.cf-ridge__yr.is-on { opacity: 1; }
	.cf-ridge__sky {
		position: absolute; left: 14px; right: 14px; top: 0;
		height: var(--cf-sky-h);
		display: flex; flex-wrap: wrap; gap: 6px;
		align-content: flex-end;
		justify-content: var(--j, center);
		padding-bottom: 36px; pointer-events: none;
	}
	.cf-ridge__sky b {
		font-family: Montserrat, "Avenir Next", "Century Gothic", system-ui, sans-serif;
		font-weight: 700; font-size: 12px; line-height: 1;
		color: #F0E9DE;
		padding: 7px 11px; border-radius: 999px;
		border: 1px solid rgba(219, 138, 62, .7);
		background: rgba(14, 12, 9, .85);
		opacity: 0; transform: translateY(10px) scale(.9);
		transition: opacity .35s ease var(--d, 0ms), transform .35s cubic-bezier(.2, .9, .3, 1.3) var(--d, 0ms);
	}
	.cf-ridge__sky b.is-more { background: var(--cf-accent); border-color: var(--cf-accent); color: #0E0C09; }
	.cf-ridge__sky.is-on b { opacity: 1; transform: none; }

	.cf-ridge-tl { display: block; list-style: none; margin: 16px 0 0; padding: 0; position: relative; }
	.cf-ridge-tl::before {
		content: ""; position: absolute; left: 10px; top: 12px; bottom: 12px; width: 1px;
		background: linear-gradient(rgba(240, 233, 222, .12), #B5561F);
	}
	.cf-ridge-tl li { position: relative; padding: 0 0 24px 32px; cursor: pointer; }
	.cf-ridge-tl li:last-child { padding-bottom: 0; }
	.cf-ridge-tl li::before {
		content: ""; position: absolute; left: 4px; top: 7px; width: 13px; height: 13px;
		border-radius: 50%; background: #0E0C09; border: 2px solid #B5561F;
		transition: background .3s, border-color .3s;
	}
	.cf-ridge-tl li.is-on::before { background: var(--cf-accent); border-color: var(--cf-accent); }
	.cf-ridge-tl__y {
		font-family: Montserrat, "Avenir Next", "Century Gothic", system-ui, sans-serif;
		font-weight: 800; font-size: 18px; color: #FFFFFF;
		display: block; margin-bottom: 4px; transition: color .3s;
	}
	.cf-ridge-tl li.is-on .cf-ridge-tl__y { color: var(--cf-accent); }
	.cf-ridge-tl p { margin: 0; font-size: 15.5px; line-height: 1.55; color: var(--cf-sec); }
	#honnan .cf-massif__note { margin-top: 20px; }
}

@media (max-width: 400px) {
	.cf-ridge { --cf-sky-h: 132px; }
	.cf-ridge__sky { gap: 5px; padding-bottom: 34px; }
	.cf-ridge__sky b { font-size: 11.5px; padding: 6px 9px; }
	.cf-ridge__yr { font-size: 17px; }
}

@media (max-width: 349px) {
	.cf-ridge { --cf-sky-h: 162px; }
}

@media (prefers-reduced-motion: reduce) {
	.cf-ridge__dot::before,
	.cf-ridge__yr,
	.cf-ridge__sky b,
	.cf-ridge-tl li::before,
	.cf-ridge-tl__y { transition: none; }
}

/* ---------- §27 Mobil: a carousel fülei két sorban, görgetés nélkül ---------- */
@media (max-width: 640px) {
	#szolgaltatasok .cf-slider__tabs {
		flex-wrap: wrap;
		overflow-x: visible;
		column-gap: 8px;
		row-gap: 8px;
	}
	#szolgaltatasok .cf-slider__tab { padding-inline: 14px; }
}
@media (max-width: 380px) {
	#szolgaltatasok .cf-slider__tabs { column-gap: 5px; row-gap: 6px; }
	#szolgaltatasok .cf-slider__tab { padding-inline: 8px; font-size: 10.5px; letter-spacing: 0.04em; }
}

/* ---------- §28 „Vissza a tetejére" gomb a lábléc jobb alsó sarkában ---------- */
.cf-footer__bottom { flex-wrap: wrap; gap: 12px 18px; }
.cf-footer__end { display: inline-flex; align-items: center; gap: 16px; }
.cf-totop {
	display: inline-flex; align-items: center; justify-content: center;
	width: 38px; height: 38px; flex: none;
	border: 1px solid var(--cf-border); border-radius: 999px;
	color: var(--cf-sec); text-decoration: none;
	transition: border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}
.cf-totop svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cf-totop:hover, .cf-totop:focus-visible { color: var(--cf-accent); border-color: var(--cf-accent); transform: translateY(-2px); }
.cf-totop:focus-visible { outline: 2px solid var(--cf-accent); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
	.cf-totop { transition: none; }
	.cf-totop:hover, .cf-totop:focus-visible { transform: none; }
}

/* ---------- §29 Űrlap mobilon: 16px, hogy az iOS ne nagyítson rá ---------- */
/* 16px alatt a Safari fókuszkor belenagyít a mezőbe, és onnantól az oldal
   szélesebb a képernyőnél. Ez a legrosszabb, ami egy kapcsolati űrlappal
   történhet, ezért mobilon minden beviteli mező 16px. */
@media (max-width: 782px) {
	.cf-form :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], textarea, select) {
		font-size: 16px;
	}
	.cf-form .cf-btn, .cf-form input[type="submit"], .cf-form button[type="submit"] { width: 100%; justify-content: center; }
}
.cf-form :is(input, textarea, select) { max-width: 100%; box-sizing: border-box; }

/* A lábléc jobb alsó blokkja mobilon is a jobb szélre kerül. */
.cf-footer__end { margin-left: auto; }


/* ---------- §29 Lábléc összehúzva (2026-10-01): asztalon ~456 → ~320 px, mobilon a koppintási méret marad ---------- */
.cf-footer { padding: 40px 0 24px; }
.cf-footer__bottom { margin-top: 24px; padding-top: 14px; }
.cf-footer__col h4 { margin-bottom: 8px; }
@media (min-width: 860px) {
	.cf-footer__col a { padding: 4px 0; min-height: 30px; }
	.cf-footer__contact { margin: 12px 0 14px; gap: 6px; }
}

/* ---------- §30 Süti-ablak élesítve (2026-10-01): a 24.4-es „FEJLESZTÉS ALATT” jelzés ki, a plugin fekete szövegei márkaszínre ---------- */
.cookieadmin_preference_title::after { content: none; }
.cookieadmin_cookie_modal .cookieadmin_preference,
.cookieadmin_cookie_modal .cookieadmin_desc { color: var(--cf-sec) !important; }
.cookieadmin_cookie_modal .cookieadmin-cookie-card {
	background: var(--cf-bg) !important;
	border: 1px solid var(--cf-border) !important;
	border-radius: 12px;
}
.cookieadmin_cookie_modal .cookieadmin-cookie-name { color: var(--cf-text) !important; }
.cookieadmin_cookie_modal .cookieadmin-cookie-description { color: var(--cf-sec) !important; margin-bottom: 0; }

/* §30.1 A süti-sáv belső dobozát a plugin inline fehérre festi; a világos márkaszövegek ezen beleolvadtak. */
.cookieadmin_law_container .cookieadmin_consent_inside {
	background-color: var(--cf-raised) !important;
	border-color: var(--cf-border) !important;
}
.cookieadmin_law_container .cookieadmin_consent_inside > p:first-child { color: var(--cf-heading) !important; }
.cookieadmin_law_container .cookieadmin_notice_con p { color: var(--cf-sec) !important; }
.cookieadmin_cookie_modal .cookieadmin_show_pref_cookies { color: var(--cf-sec) !important; }

/* ---------- §31 Kulcs-érték tábla (.cf-kv, pl. az adatkezelő adatai) mobilon: egy doboz, a címkék a többi tábla címkéivel egy stílusban ---------- */
@media (max-width: 640px) {
	.cf-prose .wp-block-table.cf-kv table {
		border: 1px solid var(--cf-border);
		border-radius: 12px;
		padding: 8px 0;
	}
	.cf-prose .wp-block-table.cf-kv tr {
		border: 0;
		border-radius: 0;
		margin: 0;
		padding: 0;
	}
	.cf-prose .wp-block-table.cf-kv th {
		display: block;
		width: 100%;
		border: 0;
		padding: 10px 16px 0;
		text-align: left;
		font-family: Montserrat, system-ui, sans-serif;
		font-size: 10.5px;
		font-weight: 700;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--cf-muted);
	}
	.cf-prose .wp-block-table.cf-kv th strong { font-weight: inherit; }
	.cf-prose .wp-block-table.cf-kv td { padding: 3px 16px 8px; }
}

/* ---------- §32 #book horgony (Kapcsolat oldal, 2026-10-01): a hős blokk kikerült, a horgony a teljes kapcsolati blokkon ül; a ragadós fejléc ne takarja a címkét és a jobb doboz tetejét ---------- */
#book { scroll-margin-top: 104px; }
@media (max-width: 782px) { #book { scroll-margin-top: 84px; } }

/* ---------- §33 Jogi oldalak (page-simple sablon: Adatkezelési tájékoztató, Sütitájékoztató): visszafogottabb címméretek; a H1 szemantikailag H1 marad ---------- */
.page-template-page-simple .cf-pagehead h1.wp-block-post-title { font-size: clamp(28px, 3.2vw, 34px) !important; line-height: 1.15; }
.page-template-page-simple .wp-block-post-content h2 { font-size: clamp(21px, 2.2vw, 24px) !important; line-height: 1.25; margin-top: 2em; }
.page-template-page-simple .wp-block-post-content h3 { font-size: 18px !important; line-height: 1.3; }
