:root {
    --kmx-ink: #06151a;
    --kmx-paper: #eee9df;
    --kmx-accent: #d5b37b;
    --kmx-menu-red: #d7192d;
    --kmx-ease: cubic-bezier(.77, 0, .18, 1);
    --kmx-duration: 720ms;
}

html { scroll-behavior: auto !important; }
body.kmx-active { margin: 0; overflow-x: clip; background: var(--kmx-ink); }
body.kmx-active.kmx-menu-open,
body.kmx-active.kmx-slide-lock { overscroll-behavior: none; }
body.kmx-menu-open { overflow: hidden; }
body.kmx-active #wpadminbar { z-index: 1000000; }
body.kmx-active .page-header,
body.kmx-active .elementor-location-header { display: none !important; }
body.kmx-active .site-main,
body.kmx-active .page-content { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; }
body.kmx-active .elementor-element-3afafcc { display: none !important; }

.kmx-top-anchor { position: absolute; inset: 0 auto auto 0; width: 1px; height: 1px; }
.kmx-screen-reader-text { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }

/* Jedan isti hamburger na desktopu, tabletu i mobitelu: gore desno, bijel, bez okvira. */
.kmx-menu-trigger {
    position: fixed;
    top: clamp(14px, 3.2vh, 32px);
    left: auto;
    right: clamp(12px, 2.4vw, 36px);
    z-index: 100020;
    width: clamp(44px, 4.5vw, 58px);
    height: clamp(44px, 4.5vw, 58px);
    display: grid;
    place-items: center;
    padding: 0;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
    color: #ffffff;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform .28s var(--kmx-ease), color .28s ease;
}
body.admin-bar .kmx-menu-trigger { top: calc(32px + clamp(18px, 3.8vh, 38px)); }
.kmx-menu-trigger:hover { transform: scale(1.06); }
.kmx-menu-trigger:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
.kmx-menu-trigger__bars { position: relative; width: clamp(26px, 2.4vw, 31px); height: 20px; display: block; }
.kmx-menu-trigger__bars i {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background: currentColor;
    transform-origin: center;
    transition: top .38s var(--kmx-ease), transform .38s var(--kmx-ease), opacity .18s ease, width .25s ease;
}
.kmx-menu-trigger__bars i:nth-child(1) { top: 0; }
.kmx-menu-trigger__bars i:nth-child(2) { top: 9px; width: 76%; }
.kmx-menu-trigger__bars i:nth-child(3) { top: 18px; }
.kmx-menu-trigger:hover .kmx-menu-trigger__bars i:nth-child(2) { width: 100%; }
.kmx-menu-open .kmx-menu-trigger__bars i:nth-child(1) { top: 9px; transform: rotate(45deg); }
.kmx-menu-open .kmx-menu-trigger__bars i:nth-child(2) { opacity: 0; transform: scaleX(0); }
.kmx-menu-open .kmx-menu-trigger__bars i:nth-child(3) { top: 9px; transform: rotate(-45deg); }


/* Diskretan povratak na 00 / početnu: fiksno dolje desno, izvan sadržajnog toka. */
.kmx-home-trigger {
    position: fixed;
    top: auto;
    right: max(14px, env(safe-area-inset-right));
    bottom: max(16px, env(safe-area-inset-bottom));
    z-index: 100019;
    width: clamp(38px, 3.4vw, 44px);
    height: clamp(38px, 3.4vw, 44px);
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.34);
    border-radius: 999px;
    background: rgba(6,21,26,.78);
    color: #fff;
    text-decoration: none;
    font: 400 clamp(18px, 1.8vw, 24px)/1 Arial,sans-serif;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate3d(0,6px,0);
    transition: opacity .2s ease, transform .25s var(--kmx-ease), border-color .2s ease, visibility 0s linear .25s;
    -webkit-tap-highlight-color: transparent;
}
body.kmx-active:not([data-kmx-slide="top"]):not(.kmx-menu-open) .kmx-home-trigger {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate3d(0,0,0);
    transition-delay: 0s;
}
.kmx-home-trigger:hover { border-color: #fff; transform: translate3d(0,-2px,0); }
.kmx-home-trigger:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }

/* Fullscreen menu. */
.kmx-menu {
    position: fixed;
    inset: 0;
    z-index: 100010;
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
    background: #06151a;
    transition: visibility 0s linear .65s, opacity .34s ease;
}
body.admin-bar .kmx-menu { top: 32px; }
.kmx-menu.is-open { visibility: visible; pointer-events: auto; opacity: 1; transition-delay: 0s; }
.kmx-menu__wash {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 82% 18%, rgba(215,25,45,.20), transparent 33%),
        radial-gradient(circle at 18% 76%, rgba(213,179,123,.13), transparent 38%),
        linear-gradient(115deg, #071a20 0%, #0b2b34 52%, #051216 100%);
    clip-path: inset(0 0 0 100%);
    transition: clip-path .68s var(--kmx-ease);
}
.kmx-menu.is-open .kmx-menu__wash { clip-path: inset(0); }
.kmx-menu__wash::after {
    content:"";
    position:absolute;
    inset:0;
    opacity:.15;
    background-image: repeating-linear-gradient(90deg, transparent 0, transparent calc(20% - 1px), rgba(255,255,255,.12) 20%);
}
.kmx-menu__inner {
    position: relative;
    z-index: 1;
    width: min(1320px, 100%);
    min-height: 100%;
    margin: auto;
    padding: clamp(88px, 13vh, 150px) clamp(32px, 10vw, 160px) clamp(26px, 5vh, 60px);
    display: flex;
    align-items: center;
}
.kmx-menu__primary { width: 100%; margin: 0; padding: 0; list-style: none; }
.kmx-menu__primary li { overflow: hidden; border-bottom: 1px solid rgba(255,255,255,.15); }
.kmx-menu__primary li:first-child { border-top: 1px solid rgba(255,255,255,.15); }
.kmx-menu__primary a {
    min-height: clamp(62px, 10vh, 110px);
    display: grid;
    grid-template-columns: clamp(34px,5vw,62px) minmax(0,1fr) clamp(24px,4vw,48px);
    align-items: center;
    gap: clamp(10px,2vw,22px);
    color: #f7f2e8;
    text-decoration: none;
    transform: translateY(115%);
    transition: color .28s ease, transform .58s var(--kmx-ease), background .28s ease, padding .28s ease;
}
.kmx-menu.is-open .kmx-menu__primary li:nth-child(1) a { transition-delay: .08s; transform: translateY(0); }
.kmx-menu.is-open .kmx-menu__primary li:nth-child(2) a { transition-delay: .12s; transform: translateY(0); }
.kmx-menu.is-open .kmx-menu__primary li:nth-child(3) a { transition-delay: .16s; transform: translateY(0); }
.kmx-menu.is-open .kmx-menu__primary li:nth-child(4) a { transition-delay: .20s; transform: translateY(0); }
.kmx-menu.is-open .kmx-menu__primary li:nth-child(5) a { transition-delay: .24s; transform: translateY(0); }
.kmx-menu__primary a:hover,
.kmx-menu__primary a:focus-visible,
.kmx-menu__primary a.is-active { color: var(--kmx-menu-red); padding-left: clamp(8px,1.3vw,18px); background: rgba(255,255,255,.025); }
.kmx-menu__primary a:focus-visible { outline: 1px solid currentColor; outline-offset: -1px; }
.kmx-menu__number { font: 600 clamp(8px,.75vw,10px)/1 Arial,sans-serif; letter-spacing: .18em; opacity: .58; }
.kmx-menu__title { font: 300 clamp(28px, min(5.1vw, 8.2vh), 74px)/.95 Arial,sans-serif; letter-spacing: -.045em; }
.kmx-menu__arrow { font: 300 clamp(18px,2.4vw,32px)/1 Arial,sans-serif; text-align: right; transition: transform .28s var(--kmx-ease); }
.kmx-menu__primary a:hover .kmx-menu__arrow,
.kmx-menu__primary a.is-active .kmx-menu__arrow { transform: translate(5px,5px); }

