/* ==========================================================================
   KIRALYIMI.HU – VERIFIED CLEANUP BASE / v66
   Forrás: stabil v51.
   A navigáció és a teljes cascade sorrendje változatlan.
   A további refaktor csak ellenőrzött, izolált szakaszonként történhet.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Marck+Script&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Artifika&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,400;0,500;0,600;1,400;1,500&display=swap');


:root {
    color-scheme: light;
    --ki-page-bg: #FFFFFF;
    --ki-page-text: #211F1D;
    --ki-cloud-bg: #F3F0E8;
    --ki-header-fg: #211F1D;
    --ki-accent: #A72B2F;
}

html[data-theme="dark"] {
    color-scheme: dark;
    --ki-page-bg: #211F1D;
    --ki-page-text: #F5F2EA;
    --ki-cloud-bg: rgba(0, 0, 0, .50);
    --ki-header-fg: #F5F2EA;
    --ki-accent: #A72B2F;
}

html,
body {
    background-color: var(--ki-page-bg);
    color: var(--ki-page-text);
}

body,
.container-header .container-nav,
.kiralyimi-nav > ul > li > a,
.kiralyimi-toggle span,
.kiralyimi-theme-toggle,
.kiralyimi-logo .st0,
.kiralyimi-logo .st1 {
    transition:
        background-color 250ms ease,
        color 250ms ease,
        fill 250ms ease,
        stroke 250ms ease;
}


/* =========================================================
   KIRÁLY IMI – ALAP / JOOMLA CASSIOPEIA
   ========================================================= */

.container-header {
    position: static;
    min-height: 0;
    padding: 0;
    background: transparent;
    box-shadow: none;
}

.container-header .container-nav {
    position: fixed;
    top: 14px;
    left: 14px;
    z-index: 1000;

    width: 326px;
    height: 62px;
    min-height: 62px;
    margin: 0;
    padding: 0;
    max-width: none;

    background: var(--ki-cloud-bg);
    border-radius: 14px;

    transition:
        width 250ms ease,
        height 250ms ease;
}

.container-header .navbar-brand {
    display: none;
}


/* =========================================================
   LEBEGŐ FEJLÉC
   ========================================================= */

.kiralyimi-floating-header {
    position: relative;
    width: 326px;
    height: 62px;
    overflow: hidden;

    transition:
        width 250ms ease,
        height 250ms ease;
}


/* =========================================================
   LOGÓ
   ========================================================= */

.kiralyimi-logo-wrap {
    position: absolute;
    left: 16px;
    top: 31px;

    width: 205px !important;
    min-width: 205px;
    max-width: 205px;
    height: auto;

    transform: translateY(-50%);
    z-index: 2;
}

.kiralyimi-logo-wrap .kiralyimi-logo {
    display: block;
    width: 205px !important;
    max-width: none !important;
    height: auto !important;
    overflow: visible;
}


/* =========================================================
   MENÜ – ALAP
   ========================================================= */

.kiralyimi-nav {
    visibility: hidden;
}

.kiralyimi-nav > ul {
    margin: 0;
    padding: 0;
    list-style: none;
}


/* =========================================================
   JOBB OLDALI VEZÉRLŐK – NAP/HOLD + HAMBURGER / X
   ========================================================= */

.kiralyimi-controls {
    position: absolute;
    top: 29px;
    right: 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    height: 20px;
    transform: translateY(-50%);
    z-index: 10;
}

.kiralyimi-theme-toggle {
    position: relative;
    flex: 0 0 26px;
    width: 26px;
    height: 20px;
    padding: 0;
    margin: 0;
    display: block;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--ki-header-fg) !important;
    cursor: pointer;

    /* Csukva csak a nap–hold kerül 6 px-cel balrább. */
    transform: translateX(0px);
    transition: transform 250ms ease;
}


.kiralyimi-theme-icon {
    display: block !important;
    width: 26px !important;
    height: auto !important;
    margin: 0;
    overflow: visible !important;
}

.kiralyimi-theme-icon .theme-sun,
.kiralyimi-theme-icon .theme-moon {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 16;
    stroke-linejoin: round;
    opacity: 1;
}

.kiralyimi-toggle {
    position: relative;
    flex: 0 0 22px;
    width: 22px;
    height: 18px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    z-index: 3;
}

