/*
Theme Name: Vektorizalas
Theme URI: https://vektorizalas.localhost/
Description: Vektorizalas child theme for WPressOne.
Author: Vektorizalas
Template: wpressone
Version: 1.1.0
Text Domain: vektorizalas
*/

/*
 * Values come from the original site (unfinityplus theme options, theme.css and
 * the ct-heading component). "body .wpo-main" outranks WPressOne's fluid
 * typography selectors such as ".wpb_wrapper h1" without resorting to !important.
 */

:root {
    --vektorizalas-accent: #900dad;
    --vektorizalas-text: #303030;
    --vektorizalas-container: 1140px;
}

body {
    text-align: left;
    color: var(--vektorizalas-text);
    font-family: Barlow, Arial, sans-serif;
    font-size: 22px;
    font-weight: 400;
    line-height: 30px;
}

.wpo-shell {
    overflow-x: clip;
}

/* ---- Typography ---------------------------------------------------------- */

body .wpo-main a:not(.vc_btn3):not([class*="sliderone"]) {
    color: #000;
}

body .wpo-main a:not(.vc_btn3):not([class*="sliderone"]):is(:hover, :active) {
    color: var(--vektorizalas-accent);
}

body .wpo-main p {
    margin: 0 0 15px;
}

body .wpo-main .wpb_text_column :is(ul, ol) {
    margin: 0 0 15px;
    padding-left: 0;
}

body .wpo-main :is(h1, h2, h3, h4, h5, h6) {
    clear: both;
    margin: 0 0 15px;
    max-width: none;
    color: #000;
    font-style: normal;
    text-wrap: wrap;
    hyphens: manual;
    word-break: normal;
    overflow-wrap: normal;
}

/* Like the original, desktop headings never split a word mid-way; phones may. */
@media screen and (max-width: 767px) {
    body .wpo-main :is(h1, h2, h3, h4, h5, h6) { overflow-wrap: break-word; }
}

body .wpo-main :is(h1, h2) { font-family: Montserrat, Arial, sans-serif; font-weight: 700; font-size: 50px; line-height: 60px; }
body .wpo-main h3 { font-family: "Barlow Semi Condensed", Barlow, Arial, sans-serif; font-weight: 600; font-size: 38px; line-height: 45px; }
body .wpo-main h4 { font-family: "Barlow Semi Condensed", Barlow, Arial, sans-serif; font-weight: 500; font-size: 30px; line-height: 40px; }
body .wpo-main h5 { font-family: Montserrat, Arial, sans-serif; font-weight: 700; font-size: 50px; line-height: 50px; }
body .wpo-main h6 { font-family: Roboto, Arial, sans-serif; font-weight: 700; font-size: 18px; line-height: 22px; color: #ef82a2; }

@media screen and (max-width: 991px) {
    body .wpo-main h1:not([style*="font-size"]) { font-size: 36px; }
    body .wpo-main h2:not([style*="font-size"]) { font-size: 30px; }
}

/* WPressOne shrinks every heading and inline-sized span on narrow containers with !important. */
@media screen and (max-width: 767px) {
    body .wpo-main h1:not([style*="font-size"]) { font-size: 28px !important; }
    body .wpo-main h2:not([style*="font-size"]) { font-size: 24px !important; }
    body .wpo-main h3:not([style*="font-size"]) { font-size: 20px; }
    body .wpo-main h4:not([style*="font-size"]) { font-size: 18px; }
}

@media screen and (max-width: 575px) {
    body .wpo-main h1:not([style*="font-size"]) { font-size: 24px !important; }
    body .wpo-main h2:not([style*="font-size"]) { font-size: 20px !important; }
    body .wpo-main h3:not([style*="font-size"]) { font-size: 18px; }
    body .wpo-main h4:not([style*="font-size"]),
    body .wpo-main h5:not([style*="font-size"]) { font-size: 16px; }
    body .wpo-main h6:not([style*="font-size"]) { font-size: 14px; }
}

body .wpo-main :is([style*="font-size: 15px"], [style*="font-size:15px"]) { font-size: 15px !important; }
body .wpo-main :is([style*="font-size: 16px"], [style*="font-size:16px"]) { font-size: 16px !important; }
body .wpo-main :is([style*="font-size: 18px"], [style*="font-size:18px"]) { font-size: 18px !important; }
body .wpo-main :is([style*="font-size: 24px"], [style*="font-size:24px"]) { font-size: 24px !important; }
body .wpo-main :is([style*="font-size: 18pt"], [style*="font-size:18pt"]) { font-size: 18pt !important; }
body .wpo-main :is([style*="font-size: 24pt"], [style*="font-size:24pt"]) { font-size: 24pt !important; }
body .wpo-main :is([style*="font-size: 30pt"], [style*="font-size:30pt"]) { font-size: 30pt !important; }
body .wpo-main :is([style*="font-size: 36pt"], [style*="font-size:36pt"]) { font-size: 36pt !important; }

@media screen and (max-width: 575px) {
    /* The 36pt e-mail address overflowed its column on the original; scale it instead. */
    body .wpo-main :is([style*="font-size: 36pt"], [style*="font-size:36pt"]):has(> a[href^="mailto:"]) { font-size: min(36pt, 11vw) !important; }
}

/* ---- Headings (ct-heading markup rendered by inc/heading.php) ------------ */

.align-center { text-align: center; }
.align-left { text-align: left; }
.align-right { text-align: right; }
@media screen and (max-width: 1199px) {
    .align-center-md { text-align: center; }
    .align-left-md { text-align: left; }
    .align-right-md { text-align: right; }
}
@media screen and (max-width: 991px) {
    .align-center-sm { text-align: center; }
    .align-left-sm { text-align: left; }
    .align-right-sm { text-align: right; }
}
@media screen and (max-width: 767px) {
    .align-center-xs { text-align: center; }
    .align-left-xs { text-align: left; }
    .align-right-xs { text-align: right; }
}

body .wpo-main .ct-heading {
    margin-bottom: 0;
}

body .wpo-main .ct-heading .ct-heading-tag {
    margin-bottom: 26px;
}

.ct-heading .ct-heading-tag.divider1 {
    position: relative;
    padding-bottom: 12px;
}

.ct-heading .ct-heading-tag.divider1:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 31px;
    height: 5px;
    border-radius: 2px;
    background-color: var(--vektorizalas-accent);
}

