.journal{position:relative;background:var(--paper,#eeeae3);color:#19211b;padding:85px var(--gutter) 110px;border-radius:24px 24px 0 0;scroll-margin-top:0;overflow:clip;--arrow-active-fill:#19211b;--arrow-active-ink:#eeeae3}
.journal .section-meta{border-bottom:1px solid #19211b33;padding-bottom:28px;margin-bottom:65px}
.journal-head{display:flex;justify-content:space-between;align-items:flex-end;gap:55px;margin-bottom:50px}
.journal-head h2{font-size:clamp(46px,6.3vw,100px);font-weight:400;line-height:.98;letter-spacing:-.06em}
.journal-head>p{max-width:330px;font-size:clamp(24px,2.5vw,38px);line-height:1.18;color:#4a584a}
.journal-head,.journal-tools{opacity:0;transform:translateY(30px);transition:opacity .8s,transform 1s var(--motion-ease)}
.journal-head.is-visible,.journal-tools.is-visible{opacity:1;transform:none}
.journal-tools{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:40px;flex-wrap:wrap}
.journal-filters{display:flex;gap:10px;flex-wrap:wrap}
.journal-filters button,.journal-author select{border:1px solid #19211b55;border-radius:30px;background:transparent;color:inherit;padding:14px 23px;font:inherit;font-size:13px;cursor:pointer}
.journal-filters button[aria-pressed=true]{background:#19211b;color:#eeeae3}
.journal-author{display:flex;gap:12px;align-items:center;font-size:12px}.journal-author[hidden]{display:none}
.journal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:60px 36px}
.journal-card{min-width:0;color:inherit;opacity:0;transform:translateY(30px);transition:opacity .7s,transform .8s var(--motion-ease);display:block;padding-bottom:25px;border-bottom:1px solid #19211b44;text-decoration:none}
.journal-card.is-visible{opacity:1;transform:none}
.journal-cover{position:relative;aspect-ratio:1;overflow:hidden;background:#d6dccf;border-radius:9px;display:grid;place-items:center}
.journal-cover img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--motion-ease)}
.journal-card:is(:active,:focus-visible) .journal-cover img{transform:scale(1.05)}
.journal-cover-type{font-size:80px;font-family:Bradford,Georgia,serif;color:#51614d}
.journal-kind{position:absolute;left:16px;top:16px;border-radius:24px;padding:7px 13px;font-size:11px;background:#19211bd9;color:#eeeae3}
.journal-byline{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:11px;color:#667260;margin:23px 0 15px;line-height:1.5}
.journal-card-title{display:flex;gap:20px;justify-content:space-between;align-items:flex-start}
.journal-card h3{font-size:clamp(23px,2vw,31px);font-weight:400;line-height:1.13;letter-spacing:-.035em;overflow-wrap:anywhere}
.journal-card-title>span{display:grid;place-items:center;width:36px;height:36px;flex:0 0 36px;border:1px solid #19211b55;border-radius:9px;font-size:21px;transition:background .3s,color .3s}
.journal-card>p{font-size:13px;line-height:1.7;color:#667260;margin-top:16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.journal-empty{padding:65px 0 15px;max-width:650px}.journal-empty[hidden]{display:none}
.journal-empty-line{display:block;width:90px;height:1px;background:#19211b77;margin-bottom:30px}
.journal-empty h3{font-size:clamp(28px,3.3vw,48px);font-weight:400;letter-spacing:-.045em;line-height:1.1;margin-bottom:16px}
.journal-empty p{font-size:14px;line-height:1.7;color:#667260}.journal-more{margin-top:50px}.journal-more[hidden]{display:none}
.journal-dialog{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;border:0;padding:0;background:var(--paper,#eeeae3);color:#19211b;overflow:auto;overscroll-behavior:contain}
.journal-dialog::backdrop{background:#19211bc9}
.journal-dialog-bar{position:sticky;top:0;z-index:4;padding:18px var(--gutter,30px);background:#eeeae3f5;backdrop-filter:blur(12px);border-bottom:1px solid #19211b33;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px}
.journal-dialog-bar .pill{background:#19211b;color:#eeeae3;min-height:48px;font:inherit;gap:20px;padding:12px 22px;border-radius:28px;border:1px solid #19211b;display:inline-flex;align-items:center;cursor:pointer}
.journal-reader{max-width:1300px;margin:auto;padding:70px var(--gutter,30px) 110px}
.journal-article-head{max-width:1000px;margin:0 auto 50px}.journal-article-meta{font-size:12px;color:#68745f;line-height:1.6;margin-bottom:30px}
.journal-reader h1{font-size:clamp(38px,5.8vw,84px);font-weight:400;line-height:1;letter-spacing:-.055em;overflow-wrap:anywhere;margin:0 0 30px}
.journal-lead{font-size:clamp(24px,2.6vw,36px);line-height:1.25;max-width:780px;color:#4a584a}
.journal-hero{display:block;width:100%;max-height:670px;object-fit:cover;border-radius:9px;margin:0 auto 60px}
.journal-article-body{max-width:740px;margin:auto;font-size:17px;line-height:1.85}
.journal-article-body p{margin:0 0 25px;overflow-wrap:anywhere}.journal-article-body h2{font-size:clamp(27px,3vw,40px);font-weight:400;line-height:1.1;letter-spacing:-.035em;margin:45px 0 24px}
.journal-article-body ul{padding-left:25px;margin:20px 0 30px}.journal-article-body li{margin:10px 0}.journal-article-body blockquote{font-family:Bradford,Georgia,serif;font-size:clamp(25px,3vw,40px);line-height:1.25;margin:40px 0;padding:25px 0 25px 25px;border-left:1px solid #64745c}
.journal-video{max-width:1000px;margin:0 auto 50px}.journal-video:empty{display:none}.journal-video video,.journal-video iframe{display:block;width:100%;aspect-ratio:16/9;border:0;background:#19211b;border-radius:9px}
.journal-play{display:grid;place-items:center;width:100%;aspect-ratio:16/9;border:1px solid #849277;border-radius:9px;background:#19211b;color:#eeeae3;font:inherit;font-size:25px;cursor:pointer}
.journal button:focus-visible,.journal a:focus-visible,.journal select:focus-visible,.journal-dialog button:focus-visible{outline:2px solid currentColor;outline-offset:5px}
@media(hover:hover){.journal-card:hover .journal-cover img{transform:scale(1.07)}.journal-card:hover .journal-card-title>span{background:#19211b;color:#eeeae3}}
@media(max-width:1099px){.journal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.journal-head{gap:35px}}
@media(max-width:700px){.journal{padding-top:60px;padding-bottom:70px;border-radius:20px 20px 0 0}.journal .section-meta{align-items:flex-start;gap:20px;margin-bottom:40px}.journal .section-meta span:last-child{text-align:right;max-width:140px;line-height:1.6}.journal-head{display:block;margin-bottom:35px}.journal-head h2{font-size:clamp(44px,12vw,65px)}.journal-head>p{font-size:28px;margin-top:30px;max-width:310px}.journal-grid{grid-template-columns:1fr;gap:50px}.journal-tools{gap:20px}.journal-author{width:100%;justify-content:space-between}.journal-author select{max-width:230px;min-width:0}.journal-filters button{padding:12px 20px}.journal-card h3{font-size:27px}.journal-dialog-bar{padding:14px 20px}.journal-dialog-bar>span{font-size:9px;max-width:85px}.journal-dialog-bar .pill{padding:10px 16px;gap:12px;font-size:11px}.journal-reader{padding:45px 22px 80px}.journal-article-body{font-size:16px;line-height:1.8}.journal-hero{margin-bottom:35px;max-height:440px}.journal-article-meta{font-size:11px}.journal-empty{padding-top:35px}}
@media(prefers-reduced-motion:reduce){.journal-card,.journal-head,.journal-tools{opacity:1;transform:none;transition:none}.journal-cover img{transition:none}}

/* ux-162 (Claude, 7. 11. 2026): automatické rozloženie bez hluchých miest + animácia veľkej karty (journal.js). */
@media(min-width:1100px){.journal-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.journal-grid>.journal-card{grid-column:span 2}.journal-grid>.journal-card.is-half{grid-column:span 3}}
@media(min-width:701px){
 .journal-grid>.journal-card.is-half .journal-cover{aspect-ratio:16/10}
 .journal-grid>.journal-card.is-feature{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);grid-template-rows:auto auto auto 1fr;column-gap:clamp(36px,5vw,84px);align-content:center;padding-bottom:34px}
 .journal-card.is-feature .journal-cover{grid-row:1/-1;aspect-ratio:16/11;border-radius:14px;align-self:start}
 .journal-card.is-feature .journal-byline{align-self:end;margin-top:clamp(8px,3vw,40px);padding-bottom:6px;border-bottom:1px solid #19211b2b;position:relative}
 .journal-card.is-feature .journal-byline::after{content:'';position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:#b9a273;transform-origin:left;transform:scaleX(var(--jl-line,1));transition:transform 1.2s .9s cubic-bezier(.22,.72,.16,1)}
 .journal-card.is-feature .journal-card-title{margin-top:22px}
 .journal-card.is-feature h3{font-size:clamp(34px,3.6vw,58px);line-height:1.02;letter-spacing:-.05em}
 .journal-card.is-feature .journal-card-title>span{width:52px;height:52px;flex-basis:52px;border-radius:14px}
 .journal-card.is-feature>p{grid-column:2;align-self:start;font-size:15px;line-height:1.75;margin-top:22px;-webkit-line-clamp:6;max-width:58ch}
 .journal-card.is-feature::after{content:'Čítať celý príbeh →';grid-column:2;align-self:start;margin-top:22px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#19211b;transition:opacity .8s .85s,transform .9s .85s cubic-bezier(.22,.72,.16,1)}
 .journal-card.is-feature:not(.is-visible)::after{opacity:0;transform:translateY(16px)}
 .journal-card.is-feature .journal-cover img{animation:jl-drift 16s ease-in-out infinite alternate}
 /* animácia pri zobrazení */
 .journal-card.is-feature:not(.is-visible){opacity:1;transform:none;--jl-line:0}
 .journal-card.is-feature .journal-cover{clip-path:inset(0 0 0 0 round 14px);transition:clip-path 1.3s cubic-bezier(.77,0,.18,1)}
 .journal-card.is-feature:not(.is-visible) .journal-cover{clip-path:inset(0 100% 0 0 round 14px)}
 .journal-card.is-feature .journal-byline,.journal-card.is-feature .journal-card-title,.journal-card.is-feature>p{transition:opacity .8s,transform .9s cubic-bezier(.22,.72,.16,1)}
 .journal-card.is-feature .journal-byline{transition-delay:.45s}.journal-card.is-feature .journal-card-title{transition-delay:.58s}.journal-card.is-feature>p{transition-delay:.72s}
 .journal-card.is-feature:not(.is-visible) .journal-byline,.journal-card.is-feature:not(.is-visible) .journal-card-title,.journal-card.is-feature:not(.is-visible)>p{opacity:0;transform:translateY(22px)}
}
@media(hover:hover) and (min-width:701px){.journal-card.is-feature:hover .journal-cover img{animation-play-state:paused}.journal-card.is-feature:hover::after{text-decoration:underline;text-underline-offset:4px}}
@keyframes jl-drift{from{transform:scale(1.02) translate(0,0)}to{transform:scale(1.08) translate(-1.5%,-1%)}}
@media(prefers-reduced-motion:reduce){.journal-card.is-feature .journal-cover img{animation:none}.journal-card.is-feature .journal-cover,.journal-card.is-feature:not(.is-visible) .journal-cover{clip-path:none;transition:none}.journal-card.is-feature:not(.is-visible) .journal-byline,.journal-card.is-feature:not(.is-visible) .journal-card-title,.journal-card.is-feature:not(.is-visible)>p{opacity:1;transform:none}}

/* ux-165 (Claude, 7. 11. 2026): nový názov „Zo zákulisia realít.“, bežiaci pás tém, odhalenie kariet, kruh pri myši. */
.journal-head h2 .jl-line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.journal-head h2 .jl-line>span{display:inline-block;transform:translateY(108%);transition:transform 1.15s cubic-bezier(.22,.72,.16,1)}
.journal-head h2 .jl-line+.jl-line>span{transition-delay:.14s}
.journal-head.is-visible h2 .jl-line>span{transform:none}
.journal-head h2 .jl-accent{position:relative;font-family:Bradford,Georgia,serif;letter-spacing:-.045em}
.journal-head h2 .jl-accent::after{content:'';position:absolute;left:.02em;right:.08em;bottom:.04em;height:.05em;min-height:2px;border-radius:2px;background:#b9a273;transform:scaleX(0);transform-origin:left;transition:transform 1.1s .85s cubic-bezier(.22,.72,.16,1)}
.journal-head.is-visible h2 .jl-accent::after{transform:scaleX(1)}
.journal-head>p{transition:opacity .9s .5s,transform 1s .5s cubic-bezier(.22,.72,.16,1)}
.journal-head:not(.is-visible)>p{opacity:0;transform:translateY(16px)}
.journal-marquee{margin:0 calc(var(--gutter,30px)*-1) 42px;padding:18px 0;border-block:1px solid #19211b24;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.journal-marquee-track{display:flex;width:max-content;animation:jl-marquee 46s linear infinite}
.journal-marquee-track>div{display:flex;align-items:center;flex:0 0 auto}
.journal-marquee span{font-family:Bradford,Georgia,serif;font-size:clamp(22px,2.3vw,34px);letter-spacing:-.03em;color:#2e3a31;white-space:nowrap;padding:0 26px}
.journal-marquee i{font-style:normal;font-size:clamp(12px,1vw,15px);color:#b9a273}
.journal-marquee:hover .journal-marquee-track{animation-play-state:paused}
@keyframes jl-marquee{to{transform:translateX(-50%)}}
.journal-grid>.journal-card:not(.is-feature) .journal-cover{clip-path:inset(0 0 0 0 round 9px);transition:clip-path 1.15s cubic-bezier(.77,0,.18,1) var(--jl-d,0s)}
.journal-grid>.journal-card:not(.is-feature):not(.is-visible) .journal-cover{clip-path:inset(100% 0 0 0 round 9px)}
.journal-grid>.journal-card{transition-delay:var(--jl-d,0s)}
.journal-cursor{position:absolute;left:0;top:0;z-index:6;width:94px;height:94px;margin:-47px 0 0 -47px;display:grid;place-items:center;border-radius:50%;background:#19211b;color:#eeeae3;font-size:11px;letter-spacing:.14em;text-transform:uppercase;pointer-events:none;scale:0;transition:scale .4s cubic-bezier(.22,.72,.16,1);box-shadow:0 14px 30px #19211b33}
.journal-cursor.is-on{scale:1}
.journal-cursor::before{content:'';position:absolute;inset:6px;border:1px solid #d9c9a366;border-radius:50%}
@media(max-width:700px){.journal-marquee{margin-bottom:30px;padding:13px 0}.journal-marquee span{padding:0 16px}}
@media(prefers-reduced-motion:reduce){.journal-marquee-track{animation:none}.journal-head h2 .jl-line>span{transform:none;transition:none}.journal-head h2 .jl-accent::after{transform:scaleX(1);transition:none}.journal-head:not(.is-visible)>p{opacity:1;transform:none}.journal-grid>.journal-card:not(.is-feature) .journal-cover{clip-path:none;transition:none}}

/* ux-166 (Claude): kruh „Čítať / Pozrieť“ na dotykových zariadeniach. */
.journal-tap{position:absolute;right:16px;bottom:16px;z-index:2;width:78px;height:78px;display:grid;place-items:center;border-radius:50%;background:#19211b;color:#eeeae3;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;box-shadow:0 12px 26px #19211b40;scale:0;transition:scale .5s cubic-bezier(.34,1.56,.64,1);pointer-events:none}
.journal-tap::before{content:'';position:absolute;inset:5px;border:1px solid #d9c9a366;border-radius:50%}
.journal-card.is-centered .journal-tap{scale:1;animation:jl-tap-float 3.2s 0.6s ease-in-out infinite}
.journal-card:active .journal-tap{scale:.9}
@keyframes jl-tap-float{0%,100%{translate:0 0}50%{translate:0 -6px}}
@media(prefers-reduced-motion:reduce){.journal-tap{transition:none}.journal-card.is-centered .journal-tap{animation:none}}

/* ux-169 (Claude): vlog karta – hrací kruh na fotke, prehrávač s náhľadom z YouTube. */
.journal-card[data-kind=vlog] .journal-cover::after{content:'';position:absolute;left:50%;top:50%;width:clamp(58px,6vw,78px);aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:#19211bcc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6.5 18 12l-9 5.5Z' fill='%23eeeae3'/%3E%3C/svg%3E") 55% 50%/42% no-repeat;box-shadow:0 0 0 1px #eeeae359,0 12px 30px #0006;animation:jl-vlog-pulse 2.8s ease-in-out infinite;pointer-events:none;transition:scale .5s cubic-bezier(.22,.72,.16,1)}
.journal-card[data-kind=vlog]:hover .journal-cover::after{scale:1.1}
.journal-card[data-kind=vlog] .journal-kind{background:#b9a273;color:#19211b}
.journal-play{background-size:cover;background-position:center;text-shadow:0 2px 12px #0008}
@keyframes jl-vlog-pulse{0%,100%{box-shadow:0 0 0 1px #eeeae359,0 0 0 0 #eeeae340,0 12px 30px #0006}50%{box-shadow:0 0 0 1px #eeeae359,0 0 0 14px #eeeae300,0 12px 30px #0006}}
@media(prefers-reduced-motion:reduce){.journal-card[data-kind=vlog] .journal-cover::after{animation:none}}