.kiralyimi-toggle span { position:absolute; left:0; width:22px; height:2px; background:#211F1D; border-radius:1px; transition:top 250ms ease, transform 250ms ease, opacity 180ms ease; }
.kiralyimi-toggle span:nth-child(1) { top:1px; }
.kiralyimi-toggle span:nth-child(2) { top:8px; }
.kiralyimi-toggle span:nth-child(3) { top:15px; }
.kiralyimi-floating-header.open .kiralyimi-toggle span:nth-child(1) { top:8px; transform:rotate(45deg); }
.kiralyimi-floating-header.open .kiralyimi-toggle span:nth-child(2) { opacity:0; }
.kiralyimi-floating-header.open .kiralyimi-toggle span:nth-child(3) { top:8px; transform:rotate(-45deg); }


/* =========================================================
   DESKTOP – NYITOTT ÁLLAPOT
   ========================================================= */

.kiralyimi-floating-header.open {
    width: var(--open-width, calc(100vw - 28px));
}

.container-header .container-nav:has(.kiralyimi-floating-header.open) {
    width: var(--open-width, calc(100vw - 28px));
}

.kiralyimi-floating-header.open .kiralyimi-nav {
    visibility: visible;

    position: absolute;
    left: 300px;
    right: 70px;
    top: 21px;

    transform: translateY(-50%);
    z-index: 1;
}

.kiralyimi-floating-header.open .kiralyimi-nav > ul {
    display: flex;
    flex-direction: row;
    align-items: center;

    gap: 26px;

    margin: 0;
    padding: 0;
    list-style: none;
}

.kiralyimi-floating-header.open .kiralyimi-nav > ul > li {
    margin: 0;
    padding: 0;
}

.kiralyimi-floating-header.open .kiralyimi-nav > ul > li > a {
    position: relative;
    display: block;

    margin: 0;
    padding: 0;
    border: 0;

    background: none;

    font-family: 'Artifika', serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: .05em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;

    color: var(--ki-header-fg);

    transition: opacity 180ms ease;
}


/* =========================================================
   JOOMLA / CASSIOPEIA LINKDEKORÁCIÓ KIKAPCSOLÁSA
   ========================================================= */

.kiralyimi-nav a,
.kiralyimi-nav a:hover,
.kiralyimi-nav a:focus,
.kiralyimi-nav a:active {
    text-decoration: none !important;
    border: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    background: none !important;
    background-image: none !important;
}


/* =========================================================
   DESKTOP – V6.10 HOVER
   ========================================================= */

.kiralyimi-floating-header:not(.compact)
.kiralyimi-nav > ul > li > a:hover {
    opacity: .55;
}

.kiralyimi-floating-header:not(.compact)
.kiralyimi-nav > ul > li > a::after {
    content: "";

    position: absolute;
    left: 0;

    /*
       A hover-vonal a fejléc bordó horizontális
       vonala fölött fusson.
    */
    bottom: -2px;

    width: 100%;
    height: 2px;

    background: var(--ki-accent) !important;

    transform: scaleX(0);
    transform-origin: left center;

    transition: transform 180ms ease;
}

.kiralyimi-floating-header:not(.compact)
.kiralyimi-nav > ul > li > a:hover::after {
    transform: scaleX(1);
}


/* =========================================================
   SVG VONALHOSSZABBÍTÁS
   ========================================================= */

.kiralyimi-line-extension {
    fill: var(--ki-accent);
}


/* =========================================================
   KOMPAKT / MOBIL
   ========================================================= */

.kiralyimi-floating-header.compact {
    width: 326px;
    height: 62px;
    overflow: hidden;
}

.container-header .container-nav:has(.kiralyimi-floating-header.compact) {
    width: 326px;
}


/* Kompakt módban nincs SVG-vonalhosszabbítás */

.kiralyimi-floating-header.compact .kiralyimi-line-extension {
    display: none;
}


/* A logó helyben marad */

.kiralyimi-floating-header.compact .kiralyimi-logo-wrap {
    top: 31px !important;
}


/* A jobb oldali vezérlőcsoport compact módban is ugyanott marad. */


/* =========================================================
   KOMPAKT MENÜ – ZÁRT / SLIDE KIINDULÓ ÁLLAPOT
   ========================================================= */

.kiralyimi-floating-header.compact .kiralyimi-nav {
    visibility: visible;

    position: absolute !important;

    /*
       A nav maga a teljes felhőszélességet használja.
       A 16 px margót belül adjuk hozzá.
    */
    left: 0 !important;
    right: 0 !important;
    top: 62px !important;

    margin: 0;
    padding: 10px 16px 18px;

    transform: translateY(-100%) !important;
    opacity: 0;

    pointer-events: none;

    transition:
        transform 250ms ease,
        opacity 150ms ease;
}


/* =========================================================
   KOMPAKT MENÜ – TIPOGRÁFIA
   ========================================================= */

.kiralyimi-floating-header.compact .kiralyimi-nav > ul {
    display: flex;
    flex-direction: column;
    align-items: stretch;

    width: 100%;

    gap: 15px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.kiralyimi-floating-header.compact .kiralyimi-nav > ul > li {
    position: relative;

    display: block;
    width: 100%;

    margin: 0;
    padding: 0;

    border: 0 !important;
    box-shadow: none !important;
    background: none !important;
}

.kiralyimi-floating-header.compact .kiralyimi-nav > ul > li > a {
    position: relative;

    display: block;
    width: 100%;

    margin: 0;
    padding: 0;

    border: 0 !important;
    box-shadow: none !important;
    background: none !important;

    font-family: 'Artifika', serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 0.5;
    letter-spacing: .05em;
    text-transform: uppercase;
    text-decoration: none !important;
    white-space: nowrap;

    color: var(--ki-header-fg);

    transition: opacity 180ms ease;
}


/* =========================================================
   KOMPAKT – V6.10 HOVER
   ========================================================= */

.kiralyimi-floating-header.compact
.kiralyimi-nav > ul > li > a:hover {
    opacity: .55;
}


/*
   Mobilon a hover-vonal nem csak a szó alatt fut:
   a felhő két 16 px-es belső margója között
   teljes szélességű.
*/

.kiralyimi-floating-header.compact
.kiralyimi-nav > ul > li > a::after {
    content: "";

    position: absolute;
    left: 0;
    bottom: -5px;

    width: 100%;
    height: 2px;

    background: var(--ki-accent) !important;

    border: 0 !important;
    box-shadow: none !important;

    transform: scaleX(0);
    transform-origin: left center;

    transition: transform 180ms ease;
}

.kiralyimi-floating-header.compact
.kiralyimi-nav > ul > li > a:hover::after {
    transform: scaleX(1);
}


/* =========================================================
   KOMPAKT – NYITOTT / SLIDE VÉGÁLLAPOT
   ========================================================= */

.kiralyimi-floating-header.compact.open {
    width: 326px;
    height: var(--compact-open-height, 110px);
}

.container-header .container-nav:has(.kiralyimi-floating-header.compact.open) {
    width: 326px;
    height: var(--compact-open-height, 110px);
}

.kiralyimi-floating-header.compact.open .kiralyimi-nav {
    transform: translateY(0) !important;
    opacity: 1;
    pointer-events: auto;
}
/* =========================================================
   KIRÁLY IMI – HOVER FINOMHANGOLÁS
   ========================================================= */

/* Alapállapot: 75% fedettség */
.kiralyimi-floating-header
.kiralyimi-nav > ul > li > a {
    opacity: .75 !important;
    transition: none !important;
}

/* Hover/fókusz: 100% */
.kiralyimi-floating-header
.kiralyimi-nav > ul > li > a:hover,
.kiralyimi-floating-header
.kiralyimi-nav > ul > li > a:focus {
    opacity: 1 !important;
}


/* DESKTOP – hover-vonal: 2 px-szel lejjebb, 1 px-szel vastagabb */
.kiralyimi-floating-header:not(.compact)
.kiralyimi-nav > ul > li > a::after {
    bottom: -6px !important;
    height: 3px !important;
    background: var(--ki-accent) !important;
}


/* MOBIL – bordó vonal lejjebb */
.kiralyimi-floating-header.compact
.kiralyimi-nav > ul > li > a::after {
    bottom: -5px !important;
    background: var(--ki-accent) !important;
}


/* Menüszöveg optikai igazítása: 1 px lejjebb */
/* 1 px optikai igazítás transform nélkül */
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a {
    position: relative;
    top: 1px;
}
/* Mobil menüsorok azonos pixelrácson */
.kiralyimi-floating-header.compact .kiralyimi-nav > ul {
    gap: 12.5px;
}

/* ===== KIRÁLY IMI – végleges menütipográfia ===== */

.kiralyimi-floating-header .kiralyimi-nav > ul > li > a {
    font-family: 'Artifika', serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: .05em;

    position: relative;
    top: 1px;

    opacity: .75 !important;
}

.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:hover,
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:focus {
    opacity: 1 !important;
}

/* Mobil: vissza az eredeti, szép ritmusra */
.kiralyimi-floating-header.compact .kiralyimi-nav > ul {
    gap: 15px;
}

/* =========================================================
   VILÁGOS / SÖTÉT TÉMA – TELJES OLDAL
   ========================================================= */

/* A logó sötét módban egyszínű elefántcsont; a kivágott macska átlátszó marad. */
html[data-theme="dark"] .kiralyimi-logo .st0,
html[data-theme="dark"] .kiralyimi-logo .st1 {
    fill: var(--ki-header-fg) !important;
}
html[data-theme="dark"] .kiralyimi-line-extension {
    fill: var(--ki-header-fg) !important;
}

/* Sötét módban a hamburger és az X is elefántcsont. */
html[data-theme="dark"] .kiralyimi-toggle span {
    background: var(--ki-header-fg) !important;
}

html[data-theme="light"] .kiralyimi-logo .st0 {
    fill: #211F1D !important;
}

html[data-theme="light"] .kiralyimi-logo .st1,
html[data-theme="light"] .kiralyimi-line-extension {
    fill: var(--ki-accent) !important;
}

/* Nap–hold: mindkét rajz látszik; az aktív mód hangsúlyosabb. */
.kiralyimi-theme-icon .theme-sun,
.kiralyimi-theme-icon .theme-moon {
    transition:
        opacity 180ms ease,
        stroke-width 180ms ease;
}

html[data-theme="light"] .kiralyimi-theme-icon .theme-sun {
    opacity: 1 !important;
    stroke-width: 18;
}

html[data-theme="light"] .kiralyimi-theme-icon .theme-moon {
    opacity: .42 !important;
    stroke-width: 13;
}

html[data-theme="dark"] .kiralyimi-theme-icon .theme-sun {
    opacity: .42 !important;
    stroke-width: 13;
}

html[data-theme="dark"] .kiralyimi-theme-icon .theme-moon {
    opacity: 1 !important;
    stroke-width: 18;
}

/* A Cassiopeia tipikus felületei is a közös oldal-témát követik. */
html[data-theme="dark"] body,
html[data-theme="dark"] .site-grid,
html[data-theme="dark"] main,
html[data-theme="dark"] .container-component,
html[data-theme="dark"] .card,
html[data-theme="dark"] .moduletable,
html[data-theme="dark"] .sidebar-left,
html[data-theme="dark"] .sidebar-right {
    background-color: var(--ki-page-bg);
    color: var(--ki-page-text);
}

html[data-theme="dark"] a:not(.ki-button):not(.kiralyimi-nav a):not(:hover):not(:focus-visible) {
    color: var(--ki-page-text);
}

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
    background-color: rgba(255, 255, 255, .06);
    color: var(--ki-page-text);
    border-color: rgba(245, 242, 234, .35);
}


/* =========================================================
   KIRÁLY IMI – GLOBÁLIS TIPOGRÁFIA ÉS GOMBOK
   A user.css végére illesztendő
   ========================================================= */


/* Globális méretek és arculati változók */
:root {
    --ki-font-heading: 'Artifika', serif;
    --ki-font-body: 'Source Sans 3', sans-serif;

    --ki-body-size: 19px;
    --ki-body-leading: 1.6;

    --ki-h1-size: 25px;
    --ki-h2-size: 21px;
    --ki-h3-size: var(--ki-h2-size);

    --ki-button-border: #A72B2F;
}

html[data-theme="dark"] {
    --ki-button-border: #F5F2EA;
}

/* Törzsszöveg */
body {
    font-family: var(--ki-font-body);
    font-size: var(--ki-body-size);
    line-height: var(--ki-body-leading);
}

/* Címek – a navigációt nem érinti */
h1, h2, h3,
.ki-heading {
    font-family: var(--ki-font-heading);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: .015em;
}

h1 { font-size: var(--ki-h1-size); }
h2 { font-size: var(--ki-h2-size); }
h3 { font-size: var(--ki-h3-size); }

/* Kényelmes szövegszélesség */
.ki-prose {
    max-width: 68ch;
}

/* Globális idézet és képaláírás */
blockquote,
.ki-quote {
    font-style: italic;
}

figcaption,
.ki-caption {
    font-size: .75em;
    line-height: 1.35;
}

/* Globális szöveges linkek */
a:not(.ki-button):not(.kiralyimi-nav a),
a:not(.ki-button):not(.kiralyimi-nav a):visited {
    color: inherit;
    font-weight: 700;
}

a:not(.ki-button):not(.kiralyimi-nav a):hover,
a:not(.ki-button):not(.kiralyimi-nav a):focus-visible {
    color: var(--ki-accent);
}

/* =========================================================
   GLOBÁLIS FELHŐGOMB – EGYSÉGES, VÉGLEGES SZABÁLYOK
   ========================================================= */

.ki-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 34px;
    padding: 6px 10px;
    border: 1px solid var(--ki-button-border);
    border-radius: 14px;
    background: var(--ki-cloud-bg);
    color: var(--ki-header-fg) !important;
    font-family: var(--ki-font-heading);
    font-size: 13px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: .05em;
    text-transform: uppercase;
    text-decoration: none !important;
    opacity: 1 !important;
    cursor: pointer;
    box-shadow: none !important;
    white-space: nowrap;
    -webkit-tap-highlight-color: transparent;
}