/* Vidljiva animacija između slajdova. */
.kmx-slide-transition { position:fixed; inset:0; z-index:99980; pointer-events:none; overflow:hidden; visibility:hidden; }
.kmx-slide-transition__veil,
.kmx-slide-transition__line { position:absolute; inset:0; display:block; }
.kmx-slide-transition__veil {
    background: linear-gradient(180deg, rgba(4,19,24,0) 0%, rgba(4,19,24,.76) 48%, rgba(4,19,24,0) 100%);
    transform: translate3d(0,105%,0);
    opacity:0;
}
.kmx-slide-transition__line {
    height:2px;
    top:50%;
    bottom:auto;
    background:linear-gradient(90deg, transparent, var(--kmx-accent), #fff, transparent);
    transform:translate3d(-110%,0,0);
    box-shadow:0 0 22px rgba(255,255,255,.42);
}
.kmx-slide-transition.is-running { visibility:visible; }
.kmx-slide-transition.is-running .kmx-slide-transition__veil { animation:kmxVeil var(--kmx-duration) var(--kmx-ease) both; }
.kmx-slide-transition.is-running .kmx-slide-transition__line { animation:kmxLine var(--kmx-duration) var(--kmx-ease) both; }
body.kmx-direction-up .kmx-slide-transition__veil { animation-direction:reverse; }
@keyframes kmxVeil {
    0% { transform:translate3d(0,105%,0); opacity:0; }
    32% { opacity:.68; }
    52% { transform:translate3d(0,0,0); opacity:.48; }
    100% { transform:translate3d(0,-105%,0); opacity:0; }
}
@keyframes kmxLine {
    0% { transform:translate3d(-110%,0,0); opacity:0; }
    25% { opacity:1; }
    100% { transform:translate3d(110%,0,0); opacity:0; }
}

/* 3D "okret" pri loop prijelazu zadnji <-> prvi. */
body.kmx-direction-down { --kmx-loop-angle: 12deg; }
body.kmx-direction-up { --kmx-loop-angle: -12deg; }
body.kmx-loop-wrap .kmx-slide-transition__veil { animation-name: kmxLoopVeil !important; }
@keyframes kmxLoopVeil {
    0% { transform:translate3d(0,105%,0); opacity:0; }
    36% { transform:translate3d(0,0,0); opacity:.92; }
    58% { transform:translate3d(0,0,0); opacity:.92; }
    100% { transform:translate3d(0,-105%,0); opacity:0; }
}
.kmx-panel.kmx-loop-out .kmx-panel__sticky { animation:kmxLoopPanelOut 375ms var(--kmx-ease) both; }
.kmx-panel.kmx-loop-in .kmx-panel__sticky { animation:kmxLoopPanelIn 375ms var(--kmx-ease) both; }
@keyframes kmxLoopPanelOut {
    from { transform:perspective(1200px) rotateX(0deg) scaleX(1) scaleY(1); opacity:1; filter:blur(0); border-radius:0; }
    to { transform:perspective(1200px) rotateX(var(--kmx-loop-angle)) scaleX(.66) scaleY(.86); opacity:.08; filter:blur(10px); border-radius:20px; }
}
@keyframes kmxLoopPanelIn {
    from { transform:perspective(1200px) rotateX(calc(var(--kmx-loop-angle) * -1)) scaleX(.66) scaleY(.86); opacity:.08; filter:blur(10px); border-radius:20px; }
    to { transform:perspective(1200px) rotateX(0deg) scaleX(1) scaleY(1); opacity:1; filter:blur(0); border-radius:0; }
}
.kmx-hero.kmx-loop-out .elementor-background-video-container,
.kmx-hero.kmx-loop-out > video,
.kmx-hero.kmx-loop-out .kmx-hero-copy { animation:kmxLoopHeroOut 375ms var(--kmx-ease) both; }
.kmx-hero.kmx-loop-in .elementor-background-video-container,
.kmx-hero.kmx-loop-in > video,
.kmx-hero.kmx-loop-in .kmx-hero-copy { animation:kmxLoopHeroIn 375ms var(--kmx-ease) both; }
@keyframes kmxLoopHeroOut {
    from { transform:perspective(1200px) rotateX(0deg) scaleX(1) scaleY(1); opacity:1; filter:blur(0); }
    to { transform:perspective(1200px) rotateX(var(--kmx-loop-angle)) scaleX(.66) scaleY(.86); opacity:.08; filter:blur(10px); }
}
@keyframes kmxLoopHeroIn {
    from { transform:perspective(1200px) rotateX(calc(var(--kmx-loop-angle) * -1)) scaleX(.66) scaleY(.86); opacity:.08; filter:blur(10px); }
    to { transform:perspective(1200px) rotateX(0deg) scaleX(1) scaleY(1); opacity:1; filter:blur(0); }
}

/* Postojeći hero ostaje prvi fullscreen slajd. Plugin ne mijenja položaj njegovog sadržaja. */
.kmx-hero {
    --kmx-hero-scale-x: 1;
    --kmx-hero-scale-y: 1;
    --kmx-hero-rotate-x: 0deg;
    --kmx-hero-opacity: 1;
    --kmx-hero-blur: 0px;
    --kmx-hero-dim: 0;
    position: relative !important;
    z-index: 1;
    min-height: 100svh !important;
    height: 100svh !important;
    overflow: hidden !important;
}
.kmx-hero::after {
    content:"";
    position:absolute;
    inset:0;
    z-index:5;
    pointer-events:none;
    background:#020608;
    opacity:var(--kmx-hero-dim);
}
.kmx-hero .elementor-background-video-container,
.kmx-hero > video {
    transform: perspective(1200px) rotateX(var(--kmx-hero-rotate-x)) scaleX(var(--kmx-hero-scale-x)) scaleY(var(--kmx-hero-scale-y));
    transform-origin:center center;
    filter:blur(var(--kmx-hero-blur));
    opacity:var(--kmx-hero-opacity);
}
.kmx-hero .kmx-hero-copy {
    transform: perspective(1200px) rotateX(var(--kmx-hero-rotate-x)) scaleX(var(--kmx-hero-scale-x)) scaleY(var(--kmx-hero-scale-y));
    transform-origin:center center;
    filter:blur(var(--kmx-hero-blur));
    opacity:var(--kmx-hero-opacity);
}
.kmx-hero .elementor-heading-title,
.kmx-hero .elementor-widget-text-editor p,
.kmx-hero .elementor-button { max-width: min(92vw, 1120px); }
.kmx-hero .elementor-heading-title { overflow-wrap: normal; word-break: normal; }
.kmx-hero .elementor-element-139426d .elementor-heading-title,
.kmx-hero .elementor-element-6eb285e .elementor-heading-title { font-size:clamp(11px,1.25vw,18px)!important; line-height:1.2!important; }
.kmx-hero .elementor-element-96e0f28 .elementor-heading-title,
.kmx-hero .elementor-element-528c119 .elementor-heading-title { font-size:clamp(38px,min(7.6vw,10vh),108px)!important; line-height:.92!important; letter-spacing:-.035em!important; }
.kmx-hero .elementor-element-3f2551e p,
.kmx-hero .elementor-element-9fda898 p { font-size:clamp(13px,1.35vw,18px)!important; line-height:1.45!important; }

/* Element 766308e: isti sadržaj i pozicija na svim ekranima. */
body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar {
    position: fixed !important;
    inset: auto auto clamp(24px,7vh,68px) clamp(12px,2.2vw,30px) !important;
    width: min(310px, calc(100vw - 86px)) !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    z-index: 99990 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}
body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar .rimac-sidebar-menu {
    display:flex!important;
    align-items:center!important;
    gap:clamp(12px,1.8vw,22px)!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
}
body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar .rimac-line {
    width:2px!important;
    height:clamp(78px,13vh,120px)!important;
    flex:0 0 2px!important;
    background:#f5e6b8!important;
    opacity:.88;
}
body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar .rimac-links {
    display:flex!important;
    flex-direction:column!important;
    gap:clamp(7px,1.25vh,16px)!important;
    margin:0!important;
    padding:0!important;
}
body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar .rimac-links a {
    position:relative;
    display:block!important;
    color:#f5e6b8!important;
    text-decoration:none!important;
    font:400 clamp(10px,1.05vw,14px)/1.18 Arial,sans-serif!important;
    letter-spacing:clamp(.65px,.08vw,1.1px)!important;
    text-transform:uppercase!important;
    white-space:nowrap!important;
    opacity:.42;
    transform:translateX(0);
    transition:opacity .28s ease, color .28s ease, transform .35s var(--kmx-ease), font-weight .28s ease;
}
body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar .rimac-links a:hover,
body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar .rimac-links a:focus-visible,
body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar .rimac-links a.is-active {
    color:#fff!important;
    opacity:1;
    transform:translateX(clamp(4px,.6vw,8px));
    font-weight:600!important;
}
body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar .rimac-links a.is-active::before {
    content:"";
    position:absolute;
    left:-11px;
    top:50%;
    width:5px;
    height:1px;
    background:currentColor;
    transform:translateY(-50%);
}

/* Fullscreen paneli. */
.kmx-experience { position: relative; isolation: isolate; background: #06151a; contain: style; }
.kmx-panel {
    --kmx-scale-x: .72;
    --kmx-scale-y: .89;
    --kmx-rotate-x: 0deg;
    --kmx-rotate-y: 0deg;
    --kmx-depth: 1;
    --kmx-title-y: 72px;
    --kmx-opacity: 0;
    --kmx-bg-y: -30px;
    --kmx-dim: .44;
    --kmx-blur: 8px;
    position: relative;
    z-index: var(--kmx-order);
    height: 100svh;
    min-height: 100svh;
    overflow: hidden;
    contain: layout paint;
}
.kmx-panel__sticky {
    position: relative;
    height: 100svh;
    overflow: hidden;
    display: grid;
    place-items: center;
    isolation: isolate;
    transform: perspective(1200px) rotateX(var(--kmx-rotate-x)) rotateY(var(--kmx-rotate-y)) scaleX(var(--kmx-scale-x)) scaleY(var(--kmx-scale-y));
    transform-origin: center center;
    border-radius: calc(var(--kmx-depth) * 18px);
    box-shadow: 0 calc(var(--kmx-depth) * 22px) calc(var(--kmx-depth) * 52px) rgba(0,0,0,calc(var(--kmx-depth) * .34));
}
.kmx-panel__texture,
.kmx-panel__shade { position:absolute; inset:0; pointer-events:none; }
.kmx-panel__texture {
    z-index:-3;
    background:
        radial-gradient(circle at 78% 18%, rgba(255,255,255,.075), transparent 34%),
        linear-gradient(120deg, transparent 0 54%, rgba(255,255,255,.035) 54% 55%, transparent 55% 100%);
    transform: translate3d(0, var(--kmx-bg-y), 0) scale(1.10);
}
.kmx-panel__texture::after {
    content:"";
    position:absolute;
    inset:0;
    opacity:.11;
    background-image: repeating-linear-gradient(90deg, transparent 0, transparent calc(16.666% - 1px), rgba(255,255,255,.18) 16.666%);
}
.kmx-panel__shade { z-index:-1; background:#000; opacity:var(--kmx-dim); }
.kmx-panel__content {
    width: min(1220px, calc(100% - clamp(54px, 12vw, 180px)));
    min-width:0;
    display: grid;
    grid-template-columns: minmax(40px, 100px) minmax(0,1fr);
    align-items: center;
    gap: clamp(18px,4vw,68px);
    opacity:var(--kmx-opacity);
    transform: translate3d(0,var(--kmx-title-y),0);
    filter:blur(var(--kmx-blur));
}
.kmx-panel__number {
    padding-bottom: clamp(4px,1vw,14px);
    font: 600 clamp(9px,.8vw,11px)/1 Arial,sans-serif;
    letter-spacing:.22em;
    opacity:.62;
}
.kmx-panel__title-mask { min-width:0; overflow:visible; padding:.13em .03em .18em; }
.kmx-panel h2 {
    margin:0;
    max-width:100%;
    font:300 clamp(42px,min(10.2vw,17vh),166px)/.91 Arial,sans-serif;
    letter-spacing:-.058em;
    text-wrap:balance;
    overflow-wrap:normal;
    word-break:normal;
}
.kmx-panel__ghost {
    position:absolute;
    right:-.04em;
    bottom:-.20em;
    z-index:-2;
    font:700 clamp(230px,42vw,700px)/.72 Arial,sans-serif;
    letter-spacing:-.09em;
    opacity:calc(var(--kmx-opacity) * .035);
    transform:translate3d(0,calc(var(--kmx-bg-y) * -1.4),0);
}
.kmx-panel--dark .kmx-panel__sticky { color:#f2eadb; background:#09242b; }
.kmx-panel--light .kmx-panel__sticky { color:#0b1d22; background:#e8e1d4; }
.kmx-panel--light .kmx-panel__texture { background:radial-gradient(circle at 20% 82%, rgba(4,24,29,.12), transparent 34%), linear-gradient(120deg, transparent 0 54%, rgba(4,24,29,.055) 54% 55%, transparent 55% 100%); }
.kmx-panel--light .kmx-panel__texture::after { background-image:repeating-linear-gradient(90deg, transparent 0, transparent calc(16.666% - 1px), rgba(4,24,29,.12) 16.666%); }
.kmx-panel--bronze .kmx-panel__sticky { color:#fff7e9; background:#8a6242; }
.kmx-panel--deep .kmx-panel__sticky { color:#f4eee3; background:#0a3038; }

/* Kontakt. */
.kmx-panel--contact .kmx-panel__sticky { color:#f6f0e6; background:#071b21; place-items:stretch; }
.kmx-panel--contact .kmx-panel__texture { background:radial-gradient(circle at 78% 25%, rgba(213,179,123,.17), transparent 34%), radial-gradient(circle at 16% 80%, rgba(215,25,45,.10), transparent 36%); }
.kmx-contact {
    position:relative;
    z-index:2;
    width:min(1280px,100%);
    height:100%;
    margin:auto;
    padding:clamp(78px,11vh,118px) clamp(28px,7vw,96px) clamp(32px,6vh,64px) clamp(72px,12vw,172px);
    display:grid;
    grid-template-columns:minmax(260px,.82fr) minmax(420px,1.18fr);
    gap:clamp(34px,6vw,90px);
    align-items:center;
    box-sizing:border-box;
}
.kmx-contact__intro { min-width:0; }
.kmx-contact__intro h2 { font-size:clamp(52px,min(7.2vw,12vh),112px); line-height:.9; }
.kmx-contact__intro > p { margin:clamp(18px,3vh,30px) 0; max-width:48ch; color:rgba(246,240,230,.72); font:400 clamp(14px,1.1vw,17px)/1.65 Arial,sans-serif; }
.kmx-contact__channels { margin-top:clamp(22px,4vh,42px); border-top:1px solid rgba(255,255,255,.16); }
.kmx-contact__channels a { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:48px; border-bottom:1px solid rgba(255,255,255,.16); color:#f6f0e6; text-decoration:none; font:500 clamp(12px,.95vw,15px)/1 Arial,sans-serif; letter-spacing:.08em; text-transform:uppercase; transition:color .25s ease, padding .25s ease; }
.kmx-contact__channels a:hover,
.kmx-contact__channels a:focus-visible { color:var(--kmx-accent); padding-left:8px; }
.kmx-contact-form {
    position:relative;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:clamp(14px,2vh,22px) clamp(16px,2vw,28px);
    padding:clamp(22px,3.2vw,46px);
    border:1px solid rgba(255,255,255,.16);
    background:rgba(255,255,255,.055);
    box-shadow:0 28px 80px rgba(0,0,0,.22);
    backdrop-filter:blur(12px);
}
.kmx-contact-form::before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(135deg,rgba(255,255,255,.055),transparent 42%); }
.kmx-field { position:relative; z-index:1; min-width:0; }
.kmx-field--full { grid-column:1/-1; }
.kmx-field label { display:block; margin-bottom:8px; color:rgba(246,240,230,.68); font:600 10px/1.2 Arial,sans-serif; letter-spacing:.13em; text-transform:uppercase; }
.kmx-field label span { color:var(--kmx-accent); }
.kmx-field input,
.kmx-field textarea {
    width:100%;
    box-sizing:border-box;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.28);
    border-radius:0;
    outline:0;
    background:transparent;
    color:#fff;
    padding:8px 0 10px;
    font:400 clamp(15px,1.1vw,18px)/1.4 Arial,sans-serif;
    transition:border-color .24s ease, box-shadow .24s ease;
}
.kmx-field textarea { min-height:82px; resize:vertical; }
.kmx-field input:focus,
.kmx-field textarea:focus { border-color:var(--kmx-accent); box-shadow:0 1px 0 var(--kmx-accent); }
.kmx-field input[aria-invalid="true"],
.kmx-field textarea[aria-invalid="true"] { border-color:#ff7d7d; }
.kmx-consent { position:relative; z-index:1; display:flex; align-items:flex-start; gap:10px; color:rgba(246,240,230,.62); font:400 11px/1.45 Arial,sans-serif; cursor:pointer; }
.kmx-consent input { flex:0 0 auto; margin-top:2px; accent-color:var(--kmx-accent); }
.kmx-contact-form__actions { position:relative; z-index:1; display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:16px; }
.kmx-contact-form__actions button { min-height:48px; display:inline-flex; align-items:center; justify-content:space-between; gap:28px; padding:0 18px; border:1px solid var(--kmx-accent); border-radius:0; background:transparent; color:#fff; font:600 11px/1 Arial,sans-serif; letter-spacing:.12em; text-transform:uppercase; cursor:pointer; transition:background .25s ease,color .25s ease,transform .25s ease; }
.kmx-contact-form__actions button:hover,
.kmx-contact-form__actions button:focus-visible { background:var(--kmx-accent); color:#071b21; transform:translateY(-2px); }
.kmx-contact-form__actions button[disabled] { opacity:.55; cursor:wait; transform:none; }
.kmx-contact-form__status { margin:0; min-height:1.4em; color:rgba(246,240,230,.75); font:400 12px/1.45 Arial,sans-serif; }
.kmx-contact-form__status.is-success { color:#bce7c5; }
.kmx-contact-form__status.is-error { color:#ffaaaa; }
.kmx-contact-form__status.is-warning { color:#ffd690; }
.kmx-contact-form__trap { position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; overflow:hidden!important; }

@media (max-width: 1024px) {
    .kmx-panel__content { width:calc(100% - clamp(46px,9vw,92px)); grid-template-columns:minmax(36px,72px) minmax(0,1fr); }
    .kmx-panel h2 { font-size:clamp(44px,min(10.8vw,14vh),112px); }
    .kmx-contact { grid-template-columns:minmax(220px,.8fr) minmax(360px,1.2fr); gap:32px; padding-left:clamp(72px,10vw,110px); padding-right:34px; }
    .kmx-contact-form { padding:24px; }
}

@media (max-width: 782px) {
    body.admin-bar .kmx-menu-trigger { top:calc(46px + 16px); }
    body.admin-bar .kmx-menu { top:46px; }
    .kmx-panel__content { width:calc(100% - 38px); grid-template-columns:1fr; align-content:center; gap:14px; padding-left:56px; box-sizing:border-box; }
    .kmx-panel__number { padding:0; }
    .kmx-panel h2 { font-size:clamp(38px,min(13vw,10.5vh),76px); line-height:.93; letter-spacing:-.045em; }
    .kmx-panel__ghost { font-size:clamp(220px,84vw,440px); }
    .kmx-contact {
        width:100%;
        max-height:100svh;
        overflow-y:auto;
        overscroll-behavior:contain;
        -webkit-overflow-scrolling:touch;
        grid-template-columns:1fr;
        align-content:start;
        gap:24px;
        padding:76px 18px 36px 70px;
        scrollbar-width:thin;
    }
    .kmx-contact__intro h2 { font-size:clamp(44px,13vw,72px); }
    .kmx-contact__intro > p { margin:14px 0 18px; font-size:14px; line-height:1.5; }
    .kmx-contact__channels { margin-top:18px; }
    .kmx-contact__channels a { min-height:42px; }
    .kmx-contact-form { grid-template-columns:1fr; gap:14px; padding:20px 18px; }
    .kmx-field--full { grid-column:auto; }
    .kmx-contact-form__actions { grid-template-columns:1fr; }
    .kmx-contact-form__actions button { width:100%; }
    body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar { width:min(255px,calc(100vw - 74px))!important; }
    body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar .rimac-links a { font-size:clamp(9px,2.55vw,11px)!important; }
    body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar .rimac-line { height:clamp(72px,12vh,92px)!important; }
    .kmx-hero .elementor-element-6eb285e .elementor-heading-title { font-size:clamp(10px,3vw,14px)!important; }
    .kmx-hero .elementor-element-528c119 .elementor-heading-title { font-size:clamp(32px,9.6vw,52px)!important; }
    .kmx-hero .elementor-element-9fda898 p { font-size:clamp(13px,3.7vw,15px)!important; }
}

@media (max-height: 650px) and (min-width: 783px) {
    .kmx-contact { padding-top:66px; padding-bottom:24px; }
    .kmx-contact__intro h2 { font-size:clamp(48px,8vh,76px); }
    .kmx-contact__intro > p { margin:14px 0; line-height:1.45; }
    .kmx-contact__channels { margin-top:14px; }
    .kmx-contact__channels a { min-height:38px; }
    .kmx-contact-form { gap:11px 20px; padding:20px 26px; }
    .kmx-field textarea { min-height:58px; }
}


/* v1.5.0 — jedan isti hero na desktopu, tabletu i mobitelu. */
body.kmx-active .elementor-element-0f57ec9.kmx-disabled-mobile-duplicate {
    display: none !important;
}

body.kmx-active .kmx-hero .kmx-hero-copy {
    visibility: visible !important;
    opacity: 1 !important;
}

@media (max-width: 1024px) {
    body.kmx-active .kmx-hero {
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        align-content: center !important;
        box-sizing: border-box !important;
        padding: max(82px, 10svh) clamp(22px, 5vw, 52px) max(150px, 20svh) !important;
        gap: 0 !important;
    }

    body.kmx-active .kmx-hero > .elementor-background-video-container {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        z-index: 0 !important;
        overflow: hidden !important;
    }

    body.kmx-active .kmx-hero .elementor-background-video-hosted,
    body.kmx-active .kmx-hero .elementor-background-video-container video {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        min-width: 100% !important;
        min-height: 100% !important;
        max-width: none !important;
        max-height: none !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

    body.kmx-active .kmx-hero .kmx-hero-copy {
        position: relative !important;
        inset: auto !important;
        z-index: 10 !important;
        flex: 0 0 auto !important;
        display: block !important;
        width: 100% !important;
        max-width: min(900px, 100%) !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
        align-self: center !important;
        text-align: center !important;
    }

    body.kmx-active .kmx-hero .elementor-element-139426d {
        margin-bottom: clamp(14px, 2.4svh, 24px) !important;
    }

    body.kmx-active .kmx-hero .elementor-element-96e0f28 {
        max-width: min(950px, 100%) !important;
    }

    body.kmx-active .kmx-hero .elementor-element-3f2551e {
        max-width: min(720px, 88%) !important;
        margin-top: clamp(18px, 3svh, 30px) !important;
    }

    body.kmx-active .kmx-hero .elementor-element-f25be47 {
        width: auto !important;
        margin-top: clamp(24px, 4svh, 38px) !important;
    }

    body.kmx-active .kmx-hero .elementor-element-139426d .elementor-heading-title {
        margin: 0 !important;
        font-size: clamp(11px, min(2vw, 2.4svh), 16px) !important;
        line-height: 1.25 !important;
        letter-spacing: .28em !important;
        text-align: center !important;
    }

    body.kmx-active .kmx-hero .elementor-element-96e0f28 .elementor-heading-title {
        margin: 0 auto !important;
        max-width: 100% !important;
        font-size: clamp(42px, min(8.4vw, 10svh), 82px) !important;
        line-height: .94 !important;
        letter-spacing: -.04em !important;
        text-align: center !important;
        text-wrap: balance !important;
        white-space: normal !important;
        overflow: visible !important;
    }

    body.kmx-active .kmx-hero .elementor-element-3f2551e p {
        margin: 0 !important;
        font-size: clamp(14px, min(2.15vw, 2.45svh), 18px) !important;
        line-height: 1.45 !important;
        text-align: center !important;
        text-wrap: balance !important;
    }

    body.kmx-active .kmx-hero .elementor-element-f25be47 .elementor-button {
        min-height: 48px !important;
        padding: 0 24px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: clamp(12px, 1.8vw, 15px) !important;
        line-height: 1 !important;
    }
}

@media (max-width: 782px) {
    body.kmx-active .kmx-hero {
        padding: max(74px, 10svh) 18px max(142px, 20svh) !important;
    }

    body.kmx-active .kmx-hero .elementor-element-139426d {
        margin-bottom: clamp(12px, 2svh, 18px) !important;
    }

    body.kmx-active .kmx-hero .elementor-element-139426d .elementor-heading-title {
        font-size: clamp(9px, min(2.8vw, 2.1svh), 13px) !important;
        letter-spacing: .20em !important;
    }

    body.kmx-active .kmx-hero .elementor-element-96e0f28 .elementor-heading-title {
        font-size: clamp(30px, min(10vw, 7.4svh), 48px) !important;
        line-height: .95 !important;
        letter-spacing: -.035em !important;
    }

    body.kmx-active .kmx-hero .elementor-element-3f2551e {
        max-width: min(34ch, 92%) !important;
        margin-top: clamp(14px, 2.4svh, 22px) !important;
    }

    body.kmx-active .kmx-hero .elementor-element-3f2551e p {
        font-size: clamp(12px, min(3.65vw, 2.2svh), 15px) !important;
        line-height: 1.42 !important;
    }

    body.kmx-active .kmx-hero .elementor-element-f25be47 {
        margin-top: clamp(20px, 3.3svh, 30px) !important;
    }

    body.kmx-active .kmx-hero .elementor-element-f25be47 .elementor-button {
        min-height: 44px !important;
        padding: 0 19px !important;
        font-size: 11px !important;
    }

    /* Naslovi ostalih slajdova moraju stati i na 320–390 px širine. */
    .kmx-panel__content {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 18px 0 54px !important;
        box-sizing: border-box !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .kmx-panel__title-mask {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
        padding: .12em 0 .22em !important;
    }

    .kmx-panel h2 {
        width: 100% !important;
        max-width: 100% !important;
        font-size: clamp(32px, min(11vw, 7.2svh), 54px) !important;
        line-height: .95 !important;
        letter-spacing: -.042em !important;
        white-space: normal !important;
        overflow: visible !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        text-wrap: balance !important;
    }

    body.kmx-active .elementor-element-766308e.kmx-fixed-sidebar {
        left: max(12px, env(safe-area-inset-left)) !important;
        bottom: max(18px, env(safe-area-inset-bottom)) !important;
        width: min(248px, calc(100vw - 74px)) !important;
    }
}

@media (max-width: 390px) and (max-height: 700px) {
    body.kmx-active .kmx-hero {
        padding-top: 66px !important;
        padding-bottom: 124px !important;
    }

    body.kmx-active .kmx-hero .elementor-element-96e0f28 .elementor-heading-title {
        font-size: clamp(28px, min(9.2vw, 7svh), 38px) !important;
    }

    body.kmx-active .kmx-hero .elementor-element-3f2551e {
        margin-top: 12px !important;
    }

    body.kmx-active .kmx-hero .elementor-element-f25be47 {
        margin-top: 17px !important;
    }
}

/* v1.6.0 — mobilni/tablet fullscreen poravnanje bez promjena desktop izgleda. */

/* Kontakt naslov: broj/label više ne ulazi u riječ "Razgovarajmo". */
.kmx-contact__intro > .kmx-panel__number {
    display: block;
    position: relative;
    z-index: 2;
    margin: 0 0 clamp(14px, 2.2vh, 24px);
    padding: 0;
}
.kmx-contact__intro > .kmx-panel__title-mask {
    display: block;
    overflow: visible;
    padding: .04em 0 .16em;
}
.kmx-contact__intro > .kmx-panel__title-mask h2 {
    display: block;
    position: relative;
    z-index: 1;
    margin: 0;
    padding: 0;
}

@media (max-width: 1024px) {
    /* Elementor omotači i svaki slajd koriste cijelu širinu zaslona. */
    body.kmx-active .site-main,
    body.kmx-active .page-content,
    body.kmx-active .elementor,
    body.kmx-active .elementor-54,
    body.kmx-active .kmx-experience,
    body.kmx-active .kmx-panel,
    body.kmx-active .kmx-panel__sticky {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    /* Početni video je stvarni fullscreen na mobitelu i tabletu. */
    body.kmx-active .kmx-hero {
        width: 100vw !important;
        max-width: 100vw !important;
        min-height: 100svh !important;
        height: 100svh !important;
        margin: 0 !important;
        padding: max(72px, 9svh) clamp(18px, 4.5vw, 42px) max(118px, 15svh) !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    body.kmx-active .kmx-hero > .elementor-background-video-container,
    body.kmx-active .kmx-hero .elementor-background-video-container {
        position: absolute !important;
        inset: 0 !important;
        width: 100vw !important;
        height: 100svh !important;
        min-width: 100vw !important;
        min-height: 100svh !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    body.kmx-active .kmx-hero .elementor-background-video-hosted,
    body.kmx-active .kmx-hero .elementor-background-video-container video {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        right: auto !important;
        bottom: auto !important;
        width: 100% !important;
        height: 100% !important;
        min-width: 100% !important;
        min-height: 100% !important;
        margin: 0 !important;
        object-fit: cover !important;
        object-position: center center !important;
        transform: translate(-50%, -50%) perspective(1200px) rotateX(var(--kmx-hero-rotate-x)) scaleX(var(--kmx-hero-scale-x)) scaleY(var(--kmx-hero-scale-y)) !important;
        transform-origin: center center !important;
    }

    /* Obični slajdovi: pozadina od ruba do ruba, tekst centriran s malim paddingom. */
    .kmx-panel__content {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 auto !important;
        padding: 0 clamp(20px, 5vw, 52px) !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        align-content: center !important;
        gap: clamp(12px, 2.2vh, 22px) !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    .kmx-panel__content .kmx-panel__number,
    .kmx-panel__content .kmx-panel__title-mask,
    .kmx-panel__content h2 {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
    }

    /* Kontakt: nema umjetnog lijevog odmaka; blokovi su centrirani i široki. */
    .kmx-contact {
        width: 100% !important;
        max-width: 920px !important;
        min-width: 0 !important;
        height: 100svh !important;
        max-height: 100svh !important;
        margin: 0 auto !important;
        padding: max(76px, 9svh) clamp(20px, 5vw, 46px) max(168px, calc(132px + env(safe-area-inset-bottom))) !important;
        grid-template-columns: minmax(0, 1fr) !important;
        justify-items: center !important;
        align-items: start !important;
        align-content: start !important;
        gap: clamp(26px, 4.5vh, 44px) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    .kmx-contact__intro {
        width: min(100%, 720px) !important;
        max-width: 720px !important;
        margin: 0 auto !important;
        text-align: center !important;
    }

    .kmx-contact__intro > .kmx-panel__number {
        margin-bottom: clamp(12px, 2vh, 20px) !important;
        text-align: center !important;
    }

    .kmx-contact__intro > .kmx-panel__title-mask,
    .kmx-contact__intro > .kmx-panel__title-mask h2 {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
    }

    .kmx-contact__intro > .kmx-panel__title-mask h2 {
        font-size: clamp(40px, min(10vw, 7.8svh), 76px) !important;
        line-height: .96 !important;
        letter-spacing: -.045em !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        text-wrap: balance !important;
    }

    .kmx-contact__intro > p {
        width: min(100%, 52ch) !important;
        max-width: 52ch !important;
        margin: clamp(14px, 2.2vh, 22px) auto 0 !important;
        text-align: center !important;
        text-wrap: balance !important;
    }

    .kmx-contact__channels {
        width: min(100%, 680px) !important;
        max-width: 680px !important;
        margin: clamp(22px, 3.5vh, 36px) auto 0 !important;
    }

    .kmx-contact__channels a {
        position: relative !important;
        width: 100% !important;
        justify-content: center !important;
        padding-left: 30px !important;
        padding-right: 30px !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    .kmx-contact__channels a b {
        position: absolute !important;
        right: 4px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
    }

    .kmx-contact-form {
        width: min(100%, 680px) !important;
        max-width: 680px !important;
        min-width: 0 !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
        text-align: left !important;
    }
}

@media (max-width: 782px) {
    body.kmx-active .kmx-hero {
        padding-left: max(18px, env(safe-area-inset-left)) !important;
        padding-right: max(18px, env(safe-area-inset-right)) !important;
    }

    .kmx-panel__content {
        padding-left: max(18px, env(safe-area-inset-left)) !important;
        padding-right: max(18px, env(safe-area-inset-right)) !important;
    }

    .kmx-contact {
        max-width: none !important;
        padding-left: max(18px, env(safe-area-inset-left)) !important;
        padding-right: max(18px, env(safe-area-inset-right)) !important;
    }

    .kmx-contact__intro > .kmx-panel__title-mask h2 {
        font-size: clamp(36px, 11vw, 56px) !important;
    }

    .kmx-contact-form {
        padding: 20px 16px !important;
    }
}

@media (max-width: 390px) {
    .kmx-contact__intro > .kmx-panel__title-mask h2 {
        font-size: clamp(34px, 10.6vw, 44px) !important;
    }
}

/* v1.9.0 — isti hamburger na svim ekranima; samo safe-area prilagodba na mobitelu. */
@media (max-width: 767px) {
    .kmx-menu-trigger {
        left: auto !important;
        right: max(12px, env(safe-area-inset-right)) !important;
        top: max(10px, calc(env(safe-area-inset-top) + 10px)) !important;
        color: #ffffff !important;
    }

    body.admin-bar .kmx-menu-trigger {
        top: calc(46px + 10px) !important;
    }
}

#kmx-contact-form {
    scroll-margin-top: 18px;
}


/* v1.9.0 — kontakt bez velikog naslova; broj, opis i kanali ostaju uredno poravnati. */
.kmx-contact__intro > .kmx-panel__number + p {
    margin-top: clamp(16px, 2.6vh, 28px);
}
@media (max-width: 1024px) {
    .kmx-contact__intro > .kmx-panel__number + p {
        margin-top: clamp(14px, 2vh, 20px) !important;
    }
}

/* ============================================================
   v2.0.0 — sadržajni editorial slajdovi + stvarni Ključ Mont video
   ============================================================ */
.kmx-panel--story .kmx-panel__sticky {
    place-items: stretch;
}

.kmx-story {
    position: relative;
    z-index: 2;
    width: min(1440px, 100%);
    height: 100%;
    min-width: 0;
    margin: 0 auto;
    padding: clamp(88px, 10vh, 122px) clamp(54px, 6.2vw, 98px) clamp(48px, 6vh, 76px) clamp(126px, 10.8vw, 184px);
    display: grid;
    grid-template-columns: minmax(0, 1.04fr) minmax(320px, .72fr);
    gap: clamp(44px, 6.5vw, 104px);
    align-items: center;
    box-sizing: border-box;
}

.kmx-story__copy {
    position: relative;
    z-index: 3;
    min-width: 0;
    max-width: 760px;
    opacity: var(--kmx-opacity);
    transform: translate3d(0, var(--kmx-title-y), 0);
    filter: blur(calc(var(--kmx-blur) * .55));
}

.kmx-story__eyebrow {
    display: block;
    margin: 0 0 clamp(18px, 2.8vh, 30px);
    font: 700 clamp(9px, .68vw, 11px)/1 Arial, sans-serif;
    letter-spacing: .24em;
    text-transform: uppercase;
    opacity: .68;
}

.kmx-story__title-mask {
    overflow: visible;
    padding: .04em .02em .12em 0;
}

.kmx-panel--story .kmx-story h2 {
    margin: 0;
    max-width: 10.6ch;
    font: 400 clamp(54px, min(6.2vw, 10.5vh), 104px)/.92 Arial, sans-serif;
    letter-spacing: -.058em;
    text-wrap: balance;
    overflow-wrap: normal;
    word-break: normal;
}

.kmx-story__lead {
    max-width: 54ch;
    margin: clamp(22px, 3.5vh, 34px) 0 0;
    font: 400 clamp(15px, 1.12vw, 18px)/1.62 Arial, sans-serif;
    opacity: .78;
    text-wrap: pretty;
}

.kmx-story__features {
    list-style: none;
    margin: clamp(22px, 3.4vh, 36px) 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
}

.kmx-story__features li {
    margin: 0;
    padding: 9px 12px 8px;
    border: 1px solid currentColor;
    border-color: color-mix(in srgb, currentColor 24%, transparent);
    font: 600 9px/1 Arial, sans-serif;
    letter-spacing: .11em;
    text-transform: uppercase;
    opacity: .72;
}

.kmx-story__cta {
    width: fit-content;
    min-width: min(250px, 100%);
    margin-top: clamp(24px, 4vh, 42px);
    padding: 15px 17px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    border: 1px solid currentColor;
    color: inherit;
    text-decoration: none;
    box-sizing: border-box;
    font: 700 11px/1 Arial, sans-serif;
    letter-spacing: .08em;
    text-transform: uppercase;
    transition: background .24s ease, color .24s ease, border-color .24s ease, transform .24s ease;
}

.kmx-story__cta:hover,
.kmx-story__cta:focus-visible {
    color: #071b21;
    background: var(--kmx-accent);
    border-color: var(--kmx-accent);
    transform: translateY(-2px);
}

.kmx-story__visual {
    position: relative;
    z-index: 1;
    justify-self: end;
    width: min(100%, clamp(330px, 29vw, 465px));
    height: clamp(500px, 72vh, 760px);
    overflow: hidden;
    isolation: isolate;
    background: rgba(0,0,0,.12);
    box-shadow: 0 30px 80px rgba(0,0,0,.26);
    opacity: clamp(.18, var(--kmx-opacity), 1);
    transform:
        translate3d(calc(var(--kmx-title-y) * -.22), 0, 0)
        scale(calc(1 - (var(--kmx-depth) * .055)));
    filter: blur(calc(var(--kmx-blur) * .26));
}

.kmx-story__video,
.kmx-floor-art {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.kmx-story__video {
    object-position: center center;
    transform: scale(1.018);
}

.kmx-story__visual-shade {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(4,15,18,.04) 0%, rgba(4,15,18,.04) 52%, rgba(4,15,18,.60) 100%),
        linear-gradient(90deg, rgba(4,15,18,.12), transparent 42%);
}

.kmx-story__visual::after {
    content: "";
    position: absolute;
    inset: 12px;
    z-index: 3;
    pointer-events: none;
    border: 1px solid rgba(255,255,255,.20);
}

.kmx-story__media-label {
    position: absolute;
    z-index: 4;
    left: 26px;
    bottom: 25px;
    max-width: calc(100% - 52px);
    color: #fff;
    font: 700 9px/1 Arial, sans-serif;
    letter-spacing: .18em;
    text-transform: uppercase;
}

/* Podovi — namjerno editorial materijalni vizual dok ne postoji stvarna fotografija poda. */
.kmx-floor-art {
    overflow: hidden;
    background:
        radial-gradient(circle at 22% 12%, rgba(255,255,255,.28), transparent 25%),
        linear-gradient(145deg, #dcc7a7 0%, #a97f55 44%, #6c4b32 100%);
}

.kmx-floor-art__planks {
    position: absolute;
    inset: -12% -18%;
    transform: perspective(760px) rotateX(58deg) rotateZ(-13deg) scale(1.18);
    transform-origin: 50% 78%;
    background:
        repeating-linear-gradient(90deg,
            rgba(255,255,255,.10) 0,
            rgba(255,255,255,.10) 1px,
            transparent 1px,
            transparent 94px),
        repeating-linear-gradient(0deg,
            rgba(30,17,9,.30) 0,
            rgba(30,17,9,.30) 2px,
            transparent 2px,
            transparent 48px),
        repeating-linear-gradient(90deg,
            rgba(70,38,19,.05) 0,
            rgba(255,255,255,.08) 26px,
            rgba(61,32,17,.12) 66px,
            rgba(255,255,255,.03) 94px);
    box-shadow: inset 0 0 90px rgba(54,29,14,.24);
}

.kmx-floor-art__light {
    position: absolute;
    z-index: 2;
    width: 80%;
    height: 52%;
    right: -14%;
    top: -10%;
    transform: rotate(-18deg);
    background: linear-gradient(145deg, rgba(255,255,255,.55), rgba(255,255,255,0));
    filter: blur(18px);
    opacity: .72;
}

.kmx-panel--light .kmx-story__cta:hover,
.kmx-panel--light .kmx-story__cta:focus-visible {
    color: #f6f0e6;
    background: #0b1d22;
    border-color: #0b1d22;
}

@media (max-width: 1180px) and (min-width: 1025px) {
    .kmx-story {
        padding-left: 116px;
        padding-right: 48px;
        gap: 42px;
        grid-template-columns: minmax(0, 1fr) minmax(300px, .7fr);
    }
    .kmx-panel--story .kmx-story h2 { font-size: clamp(50px, 6.5vw, 82px); }
}

@media (max-width: 1024px) {
    .kmx-panel--story .kmx-panel__sticky {
        color: #fff7ed !important;
        background: #071b21 !important;
    }

    .kmx-story {
        width: 100% !important;
        max-width: none !important;
        height: 100svh !important;
        margin: 0 !important;
        padding:
            max(84px, calc(env(safe-area-inset-top) + 74px))
            max(22px, env(safe-area-inset-right))
            max(156px, calc(env(safe-area-inset-bottom) + 136px))
            max(22px, env(safe-area-inset-left)) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    .kmx-story__visual {
        position: absolute !important;
        inset: 0 !important;
        z-index: 0 !important;
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        box-shadow: none !important;
        opacity: 1 !important;
        transform: scale(calc(1.035 - (var(--kmx-depth) * .03))) !important;
        filter: blur(calc(var(--kmx-blur) * .18)) !important;
    }

    .kmx-story__visual::after { display: none; }
    .kmx-story__video { object-position: center center !important; }

    .kmx-story__visual-shade {
        z-index: 2 !important;
        background:
            linear-gradient(180deg, rgba(3,15,19,.44) 0%, rgba(3,15,19,.30) 25%, rgba(3,15,19,.66) 76%, rgba(3,15,19,.88) 100%),
            linear-gradient(90deg, rgba(3,15,19,.18), rgba(3,15,19,.04), rgba(3,15,19,.18)) !important;
    }

    .kmx-panel--light .kmx-story__visual-shade {
        background:
            linear-gradient(180deg, rgba(4,20,24,.35) 0%, rgba(4,20,24,.24) 24%, rgba(4,20,24,.68) 76%, rgba(4,20,24,.90) 100%) !important;
    }

    .kmx-story__copy {
        z-index: 4 !important;
        width: min(100%, 680px) !important;
        max-width: 680px !important;
        margin: 0 auto !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        transform: translate3d(0, calc(var(--kmx-title-y) * .55 - 2svh), 0) !important;
        filter: blur(calc(var(--kmx-blur) * .34)) !important;
    }

    .kmx-story__eyebrow {
        margin-bottom: clamp(14px, 2.3svh, 22px) !important;
        color: #fff !important;
        opacity: .76 !important;
    }

    .kmx-panel--story .kmx-story h2 {
        width: 100% !important;
        max-width: 12ch !important;
        margin: 0 auto !important;
        color: #fff !important;
        font-size: clamp(42px, min(8.7vw, 8.3svh), 76px) !important;
        line-height: .94 !important;
        letter-spacing: -.052em !important;
        text-align: center !important;
        text-wrap: balance !important;
    }

    .kmx-story__lead {
        width: min(100%, 46ch) !important;
        margin: clamp(16px, 2.6svh, 25px) auto 0 !important;
        color: rgba(255,255,255,.88) !important;
        font-size: clamp(14px, 1.8vw, 17px) !important;
        line-height: 1.5 !important;
        text-align: center !important;
    }

    .kmx-story__features {
        justify-content: center !important;
        margin-top: clamp(16px, 2.6svh, 24px) !important;
    }

    .kmx-story__features li {
        color: #fff !important;
        border-color: rgba(255,255,255,.34) !important;
        background: rgba(4,17,21,.16) !important;
        backdrop-filter: blur(5px);
    }

    .kmx-story__cta {
        margin-top: clamp(18px, 3svh, 28px) !important;
        color: #fff !important;
        border-color: rgba(255,255,255,.70) !important;
        background: rgba(6,24,29,.18) !important;
        backdrop-filter: blur(7px);
    }

    .kmx-story__cta:hover,
    .kmx-story__cta:focus-visible,
    .kmx-panel--light .kmx-story__cta:hover,
    .kmx-panel--light .kmx-story__cta:focus-visible {
        color: #071b21 !important;
        background: var(--kmx-accent) !important;
        border-color: var(--kmx-accent) !important;
    }

    .kmx-story__media-label {
        left: auto !important;
        right: max(18px, env(safe-area-inset-right)) !important;
        bottom: max(22px, env(safe-area-inset-bottom)) !important;
        color: rgba(255,255,255,.62) !important;
        font-size: 8px !important;
    }

    .kmx-panel__ghost { display: none !important; }
}

@media (max-width: 767px) {
    .kmx-story {
        padding-top: max(76px, calc(env(safe-area-inset-top) + 66px)) !important;
        padding-left: max(18px, env(safe-area-inset-left)) !important;
        padding-right: max(18px, env(safe-area-inset-right)) !important;
        padding-bottom: max(142px, calc(env(safe-area-inset-bottom) + 124px)) !important;
    }

    .kmx-story__copy {
        width: min(100%, 520px) !important;
        transform: translate3d(0, calc(var(--kmx-title-y) * .42 - 1svh), 0) !important;
    }

    .kmx-story__eyebrow {
        font-size: 8px !important;
        letter-spacing: .20em !important;
        margin-bottom: 13px !important;
    }

    .kmx-panel--story .kmx-story h2 {
        font-size: clamp(34px, min(10.2vw, 7.2svh), 52px) !important;
        max-width: 11.5ch !important;
    }

    .kmx-story__lead {
        font-size: clamp(12px, 3.45vw, 15px) !important;
        line-height: 1.46 !important;
        max-width: 38ch !important;
        margin-top: 14px !important;
    }

    .kmx-story__features {
        gap: 6px !important;
        margin-top: 14px !important;
    }

    .kmx-story__features li {
        padding: 7px 8px 6px !important;
        font-size: 7px !important;
        letter-spacing: .09em !important;
    }

    .kmx-story__cta {
        min-width: min(220px, 84vw) !important;
        padding: 13px 14px 12px !important;
        margin-top: 16px !important;
        font-size: 9px !important;
    }

    .kmx-story__media-label { display: none !important; }
}

@media (max-width: 390px), (max-height: 690px) and (max-width: 767px) {
    .kmx-story {
        padding-top: max(66px, calc(env(safe-area-inset-top) + 58px)) !important;
        padding-bottom: max(128px, calc(env(safe-area-inset-bottom) + 112px)) !important;
    }
    .kmx-panel--story .kmx-story h2 {
        font-size: clamp(30px, min(9.7vw, 6.8svh), 42px) !important;
    }
    .kmx-story__lead { font-size: 12px !important; line-height: 1.42 !important; }
    .kmx-story__features li { font-size: 6.8px !important; }
}


/* ============================================================
   v2.1.0 — desktop safety lane, stronger floor contrast, source-quality media
   ============================================================ */

/* The fixed section index occupies the lower-left lane. Move story copy clear
   of it without moving the media column or changing the tablet/mobile layout. */
@media (min-width: 1025px) {
    .kmx-panel--story .kmx-story__copy {
        padding-left: clamp(54px, 4.4vw, 82px);
        box-sizing: border-box;
    }

    /* Keep large headings from drifting into the top-right hamburger safety zone. */
    .kmx-panel--story .kmx-story__copy {
        padding-right: clamp(10px, 1.3vw, 24px);
    }
}

/* Podovi: explicit contrast overrides Elementor/global heading colors. */
.kmx-panel--light .kmx-story__eyebrow,
.kmx-panel--light .kmx-story h2,
.kmx-panel--light .kmx-story__lead,
.kmx-panel--light .kmx-story__features,
.kmx-panel--light .kmx-story__cta {
    color: #10282d !important;
}
.kmx-panel--light .kmx-story__lead { opacity: .88 !important; }
.kmx-panel--light .kmx-story__features li {
    border-color: rgba(16,40,45,.30) !important;
    background: rgba(255,255,255,.16);
}
.kmx-panel--light .kmx-story__cta {
    border-color: rgba(16,40,45,.56) !important;
}

/* Real Pexels floor photograph replaces the synthetic floor illustration. */
.kmx-story__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: 48% center;
    transform: scale(1.002);
}
.kmx-story__visual--image .kmx-story__visual-shade {
    background:
        linear-gradient(180deg, rgba(4,15,18,.02) 0%, rgba(4,15,18,.04) 55%, rgba(4,15,18,.48) 100%),
        linear-gradient(90deg, rgba(4,15,18,.08), transparent 46%);
}

/* Do not enlarge the already-vertical source video at rest. Preserving the
   original stream plus avoiding needless scale keeps it as crisp as the source allows. */
.kmx-story__video {
    transform: none !important;
    image-rendering: auto;
}

@media (max-width: 1024px) {
    .kmx-panel--story .kmx-story__copy {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Mobile/tablet stories are video/image backgrounds: always force readable white copy. */
    .kmx-panel--light .kmx-story__eyebrow,
    .kmx-panel--light .kmx-story h2,
    .kmx-panel--light .kmx-story__lead,
    .kmx-panel--light .kmx-story__features,
    .kmx-panel--light .kmx-story__cta {
        color: #ffffff !important;
    }
    .kmx-panel--light .kmx-story__features li {
        border-color: rgba(255,255,255,.34) !important;
        background: rgba(4,17,21,.20) !important;
    }
    .kmx-panel--light .kmx-story__cta {
        border-color: rgba(255,255,255,.72) !important;
    }
    .kmx-story__image {
        object-position: center center;
    }
}

/* ============================================================
   v2.2.0 — isti UX na svim ekranima + pouzdani touch CTA
   ============================================================ */
.kmx-story__cta,
body.kmx-active .kmx-hero .elementor-button,
body.kmx-active a[data-kmx-contact-link="true"] {
    position: relative;
    z-index: 30;
    pointer-events: auto !important;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

/* Na touch uređajima vizual nikada ne smije presresti CTA iznad njega. */
@media (max-width: 1024px) {
    .kmx-story__visual,
    .kmx-story__visual-shade {
        pointer-events: none !important;
    }
    .kmx-story__copy {
        pointer-events: auto !important;
    }
}


/* ============================================================
   v2.3.0 — isti snap UX na svim uređajima, kompaktan kontakt,
   pouzdani mobilni CTA i normalna 1x brzina videa
   ============================================================ */

/* Hero CTA mora biti iznad svih Elementor overlay slojeva i stvarno klikabilan. */
body.kmx-active .kmx-hero .elementor-element-f25be47,
body.kmx-active .kmx-hero .elementor-element-f25be47 .elementor-widget-container,
body.kmx-active .kmx-hero .elementor-element-f25be47 .elementor-button {
    position: relative !important;
    z-index: 80 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
}
body.kmx-active .kmx-hero::before,
body.kmx-active .kmx-hero::after,
body.kmx-active .kmx-hero .elementor-background-overlay,
body.kmx-active .kmx-hero .elementor-background-video-container {
    pointer-events: none !important;
}

/* Kontakt je jedan slajd. Nikakav unutarnji scrollbar na desktopu/tabletu/mobitelu. */
.kmx-panel--contact,
.kmx-panel--contact .kmx-panel__sticky {
    height: 100svh !important;
    min-height: 100svh !important;
    overflow: hidden !important;
}
.kmx-contact {
    height: 100svh !important;
    max-height: 100svh !important;
    overflow: hidden !important;
}
.kmx-field textarea {
    resize: none !important;
}

/* Desktop i veći tablet: zadrži isti izgled, ali stisni vertikalni ritam da sve stane. */
@media (min-width: 783px) {
    .kmx-contact {
        padding-top: clamp(62px, 8.2svh, 94px) !important;
        padding-bottom: clamp(24px, 3.8svh, 46px) !important;
        gap: clamp(28px, 4.5vw, 70px) !important;
    }
    .kmx-contact__intro > p {
        margin: clamp(12px, 1.8svh, 20px) 0 !important;
        line-height: 1.5 !important;
    }
    .kmx-contact__channels {
        margin-top: clamp(14px, 2.2svh, 24px) !important;
    }
    .kmx-contact__channels a { min-height: clamp(38px, 5.4svh, 46px) !important; }
    .kmx-contact-form {
        gap: clamp(10px, 1.45svh, 16px) clamp(14px, 1.7vw, 24px) !important;
        padding: clamp(18px, 2.4vw, 34px) !important;
    }
    .kmx-field label { margin-bottom: 5px !important; }
    .kmx-field input,
    .kmx-field textarea { padding-top: 6px !important; padding-bottom: 7px !important; }
    .kmx-field textarea { min-height: clamp(58px, 8.5svh, 78px) !important; }
    .kmx-contact-form__actions button { min-height: 44px !important; }
}

/* Mobitel: isti sadržaj, ali kompaktno posložen u jednom viewportu. */
@media (max-width: 782px) {
    .kmx-contact {
        width: 100% !important;
        max-width: none !important;
        padding:
            max(58px, calc(env(safe-area-inset-top) + 48px))
            max(16px, env(safe-area-inset-right))
            max(118px, calc(env(safe-area-inset-bottom) + 102px))
            max(16px, env(safe-area-inset-left)) !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: auto minmax(0, 1fr) !important;
        align-content: center !important;
        align-items: center !important;
        justify-items: stretch !important;
        gap: clamp(10px, 1.8svh, 16px) !important;
        text-align: center !important;
    }

    .kmx-contact__intro {
        width: 100% !important;
        max-width: 620px !important;
        margin: 0 auto !important;
    }
    .kmx-contact__intro > .kmx-panel__number {
        margin: 0 0 clamp(5px, .8svh, 8px) !important;
        font-size: 8px !important;
        line-height: 1 !important;
    }
    .kmx-contact__intro > p {
        max-width: 42ch !important;
        margin: 0 auto !important;
        font-size: clamp(10px, 2.9vw, 13px) !important;
        line-height: 1.35 !important;
    }
    .kmx-contact__channels {
        width: min(100%, 520px) !important;
        margin: clamp(8px, 1.3svh, 12px) auto 0 !important;
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        border-top: 1px solid rgba(255,255,255,.16) !important;
    }
    .kmx-contact__channels a {
        min-height: 30px !important;
        padding: 0 7px !important;
        justify-content: center !important;
        border-bottom: 1px solid rgba(255,255,255,.16) !important;
        border-right: 1px solid rgba(255,255,255,.12) !important;
        font-size: clamp(8px, 2.35vw, 10px) !important;
        letter-spacing: .05em !important;
        white-space: nowrap !important;
    }
    .kmx-contact__channels a:last-child { border-right: 0 !important; }
    .kmx-contact__channels a b { display: none !important; }

    .kmx-contact-form {
        width: min(100%, 620px) !important;
        max-width: 620px !important;
        min-height: 0 !important;
        margin: 0 auto !important;
        padding: clamp(10px, 1.8svh, 14px) 12px !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
        gap: clamp(6px, .95svh, 9px) 10px !important;
        align-self: center !important;
    }
    .kmx-field--full { grid-column: 1 / -1 !important; }
    .kmx-field label {
        margin-bottom: 3px !important;
        font-size: 7.5px !important;
        line-height: 1.1 !important;
        letter-spacing: .08em !important;
    }
    .kmx-field input,
    .kmx-field textarea {
        padding: 4px 0 5px !important;
        font-size: 13px !important;
        line-height: 1.25 !important;
    }
    .kmx-field input { min-height: 31px !important; }
    .kmx-field textarea {
        min-height: clamp(46px, 7.2svh, 60px) !important;
        max-height: clamp(46px, 7.2svh, 60px) !important;
    }
    .kmx-consent {
        gap: 7px !important;
        font-size: 8px !important;
        line-height: 1.25 !important;
        text-align: left !important;
    }
    .kmx-contact-form__actions {
        grid-template-columns: minmax(118px, .65fr) minmax(0, 1fr) !important;
        gap: 8px !important;
    }
    .kmx-contact-form__actions button {
        width: auto !important;
        min-height: 36px !important;
        padding: 0 11px !important;
        font-size: 8px !important;
        gap: 10px !important;
    }
    .kmx-contact-form__status {
        min-height: 0 !important;
        font-size: 9px !important;
        line-height: 1.25 !important;
        text-align: left !important;
    }
}

/* Vrlo niski mobiteli: dodatno zbijanje bez unutarnjeg scrolla. */
@media (max-width: 782px) and (max-height: 680px) {
    .kmx-contact {
        padding-top: max(48px, calc(env(safe-area-inset-top) + 40px)) !important;
        padding-bottom: max(104px, calc(env(safe-area-inset-bottom) + 90px)) !important;
        gap: 7px !important;
    }
    .kmx-contact__intro > p { font-size: 10px !important; line-height: 1.28 !important; }
    .kmx-contact__channels { margin-top: 6px !important; }
    .kmx-contact__channels a { min-height: 26px !important; font-size: 7.5px !important; }
    .kmx-contact-form { padding: 8px 10px !important; gap: 5px 8px !important; }
    .kmx-field label { font-size: 7px !important; }
    .kmx-field input { min-height: 27px !important; font-size: 12px !important; }
    .kmx-field textarea { min-height: 40px !important; max-height: 40px !important; font-size: 12px !important; }
    .kmx-consent { font-size: 7.3px !important; }
    .kmx-contact-form__actions button { min-height: 32px !important; }
}


/* ============================================================
   v2.4.0 — mobilni 1 gesture = 1 page + puna transition animacija
   ============================================================ */
@media (max-width: 1024px) {
    /* Vertikalno pomicanje vodi KMX slider; browser ne smije paralelno odvući
       dokument između dva gesture eventa. Tap, horizontalni gesture i pinch ostaju. */
    body.kmx-active .kmx-snap-slide {
        touch-action: pan-x pinch-zoom;
        overscroll-behavior-y: none;
    }

    body.kmx-active input,
    body.kmx-active textarea,
    body.kmx-active button,
    body.kmx-active a {
        touch-action: manipulation;
    }

    /* Na manjim ekranima veil je malo jači kako bi prijelaz bio jednako vidljiv
       kao na desktopu, a ne izgledao kao trenutni skok. */
    .kmx-slide-transition__veil {
        background: linear-gradient(180deg, rgba(4,19,24,0) 0%, rgba(4,19,24,.88) 46%, rgba(4,19,24,.16) 62%, rgba(4,19,24,0) 100%);
    }
    .kmx-slide-transition__line {
        height: 2px;
        box-shadow: 0 0 26px rgba(255,255,255,.58);
    }

    .kmx-story__video,
    .kmx-hero video,
    .kmx-hero .elementor-background-video-hosted {
        animation-duration: initial !important;
        playback-rate: 1; /* dokumentacijski marker; stvarnu brzinu postavlja JS */
    }
}

/* v2.5.0 — iOS loader failsafe. Čak i ako neki third-party JS ne dođe do window.load,
   dekorativni početni loader ne smije zaključati web. */
body.kmx-active #km-loader {
    animation: kmx-loader-emergency-hide .01s linear 2.4s forwards !important;
}
@keyframes kmx-loader-emergency-hide {
    to { opacity:0 !important; visibility:hidden !important; pointer-events:none !important; }
}


/* v2.6.1 — pet stavki hamburger menija mora ostati dostupno na svakom viewportu. */
.kmx-menu__inner {
    max-height: 100dvh;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: none;
}
.kmx-menu__inner::-webkit-scrollbar { display: none; }
@media (max-width: 782px) {
    .kmx-menu__inner {
        min-height: 100%;
        padding-top: clamp(72px, 10svh, 96px);
        padding-bottom: max(20px, env(safe-area-inset-bottom));
    }
    .kmx-menu__primary a {
        min-height: clamp(54px, 9.4svh, 70px);
    }
}

/* ============================================================
   v2.7.3 — desktop-only proportion refinement
   More generous editorial copy + larger media panel.
   Tablet/mobile (<=1024px) intentionally unchanged.
   ============================================================ */
@media (min-width: 1025px) {
    .kmx-story {
        width: min(1580px, 100%);
        padding-top: clamp(84px, 9vh, 112px);
        padding-right: clamp(42px, 4.2vw, 72px);
        padding-bottom: clamp(42px, 5.5vh, 68px);
        padding-left: clamp(112px, 8.7vw, 154px);
        grid-template-columns: minmax(0, 1.12fr) minmax(390px, .88fr);
        gap: clamp(44px, 4.8vw, 82px);
    }

    .kmx-panel--story .kmx-story__copy {
        max-width: 850px;
        padding-left: clamp(48px, 3.6vw, 66px);
        padding-right: clamp(8px, 1vw, 18px);
    }

    .kmx-panel--story .kmx-story h2 {
        max-width: 12.2ch;
        font-size: clamp(58px, min(5.8vw, 9.8vh), 104px);
        line-height: .93;
    }

    .kmx-story__lead {
        max-width: 61ch;
        font-size: clamp(16px, 1.08vw, 19px);
        line-height: 1.62;
    }

    .kmx-story__features {
        max-width: 760px;
    }

    .kmx-story__visual {
        width: min(100%, clamp(400px, 32vw, 560px));
        height: clamp(540px, 76vh, 820px);
    }
}

@media (min-width: 1440px) {
    .kmx-story {
        width: min(1640px, 100%);
        grid-template-columns: minmax(0, 1.08fr) minmax(440px, .92fr);
    }

    .kmx-panel--story .kmx-story__copy {
        max-width: 900px;
    }

    .kmx-story__visual {
        width: min(100%, clamp(500px, 33vw, 600px));
        height: clamp(580px, 78vh, 850px);
    }
}

/* ============================================================
   v2.7.4 — desktop-only contact proportion refinement
   Tablet/mobile (<=1024px) intentionally unchanged.
   ============================================================ */
@media (min-width: 1025px) {
    .kmx-contact {
        width: min(1580px, 100%) !important;
        padding-left: clamp(112px, 8vw, 148px) !important;
        padding-right: clamp(48px, 4.2vw, 78px) !important;
        grid-template-columns: minmax(340px, .82fr) minmax(560px, 1.18fr) !important;
        gap: clamp(54px, 5vw, 88px) !important;
    }

    .kmx-contact__intro {
        max-width: 560px;
    }

    .kmx-contact__intro > p {
        max-width: 54ch !important;
        font-size: clamp(15px, 1.02vw, 18px) !important;
    }

    .kmx-contact__channels {
        max-width: 560px;
    }

    .kmx-contact-form {
        width: 100% !important;
        min-width: 0;
        min-height: clamp(390px, 49vh, 500px);
        padding: clamp(28px, 2.8vw, 42px) !important;
        gap: clamp(14px, 1.7vh, 20px) clamp(22px, 2vw, 32px) !important;
        align-content: center;
    }

    .kmx-field input,
    .kmx-field textarea {
        font-size: clamp(16px, 1vw, 18px) !important;
    }

    .kmx-field textarea {
        min-height: clamp(90px, 12vh, 122px) !important;
        max-height: none !important;
    }

    .kmx-contact-form__actions button {
        min-height: 50px !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

@media (min-width: 1440px) {
    .kmx-contact {
        width: min(1640px, 100%) !important;
        grid-template-columns: minmax(390px, .8fr) minmax(650px, 1.2fr) !important;
    }
    .kmx-contact-form {
        min-height: clamp(420px, 52vh, 530px);
    }
}

/* ============================================================
   v3.0.0 — Elementor is the source of truth for every service/contact slide.
   The same widget markup is used inside Elementor and on the live homepage.
   ============================================================ */

/* Elementor builder wrappers must never constrain a fullscreen KMX slide. */
#kmx-experience.kmx-experience--elementor > .elementor,
#kmx-experience.kmx-experience--elementor .elementor[data-elementor-type="wp-page"],
#kmx-experience.kmx-experience--elementor .e-con.e-parent,
body.kmx-section-preview-page .elementor,
body.kmx-section-preview-page .elementor > .e-con.e-parent,
body.kmx-section-preview-page .elementor .e-con.e-parent {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
}

#kmx-experience .elementor-widget-kmx-story-section,
#kmx-experience .elementor-widget-kmx-contact-section,
#kmx-experience .elementor-widget-kmx-story-section > .elementor-widget-container,
#kmx-experience .elementor-widget-kmx-contact-section > .elementor-widget-container,
body.kmx-section-preview-page .elementor-widget-kmx-story-section,
body.kmx-section-preview-page .elementor-widget-kmx-contact-section,
body.kmx-section-preview-page .elementor-widget-kmx-story-section > .elementor-widget-container,
body.kmx-section-preview-page .elementor-widget-kmx-contact-section > .elementor-widget-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* The visual Elementor editor should show the actual finished slide, not its
   pre-animation hidden state. The homepage still uses JS animation variables. */
body.kmx-section-preview-page {
    margin: 0 !important;
    overflow-x: hidden !important;
    background: #06151a !important;
}
body.kmx-section-preview-page .kmx-panel {
    --kmx-scale-x: 1 !important;
    --kmx-scale-y: 1 !important;
    --kmx-rotate-x: 0deg !important;
    --kmx-rotate-y: 0deg !important;
    --kmx-depth: 0 !important;
    --kmx-title-y: 0px !important;
    --kmx-opacity: 1 !important;
    --kmx-bg-y: 0px !important;
    --kmx-dim: 0 !important;
    --kmx-blur: 0px !important;
}
body.kmx-section-preview-page .kmx-panel__sticky {
    transform: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Rich-text controls render a <p> inside these editable blocks. Keep the
   original typography and spacing exactly the same. */
.kmx-story__lead > p,
.kmx-contact__copy > p {
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    font: inherit !important;
    line-height: inherit !important;
}
.kmx-contact__copy {
    margin: clamp(18px,3vh,30px) 0;
    max-width: 48ch;
    color: rgba(246,240,230,.72);
    font: 400 clamp(14px,1.1vw,17px)/1.65 Arial,sans-serif;
}

@media (max-width: 1024px) {
    .kmx-contact__copy {
        margin: 14px 0 18px !important;
        font-size: 14px !important;
        line-height: 1.5 !important;
    }
}
@media (max-width: 767px) {
    .kmx-contact__copy {
        margin: 14px 0 !important;
        line-height: 1.45 !important;
    }
}

/* Elementor editor selection outlines must remain usable above the slide. */
body.kmx-section-preview-page.elementor-editor-active .elementor-element-edit-mode {
    z-index: 20;
}
@media (min-width: 1025px) {
    .kmx-contact__copy {
        max-width: 54ch !important;
        font-size: clamp(15px, 1.02vw, 18px) !important;
    }
}

/* ============================================================
   v3.0.1 — cleaner viewport + desktop text safety lane.
   Scroll still works with mouse wheel, touchpad, keyboard and touch; only the
   browser's visible scrollbar is hidden. Service/contact copy is nudged right
   so it stays clear of the fixed lower-left section navigation.
   ============================================================ */

/* Hide the page scrollbar without disabling scrolling. */
html,
body.kmx-active {
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}

html::-webkit-scrollbar,
body.kmx-active::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
}

/* The contact slide has its own scroll container on smaller screens. */
.kmx-contact {
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}
.kmx-contact::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
}

/* Desktop: create a little more breathing room between copy and the fixed
   lower-left navigation. Media stays where it is; only the copy moves right. */
@media (min-width: 1025px) {
    .kmx-panel--story .kmx-story__copy {
        padding-left: clamp(88px, 5.8vw, 112px) !important;
    }

    .kmx-contact__intro {
        padding-left: clamp(38px, 3vw, 54px) !important;
        box-sizing: border-box !important;
    }
}


/* ============================================================
   v3.1.3 — performance bez promjene efekta.
   Samo dva slajda koja stvarno sudjeluju u prijelazu dobivaju compositor hintove.
   Prijašnja body.kmx-is-animating pravila promovirala su sve fullscreen slajdove
   i njihove velike video layere odjednom, što je posebno skupo na mobitelima.
   ============================================================ */
.kmx-snap-slide.kmx-transitioning .elementor-background-video-container,
.kmx-snap-slide.kmx-transitioning > video,
.kmx-snap-slide.kmx-transitioning .kmx-hero-copy,
.kmx-snap-slide.kmx-transitioning .kmx-panel__sticky,
.kmx-snap-slide.kmx-transitioning .kmx-panel__texture,
.kmx-snap-slide.kmx-transitioning .kmx-panel__shade,
.kmx-snap-slide.kmx-transitioning .kmx-panel__content,
.kmx-snap-slide.kmx-transitioning .kmx-panel__ghost,
.kmx-snap-slide.kmx-transitioning .kmx-story__copy,
.kmx-snap-slide.kmx-transitioning .kmx-story__visual {
    will-change: transform, opacity, filter;
}

/* Strelica je i dalje u donjem desnom kutu. Na vrlo niskim/wide viewportima
   podižemo je iz donje sistemske/AI overlay zone bez ulaska u tekstualni layout. */
@media (max-height: 720px) {
    .kmx-home-trigger {
        bottom: max(88px, calc(env(safe-area-inset-bottom) + 88px));
    }
}

/* ============================================================
   v3.3.0 — modern motion/performance + responsive safety pass
   ============================================================ */
:root {
    --kmx-duration: 460ms;
    --kmx-viewport-height: 100svh;
}

/* Keep the fullscreen start page stable while mobile browser chrome expands/collapses.
   Desktop can use dvh safely; phone/tablet retain svh so the first screen does not jump. */
@media (min-width: 1025px) {
    @supports (height: 100dvh) {
        :root { --kmx-viewport-height: 100dvh; }
    }
}

body.kmx-active {
    overscroll-behavior-y: none;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* Use one viewport token everywhere that matters. This avoids mobile browser-bar
   jumps while retaining svh as a safe fallback. */
body.kmx-active .kmx-hero,
body.kmx-active .kmx-panel,
body.kmx-active .kmx-panel__sticky,
body.kmx-active .kmx-story,
body.kmx-active .kmx-contact,
body.kmx-active .kmx-hero > .elementor-background-video-container,
body.kmx-active .kmx-hero .elementor-background-video-container {
    min-height: var(--kmx-viewport-height) !important;
}
body.kmx-active .kmx-hero,
body.kmx-active .kmx-panel,
body.kmx-active .kmx-panel__sticky,
body.kmx-active .kmx-story,
body.kmx-active .kmx-contact {
    height: var(--kmx-viewport-height) !important;
}

/* Motion stays cinematic but avoids live blur on fullscreen/video surfaces. */
.kmx-hero .elementor-background-video-container,
.kmx-hero > video,
.kmx-hero .kmx-hero-copy,
.kmx-panel__content,
.kmx-story__copy,
.kmx-story__visual {
    filter: none !important;
}

.kmx-snap-slide.kmx-transitioning .elementor-background-video-container,
.kmx-snap-slide.kmx-transitioning > video,
.kmx-snap-slide.kmx-transitioning .kmx-hero-copy,
.kmx-snap-slide.kmx-transitioning .kmx-panel__sticky,
.kmx-snap-slide.kmx-transitioning .kmx-panel__texture,
.kmx-snap-slide.kmx-transitioning .kmx-panel__shade,
.kmx-snap-slide.kmx-transitioning .kmx-panel__content,
.kmx-snap-slide.kmx-transitioning .kmx-panel__ghost,
.kmx-snap-slide.kmx-transitioning .kmx-story__copy,
.kmx-snap-slide.kmx-transitioning .kmx-story__visual {
    will-change: transform, opacity;
}

/* Same loop idea, cheaper compositor path. */
@keyframes kmxLoopPanelOut {
    from { transform:perspective(1200px) rotateX(0deg) scaleX(1) scaleY(1); opacity:1; border-radius:0; }
    to { transform:perspective(1200px) rotateX(var(--kmx-loop-angle)) scaleX(.70) scaleY(.88); opacity:.08; border-radius:18px; }
}
@keyframes kmxLoopPanelIn {
    from { transform:perspective(1200px) rotateX(calc(var(--kmx-loop-angle) * -1)) scaleX(.70) scaleY(.88); opacity:.08; border-radius:18px; }
    to { transform:perspective(1200px) rotateX(0deg) scaleX(1) scaleY(1); opacity:1; border-radius:0; }
}
@keyframes kmxLoopHeroOut {
    from { transform:perspective(1200px) rotateX(0deg) scaleX(1) scaleY(1); opacity:1; }
    to { transform:perspective(1200px) rotateX(var(--kmx-loop-angle)) scaleX(.70) scaleY(.88); opacity:.08; }
}
@keyframes kmxLoopHeroIn {
    from { transform:perspective(1200px) rotateX(calc(var(--kmx-loop-angle) * -1)) scaleX(.70) scaleY(.88); opacity:.08; }
    to { transform:perspective(1200px) rotateX(0deg) scaleX(1) scaleY(1); opacity:1; }
}
.kmx-panel.kmx-loop-out .kmx-panel__sticky,
.kmx-panel.kmx-loop-in .kmx-panel__sticky,
.kmx-hero.kmx-loop-out .elementor-background-video-container,
.kmx-hero.kmx-loop-out > video,
.kmx-hero.kmx-loop-out .kmx-hero-copy,
.kmx-hero.kmx-loop-in .elementor-background-video-container,
.kmx-hero.kmx-loop-in > video,
.kmx-hero.kmx-loop-in .kmx-hero-copy {
    animation-duration: 300ms;
}

/* Keep the top-right control in a dedicated safe lane on every device. */
.kmx-menu-trigger {
    right: max(clamp(16px, 2.8vw, 48px), env(safe-area-inset-right)) !important;
    isolation: isolate;
}
body.kmx-menu-open .kmx-menu-trigger { z-index: 100030; }

/* Widescreen: move the framed media composition left instead of pushing the menu
   into the edge. The video moves with its frame. */
@media (min-width: 1280px) {
    .kmx-story {
        padding-right: clamp(88px, 7vw, 138px) !important;
    }
    .kmx-story__visual {
        transform:
            translate3d(calc((var(--kmx-title-y) * -.22) - clamp(30px, 2.6vw, 56px)), 0, 0)
            scale(calc(1 - (var(--kmx-depth) * .055))) !important;
    }
    body.kmx-active .kmx-hero .elementor-background-video-hosted,
    body.kmx-active .kmx-hero .elementor-background-video-container video {
        object-position: 47% center !important;
    }
}

@media (min-width: 1720px) {
    .kmx-story__visual {
        transform:
            translate3d(calc((var(--kmx-title-y) * -.22) - clamp(48px, 3vw, 72px)), 0, 0)
            scale(calc(1 - (var(--kmx-depth) * .05))) !important;
    }
}

/* Tablet: retain the full-bleed visual but keep controls/copy inside safe areas. */
@media (min-width: 768px) and (max-width: 1024px) {
    .kmx-menu-trigger {
        top: max(16px, calc(env(safe-area-inset-top) + 12px)) !important;
        right: max(20px, calc(env(safe-area-inset-right) + 12px)) !important;
    }
    .kmx-story {
        padding-left: max(34px, env(safe-area-inset-left)) !important;
        padding-right: max(34px, env(safe-area-inset-right)) !important;
    }
    .kmx-story__visual {
        transform: scale(calc(1.018 - (var(--kmx-depth) * .022))) !important;
    }
    .kmx-story__video,
    .kmx-story__image { object-position: center center; }
}

/* Mobile: smaller motion amplitude, stable viewport, and protected touch controls. */
@media (max-width: 767px) {
    .kmx-menu-trigger {
        right: max(14px, calc(env(safe-area-inset-right) + 8px)) !important;
    }
    .kmx-story__visual {
        transform: scale(calc(1.012 - (var(--kmx-depth) * .018))) !important;
    }
    .kmx-story__video,
    .kmx-story__image {
        transform: none !important;
        object-position: center center !important;
    }
    .kmx-story__cta,
    body.kmx-active .kmx-hero .elementor-button,
    .kmx-menu-trigger,
    .kmx-home-trigger {
        touch-action: manipulation;
    }
}

/* Accessibility and weak-device escape hatch: no forced cinematic motion when the
   operating system explicitly requests reduced motion. */
@media (prefers-reduced-motion: reduce) {
    .kmx-slide-transition,
    .kmx-panel.kmx-loop-out .kmx-panel__sticky,
    .kmx-panel.kmx-loop-in .kmx-panel__sticky,
    .kmx-hero.kmx-loop-out .elementor-background-video-container,
    .kmx-hero.kmx-loop-in .elementor-background-video-container,
    .kmx-hero.kmx-loop-out .kmx-hero-copy,
    .kmx-hero.kmx-loop-in .kmx-hero-copy {
        animation: none !important;
        transition-duration: 0.01ms !important;
    }
}