/*
Theme Name: MZK Trade
Theme URI: https://mzktrade.sk
Author: MZK Trade s.r.o.
Description: Editovateľná one-page téma pre MZK Trade s.r.o. s kotvami Domov, O nás a Kontakt.
Version: 1.1.0
Requires at least: 7.0
Tested up to: 7.0.2
Requires PHP: 8.1
Text Domain: mzk-trade
*/

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,500;0,600;0,700;1,600&family=Manrope:wght@400;500;600;700&display=swap');

:root { --ink:#07090a; --ink-2:#0d1113; --steel:#9aa2a5; --paper:#e7e5df; --brass:#b89a5b; --brass-light:#d0b675; --line:rgba(255,255,255,.15); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:#f4f2ed; font-family:"Manrope",Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; }
section { scroll-margin-top:88px; }
.section-dark { background:var(--ink); }
.site-header { position:fixed; z-index:50; inset:0 0 auto; height:88px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 4vw; border-bottom:1px solid var(--line); background:rgba(5,7,8,.82); backdrop-filter:blur(16px); }
.brand { display:flex; align-items:center; gap:11px; width:max-content; }
.brand img { width:55px; height:55px; object-fit:contain; }
.brand span { display:grid; line-height:.8; }
.brand strong { font:700 29px/1 "Barlow Condensed",sans-serif; letter-spacing:.03em; }
.brand small { font:600 9px/1 "Manrope",sans-serif; letter-spacing:.46em; margin:5px 0 0 2px; }
nav { display:flex; gap:42px; font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
nav a { position:relative; padding:34px 0; }
nav a:after { content:""; position:absolute; left:0; right:100%; bottom:23px; height:1px; background:var(--brass-light); transition:.25s; }
nav a:hover:after, nav a:focus-visible:after { right:0; }
.header-cta { justify-self:end; font-size:12px; text-transform:uppercase; letter-spacing:.12em; border:1px solid rgba(255,255,255,.28); padding:13px 18px; }
.header-cta span { color:var(--brass-light); margin-left:12px; }
.hero { min-height:100svh; position:relative; display:flex; align-items:center; overflow:hidden; padding:140px 8vw 100px; background-image:var(--hero-image); background-size:cover; background-position:center; }
.hero-image { object-fit:cover; z-index:0; }
.hero-shade { position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(4,6,7,.98) 0%,rgba(4,6,7,.9) 35%,rgba(4,6,7,.15) 73%,rgba(4,6,7,.28)); }
.hero-grid { position:absolute; inset:0; z-index:2; opacity:.11; background-image:linear-gradient(rgba(255,255,255,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.2) 1px,transparent 1px); background-size:80px 80px; mask-image:linear-gradient(90deg,#000,transparent 70%); }
.hero-content { position:relative; z-index:3; width:min(720px,60vw); }
.eyebrow,.section-kicker { color:var(--brass-light); font-size:11px; font-weight:700; letter-spacing:.22em; text-transform:uppercase; }
.eyebrow { display:flex; align-items:center; gap:12px; }
.eyebrow span { width:36px; height:1px; background:var(--brass-light); }
h1,h2,h3 { margin:0; font-family:"Barlow Condensed",Arial,sans-serif; text-transform:uppercase; }
h1 { margin-top:28px; font-size:clamp(76px,9.5vw,148px); line-height:.76; letter-spacing:-.035em; }
h1 em,.contact h2 em { color:var(--brass-light); font-style:normal; }
.hero-lead { max-width:570px; margin:38px 0 0; font-size:16px; line-height:1.8; color:#bdc2c3; }
.hero-actions { display:flex; align-items:center; gap:34px; margin-top:36px; }
.button { display:inline-flex; gap:28px; align-items:center; padding:17px 22px; font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.button-gold { background:var(--brass); color:#0a0b0b; }
.text-link { font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.text-link span { color:var(--brass-light); margin-left:10px; }
.hero-status { position:absolute; z-index:3; right:4vw; top:120px; display:flex; gap:10px; align-items:center; font-size:10px; text-transform:uppercase; letter-spacing:.14em; color:#d3d5d4; }
.pulse { width:7px; height:7px; border-radius:50%; background:#d0b675; box-shadow:0 0 0 7px rgba(208,182,117,.12); }
.scroll-cue { position:absolute; z-index:3; right:4vw; bottom:38px; display:flex; gap:15px; align-items:center; font-size:9px; letter-spacing:.2em; text-transform:uppercase; writing-mode:vertical-rl; }
.scroll-cue i { display:block; width:1px; height:44px; background:var(--brass-light); }
.manifesto { padding:130px 8vw; border-top:1px solid var(--line); }
.section-kicker { margin:0 0 30px; }
.section-kicker.dark { color:#735d34; }
.manifesto-intro { display:grid; grid-template-columns:1fr 2fr; align-items:start; }
.manifesto h2,.focus h2,.about h2,.vision h2,.contact h2 { font-size:clamp(52px,6vw,94px); line-height:.94; letter-spacing:-.02em; }
.manifesto h2 span { color:#6c7375; }
.value-grid { margin-top:90px; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.value-grid article { padding:38px 34px 45px 0; border-right:1px solid var(--line); }
.value-grid article+article { padding-left:34px; }
.value-grid article:last-child { border-right:0; }
.value-grid b,.focus-list b { color:var(--brass-light); font:600 12px/1 "Manrope"; letter-spacing:.15em; }
.value-grid h3 { margin:45px 0 15px; font-size:28px; letter-spacing:.02em; }
.value-grid p,.focus-list p { color:#949b9d; line-height:1.7; font-size:14px; margin:0; }
.section-light { background:var(--paper); color:#111416; }
.about { padding:140px 8vw; display:grid; grid-template-columns:1fr 1.15fr; gap:9vw; }
.about-heading { position:sticky; top:130px; align-self:start; }
.about-tagline { color:#735d34; font:600 24px/1.3 "Barlow Condensed",sans-serif; text-transform:uppercase; letter-spacing:.03em; max-width:400px; }
.about-copy { font-size:16px; line-height:1.95; color:#383d3f; }
.about-copy p { margin:0 0 30px; }
.about-copy p:first-child:first-letter { float:left; color:#9f8247; font:700 82px/.75 "Barlow Condensed"; margin:10px 13px 0 0; }
.focus { padding:140px 8vw 0; }
.focus-title { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:75px; }
.focus-list { border-top:1px solid var(--line); }
.focus-list article { display:grid; grid-template-columns:80px 1fr auto; gap:25px; align-items:center; padding:31px 8px; border-bottom:1px solid var(--line); transition:.25s; }
.focus-list article:hover { padding-left:20px; background:rgba(255,255,255,.025); }
.focus-list h3 { font-size:30px; margin-bottom:7px; }
.focus-list article>span { color:var(--brass-light); font-size:24px; }
.quality-band { margin:110px -8vw 0; padding:24px 8vw; background:#111719; display:flex; justify-content:center; gap:35px; align-items:center; font:600 11px "Manrope"; letter-spacing:.13em; text-transform:uppercase; color:#aeb3b4; }
.quality-band i { width:5px; height:5px; border-radius:50%; background:var(--brass); }
.section-brass { background:#b49a62; color:#0b0d0e; }
.vision { padding:130px 8vw 0; }
.vision-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:9vw; }
.vision-grid p { font-size:15px; line-height:1.85; margin:0 0 24px; }
.vision blockquote { margin:115px 0 0; padding:70px 0 75px; border-top:1px solid rgba(0,0,0,.25); font:600 clamp(42px,5.7vw,88px)/.95 "Barlow Condensed"; text-transform:uppercase; letter-spacing:-.02em; }
.contact { padding:140px 8vw 70px; }
.contact-top { display:grid; grid-template-columns:1fr 1fr; gap:8vw; align-items:end; }
.mail-card { position:relative; display:grid; gap:15px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:30px 55px 30px 0; }
.mail-card small,.company-card small { color:#777f81; text-transform:uppercase; letter-spacing:.2em; font-size:9px; }
.mail-card strong { font:500 clamp(22px,3vw,42px)/1 "Barlow Condensed"; text-transform:uppercase; }
.mail-card span { position:absolute; right:5px; bottom:33px; color:var(--brass-light); font-size:26px; }
.company-card { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin-top:100px; background:var(--line); border:1px solid var(--line); }
.company-card div { background:var(--ink); padding:28px; display:grid; gap:12px; }
.company-card strong { font:500 20px "Barlow Condensed"; text-transform:uppercase; }
.registry-note { margin:16px 0 0; color:#747b7d; font-size:11px; }
.preparation-note { margin-top:45px; padding:25px; background:#101416; display:flex; gap:20px; color:#949b9d; font-size:12px; line-height:1.7; }
.preparation-note span { flex:0 0 25px; height:25px; display:grid; place-items:center; border:1px solid var(--brass); border-radius:50%; color:var(--brass-light); font-family:serif; }
.preparation-note p { margin:0; }
footer { min-height:110px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:30px; padding:20px 4vw; border-top:1px solid var(--line); background:#050607; color:#737a7c; font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.footer-brand { color:#fff; transform:scale(.85); transform-origin:left; }
footer>a:last-child { justify-self:end; color:#b6bbbc; }

@media (max-width:900px) {
  .site-header { grid-template-columns:1fr auto; height:74px; }
  .brand img { width:46px; height:46px; }
  .site-header nav { gap:20px; font-size:10px; }
  .header-cta { display:none; }
  .hero { padding:120px 6vw 75px; }
  .hero-content { width:90%; }
  .hero-shade { background:linear-gradient(90deg,rgba(4,6,7,.97),rgba(4,6,7,.55)); }
  .hero-status,.scroll-cue { display:none; }
  .manifesto,.focus,.contact { padding-left:6vw; padding-right:6vw; }
  .manifesto-intro,.about,.vision-grid,.contact-top { grid-template-columns:1fr; }
  .manifesto h2 { margin-top:25px; }
  .value-grid { grid-template-columns:1fr; }
  .value-grid article,.value-grid article+article { border-right:0; border-bottom:1px solid var(--line); padding:28px 0; }
  .about { padding:110px 6vw; gap:55px; }
  .about-heading { position:static; }
  .focus-title { display:block; }
  .focus-title h2 { margin-top:20px; }
  .quality-band { margin-left:-6vw; margin-right:-6vw; flex-wrap:wrap; gap:18px; }
  .vision { padding:110px 6vw 0; }
  .vision-grid { gap:45px; }
  .company-card { grid-template-columns:1fr 1fr; }
  footer { grid-template-columns:1fr auto; }
  footer p { display:none; }
}

@media (max-width:560px) {
  .site-header { padding:0 18px; }
  .brand span { display:none; }
  .site-header nav { gap:14px; letter-spacing:.1em; }
  h1 { font-size:66px; }
  .hero { min-height:840px; }
  .hero-image { object-position:66% center; }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:25px; }
  .manifesto,.focus,.contact { padding-top:90px; padding-bottom:90px; }
  .focus-list article { grid-template-columns:45px 1fr; }
  .focus-list article>span { display:none; }
  .quality-band { display:none; }
  .vision { padding-top:90px; }
  .vision blockquote { margin-top:65px; }
  .contact-top { gap:55px; }
  .company-card { grid-template-columns:1fr; margin-top:65px; }
}

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

/* Themify Builder 7.7.9 compatibility ------------------------------------ */
.mzk-builder-main,
.mzk-builder-main .themify_builder_content,
.mzk-builder-main .mzk-builder-row { width:100%; max-width:none; margin:0; }
.mzk-builder-main .mzk-builder-row > .row_inner,
.mzk-builder-main .mzk-builder-row .module_column { width:100%!important; max-width:none!important; margin:0!important; padding:0!important; }
.mzk-builder-main .mzk-builder-row .module { margin:0; }
.mzk-builder-main .mzk-builder-row .tb_text_wrap { color:inherit; }
.mzk-builder-main .hero { background-image:none; }
.mzk-builder-main .hero::before { content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(4,6,7,.98) 0%,rgba(4,6,7,.9) 35%,rgba(4,6,7,.15) 73%,rgba(4,6,7,.28)); pointer-events:none; }
.mzk-builder-main .hero::after { content:""; position:absolute; inset:0; z-index:2; opacity:.11; background-image:linear-gradient(rgba(255,255,255,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.2) 1px,transparent 1px); background-size:80px 80px; mask-image:linear-gradient(90deg,#000,transparent 70%); pointer-events:none; }
.mzk-builder-main .hero > .row_inner { position:relative; z-index:3; }
.mzk-builder-main .mzk-builder-hero-image { position:absolute!important; inset:0; z-index:0; width:100%; height:100%; max-width:none!important; }
.mzk-builder-main .mzk-builder-hero-image .image-wrap,
.mzk-builder-main .mzk-builder-hero-image img { display:block; width:100%!important; height:100%!important; max-width:none!important; object-fit:cover; }
.mzk-builder-main .mzk-hero-content { position:relative; z-index:3; width:min(720px,60vw); }
.mzk-builder-main .about .tb_text_wrap { display:grid; grid-template-columns:1fr 1.15fr; gap:9vw; }
.mzk-builder-main .contact .tb_text_wrap { width:100%; }
.mzk-builder-main .tb_editor_enable .mzk-builder-hero-image { pointer-events:auto; }

@media (max-width:900px) {
  .mzk-builder-main .mzk-hero-content { width:90%; }
  .mzk-builder-main .about .tb_text_wrap { grid-template-columns:1fr; gap:55px; }
}

@media (max-width:560px) {
  .mzk-builder-main .mzk-builder-hero-image img { object-position:66% center; }
}