.ki-button:hover,
.ki-button:focus,
.ki-button:active {
    color: var(--ki-header-fg) !important;
    text-decoration: none !important;
    background-image: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

/* A Joomla/Cassiopeia hivatkozás-dekorációja nem kerül a gombra. */
.ki-button::after {
    content: none !important;
}

/* Csak a szöveg változtatja a fedettségét. */
.ki-button > span:first-child {
    opacity: .75;
}
.ki-button:hover > span:first-child,
.ki-button:focus-visible > span:first-child {
    opacity: 1;
}

/* A Joomla az üres span-t törli, ezért a HTML-ben   marad.
   A tényleges nyilat a ::before SVG-maszk rajzolja. */
.ki-button__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 14px;
    width: 14px;
    height: 14px;
    font-size: 0;
    line-height: 0;
    opacity: 1 !important;
    transform: translate(0, 0);
    transition: transform 180ms ease;
}
.ki-button__arrow::before {
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    background-color: #A72B2F !important;
    opacity: 1 !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 21L19 5M7 5h12v12' fill='none' stroke='black' stroke-width='3.3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 21L19 5M7 5h12v12' fill='none' stroke='black' stroke-width='3.3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ki-button:hover .ki-button__arrow,
.ki-button:focus-visible .ki-button__arrow {
    transform: translate(3px, -3px);
}
.ki-button:focus-visible {
    outline: 2px solid var(--ki-accent);
    outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
    .ki-button__arrow { transition: none; }
}

/* =========================================================
   KIRÁLY IMI – SLIDER
   Kizárólag a bannerben lévő .ki-slider-module / .ki-slider elemekre hat.
   ========================================================= */

.container-banner,
.container-banner > .ki-slider-module,
.container-banner .ki-slider-module > .mod-custom {
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: none;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.ki-slider {
    position: relative;
    isolation: isolate;
    width: 100%;


    overflow: hidden;
    background: #211F1D;
}

.ki-slider .ki-slide {
    position: absolute;
    inset: 0;
    z-index: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    background-image: var(--ki-slide-image);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    transition: opacity 1.8s ease, visibility 0s linear 1.8s;
}

.ki-slider .ki-slide.is-active {
    z-index: 1;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity 1.8s ease, visibility 0s linear 0s;
}

/* ---------- közös felhő ---------- */

.ki-slider .ki-slide-cloud {
    position: absolute;
    z-index: 3;
    box-sizing: border-box;
    width: min(560px, calc(100% - 64px));
    padding: 26px;
    padding-bottom: clamp(72px, 6vw, 82px);
    border-radius: 22px;
    overflow: visible;

    /* UGYANAZ a világos/sötét rendszer, mint a navigációé. */
    background: var(--ki-cloud-bg);
    color: var(--ki-header-fg);

    box-shadow: 0 10px 34px rgba(0,0,0,.14);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);

    font-family: var(--ki-font-body, 'Source Sans 3', sans-serif);
    font-size: .8em;
}

.ki-slider .ki-slide-cloud h2 {
    margin: 0;
    font-size: var(--ki-h1-size);
    text-transform: uppercase;
    color: var(--ki-header-fg);
}

.ki-slider .ki-slide-cloud p {
    margin: 0;
    color: var(--ki-header-fg);
}

/* ---------- CTA: a nagy felhőn BELÜL, jobb alul ---------- */

.ki-slider .ki-slide-cloud > .ki-button {
    position: absolute;
    z-index: 5;
    right: clamp(20px, 2vw, 30px);
    bottom: clamp(18px, 1.8vw, 26px);
    left: auto;
    top: auto;
    margin: 0;
    transform: none;
    white-space: nowrap;
}

.ki-slider .ki-slide-cloud > .ki-button:hover,
.ki-slider .ki-slide-cloud > .ki-button:focus-visible {
    transform: none;
}

/* ---------- 1. dia – Rólam ---------- */

.ki-slider .ki-slide--about .ki-slide-cloud {
    left: clamp(28px, 7vw, 120px);
    top: clamp(118px, 17vh, 190px);
    width: min(590px, calc(100% - 64px));
    display: grid;
    grid-template-columns: fit-content(100%);
    justify-content: start;
}

.ki-slider .ki-slide--about .ki-slide-quote-text,
.ki-slider .ki-slide--about .ki-slide-author {
    width: 100%;
    grid-column: 1;
}

.ki-slider .ki-slide--about .ki-slide-author {
    margin-left: 0;
}

/*
   A „ karakter tipográfiailag alul ül a saját sorában.
   Ezért a karakter doboza a sarokhoz van rögzítve, a glifet pedig
   negatív felső eltolással húzzuk vizuálisan a BAL FELSŐ sarokba.
*/

/* ---------- Rólam – SVG idézőjel, közös desktop + mobil szabály ---------- */

.ki-slider .ki-slide--about .ki-slide-cloud::before {
    content: "";
    position: absolute;
    z-index: 2;
    left: -15px;
    top: -20px;
    width: clamp(77px, 6vw, 102px);
    aspect-ratio: 1 / 1;
    background: url('/images/slider/idezo-99.svg') left top / contain no-repeat;
    opacity: 1;
    pointer-events: none;
}

.ki-slider .ki-slide-quote-text,
.ki-slider .ki-slide-author {
    position: relative;
    z-index: 1;
}

.ki-slider .ki-slide-quote-text {
    font-style: italic;
    width: fit-content;
    max-width: 100%;
}

.ki-slider .ki-slide-cloud .ki-slide-author {
    width: fit-content;
    max-width: 100%;
    margin-top: 12px;
    margin-left: auto;
    font-size: .75em;
    line-height: 1.35;
    text-align: right;
}

/* ---------- 2. dia – Grafikai tervezés ---------- */

.ki-slider .ki-slide--graphic .ki-slide-cloud {
    left: clamp(28px, 7vw, 120px);
    top: clamp(125px, 18vh, 205px);
}

.ki-slider .ki-slide--graphic .ki-slide-cloud p {
    max-width: 36ch;
}


/* ---------- főcím: a globális .ki-title-line rendszerből ---------- */

/* ---------- 3. dia – TréfaSzarvas ---------- */



/* ---------- kalligrafikus iniciálék a főcímeken ---------- */

.ki-slider .ki-initial {
    position: relative;
    top: calc(.13em + 1px);
    display: inline-block;
    margin-right: -.055em;
    color: inherit;
    text-transform: none;
    vertical-align: baseline;
}

.ki-slider .ki-slide-craft-title {
    margin: 0;
    width: 100%;
    white-space: normal;
    text-align: left;
    color: var(--ki-header-fg);
}

.ki-slider .ki-slide-craft-text {
    letter-spacing: .045em;
    text-transform: uppercase;
}

/* ---------- lapozópöttyök ---------- */

.ki-slider .ki-slider-dots {
    position: absolute;
    z-index: 10;
    left: 50%;
    bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    min-height: 16px;
    transform: translateX(-50%);
}

.ki-slider .ki-slider-dots button {
    display: block;
    width: 10px;
    height: 10px;
    min-width: 10px;
    min-height: 10px;
    margin: 0;
    padding: 0;
    border: 1px solid #F5F2EA;
    border-radius: 50%;
    background: rgba(0,0,0,.18);
    box-shadow: 0 1px 5px rgba(0,0,0,.35);
    cursor: pointer;
}

.ki-slider .ki-slider-dots button.is-active {
    background: #F5F2EA;
}

/* ---------- köztes képarány ---------- */



/* ---------- mobil ---------- */

@media (max-width: 680px) {

    .ki-slider .ki-slide {
        background-size: cover;
        background-position: center center;
    }

    .ki-slider .ki-slide-cloud {
        padding: 24px 22px 78px;
        border-radius: 18px;
    }

    .ki-slider .ki-slide--about .ki-slide-cloud {
}

    .ki-slider .ki-slide-cloud > .ki-button {
        right: 18px;
        bottom: 18px;
    }

    .ki-slider .ki-slider-dots {
        bottom: 17px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ki-slider .ki-slide {
        transition: none;
    }
}
/* ========================================================================
   KIRALYIMI.HU – TISZTA GLOBÁLIS TIPOGRÁFIA V2
   ======================================================================== */

/* Globális teljes blokkbehúzás – visszafogottabb. */
p {
    margin-left: 2.5em;
}

/* A slider normál bekezdései ugyanazt a globális 2.5em-et kapják. */
.ki-slider .ki-slide-cloud p {
    margin-left: 2.5em;
}

/* Rólam: az idézőjel miatt csak az idézet kap nagyobb helyet. */
/* Idézőjel a szöveg mögött. */
.ki-slider .ki-slide--about .ki-slide-cloud::before {
    z-index: 0;
}
.ki-slider .ki-slide--about .ki-slide-quote-text,
.ki-slider .ki-slide--about .ki-slide-author {
    position: relative;
    z-index: 1;
}

/* Szerző: nem örökli a bekezdésbehúzást; jobbra igazodik. */
.ki-slider .ki-slide--about .ki-slide-author {
    margin-left: auto;
}

/* H1–H4 közös szerkezet. */
h1.ki-title-line,
h2.ki-title-line,
h3.ki-title-line {
    position: relative;
    display: flex;
    width: 100%;
    align-items: baseline;
    margin-left: 0;
    margin-right: 0;
    padding: 0;
    border: 0;
    background: none;
    font-family: var(--ki-font-heading);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: .015em;
    color: inherit;
}
h1.ki-title-line { font-size: var(--ki-h1-size); }
h2.ki-title-line { font-size: var(--ki-h2-size); }
h3.ki-title-line { font-size: var(--ki-h3-size); }

.ki-title-line > .ki-initial {
    position: relative;
    top: calc(.13em + 1px);
    display: inline-block;
    flex: 0 0 auto;
    margin-right: -.055em;
    font-family: 'Marck Script', cursive;
    font-size: 1.85em;
    font-weight: 400;
    line-height: .62;
    color: inherit;
    text-transform: none;
    vertical-align: baseline;
}
.ki-title-line > .ki-title-rest {
    position: relative;
    display: block;
    flex: 1 1 auto;
    min-width: 0;
}

/* H1/H2: a második betűtől a rendelkezésre álló jobb széléig.
   Nincs több em+px halmozás: stabil, közvetlen 8px távolság a címsor alatt. */
h1.ki-title-line > .ki-title-rest::after,
h2.ki-title-line > .ki-title-rest::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -7px;
    height: 3px;
    border-radius: 999px;
    background: var(--ki-accent);
}

h3.ki-title-line > .ki-title-rest::after {
    content: none;
}

/* Slider H2: a felhő teljes belső szélességét használja,
   így a vonal a jobb 26px-es tükörmargóig ér. */
.ki-slider .ki-slide-cloud h2.ki-title-line {
    width: 100%;
    font-size: var(--ki-h2-size);
    color: var(--ki-header-fg);
}

/* Joomla oldalcím / Home:
   a H1 blokk kitölti a saját modulját, ezért a vonal a modul jobb széléig fut. */
main h1.ki-title-line,
.container-component h1.ki-title-line,
.com-content-article h1.ki-title-line,
.page-header h1.ki-title-line {
    width: 100%;
}

/* Nincs külön Rólam CTA-geometria. */

/* TARTALMI TIPOGRÁFIA – a navigációra nem vonatkozik */
main h1.ki-title-line,
main h2.ki-title-line,
main h3.ki-title-line,
.ki-slider h1.ki-title-line,
.ki-slider h2.ki-title-line,
.ki-slider h3.ki-title-line {
    margin-bottom: .5em;
}
main h1.ki-title-line + p,
main h2.ki-title-line + p,
main h3.ki-title-line + p + p,
.ki-slider h1.ki-title-line + p,
.ki-slider h2.ki-title-line + p,
.ki-slider h3.ki-title-line + p + p {
    margin-top: 0;
}
.ki-slider .ki-slide-cloud > h2.ki-title-line + p {
    position: static;
    left: auto;
    right: auto;
    top: auto;
    transform: none;
}

/* NAVIGÁCIÓ – 1 px optikai emelés */
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a {
    top: -1px;
}

/* Navigációs felhő – finom sötét outer glow csak világos módban */
html[data-theme="light"] .container-header .container-nav {
    box-shadow:
        0 2px 10px rgba(33, 31, 29, .18),
        0 0 18px rgba(33, 31, 29, .10);
}

/* ========================================================================
   V13 – NAV GEOMETRIA VISSZAÁLLÍTVA; CSAK BIZTONSÁGOS KORREKCIÓK
   ======================================================================== */

/* Sötét navigációs felhő: háttérhomályosítás. */
html[data-theme="dark"] .container-header .container-nav {
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

/* Globális bekezdésbehúzás – kisebb, a vörös vonalhoz optikailag közelebb. */
:root {
    --ki-paragraph-indent: 1.75em;
}
p {
    margin-left: var(--ki-paragraph-indent);
}
.ki-slider .ki-slide-cloud p {
    margin-left: var(--ki-paragraph-indent);
}
.ki-title-line + p {
    margin-left: var(--ki-title-rest-offset, var(--ki-paragraph-indent));
}

/* Rólam-felhő: tartalomfüggő, de biztos kereten belüli tükörmargó. */
.ki-slider .ki-slide--about .ki-slide-cloud {
    box-sizing: border-box;
    width: fit-content;
    max-width: calc(100% - 64px);
    min-width: 0;
    padding-left: 26px;
    padding-right: 26px;
}

/* Az idézet saját behúzása kisebb a globálisnál. */
.ki-slider .ki-slide--about .ki-slide-quote-text {
    box-sizing: border-box;
    width: fit-content;
    max-width: min(52ch, 100%);
    margin-left: .85em;
    margin-right: 0;
    position: relative;
    top: 10px;
}
.ki-slider .ki-slide--about .ki-slide-author {
    position: relative;
    top: 10px;
}

/* Alacsony fekvő képernyőn a slider nem lehet alacsonyabb a tartalomnál. */
@media (orientation: landscape) and (max-height: 650px) {
}

@media (max-width: 680px) {
    .ki-slider .ki-slide--about .ki-slide-cloud {
        max-width: calc(100% - 40px);
        padding-left: 22px;
        padding-right: 22px;
    }
    .ki-slider .ki-slide--about .ki-slide-quote-text {
        margin-left: .65em;
        max-width: calc(100vw - 84px);
    }
}


/* Desktop menü: sortörés nem megengedett; ha nem fér el, a JS compact módra vált. */
.kiralyimi-floating-header:not(.compact).open .kiralyimi-nav > ul {
    flex-wrap: nowrap;
}
.kiralyimi-floating-header:not(.compact).open .kiralyimi-nav > ul > li,
.kiralyimi-floating-header:not(.compact).open .kiralyimi-nav > ul > li > a {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* ========================================================================
   ELFOGADOTT IDÉZŐJEL-MÉRET
   ======================================================================== */

/* 4. Idézőjel: kisebb, a jelenlegi bal felső sarok változatlan fix pont. */
.ki-slider .ki-slide--about .ki-slide-cloud::before {
    left: -15px;
    top: -20px;
    width: 62px;
    height: auto;
    aspect-ratio: 1 / 1;
}





.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:hover::after {
    transform: scaleX(1) !important;
    opacity: 1 !important;
}


/* VÉGLEGES NAV-RÉTEGZÉS:
   csak a piros hosszabbító kerül a menüpontok mögé. */
.kiralyimi-floating-header .kiralyimi-nav {
    z-index: 2 !important;
}
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a,
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a::after {
    position: relative;
    z-index: 3 !important;
}

/* Az aktív Joomla-állapot SEMMILYEN saját vonalat nem kap.
   Csak a tényleges hover nyitja ki a ::after vonalat. */
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a::after {
    transform: scaleX(0) !important;
    opacity: 0 !important;
}
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:hover::after {
    transform: scaleX(1) !important;
    opacity: 1 !important;
}

/* MOBIL / COMPACT – ugyanaz a hover-vonal pontosan 1 px-szel lejjebb. */
.kiralyimi-floating-header.compact .kiralyimi-nav > ul > li > a::after {
    bottom: -8px !important;
}


/* ========================================================================
   NAV – VÉGLEGES VONALKEZELÉS
   A valódi hosszabbító osztály: .kiralyimi-line-extension.
   ======================================================================== */

.kiralyimi-floating-header .kiralyimi-line-extension {
    position: relative;
    z-index: 0 !important;
}

.kiralyimi-floating-header .kiralyimi-nav {
    z-index: 2 !important;
}

.kiralyimi-floating-header .kiralyimi-nav > ul > li > a {
    position: relative;
    z-index: 3 !important;
}

/* A 4 px-es hover-vonal a maszkoló csík fölött jelenik meg. */
.kiralyimi-floating-header
.kiralyimi-nav > ul > li > a::after {
    z-index: 4 !important;
}

/* Nincs active/current saját jelölés: kizárólag hover mutat vonalat. */
.kiralyimi-floating-header
.kiralyimi-nav > ul > li > a::after {
    transform: scaleX(0) !important;
    opacity: 0 !important;
}

.kiralyimi-floating-header
.kiralyimi-nav > ul > li > a:hover::after {
    transform: scaleX(1) !important;
    opacity: 1 !important;
}


/* HOVER-VONAL – végleges vastagság és témaszín */
.kiralyimi-floating-header:not(.compact)
.kiralyimi-nav > ul > li > a::after {
    bottom: -6px !important;
    height: 3px !important;
}

.kiralyimi-floating-header.compact
.kiralyimi-nav > ul > li > a::after {
    bottom: -7px !important;
    height: 3px !important;
}

html[data-theme="light"]
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a::after {
    background: var(--ki-accent) !important;
}

html[data-theme="dark"]
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a::after {
    background: var(--ki-header-fg) !important;
}


/* ========================================================================
   NAV VONALAK – v28 végleges geometria
   Desktop: 3 px.
   Mobil: eredeti 2 px; az előző 3 px tetejéből 1 px elvéve.
   A szerkezeti hosszabbító nincs maszkolva, ezért újra folytonos.
   ======================================================================== */

.kiralyimi-floating-header:not(.compact)
.kiralyimi-nav > ul > li > a::before {
    content: none !important;
    display: none !important;
}

.kiralyimi-floating-header:not(.compact)
.kiralyimi-nav > ul > li > a::after {
    bottom: -6px !important;
    height: 3px !important;
}

.kiralyimi-floating-header.compact
.kiralyimi-nav > ul > li > a::after {
    bottom: -7px !important;
    height: 2px !important;
}

html[data-theme="light"]
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a::after {
    background: var(--ki-accent) !important;
}

html[data-theme="dark"]
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a::after {
    background: var(--ki-header-fg) !important;
}


/* ========================================================================
   v30 – JOOMLA AKTÍV MENÜDEKORÁCIÓ TELJES KIKAPCSOLÁSA
   A saját hover ::after szabályhoz nem nyúl.
   ======================================================================== */

.kiralyimi-nav > ul > li.current,
.kiralyimi-nav > ul > li.active,
.kiralyimi-nav > ul > li.alias-parent-active,
.kiralyimi-nav > ul > li.current > a,
.kiralyimi-nav > ul > li.active > a,
.kiralyimi-nav > ul > li.alias-parent-active > a,
.kiralyimi-nav > ul > li > a[aria-current="page"],
.kiralyimi-nav > ul > li > a[aria-current="true"] {
    text-decoration: none !important;
    text-decoration-line: none !important;
    border: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    background-image: none !important;
}

/* Ha a Cassiopeia/Joomla az LI pseudoelemén jelöli az aktív pontot,
   azt is megszüntetjük. A link ::after szándékosan NINCS ebben a listában. */
.kiralyimi-nav > ul > li.current::before,
.kiralyimi-nav > ul > li.current::after,
.kiralyimi-nav > ul > li.active::before,
.kiralyimi-nav > ul > li.active::after,
.kiralyimi-nav > ul > li.alias-parent-active::before,
.kiralyimi-nav > ul > li.alias-parent-active::after {
    content: none !important;
    display: none !important;
    border: 0 !important;
    box-shadow: none !important;
    background: none !important;
}


/* ========================================================================
   v32 – MOBIL HOVER SZÍN
   Compact nézetben a hover-vonal mindkét témában arculati vörös.
   ======================================================================== */
html[data-theme="dark"]
.kiralyimi-floating-header.compact
.kiralyimi-nav > ul > li > a::after {
    background: var(--ki-accent) !important;
}

/* v34 – mentett desktop nyitott állapot visszaállítása animáció nélkül */
html.ki-nav-restoring .container-header .container-nav,
html.ki-nav-restoring .kiralyimi-floating-header,
html.ki-nav-restoring .kiralyimi-floating-header .kiralyimi-nav {
    transition: none !important;
}


/* ==========================================================================
   v35 – KI–01 TARTALMI KIEMELÉS
   A globális H2/P/.ki-button rendszert örökli; itt csak kompozíció van.
   ========================================================================== */

.ki-feature {
    --ki-feature-focus: 50% 50%;
    --ki-feature-gap: clamp(34px, 6vw, 92px);
    --ki-feature-media-h: clamp(390px, 47vw, 640px);

    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.28fr) minmax(280px, .72fr);
    gap: var(--ki-feature-gap);
    align-items: center;
    width: min(calc(100% - 40px), 1320px);
    margin-inline: auto;
    padding-block: clamp(68px, 9vw, 126px);
    isolation: isolate;
}

.ki-feature__media {
    position: relative;
    min-width: 0;
    height: var(--ki-feature-media-h);
    overflow: visible;
}

.ki-feature__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: var(--ki-feature-focus);
}

/* A grafikai gesztus a sablon része, nem kell a képre rárajzolni. */
.ki-feature__media::after {
    content: "";
    position: absolute;
    right: -30px;
    bottom: 9%;
    width: 43%;
    height: 2px;
    background: var(--ki-accent, #A72B2F);
    transform: rotate(-5deg);
    transform-origin: right center;
    pointer-events: none;
    z-index: 2;
}

.ki-feature__content {
    position: relative;
    z-index: 3;
    min-width: 0;
}

.ki-feature__content > :last-child {
    margin-bottom: 0;
}

/* Ugyanaz a blokk fordított irányban. */
.ki-feature--image-right {
    grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
}

.ki-feature--image-right .ki-feature__media {
    grid-column: 2;
    grid-row: 1;
}

.ki-feature--image-right .ki-feature__content {
    grid-column: 1;
    grid-row: 1;
}

.ki-feature--image-right .ki-feature__media::after {
    right: auto;
    left: -30px;
    transform: rotate(5deg);
    transform-origin: left center;
}

/* Opcionális fókuszpontok – csak problémás képnél kell választani. */
.ki-focus-left   { --ki-feature-focus: 25% 50%; }
.ki-focus-right  { --ki-feature-focus: 75% 50%; }
.ki-focus-top    { --ki-feature-focus: 50% 25%; }
.ki-focus-bottom { --ki-feature-focus: 50% 75%; }

@media (max-width: 760px) {
    .ki-feature,
    .ki-feature--image-right {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 30px;
        width: min(calc(100% - 28px), 680px);
        padding-block: 56px;
    }

    .ki-feature__media,
    .ki-feature--image-right .ki-feature__media {
        order: 1;
        width: 100%;
        height: clamp(310px, 92vw, 520px);
    }

    .ki-feature__content,
    .ki-feature--image-right .ki-feature__content {
        order: 2;
    }

    .ki-feature__media::after,
    .ki-feature--image-right .ki-feature__media::after {
        right: 8%;
        left: auto;
        bottom: -12px;
        width: 48%;
        transform: rotate(-4deg);
        transform-origin: right center;
    }
}


/* ==========================================================================
   v36 – NAV: KETTŐS HOVER-VONAL JAVÍTÁSA
   Cassiopeia/link hover dekoráció kikapcsolása.
   A saját a::after hover-vonal érintetlen marad.
   ========================================================================== */
.kiralyimi-floating-header
.kiralyimi-nav > ul > li > a:hover,
.kiralyimi-floating-header
.kiralyimi-nav > ul > li > a:focus,
.kiralyimi-floating-header
.kiralyimi-nav > ul > li > a:focus-visible {
    text-decoration: none !important;
    text-decoration-line: none !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    background-image: none !important;
}


/* ==========================================================================
   v37 – GLOBÁLIS FŐCÍMEK
   H1 + H2 verzál; H3 változatlan.
   A Marck Script iniciálé saját text-transform:none szabálya megmarad.
   ========================================================================== */
h1,
h2 {
    text-transform: uppercase;
}

h1 .ki-initial,
h2 .ki-initial {
    text-transform: none;
}


/* ==========================================================================
   v38 – H3 = H2 ALÁHÚZÁS NÉLKÜL
   H1–H3 globálisan verzál; a H3 meglévő aláhúzás nélküli geometriája változatlan.
   ========================================================================== */
h3 {
    text-transform: uppercase;
}

h3 .ki-initial {
    text-transform: none;
}

/* ==========================================================================
   v39 – KI–01 FELHŐS, RITMIKUS TARTALMI KIEMELÉSEK
   Egy elem: keskeny vízszintes sáv.
   Több elem: automatikus, reszponzív rács.
   Páros elemek tónusa automatikusan váltakozik mindkét témában.
   ========================================================================== */

:root {
    --ki-feature-cloud-a: #F3F0E8;
    --ki-feature-cloud-b: #EAE6DC;
}

html[data-theme="dark"] {
    --ki-feature-cloud-a: rgba(255, 255, 255, .055);
    --ki-feature-cloud-b: rgba(255, 255, 255, .095);
}

.ki-feature-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 470px), 1fr));
    gap: clamp(18px, 2.4vw, 30px);
    width: min(calc(100% - 40px), 1320px);
    margin-inline: auto;
    padding-block: clamp(34px, 5vw, 68px);
}

