/* Rudolf Baranovič – shared look for every page.
   BeBuilder blocks are hooked up by CSS classes set in Advanced → Custom → CSS classes:
   every section of ours carries "rb-s" plus its role (rb-hero, rb-band, rb-page-head …). */

:root{--rb-paper:#EFEBE4;--rb-ink:#141312;--rb-soft:#6B665F;--rb-line:#D4CDC2;--rb-dark:#0B0A09;--rb-on-dark:#EFEBE4;--rb-on-dark-soft:rgba(239,235,228,.7);
--rb-serif:"Fraunces",Georgia,serif;--rb-sans:"Inter",system-ui,sans-serif;--rb-gut:clamp(20px,5vw,80px)}

/* ---------- base: BeTheme chrome replaced by our nav/footer ---------- */
html:has(body.rb-site),body.rb-site{overflow-x:clip!important;overflow-y:visible!important}
body.rb-site{background:var(--rb-paper)!important;color:var(--rb-ink);font-family:var(--rb-sans);-webkit-font-smoothing:antialiased}
body.rb-site #Wrapper,body.rb-site #Content{background:transparent!important;padding:0!important}
body.rb-site h1,body.rb-site h2,body.rb-site h3{font-family:var(--rb-serif);font-weight:300;letter-spacing:-.02em;color:inherit;margin:0}
body.rb-site a{color:inherit}
body.rb-site ::selection{background:var(--rb-ink);color:var(--rb-paper)}

/* ---------- BeBuilder sections of ours: full width, no theme paddings ---------- */
.rb-s{padding:0!important;background:transparent}
.rb-s .section_wrapper{max-width:none!important;width:100%!important;padding:0!important;margin:0!important}
.rb-s .wrap,.rb-s .column{width:100%;float:none!important;margin:0!important;padding:0!important}
.rb-s .mcb-wrap-inner,.rb-s .mcb-column-inner,.rb-s .column_attr{padding:0!important;margin:0!important;max-width:none!important}
.rb-s img{display:block;max-width:100%;height:auto}
.rb-s p{margin:0}

/* ---------- BeTheme header (Theme Options → Header: Transparent, text logo, Menu: Hlavné menu) ----------
   Only typography is refined here; layout, colours and behaviour stay in Theme Options. */
/* BeTheme ties the text logo to the H1 colour/size; the header sits on dark, so it gets its own */
body.rb-site .text-logo #logo{font-family:var(--rb-serif)!important;font-weight:300;font-size:22px!important;letter-spacing:-.01em;text-decoration:none;color:var(--rb-on-dark)!important}
body.rb-site #menu>ul>li>a span{letter-spacing:.2em;text-transform:uppercase}
body.rb-site #menu>ul>li.menu-item-type-custom.current-menu-item>a span{color:inherit}
/* on the home page the header waits until the opening viewfinder has played out */
body.home #Top_bar{transition:opacity .4s,transform .4s}
body.home:not(.rb-past-hero) #Top_bar{opacity:0;transform:translateY(-12px);pointer-events:none}
/* BeTheme's mobile sticky bar stays transparent; content must never run under the logo */
#Top_bar.is-sticky{background-color:var(--rb-dark)!important}
body.mfn-ui #Top_bar{opacity:1!important;transform:none!important}

/* ---------- BeTheme footer (Theme Options → Footer → Copyright) ---------- */
body.rb-site #Footer .footer_copy{border:0}
body.rb-site #Footer .footer_copy .copyright{font-size:13px}
body.rb-site #Footer .footer_copy a{text-decoration:none;margin-left:22px}