.ct-heading .ct-heading-tag.divider_img {
    position: relative;
    padding-bottom: 24px;
}

.ct-heading .ct-heading-tag.divider_img:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 50px;
    height: 9px;
    background-repeat: no-repeat;
    background-size: contain;
}

.ct-heading.align-center .ct-heading-tag:is(.divider1, .divider_img):before {
    right: 0;
    margin: auto;
}

.ct-heading.align-right .ct-heading-tag:is(.divider1, .divider_img):before {
    left: auto;
    right: 0;
}

.ct-heading .ct-heading-desc {
    line-height: 1.714;
}

/* ---- Content layout ------------------------------------------------------ */

.wpo-content:not(.wpo-container),
.vektorizalas-reference-page {
    padding: 0 !important;
}

.vektorizalas-reference-page > .wpb-content-wrapper {
    width: 100%;
}

/*
 * WPressOne zeroes ".vc_column-inner" padding with !important. Restore WPBakery's
 * native gutters; :where() keeps specificity at (0,1,0) so the per-element
 * vc_custom_* design options printed later in <head> still take precedence.
 */
:where(.wpo-main .vc_column_container) > .vc_column-inner {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

:where(.wpo-main .vc_col-has-fill,
    .wpo-main .vc_row-has-fill > .vc_column_container,
    .wpo-main .vc_row-has-fill + .vc_row > .vc_column_container,
    .wpo-main .vc_row-has-fill + .vc_row-full-width + .vc_row > .vc_column_container) > .vc_column-inner {
    padding-top: 35px !important;
}

:where(.wpo-main .vc_column-gap-1) > .vc_column_container { padding: 0.5px !important; }
:where(.wpo-main .vc_column-gap-2) > .vc_column_container { padding: 1px !important; }
:where(.wpo-main .vc_column-gap-3) > .vc_column_container { padding: 1.5px !important; }
:where(.wpo-main .vc_column-gap-4) > .vc_column_container { padding: 2px !important; }
:where(.wpo-main .vc_column-gap-5) > .vc_column_container { padding: 2.5px !important; }
:where(.wpo-main .vc_column-gap-10) > .vc_column_container { padding: 5px !important; }
:where(.wpo-main .vc_column-gap-15) > .vc_column_container { padding: 7.5px !important; }
:where(.wpo-main .vc_column-gap-20) > .vc_column_container { padding: 10px !important; }
:where(.wpo-main .vc_column-gap-25) > .vc_column_container { padding: 12.5px !important; }
:where(.wpo-main .vc_column-gap-30) > .vc_column_container { padding: 15px !important; }
:where(.wpo-main .vc_column-gap-35) > .vc_column_container { padding: 17.5px !important; }

:where(.wpo-main .vc_row-no-padding) .vc_column-inner {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.wpo-shell,
.wpo-content,
.wpo-content .vc_row,
.wpo-content .wpb_wrapper {
    min-width: 0;
}

/* Desktop columns keep flex min-width:auto like the original theme, so a long
   heading word (e.g. VEKTORIZÁLÁS) widens its column instead of breaking. */
@media (max-width: 767px) {
    .wpo-content .vc_column_container,
    .wpo-content .vc_column-inner {
        min-width: 0;
    }
}

.wpo-content img,
.wpo-content video,
.wpo-content iframe {
    max-width: 100%;
}

.wpo-content img,
.wpo-content video {
    height: auto;
}

.vektorizalas-reference-page--kapcsolat .vc_col-sm-12 > .vc_column-inner > .wpb_wrapper {
    padding-inline: 15px;
}

/* ---- Contact form (original: flat fields, Poppins inputs, black buttons) -- */

/* The plugin writes its design settings inline as custom properties. */
body .wpo-main .contact-one-form-wrapper {
    --contact-one-font-family: Barlow, Arial, sans-serif !important;
    --contact-one-body-font-size: 22px !important;
    --contact-one-label-font-weight: 700 !important;
    --contact-one-panel-bg: transparent !important;
    --contact-one-field-bg: #fff !important;
    --contact-one-text: #303030 !important;
    --contact-one-muted: #6a6a6a !important;
    --contact-one-accent: #900dad !important;
    --contact-one-accent-strong: #900dad !important;
    --contact-one-border: #ddd !important;
    --contact-one-button-bg: #000 !important;
    --contact-one-button-hover: #900dad !important;
    --contact-one-dropzone-bg: #fff !important;
    --contact-one-panel-radius: 0 !important;
    --contact-one-field-radius: 4px !important;
    --contact-one-button-radius: 0 !important;
    --contact-one-panel-padding: 0 !important;
    --contact-one-shadow: none !important;
    border: 0;
    line-height: 30px;
}

body .wpo-main .contact-one-form-wrapper .contact-one-form .form-group {
    margin-bottom: 15px;
}

body .wpo-main .contact-one-form-wrapper .contact-one-form label {
    margin-bottom: 5px;
}

body .wpo-main .contact-one-form-wrapper .contact-one-form .required {
    color: #ff0000;
}

body .wpo-main .contact-one-form-wrapper .contact-one-form :is(input[type="text"], input[type="email"], input[type="tel"], textarea, .widefat) {
    padding: 8px 12px;
    color: #333;
    font-family: Poppins, Arial, sans-serif;
    font-size: 16px;
    line-height: 24px;
    box-shadow: none;
}

body .wpo-main .contact-one-form-wrapper .contact-one-form textarea {
    height: 195px;
    min-height: 0;
}

body .wpo-main .contact-one-form-wrapper :is(.contact-one-form button[type="submit"], .contact-one-captcha-refresh) {
    min-height: 44px;
    padding: 5px 20px;
    font-family: Poppins, Arial, sans-serif;
    font-size: 16px;
    line-height: 32px;
    text-transform: capitalize;
}

body .wpo-main .contact-one-form-wrapper .contact-one-captcha-refresh {
    min-height: 48px;
    padding: 10px 20px;
    font-size: 14px;
    line-height: 28px;
}

body .wpo-main .contact-one-form-wrapper .contact-one-dropzone {
    border: 2px dashed #ccc;
    color: #6a6a6a;
}

.vektorizalas-masonry-gallery,
.vektorizalas-masonry-gallery .container-fluid,
.vektorizalas-masonry-gallery .masonry-gallery-container {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.vektorizalas-masonry-gallery img {
    max-width: 100%;
    height: auto;
}

/* Match the original full-height hero slides on all three migrated pages. */
body.home #section-home .wpo-sliderone-component .sliderone-slider,
.vektorizalas-reference-page .wpo-sliderone-component .sliderone-slider {
    height: 520px !important;
}

body.home #section-home .wpo-sliderone-component .sliderone-item img,
.vektorizalas-reference-page .wpo-sliderone-component .sliderone-item img {
    height: 100% !important;
    max-height: none !important;
    object-fit: cover;
}

@media (min-width: 768px) {
    body.home #section-home .wpo-sliderone-component .sliderone-slider,
    .vektorizalas-reference-page .wpo-sliderone-component .sliderone-slider {
        width: 100% !important;
        margin-left: 0 !important;
    }
}

@media (max-width: 767px) {
    body.home #section-home .wpo-sliderone-component .sliderone-slider,
    .vektorizalas-reference-page .wpo-sliderone-component .sliderone-slider {
        width: calc(100% + 30px) !important;
        margin-left: -15px !important;
    }

    .vektorizalas-reference-page--kapcsolat .vc_col-sm-12 > .vc_column-inner > .wpb_wrapper {
        padding-inline: 0;
    }
}

/* ---- Header -------------------------------------------------------------- */

.wpo-header {
    position: relative;
    top: auto;
    display: block;
    min-height: 110px;
    padding: 0;
    background: #fff;
    border: 0;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
    backdrop-filter: none;
}

.wpo-header .vektorizalas-header-row {
    display: flex;
    align-items: center;
    min-height: 110px;
    margin: 0;
    padding: 0 15px;
}

.vektorizalas-header-row > .vc_column_container:first-child {
    flex: 0 0 auto;
    width: auto;
    margin-right: 30px;
}

.vektorizalas-header-row > .vc_column_container:last-child {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
}

.vektorizalas-brand,
.vektorizalas-brand .vc_figure,
.vektorizalas-brand .vc_single_image-wrapper {
    margin: 0;
}

.vektorizalas-brand img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 70px;
}

.wpo-header .vektorizalas-main-menu {
    display: flex;
    justify-content: flex-end;
}

.wpo-header .vektorizalas-main-menu .wpo-menu-spacing-shell {
    margin-left: auto !important;
}

/*
 * The original 30px menu ran off-screen below ~1500px. The five items need about
 * 35x their font size; derive the size from the space left beside the 358px logo.
 */
.wpo-header nav.vektorizalas-main-menu {
    --wpo-menu-font-size: clamp(16px, calc((100vw - 358px) / 36), 30px) !important;
    --menu-item-spacing: clamp(10px, calc((100vw - 358px) / 36), 30px) !important;
}

.wpo-header nav.vektorizalas-main-menu a {
    line-height: 110px;
    text-transform: uppercase;
}

@media (max-width: 991px) {
    .wpo-header,
    .wpo-header .vektorizalas-header-row {
        min-height: 95px;
    }

    .wpo-header .vektorizalas-header-row {
        padding-left: 0;
    }

    .vektorizalas-brand img {
        max-height: 65px;
    }

    .wpo-header nav.vektorizalas-main-menu a {
        line-height: 1.4;
    }

    /* Line up the hamburger bars with the 15px edge, as on the original. */
    .wpo-header .vektorizalas-main-menu .wpo-menu-hamburger {
        margin-right: -12px;
    }
}

/* ---- Footer (top bar #494949, bottom bar #000) --------------------------- */

.wpo-footer {
    margin-top: 0;
    padding: 0;
    color: #c5d0dd;
    font-size: 15px;
    line-height: 30px;
}

.wpo-footer .wpo-footer__content {
    padding: 0;
}

.wpo-footer .vektorizalas-footer-row,
.wpo-footer .vektorizalas-footer-credit {
    margin: 0;
    padding: 100px max(15px, calc((100% - var(--vektorizalas-container)) / 2)) 131px;
    --wpo-footer-bg: #494949;
}

.wpo-footer .vektorizalas-footer-credit {
    padding-block: 15px;
    color: #fff;
    --wpo-footer-bg: #000;
}

.wpo-footer .vektorizalas-footer-row > .vc_column_container {
    width: min(100%, 360px);
}

.wpo-footer .wpo-footer-content {
    color: inherit;
    font: inherit;
    background: transparent;
}

.wpo-footer .vektorizalas-footer-row .wpo-footer-content p {
    margin: 0 0 15px;
    line-height: 25.5px;
}

.wpo-footer .vektorizalas-footer-credit .wpo-footer-content p {
    margin: 0 0 15px;
}

.wpo-footer .vektorizalas-footer-row a {
    color: #e5e5e5;
}

.wpo-footer .vektorizalas-footer-row a:hover {
    color: #be97c4;
}

.wpo-footer .vektorizalas-footer-row .vektorizalas-footer-logo {
    margin: 0 0 41px;
}

.vektorizalas-footer-logo img {
    display: block;
    width: 360px;
    max-width: 100%;
    height: auto;
}

@media (max-width: 991px) {
    .wpo-footer .vektorizalas-footer-row {
        padding-bottom: 96px;
    }

    .wpo-footer .vektorizalas-footer-credit .wpo-footer-content {
        justify-content: center;
        text-align: center;
    }
}