.ki-feature {
    --ki-feature-focus: 50% 50%;
    --ki-feature-cloud: var(--ki-feature-cloud-a);

    position: relative;
    display: grid;
    grid-template-columns: minmax(150px, 38%) minmax(0, 1fr);
    gap: clamp(20px, 3vw, 42px);
    align-items: center;
    width: 100%;
    min-height: 250px;
    margin: 0;
    padding: clamp(18px, 2.4vw, 30px);
    border-radius: 22px;
    background: var(--ki-feature-cloud);
    overflow: hidden;
    isolation: isolate;
    transition: background-color 250ms ease;
}

.ki-feature-grid > .ki-feature:nth-child(even) {
    --ki-feature-cloud: var(--ki-feature-cloud-b);
}

/* Ha a blokk rácson kívül, önmagában áll, maradjon keskeny sáv. */
.ki-feature:not(.ki-feature-grid > .ki-feature) {
    width: min(calc(100% - 40px), 1180px);
    margin-inline: auto;
    margin-block: clamp(24px, 4vw, 52px);
}

.ki-feature__media {
    position: relative;
    min-width: 0;
    width: 100%;
    height: clamp(190px, 20vw, 270px);
    overflow: hidden;
    border-radius: 15px;
}

.ki-feature__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: var(--ki-feature-focus);
}