/* ---------- shared bits ---------- */
.rb-btn,.rb-cta p:last-child a:first-child{display:inline-block;background:var(--rb-paper);color:var(--rb-ink)!important;padding:18px 34px;text-decoration:none!important;border:0!important;font-size:15px;font-weight:500;letter-spacing:.02em;transition:transform .2s,background .2s}
.rb-btn:hover,.rb-cta p:last-child a:first-child:hover{transform:translateY(-2px);background:#fff}
.rb-empty{color:var(--rb-soft);font-style:italic}

/* ---------- subpages built in BeBuilder ----------
   section  rb-s rb-page-head   dark opening: h1 + lead + optional anchor links
   section  rb-s rb-band        paper band: h2 + text (+ shortcode)
   section  rb-s rb-band rb-dark   same band on dark
   wrap     rb-split            two columns (first item narrower)
   section  rb-s rb-cta         closing invitation, last link = button  */
.rb-page-head,.rb-head{background:var(--rb-dark);color:var(--rb-on-dark);padding:clamp(140px,26vh,260px) var(--rb-gut) clamp(56px,10vh,110px)!important}
.rb-page-head h1,.rb-head h1{font-size:clamp(52px,min(9vw,17vh),168px)!important;line-height:.92!important;color:var(--rb-on-dark)!important;max-width:11em}
.rb-page-head p,.rb-head .rb-lead p{font-size:clamp(17px,1.4vw,21px);line-height:1.6;color:var(--rb-on-dark-soft);max-width:36em;margin-top:28px!important}
.rb-page-head h2,.rb-crumb{font:500 12px/1.4 var(--rb-sans)!important;letter-spacing:.24em!important;text-transform:uppercase;color:var(--rb-on-dark-soft)!important;margin:0 0 26px!important}
.rb-crumb a{text-decoration:none;border-bottom:1px solid rgba(239,235,228,.35)}
.rb-page-head ul{list-style:none;display:flex;flex-wrap:wrap;gap:12px 28px;margin:44px 0 0!important;padding:0}
.rb-page-head ul a{text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px;font-size:15px}

.rb-band{padding:clamp(72px,14vh,160px) var(--rb-gut)!important;background:var(--rb-paper)}
/* a band whose shortcode has nothing to show yet (e.g. no references published) disappears */
.mcb-section.rb-band:not(:has(.column_attr > *)){display:none!important}
.rb-band.rb-dark,.rb-dark{background:var(--rb-dark)!important;color:var(--rb-on-dark)}
.rb-band h2{font-size:clamp(40px,min(6vw,12vh),104px)!important;line-height:.95!important;margin-bottom:28px!important}
.rb-band h3{font-size:clamp(26px,2.4vw,38px)!important;line-height:1.1!important;margin:48px 0 14px!important}
.rb-band p,.rb-band li{font-size:17px;line-height:1.7;color:var(--rb-soft);max-width:38em}
.rb-band p+p{margin-top:1em!important}
.rb-dark p,.rb-dark li{color:var(--rb-on-dark-soft)}
.rb-band p a{text-decoration:none;border-bottom:1px solid currentColor;color:inherit}
.rb-band .rb-jg,.rb-band .rb-posts,.rb-band .rb-pf .column_filters{margin-top:clamp(36px,6vh,72px)}
/* sections set to Height: Full screen in BeBuilder fill the viewport; content sits low, like a cover */
.rb-s.full-screen{box-sizing:border-box;min-height:100svh!important;height:auto!important;display:flex!important;flex-direction:column;justify-content:flex-end}
.rb-s.full-screen>.section_wrapper{flex:0 0 auto;min-height:0!important;height:auto!important}
.rb-split>.mcb-wrap-inner{display:grid!important;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,110px);align-items:start}
.rb-split.rb-flip>.mcb-wrap-inner{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.rb-split+.rb-split{margin-top:clamp(72px,14vh,160px)!important}
.rb-sticky{position:sticky!important;top:110px}
.rb-portrait img{width:100%}

/* below-the-fold BeBuilder background photos wait until rb-site.js sees them coming;
   "rb-js" is set in <head> only when JavaScript runs, so without it the photos load as usual.
   Keep this list in sync with LAZY_BG in rb-site.js. */
.rb-js .rb-moment .rb-stage-w>.mcb-wrap-inner:not(.rb-bg-on),
.rb-js .rb-close-w>.mcb-wrap-inner:not(.rb-bg-on),
.rb-js .rb-cta:not(.rb-bg-on){background-image:none!important}

/* the photo + 50 % overlay come from BeBuilder (Section → Background / Overlay); only the fallback colour is ours */
.rb-cta{position:relative;background-color:var(--rb-dark)!important;color:var(--rb-on-dark);padding:clamp(96px,20vh,220px) var(--rb-gut)!important}
.rb-cta h2{font-size:clamp(48px,min(9vw,17vh),160px)!important;line-height:.92!important;color:var(--rb-on-dark)!important;margin-bottom:28px!important}
.rb-cta p{font-size:17px;line-height:1.65;color:var(--rb-on-dark-soft);max-width:34em}.rb-cta p:last-child{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;margin-top:36px!important}
.rb-cta p:last-child a{color:var(--rb-on-dark);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px;font-size:15px}

/* item  rb-contact   plain <ul>: each <li> = small label (<span>) + one big link */
.rb-contact ul{list-style:none;margin:0!important;padding:0;border-top:1px solid var(--rb-line)}
.rb-contact li{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 24px;padding:clamp(22px,4vh,40px) 0;border-bottom:1px solid var(--rb-line);max-width:none!important}
.rb-contact li span{font:500 12px/1.4 var(--rb-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--rb-soft)}
.rb-contact li a,.rb-contact li strong{font-family:var(--rb-serif);font-weight:300;font-size:clamp(26px,3.2vw,52px);line-height:1.1;color:var(--rb-ink);text-decoration:none;border:0!important;transition:transform .3s;overflow-wrap:anywhere}
.rb-contact li a:hover{transform:translateX(-8px)}
.rb-band .rb-steps h3:first-child{margin-top:0!important}

@media (max-width:900px){
 .rb-contact li{flex-direction:column}
 .rb-split>.mcb-wrap-inner,.rb-split.rb-flip>.mcb-wrap-inner{grid-template-columns:1fr}
 .rb-sticky{position:static!important}
}

/* ---------- templates: gallery, archives, stories ---------- */
.rb-main{display:block}
.rb-lead{max-width:40em}
.rb-pager{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:end;padding:56px var(--rb-gut) 80px;border-top:1px solid var(--rb-line)}
.rb-pager a{text-decoration:none;font-family:var(--rb-serif);font-size:clamp(20px,2vw,30px);line-height:1.15}
.rb-pager a span{display:block;font:500 11px var(--rb-sans);letter-spacing:.22em;text-transform:uppercase;color:var(--rb-soft);margin-bottom:8px}
.rb-pager a:last-child{text-align:right}
.rb-pager .rb-pager-all{font:500 12px var(--rb-sans);letter-spacing:.2em;text-transform:uppercase;border-bottom:1px solid currentColor;padding-bottom:3px}
@media (max-width:700px){.rb-pager{grid-template-columns:1fr;text-align:left}.rb-pager a:last-child{text-align:left}}


/* justified photo grid: flex-grow by aspect ratio keeps every photo whole */
.rb-jg{display:flex;flex-wrap:wrap;gap:clamp(6px,.8vw,12px)}
.rb-jg a{flex:var(--r) 1 calc(var(--r) * clamp(150px,18vw,280px));display:block;border:0!important;cursor:zoom-in;background:#ddd6cb}
.rb-jg a img{display:block;width:100%;height:auto;transition:opacity .3s}
.rb-jg a:hover img{opacity:.88}
.rb-jg i{flex:1e6 1 0}
@media (max-width:600px){.rb-jg a{flex-basis:100%}}

/* BeTheme Portfolio element (class rb-pf): layout (style, columns, filters) stays in its BeBuilder
   settings; here only typography and colours. rb-pf-one = a single sample filling its column (Služby). */
.rb-pf .portfolio-item{background:transparent!important}
.rb-pf .portfolio-item .image_frame{border:0!important;background:transparent!important}
.rb-pf-one .portfolio_group{height:auto!important}
.rb-pf-one .portfolio_group .portfolio-item{width:100%!important;position:relative!important;left:auto!important;top:auto!important;transform:none!important;margin:0 0 clamp(28px,4vw,48px)!important;float:none!important}
.rb-pf-one .portfolio-item .image_frame,.rb-pf-one .portfolio-item .image_wrapper,.rb-pf-one .portfolio-item img{width:100%!important;height:auto!important}
.rb-pf .portfolio_group .portfolio-item img{transition:filter .4s}
.rb-pf .portfolio_group .portfolio-item:hover img{filter:brightness(.85)}
.rb-pf .filters_wrapper ul li a{font:500 12px var(--rb-sans)!important;letter-spacing:.18em;text-transform:uppercase;background:transparent!important;color:inherit!important;border:0!important;border-bottom:1px solid transparent!important;border-radius:0!important;padding:6px 0!important;margin-right:24px}
.rb-pf .filters_wrapper ul li.current-cat a,.rb-pf .filters_wrapper ul li a:hover{border-bottom-color:currentColor!important}
.rb-dark .rb-pf .filters_wrapper,.rb-dark .rb-pf .filters_buttons{background:transparent!important}
.rb-pf .portfolio-item .desc{padding:16px 0 0!important;background:transparent!important}
.rb-pf .portfolio-item .desc .title_wrapper h5,.rb-pf .portfolio-item .desc h5{font-family:var(--rb-serif)!important;font-weight:300!important;font-size:clamp(24px,2vw,32px)!important;line-height:1.15!important}
.rb-pf .portfolio-item .desc h5,.rb-pf .portfolio-item .desc h5 a{color:inherit!important;text-decoration:none}
.rb-pf .portfolio-item .desc .desc-wrapper,.rb-pf .portfolio-item .desc p{color:inherit;opacity:.7;font-size:15px;line-height:1.6}
.rb-pf .portfolio-item .desc .button-love,.rb-pf .portfolio-item .desc .post-meta,.rb-pf .portfolio-item .desc .details-wrapper{display:none!important}

/* references */
.rb-refs h2{margin-bottom:clamp(36px,6vh,72px)!important}
.rb-refs-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:clamp(40px,6vw,96px)}
.rb-ref{margin:0}
.rb-ref blockquote{margin:0;padding:0;border:0;background:none}
.rb-ref blockquote p{font-family:var(--rb-serif);font-weight:300;font-style:italic;font-size:clamp(22px,2vw,32px);line-height:1.3;color:inherit!important;max-width:none}
.rb-ref figcaption{margin-top:22px;font-size:14px;display:flex;flex-direction:column;gap:4px}
.rb-ref figcaption span{color:var(--rb-soft)}
.rb-dark .rb-ref figcaption span{color:var(--rb-on-dark-soft)}
.rb-logos{list-style:none;margin:clamp(56px,10vh,110px) 0 0;padding:clamp(32px,5vh,56px) 0 0;border-top:1px solid var(--rb-line);display:flex;flex-wrap:wrap;gap:28px 56px;align-items:center}
.rb-dark .rb-logos{border-color:rgba(239,235,228,.18)}
.rb-logos img{max-height:48px;width:auto;filter:grayscale(1);opacity:.7}
.rb-dark .rb-logos img{filter:grayscale(1) invert(1);opacity:.75}

/* stories list */
.rb-posts{display:grid;gap:clamp(48px,8vh,96px)}
.rb-post{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(24px,4vw,64px);align-items:end;text-decoration:none!important;border:0!important}
/* list cards share one 4:3 frame; a portrait cover is cut to it (the story page shows the whole photo) */
.rb-post img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:50% 35%;display:block}
.rb-post time{display:block;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--rb-soft);margin-bottom:14px}
.rb-post strong{display:block;font-family:var(--rb-serif);font-weight:300;font-size:clamp(30px,3.4vw,56px);line-height:1.02;margin-bottom:16px}
.rb-post em{font-style:normal;color:var(--rb-soft);font-size:16px;line-height:1.6}
/* a story without a photo reads as a full-width text row, not half an empty card */
.rb-post:not(:has(img)){grid-template-columns:1fr;border-top:1px solid var(--rb-line)!important;padding-top:clamp(32px,5vh,56px)}
.rb-post:not(:has(img)) span{max-width:44em}
@media (max-width:800px){.rb-post{grid-template-columns:1fr}}