/* A piros gesztus most a kép és a tartalom közti kapcsolatot jelöli. */
.ki-feature__media::after {
    content: "";
    position: absolute;
    right: -26px;
    bottom: 24px;
    width: 62px;
    height: 2px;
    background: var(--ki-accent);
    transform: rotate(-4deg);
    transform-origin: right center;
    pointer-events: none;
    z-index: 2;
}

.ki-feature__content {
    position: relative;
    z-index: 3;
    min-width: 0;
    padding-block: 4px;
}

.ki-feature__content > :last-child {
    margin-bottom: 0;
}

/* Fordított változat ugyanabban a rendszerben. */
.ki-feature--image-right {
    grid-template-columns: minmax(0, 1fr) minmax(150px, 38%);
}

.ki-feature--image-right .ki-feature__media {
    grid-column: 2;
    grid-row: 1;
}

.ki-feature--image-right .ki-feature__content {
    grid-column: 1;
    grid-row: 1;
}

.ki-feature--image-right .ki-feature__media::after {
    right: auto;
    left: -26px;
    transform: rotate(4deg);
    transform-origin: left center;
}

@media (max-width: 620px) {
    .ki-feature-grid {
        grid-template-columns: 1fr;
        gap: 16px;
        width: min(calc(100% - 28px), 680px);
        padding-block: 32px;
    }

    .ki-feature,
    .ki-feature--image-right,
    .ki-feature:not(.ki-feature-grid > .ki-feature) {
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;
        width: min(calc(100% - 28px), 680px);
        min-height: 0;
        margin-inline: auto;
        padding: 16px 16px 22px;
        border-radius: 18px;
    }

    .ki-feature-grid > .ki-feature,
    .ki-feature-grid > .ki-feature--image-right {
        width: 100%;
    }

    .ki-feature__media,
    .ki-feature--image-right .ki-feature__media {
        grid-column: 1;
        grid-row: 1;
        width: 100%;
        height: clamp(190px, 58vw, 300px);
        border-radius: 12px;
    }

    .ki-feature__content,
    .ki-feature--image-right .ki-feature__content {
        grid-column: 1;
        grid-row: 2;
    }

    .ki-feature__media::after,
    .ki-feature--image-right .ki-feature__media::after {
        right: 18px;
        left: auto;
        bottom: -1px;
        width: 54px;
        transform: rotate(-4deg);
        transform-origin: right center;
    }
}


/* ==========================================================================
   v40 – SLIDER DESKTOP MAGASSÁG + TOP EDGE
   Desktop: legfeljebb 600px, de a teljes szöveges tartalom mindig elfér.
   Mobilnézetet ez a blokk nem módosítja.
   ========================================================================== */
@media (min-width: 761px) {
    /* A slider közvetlenül a viewport felső élén induljon. */
    .ki-slider {
        margin-top: 0 !important;
        top: 0 !important;

        /* A korábbi 90vh helyett tartalomvezérelt, 600px-es plafon. */


}

    /*
       A szöveges felhő nem csonkolható. Ha a tényleges tartalom több helyet
       kérne, a slide/slider nőhessen a szükséges minimumra.
    */
    .ki-slider .ki-slide {
        min-height: min-content;
    }

    .ki-slider .ki-slide-cloud {
        max-height: none !important;
        overflow: visible !important;
    }

    /* Cassiopeia főtartalom felső hézagának lenullázása a slider oldalán. */
    .site-grid,
    .container-component,
    main {
        margin-top: 0;
    }

    .site-grid > :first-child,
    .container-component > :first-child,
    main > :first-child {
        margin-top: 0 !important;
    }
}


/* ==========================================================================
   v41 – SLIDER DESKTOP: VALÓDI BANNER-EDGE + 600 PX + BILLOG KÖZÉP
   Mobilnézethez nem nyúl.
   ========================================================================== */
@media (min-width: 761px) {
    /* A slider Joomla banner-környezete ne adjon felső hézagot. */
    body,
    .site-grid,
    .container-banner,
    .container-banner > .ki-slider-module,
    .container-banner .ki-slider-module > .mod-custom {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .container-banner {
        position: relative;
        top: 0 !important;
        align-self: start;
        row-gap: 0 !important;
        column-gap: 0 !important;
    }

    .ki-slider {


        margin: 0 !important;
    }

    .ki-slider .ki-slide-cloud {
        max-height: none !important;
        overflow: visible !important;
    }
}

/* ==========================================================================
   v41 – KI–01: EDITORIAL / ECSETMASZKOS TARTALMI KIEMELÉSEK
   Egy normál feltöltött képből készül; nincs kézi képelőkészítés.
   ========================================================================== */

/* A/B tónuspár – finom ritmus mindkét globális témában. */
html[data-theme="light"] {
    --ki-feature-bg-a: rgba(33, 31, 29, .045);
    --ki-feature-bg-b: rgba(167, 43, 47, .055);
}
html[data-theme="dark"] {
    --ki-feature-bg-a: rgba(245, 242, 234, .070);
    --ki-feature-bg-b: rgba(167, 43, 47, .105);
}

.ki-feature-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 470px), 1fr));
    gap: clamp(18px, 2.2vw, 30px);
    width: min(calc(100% - 40px), 1320px);
    margin-inline: auto;
    padding-block: clamp(28px, 4vw, 54px);
}

/* Felülírja a korábbi nagy KI–01 kártyageometriát. */
.ki-feature-grid .ki-feature {
    --ki-feature-focus: 50% 50%;
    --ki-feature-bg: var(--ki-feature-bg-a);

    position: relative;
    display: grid;
    grid-template-columns: minmax(150px, .82fr) minmax(220px, 1.18fr);
    gap: clamp(18px, 2.4vw, 34px);
    align-items: center;

    width: 100%;
    min-height: 250px;
    margin: 0;
    padding: clamp(22px, 2.6vw, 34px);
    border: 0 !important;
    border-radius: 22px;
    box-shadow: none !important;
    background: var(--ki-feature-bg);
    overflow: hidden;
    isolation: isolate;
}

.ki-feature-grid .ki-feature:nth-child(even) {
    --ki-feature-bg: var(--ki-feature-bg-b);
}

/* Az egymás melletti elemeknél finom editorial váltás automatikusan. */
.ki-feature-grid .ki-feature:nth-child(even) .ki-feature__media {
    order: 2;
}
.ki-feature-grid .ki-feature:nth-child(even) .ki-feature__content {
    order: 1;
}

/* Nem téglalap: a normál JPG/WEBP CSS maszkon keresztül jelenik meg. */
.ki-feature-grid .ki-feature__media {
    position: relative;
    width: 112%;
    height: clamp(180px, 19vw, 255px);
    min-width: 0;
    margin-left: -8%;
    overflow: visible;
}

.ki-feature-grid .ki-feature:nth-child(even) .ki-feature__media {
    margin-left: 0;
    margin-right: -8%;
}