/* story */
.rb-story-cover{margin:0;background:var(--rb-dark);padding:0 var(--rb-gut) clamp(40px,8vh,96px)}
.rb-story-cover img{display:block;max-width:100%;max-height:min(70vh,640px);width:auto;height:auto;margin:0 auto;cursor:zoom-in}
.rb-cover-crop img{width:min(100%,calc(min(70vh,640px) * 4 / 3));max-height:none;aspect-ratio:4/3;object-fit:cover;object-position:50% 35%}
.rb-story-cover figcaption{margin-top:14px;text-align:center;font-size:13px;color:var(--rb-on-dark-soft)}
.rb-prose{padding:clamp(64px,12vh,140px) var(--rb-gut)}
.rb-prose>*{max-width:40rem;margin-left:auto!important;margin-right:auto!important}
.rb-prose p,.rb-prose li{font-size:19px;line-height:1.75;color:#2b2926}
.rb-prose p{margin:0 auto 1.2em!important}
.rb-prose h2{font-size:clamp(32px,3.4vw,52px)!important;line-height:1.05!important;margin:1.6em auto .6em!important}
.rb-prose h3{font-size:clamp(24px,2.2vw,34px)!important;margin:1.4em auto .5em!important}
.rb-prose blockquote{border:0;padding:0;margin:2em auto!important;background:none}
.rb-prose blockquote p{font-family:var(--rb-serif);font-style:italic;font-weight:300;font-size:clamp(26px,2.6vw,40px);line-height:1.2;color:var(--rb-ink)}
.rb-prose figure,.rb-prose .wp-block-image,.rb-prose .wp-block-gallery{max-width:min(1200px,100%);margin:clamp(40px,7vh,80px) auto!important}
.rb-prose .alignfull{max-width:none}
.rb-prose figure img,.rb-prose .wp-block-image img{display:block;width:auto;max-width:100%;max-height:90vh;height:auto!important;margin:0 auto;cursor:zoom-in;object-fit:contain!important}
.rb-prose figcaption{font-size:13px;color:var(--rb-soft);text-align:center;margin-top:12px}
.rb-prose .wp-block-gallery{display:flex!important;flex-wrap:wrap;gap:10px!important}
.rb-prose .wp-block-gallery figure{margin:0!important;flex:1 1 300px!important;width:auto!important}
.rb-prose .wp-block-gallery figure img{width:100%!important;height:auto!important;max-height:none}

/* ---------- lightbox ---------- */
.rb-lb{position:fixed;inset:0;z-index:1000;background:rgba(8,7,6,.97);display:grid;grid-template-rows:auto 1fr auto;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;color:var(--rb-on-dark)}
.rb-lb.on{opacity:1;visibility:visible}
.rb-lb-top{display:flex;justify-content:space-between;align-items:center;padding:16px var(--rb-gut);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--rb-on-dark-soft)}
.rb-lb button{background:none;border:0;color:var(--rb-on-dark);cursor:pointer;font:500 12px var(--rb-sans);letter-spacing:.2em;text-transform:uppercase;padding:12px}
.rb-lb-stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:0;padding:0 clamp(8px,4vw,72px)}
.rb-lb-stage img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;transition:opacity .25s;user-select:none;-webkit-user-drag:none}
.rb-lb-stage img.out{opacity:0}
.rb-lb-prev,.rb-lb-next{position:absolute;top:0;bottom:0;width:30%;font-size:0!important;z-index:1}
.rb-lb-prev{left:0;cursor:w-resize}.rb-lb-next{right:0;cursor:e-resize}
.rb-lb-prev::after,.rb-lb-next::after{content:"";position:absolute;top:50%;width:16px;height:16px;border:solid var(--rb-on-dark);border-width:0 0 1.5px 1.5px;opacity:.6;transition:opacity .2s}
.rb-lb-prev::after{left:clamp(14px,2vw,32px);transform:rotate(45deg)}
.rb-lb-next::after{right:clamp(14px,2vw,32px);transform:rotate(-135deg)}
.rb-lb-prev:hover::after,.rb-lb-next:hover::after{opacity:1}
.rb-lb-cap{padding:14px var(--rb-gut) 22px;text-align:center;font-size:14px;color:var(--rb-on-dark-soft);min-height:20px}
body.rb-lb-open{overflow:hidden!important}
@media (hover:none){.rb-lb-prev::after,.rb-lb-next::after{display:none}}