.ki-feature-grid .ki-feature__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: var(--ki-feature-focus);

    /*
       Többrétegű, szabálytalan festett/ecsetelt perem.
       Nincs külön maszkfájl és nincs Photoshop-előkészítés.
    */
    -webkit-mask-image:
        radial-gradient(ellipse 18% 15% at 8% 16%, #000 72%, transparent 78%),
        radial-gradient(ellipse 24% 20% at 25% 10%, #000 74%, transparent 80%),
        radial-gradient(ellipse 28% 24% at 48% 12%, #000 76%, transparent 82%),
        radial-gradient(ellipse 30% 24% at 72% 14%, #000 75%, transparent 82%),
        radial-gradient(ellipse 20% 18% at 92% 18%, #000 72%, transparent 80%),
        radial-gradient(ellipse 24% 24% at 8% 48%, #000 74%, transparent 81%),
        radial-gradient(ellipse 34% 34% at 32% 50%, #000 78%, transparent 84%),
        radial-gradient(ellipse 38% 38% at 62% 50%, #000 80%, transparent 86%),
        radial-gradient(ellipse 28% 30% at 90% 50%, #000 75%, transparent 82%),
        radial-gradient(ellipse 22% 18% at 10% 84%, #000 72%, transparent 80%),
        radial-gradient(ellipse 30% 22% at 34% 90%, #000 75%, transparent 82%),
        radial-gradient(ellipse 28% 22% at 62% 88%, #000 75%, transparent 82%),
        radial-gradient(ellipse 22% 18% at 90% 82%, #000 72%, transparent 80%);
    -webkit-mask-composite: source-over;
    mask-image:
        radial-gradient(ellipse 18% 15% at 8% 16%, #000 72%, transparent 78%),
        radial-gradient(ellipse 24% 20% at 25% 10%, #000 74%, transparent 80%),
        radial-gradient(ellipse 28% 24% at 48% 12%, #000 76%, transparent 82%),
        radial-gradient(ellipse 30% 24% at 72% 14%, #000 75%, transparent 82%),
        radial-gradient(ellipse 20% 18% at 92% 18%, #000 72%, transparent 80%),
        radial-gradient(ellipse 24% 24% at 8% 48%, #000 74%, transparent 81%),
        radial-gradient(ellipse 34% 34% at 32% 50%, #000 78%, transparent 84%),
        radial-gradient(ellipse 38% 38% at 62% 50%, #000 80%, transparent 86%),
        radial-gradient(ellipse 28% 30% at 90% 50%, #000 75%, transparent 82%),
        radial-gradient(ellipse 22% 18% at 10% 84%, #000 72%, transparent 80%),
        radial-gradient(ellipse 30% 22% at 34% 90%, #000 75%, transparent 82%),
        radial-gradient(ellipse 28% 22% at 62% 88%, #000 75%, transparent 82%),
        radial-gradient(ellipse 22% 18% at 90% 82%, #000 72%, transparent 80%);
    mask-composite: add;
}

/* A korábbi diagonális vonalat megszüntetjük: itt már maga a kép a gesztus. */
.ki-feature-grid .ki-feature__media::after {
    content: none !important;
}

.ki-feature-grid .ki-feature__content {
    position: relative;
    z-index: 2;
    min-width: 0;
    padding-block: 4px;
}

.ki-feature-grid .ki-feature__content h2,
.ki-feature-grid .ki-feature__content h3 {
    margin-top: 0;
}

.ki-feature-grid .ki-feature__content > :last-child {
    margin-bottom: 0;
}

/* Mobil KI–01: csak a komponens tördelése változik; a SLIDER mobilja érintetlen. */
@media (max-width: 760px) {
    .ki-feature-grid {
        grid-template-columns: 1fr;
        width: min(calc(100% - 28px), 680px);
        gap: 18px;
        padding-block: 28px;
    }

    .ki-feature-grid .ki-feature,
    .ki-feature-grid .ki-feature:nth-child(even) {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 18px;
        min-height: 0;
        padding: 20px;
    }

    .ki-feature-grid .ki-feature__media,
    .ki-feature-grid .ki-feature:nth-child(even) .ki-feature__media {
        order: 1;
        width: 108%;
        height: clamp(190px, 55vw, 300px);
        margin: -4% -4% 0;
    }

    .ki-feature-grid .ki-feature__content,
    .ki-feature-grid .ki-feature:nth-child(even) .ki-feature__content {
        order: 2;
    }
}


/* ==========================================================================
   v42 – SLIDER TOP EDGE: a banner grid-helyének megszüntetése desktopon
   ========================================================================== */
@media (min-width: 761px) {
    /*
       A Cassiopeia banner ne egy, a fejléc után kezdődő normál grid-sorban
       foglaljon helyet: a slider a lap felső élére kerül, a floating nav fölötte marad.
    */
    .container-banner {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    body:has(.container-banner .ki-slider) .site-grid {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
}

/* ==========================================================================
   v42 – KI–01 KÜLSŐ JOOMLA MODULBURKOLAT: SEMMILYEN PLUSZ DOBOZ
   ========================================================================== */
.moduletable:has(.ki-feature-grid),
.mod-custom:has(.ki-feature-grid),
.card:has(.ki-feature-grid),
.container-component:has(.ki-feature-grid) {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
}

.moduletable:has(.ki-feature-grid),
.mod-custom:has(.ki-feature-grid),
.card:has(.ki-feature-grid) {
    margin: 0 !important;
    padding: 0 !important;
}

/* ==========================================================================
   v42 – KI–01 FIX BELSŐ TÜKÖRMARGÓ / GOMB JOBB-ALUL
   ========================================================================== */
.ki-feature-grid .ki-feature {
    min-height: 270px;
}

.ki-feature-grid .ki-feature__content {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 0;
}

.ki-feature-grid .ki-feature__content h2,
.ki-feature-grid .ki-feature__content h3 {
    margin-top: 0 !important;
}

.ki-feature-grid .ki-feature__content p {
    margin-bottom: 18px;
}

.ki-feature-grid .ki-feature__content > .ki-button {
    position: static;
    align-self: flex-end;
    margin-top: auto !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
}

/* ==========================================================================
   v42 – FELHŐSZÍNEK
   A = globális világos/sötét oldalalap
   B = ugyanaz, kevés feketével sötétítve
   ========================================================================== */
html[data-theme="light"] {
    --ki-feature-bg-a: var(--ki-page-bg);
    --ki-feature-bg-b: color-mix(in srgb, var(--ki-page-bg) 94%, #000 6%);
}
html[data-theme="dark"] {
    --ki-feature-bg-a: var(--ki-page-bg);
    --ki-feature-bg-b: color-mix(in srgb, var(--ki-page-bg) 90%, #000 10%);
}

/* ==========================================================================
   v42 – LIGHT GOMB
   vörös kitöltés + vörös kontúr / fehér szöveg / fekete nyíl
   Dark mód változatlan.
   ========================================================================== */
html[data-theme="light"] .ki-button {
    background: var(--ki-accent, #A72B2F) !important;
    border-color: var(--ki-accent, #A72B2F) !important;
    color: #fff !important;
}

html[data-theme="light"] .ki-button .ki-button__label {
    color: #fff !important;
}

/* A meglévő mask-es nyíl színét feketévé tesszük. */
html[data-theme="light"] .ki-button .ki-button__arrow,
html[data-theme="light"] .ki-button .ki-button__arrow::before,
html[data-theme="light"] .ki-button .ki-button__arrow::after {
    background-color: #000 !important;
}

/* Mobil KI–01-nél a fix desktop tükörmargó-logika ne kényszerítsen magasságot. */
@media (max-width: 760px) {
    .ki-feature-grid .ki-feature {
        min-height: 0;
    }

    .ki-feature-grid .ki-feature__content > .ki-button {
        margin-top: 8px !important;
    }
}


/* ==========================================================================
   v43 – LIGHT GOMB KONTÚR KORREKCIÓ
   vörös kitöltés / fehér kontúr / fehér felirat / fekete nyíl
   ========================================================================== */
html[data-theme="light"] .ki-button {
    background: var(--ki-accent, #A72B2F) !important;
    border-color: #fff !important;
    color: #fff !important;
}


/* ==========================================================================
   v44 – LIGHT GOMB VISSZAFINOMÍTÁS
   Eredeti karakter: vörös kontúr + finom áttetsző fekete kitöltés + vörös nyíl.
   A v42/v43 nyílszín-felülírásokat itt célzottan visszavonjuk.
   ========================================================================== */
html[data-theme="light"] .ki-button {
    background: rgba(0, 0, 0, .035) !important;
    border-color: var(--ki-accent, #A72B2F) !important;
    color: var(--ki-header-fg) !important;
}

html[data-theme="light"] .ki-button .ki-button__label {
    color: inherit !important;
}

/* A nyíl eredeti mask-geometriája marad; csak a mask színe lesz újra vörös. */
html[data-theme="light"] .ki-button .ki-button__arrow {
    background-color: var(--ki-accent, #A72B2F) !important;
}

html[data-theme="light"] .ki-button .ki-button__arrow::before,
html[data-theme="light"] .ki-button .ki-button__arrow::after {
    background-color: transparent !important;
}

/* ==========================================================================
   v44 – KI–01 MODULHÁTTÉR
   A blokkok A/B színei változatlanok; csak a környező modul kap nagyon
   enyhe sötétítést, hogy az A/B felhők elkülönüljenek.
   ========================================================================== */
html[data-theme="light"] .moduletable:has(.ki-feature-grid),
html[data-theme="light"] .mod-custom:has(.ki-feature-grid),
html[data-theme="light"] .card:has(.ki-feature-grid) {
    background: rgba(0, 0, 0, .025) !important;
}

html[data-theme="dark"] .moduletable:has(.ki-feature-grid),
html[data-theme="dark"] .mod-custom:has(.ki-feature-grid),
html[data-theme="dark"] .card:has(.ki-feature-grid) {
    background: rgba(0, 0, 0, .10) !important;
}


/* ==========================================================================
   v46 – KI–01: KÜLSŐ BURKOLÓK LECSUPASZÍTÁSA
   A modul háttere vissza az oldal saját alapszínére; nincs külön színes sáv.
   ========================================================================== */
html[data-theme="light"] .moduletable:has(.ki-feature-grid),
html[data-theme="light"] .mod-custom:has(.ki-feature-grid),
html[data-theme="light"] .card:has(.ki-feature-grid),
html[data-theme="dark"] .moduletable:has(.ki-feature-grid),
html[data-theme="dark"] .mod-custom:has(.ki-feature-grid),
html[data-theme="dark"] .card:has(.ki-feature-grid) {
    background: var(--ki-page-bg) !important;
    border: 0 !important;
    box-shadow: none !important;
}

main:has(.ki-feature-grid),
.container-component:has(.ki-feature-grid),
.container-component:has(.ki-feature-grid) > *,
.moduletable:has(.ki-feature-grid),
.mod-custom:has(.ki-feature-grid),
.card:has(.ki-feature-grid) {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.ki-feature-grid {
    gap: clamp(12px, 1.4vw, 20px) !important;
    padding-block: clamp(16px, 2vw, 28px) !important;
}

/* ==========================================================================
   v46 – KI–01 FELHŐSZÍNEK: KÉT KONKRÉT, ROKON LÉPCSŐ
   Nem blend mode, nem barna overlay, nem color-mix.
   Világos oldal: alapszín -> A -> B, finoman barnásabb/sötétebb.
   ========================================================================== */
html[data-theme="light"] {
    --ki-feature-bg-a: #E9E4DA;
    --ki-feature-bg-b: #DDD5C8;
}

/* Dark módban ugyanaz az elv: két közeli, melegebb/sötétebb rokon felület. */
html[data-theme="dark"] {
    --ki-feature-bg-a: #282522;
    --ki-feature-bg-b: #302B27;
}

.ki-feature-grid .ki-feature {
    padding: clamp(18px, 2vw, 26px) !important;
}


/* ==========================================================================
   v47 – DARK KI–01: ALAPSZÍN + KÉT FEKETE LÉPCSŐ
   Konkrét színek, barnás eltérítés nélkül.
   Dark alap: #211F1D -> A -> B
   ========================================================================== */
html[data-theme="dark"] {
    --ki-feature-bg-a: #1D1B19;
    --ki-feature-bg-b: #191816;
}

/* ==========================================================================
   v47 – GLOBÁLIS INICIÁLÉ TÁVOLSÁG
   H1–H3: az iniciálé kicsivel távolabb kerül a második betűtől.
   Minden más iniciálé-geometria változatlan.
   ========================================================================== */
.ki-title-line > .ki-initial {
    margin-right: -.025em;
}


/* ==========================================================================
   v48 – LIGHT GOMB NYÍL: MASZK HELYREÁLLÍTÁSA
   A 14x14-es szülő nem kaphat kitöltést: attól lett négyzet.
   A vörös szín kizárólag a maszkolt ::before elemen van.
   ========================================================================== */
html[data-theme="light"] .ki-button .ki-button__arrow {
    background: transparent !important;
    background-color: transparent !important;
}

html[data-theme="light"] .ki-button .ki-button__arrow::before {
    background: var(--ki-accent, #A72B2F) !important;
    background-color: var(--ki-accent, #A72B2F) !important;
}

html[data-theme="light"] .ki-button .ki-button__arrow::after {
    background: transparent !important;
    background-color: transparent !important;
}

/* v48 – végleges globális iniciálé-köz */
.ki-title-line > .ki-initial {
    margin-right: 0;
}


/* ==========================================================================
   v49 – SLIDER TOP EDGE: STATIKUS SZERKEZET, NINCS JS-MÉRÉS
   A látható navigáció position:fixed; a Joomla .container-header ezért
   csak technikai burkoló. Kivesszük a normál dokumentumáramból, hogy ne
   képezhessen állapotfüggő felső sort/helyet a banner előtt.
   ========================================================================== */
.container-header {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

/* A banner helyzete mostantól kizárólag statikus CSS-geometria. */
@media (min-width: 761px) {
    body:has(.container-banner .ki-slider),
    body:has(.container-banner .ki-slider) .site-grid,
    body:has(.container-banner .ki-slider) .container-banner {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    body:has(.container-banner .ki-slider) .container-banner {
        transform: none !important;
        top: 0 !important;
    }
}


/* ==========================================================================
   v51 – DARK KI–01: HELYESEN EGY LÉPCSŐVEL SÖTÉTEBB
   új A = régi B (#191816)
   új B = további egy fekete lépcső (#151412)
   ========================================================================== */
html[data-theme="dark"] {
    --ki-feature-bg-a: #191816;
    --ki-feature-bg-b: #151412;
}


/* ==========================================================================
   v67 – NAV / SEEK AND DESTROY
   A navigációban KIZÁRÓLAG az a::after rajzolhat vonalat.
   Minden más link- és lista-pseudoelem/dekoráció végleg kikapcsolva.
   ========================================================================== */

/* A listaelemek semmilyen saját vonalat/dekorációt nem rajzolhatnak. */
.kiralyimi-floating-header .kiralyimi-nav > ul > li,
.kiralyimi-floating-header .kiralyimi-nav > ul > li:hover,
.kiralyimi-floating-header .kiralyimi-nav > ul > li:focus-within,
.kiralyimi-floating-header .kiralyimi-nav > ul > li.current,
.kiralyimi-floating-header .kiralyimi-nav > ul > li.active,
.kiralyimi-floating-header .kiralyimi-nav > ul > li.alias-parent-active {
    border: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    background: none !important;
    background-image: none !important;
    text-decoration: none !important;
}

/* LI pseudoelemek: teljes tiltás minden állapotban. */
.kiralyimi-floating-header .kiralyimi-nav > ul > li::before,
.kiralyimi-floating-header .kiralyimi-nav > ul > li::after,
.kiralyimi-floating-header .kiralyimi-nav > ul > li:hover::before,
.kiralyimi-floating-header .kiralyimi-nav > ul > li:hover::after,
.kiralyimi-floating-header .kiralyimi-nav > ul > li:focus-within::before,
.kiralyimi-floating-header .kiralyimi-nav > ul > li:focus-within::after {
    content: none !important;
    display: none !important;
    border: 0 !important;
    box-shadow: none !important;
    background: none !important;
    background-image: none !important;
}

/* Link: csak tipográfia + saját a::after maradhat. */
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a,
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:hover,
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:focus,
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:focus-visible,
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:active {
    border: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    background: none !important;
    background-image: none !important;
    text-decoration: none !important;
    text-decoration-line: none !important;
    outline-color: transparent !important;
}

/* Link ::before: teljes tiltás desktopon ÉS compact nézetben. */
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a::before,
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:hover::before,
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:focus::before,
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:focus-visible::before,
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:active::before {
    content: none !important;
    display: none !important;
    border: 0 !important;
    box-shadow: none !important;
    background: none !important;
    background-image: none !important;
}

/* Az EGYETLEN engedélyezett vonal: a saját link ::after. */
.kiralyimi-floating-header .kiralyimi-nav > ul > li > a::after {
    content: "" !important;
    display: block !important;
    transform: scaleX(0) !important;
    opacity: 0 !important;
}

.kiralyimi-floating-header .kiralyimi-nav > ul > li > a:hover::after {
    transform: scaleX(1) !important;
    opacity: 1 !important;
}

/* ==========================================================================
   CRAFT SLIDE – KANONIKUS GEOMETRIA
   A méreteket és az állapotot a user.js számolja a tényleges képarányból.
   A CSS csak megjelenít; nincs külön desktop/tablet/mobil craft-geometria.
   ========================================================================== */
.ki-slider .ki-slide--craft .ki-slide-cloud {
    left: var(--craft-cloud-left);
    top: var(--craft-cloud-top);
    width: var(--craft-cloud-width);
    min-width: 0;
    max-width: none;
    transform: none;
}

.ki-slider .ki-slide--craft .ki-slide-stamp {
    position: absolute;
    z-index: 4;
    left: var(--craft-stamp-left);
    right: auto;
    top: var(--craft-stamp-top);
    bottom: auto;
    width: var(--craft-stamp-width);
    height: var(--craft-stamp-height);
    max-width: none;
    max-height: none;
    transform: none;
    object-fit: contain;
    filter: drop-shadow(0 5px 14px rgba(0,0,0,.17));
}

.ki-slider .ki-slide--craft .ki-slide-craft-title {
    white-space: normal;
}


/* v72 – CRAFT clean engine sizing calibration.
   Geometria továbbra is kizárólag a CLEAN CRAFT ENGINE tulajdona;
   itt nincs új felülíró craft-szabály. */


/* v73 – CLEAN CRAFT ENGINE calibration:
   nav-gap 4px, bottom-gap 8px, minimum stamp = max(300px, 70% max).
   Nincs új geometriai felülírás. */

/* v74 – CLEAN CRAFT ENGINE: priority algorithm corrected; no geometry patch. */





/* ==========================================================================
   v77 – KANONIKUS SLIDER ALAP
   Egyetlen 600 px-es vászon minden szélességen.
   Nincs vh/svh és nincs breakpoint-függő slidermagasság.
   ========================================================================== */
.ki-slider {
    height: 600px !important;
    min-height: 600px !important;
    max-height: 600px !important;
}

/* A normál szöveges felhők nem kapnak mobilon mesterséges 100%-os szélességet.
   A tartalom természetes mérete az elsődleges, a képernyő csak felső korlát. */
.ki-slider .ki-slide--about .ki-slide-cloud {
    left: clamp(20px, 7vw, 120px);
    top: clamp(112px, 17vw, 190px);
    width: fit-content;
    min-width: 0;
    max-width: calc(100% - 40px);
}

.ki-slider .ki-slide--graphic .ki-slide-cloud {
    left: clamp(20px, 7vw, 120px);
    top: clamp(112px, 18vw, 205px);
    width: fit-content;
    min-width: 0;
    max-width: min(650px, calc(100% - 40px));
}

/* Craft: a JS az egyetlen geometriai tulajdonos. */
.ki-slider .ki-slide--craft .ki-slide-cloud {
    box-sizing: border-box;
    overflow: visible;
}

/* v91: enforce the single fixed canvas, including actual slide children. */
.ki-slider, .ki-slider .ki-slide {
    height:600px !important;
    min-height:600px !important;
    max-height:600px !important;
}
.ki-slider .ki-slide--craft .ki-slide-cloud,
.ki-slider .ki-slide--craft .ki-slide-stamp {transition:none !important;}
@media(max-width:680px){
    .ki-slider .ki-slide--craft .ki-slide-cloud {
        left:var(--craft-cloud-left) !important;
        width:var(--craft-cloud-width) !important;
        max-width:none !important;
    }
}

/* v95: shared mobile cloud alignment, independent of the craft engine. */
@media (max-width:680px) {
  .ki-slider .ki-slide--about .ki-slide-cloud,
  .ki-slider .ki-slide--graphic .ki-slide-cloud {
    left:14px !important;
    right:14px !important;
    width:calc(100% - 28px) !important;
    max-width:none !important;
  }
}

/* v97: canonical natural-width cloud layout, no full-width mobile override. */
.ki-slider .ki-slide-cloud { width: max-content; max-width: calc(100% - 28px); }
.ki-slider .ki-slide--craft .ki-slide-cloud { width: var(--craft-cloud-width); max-width: calc(100% - 28px); }
.ki-slider .ki-cloud-measure { position:absolute!important; left:-10000px!important; top:0!important; right:auto!important; bottom:auto!important; transform:none!important; visibility:hidden!important; pointer-events:none!important; height:auto!important; min-width:0!important; transition:none!important; }
@media(max-width:680px) {
 .ki-slider .ki-slide--about .ki-slide-cloud,
 .ki-slider .ki-slide--graphic .ki-slide-cloud {
  left:50%!important; right:auto!important; width:max-content!important;
  max-width:calc(100% - 28px)!important; transform:translateX(-50%)!important;
 }
 .ki-slider .ki-slide--craft .ki-slide-cloud {
  left:var(--craft-cloud-left)!important; right:auto!important;
  width:var(--craft-cloud-width)!important; max-width:calc(100% - 28px)!important;
 }
}