/*
Theme Name: Zaverukha
Theme URI: https://www.powerforlife.space/
Author: Digital Kiss
Author URI: https://digitalkiss.com.ua/
Description: Алхімія живого жіття
Version: 1.0
License: 1.0
License URI: https://digitalkiss.com.ua/
*/

@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");
:root {
    /* Font Family */
    --global--font-primary: "Roboto", sans-serif;
    /* Font Size */
    --global--font-size-base: 1.25rem;
    --global--font-size-xs: 1rem;
    --global--font-size-sm: 1.125rem;
    --global--font-size-md: 1.25rem;
    --global--font-size-lg: 1.5rem;
    --global--font-size-xl: 2.25rem;
    --global--font-size-xxl: 4rem;
    --global--font-size-xxxl: 5rem;
    --global--font-size-page-title: var(--global--font-size-xxl);
    --global--letter-spacing: normal;
    /* Line Height */
    --global--line-height-body: 1.7;
    --global--line-height-heading: 1.3;
    --global--line-height-page-title: 1.1;
    /* Headings */
    --heading--font-family: var(--global--font-primary);
    --heading--font-size-h6: var(--global--font-size-xs);
    --heading--font-size-h5: var(--global--font-size-sm);
    --heading--font-size-h4: var(--global--font-size-lg);
    --heading--font-size-h3: calc(1.25 * var(--global--font-size-lg));
    --heading--font-size-h2: var(--global--font-size-xl);
    --heading--font-size-h1: var(--global--font-size-page-title);
    --heading--letter-spacing-h6: 0.05em;
    --heading--letter-spacing-h5: 0.05em;
    --heading--letter-spacing-h4: var(--global--letter-spacing);
    --heading--letter-spacing-h3: var(--global--letter-spacing);
    --heading--letter-spacing-h2: var(--global--letter-spacing);
    --heading--letter-spacing-h1: var(--global--letter-spacing);
    --heading--line-height-h6: var(--global--line-height-heading);
    --heading--line-height-h5: var(--global--line-height-heading);
    --heading--line-height-h4: var(--global--line-height-heading);
    --heading--line-height-h3: var(--global--line-height-heading);
    --heading--line-height-h2: var(--global--line-height-heading);
    --heading--line-height-h1: var(--global--line-height-page-title);
    --heading--font-weight: normal;
    --heading--font-weight-page-title: 300;
    --heading--font-weight-strong: 600;
    /* Block: Latest posts */
    --latest-posts--title-font-family: var(--heading--font-family);
    --latest-posts--title-font-size: var(--heading--font-size-h3);
    --latest-posts--description-font-family: var(--global--font-secondary);
    --latest-posts--description-font-size: var(--global--font-size-sm);
    --list--font-family: var(--global--font-secondary);
    --definition-term--font-family: var(--global--font-primary);
    /* Colors */
    --global--color-black: #000;
    --global--color-dark-gray: #28303d;
    --global--color-gray: #39414d;
    --global--color-light-gray: #f0f0f0;
    --global--color-green: #d1e4dd;
    --global--color-dark-blue: rgba(46, 43, 117, 1) !important;
    --global--color-blue: rgba(56, 51, 186, 1);
    --global--color-dark-gold: rgba(179, 125, 16, 1);
    --global--color-gold: rgba(179, 153, 16, 1);
    --global--color-purple: #d1d1e4;
    --global--color-red: #e4d1d1;
    --global--color-orange: #e4dad1;
    --global--color-yellow: #eeeadd;
    --global--color-white: #fff;
    --global--color-dark-blue-10: rgba(56, 51, 186, 0.1);
    --global--color-white-50: rgba(255, 255, 255, 0.5);
    --global--color-white-90: rgba(255, 255, 255, 0.9);
    --global--color-primary: var(--global--color-dark-gray);
    /* Body text color, site title, footer text color. */
    --global--color-secondary: var(--global--color-gray);
    /* Headings */
    --global--color-primary-hover: var(--global--color-primary);
    --global--color-background: var(--global--color-green);
    /* Mint, default body background */
    --global--color-border: var(--global--color-primary);
    /* Used for borders (separators) */
    /* Spacing */
    --global--spacing-unit: 20px;
    --global--spacing-measure: unset;
    --global--spacing-horizontal: 25px;
    --global--spacing-vertical: 30px;
    /* Elevation */
    --global--elevation: 1px 1px 3px 0 rgba(0, 0, 0, 0.2);
    /* Forms */
    --form--font-family: var(--global--font-secondary);
    --form--font-size: var(--global--font-size-sm);
    --form--line-height: var(--global--line-height-body);
    --form--color-text: var(--global--color-dark-gray);
    --form--color-ranged: var(--global--color-secondary);
    --form--label-weight: 500;
    --form--border-color: var(--global--color-secondary);
    --form--border-width: 3px;
    --form--border-radius: 0;
    --form--spacing-unit: calc(0.5 * var(--global--spacing-unit));
    /* Cover block */
    --cover--height: calc(15 * var(--global--spacing-vertical));
    --cover--color-foreground: var(--global--color-white);
    --cover--color-background: var(--global--color-black);
    /* Buttons */
    --button--color-text: var(--global--color-background);
    --button--color-text-hover: var(--global--color-secondary);
    --button--color-text-active: var(--global--color-secondary);
    --button--color-background: var(--global--color-secondary);
    --button--color-background-active: var(--global--color-background);
    --button--font-family: var(--global--font-primary);
    --button--font-size: var(--global--font-size-base);
    --button--font-weight: 500;
    --button--line-height: 1.5;
    --button--border-width: 3px;
    --button--border-radius: 0;
    --button--padding-vertical: 15px;
    --button--padding-horizontal: calc(2 * var(--button--padding-vertical));
    /* entry */
    --entry-header--color: var(--global--color-primary);
    --entry-header--color-link: currentColor;
    --entry-header--color-hover: var(--global--color-primary-hover);
    --entry-header--color-focus: var(--global--color-secondary);
    --entry-header--font-size: var(--heading--font-size-h2);
    --entry-content--font-family: var(--global--font-secondary);
    --entry-author-bio--font-family: var(--heading--font-family);
    --entry-author-bio--font-size: var(--heading--font-size-h4);
    /* Header */
    --branding--color-text: var(--global--color-primary);
    --branding--color-link: var(--global--color-primary);
    --branding--color-link-hover: var(--global--color-secondary);
    --branding--title--font-family: var(--global--font-primary);
    --branding--title--font-size: var(--global--font-size-lg);
    --branding--title--font-size-mobile: var(--heading--font-size-h4);
    --branding--title--font-weight: normal;
    --branding--title--text-transform: uppercase;
    --branding--description--font-family: var(--global--font-secondary);
    --branding--description--font-size: var(--global--font-size-sm);
    --branding--description--font-family: var(--global--font-secondary);
    --branding--logo--max-width: 300px;
    --branding--logo--max-height: 100px;
    --branding--logo--max-width-mobile: 96px;
    --branding--logo--max-height-mobile: 96px;
    /* Main navigation */
    --primary-nav--font-family: var(--global--font-primary);
    --primary-nav--font-family-mobile: var(--global--font-primary);
    --primary-nav--font-size: var(--global--font-size-md);
    --primary-nav--font-size-sub-menu: var(--global--font-size-xs);
    --primary-nav--font-size-mobile: var(--global--font-size-sm);
    --primary-nav--font-size-sub-menu-mobile: var(--global--font-size-sm);
    --primary-nav--font-size-button: var(--global--font-size-xs);
    --primary-nav--font-style: normal;
    --primary-nav--font-style-sub-menu-mobile: normal;
    --primary-nav--font-weight: normal;
    --primary-nav--font-weight-button: 500;
    --primary-nav--color-link: var(--global--color-primary);
    --primary-nav--color-link-hover: var(--global--color-primary-hover);
    --primary-nav--color-text: var(--global--color-primary);
    --primary-nav--padding: calc(0.66 * var(--global--spacing-unit));
    --primary-nav--border-color: var(--global--color-primary);
    /* Pagination */
    --pagination--color-text: var(--global--color-primary);
    --pagination--color-link-hover: var(--global--color-primary-hover);
    --pagination--font-family: var(--global--font-secondary);
    --pagination--font-size: var(--global--font-size-lg);
    --pagination--font-weight: normal;
    --pagination--font-weight-strong: 600;
    /* Footer */
    --footer--color-text: var(--global--color-primary);
    --footer--color-link: var(--global--color-primary);
    --footer--color-link-hover: var(--global--color-primary-hover);
    --footer--font-family: var(--global--font-primary);
    --footer--font-size: var(--global--font-size-sm);
    /* Block: Pull quote */
    --pullquote--font-family: var(--global--font-primary);
    --pullquote--font-size: var(--heading--font-size-h3);
    --pullquote--font-style: normal;
    --pullquote--letter-spacing: var(--heading--letter-spacing-h4);
    --pullquote--line-height: var(--global--line-height-heading);
    --pullquote--border-width: 3px;
    --pullquote--border-color: var(--global--color-primary);
    --pullquote--color-foreground: var(--global--color-primary);
    --pullquote--color-background: var(--global--color-background);
    --quote--font-family: var(--global--font-secondary);
    --quote--font-size: var(--global--font-size-md);
    --quote--font-size-large: var(--global--font-size-xl);
    --quote--font-style: normal;
    --quote--font-weight: 700;
    --quote--font-weight-strong: bolder;
    --quote--font-style-large: normal;
    --quote--font-style-cite: normal;
    --quote--line-height: var(--global--line-height-body);
    --quote--line-height-large: 1.35;
    --separator--border-color: var(--global--color-border);
    --separator--height: 1px;
    /* Block: Table */
    --table--stripes-border-color: var(--global--color-light-gray);
    --table--stripes-background-color: var(--global--color-light-gray);
    --table--has-background-text-color: var(--global--color-dark-gray);
    /* Widgets */
    --widget--line-height-list: 1.9;
    --widget--line-height-title: 1.4;
    --widget--font-weight-title: 700;
    --widget--spacing-menu: calc(0.66 * var(--global--spacing-unit));
}
/* Додаткові стилі для FontAwesome */

@font-face {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    src: url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/webfonts/fa-solid-900.woff2")
        format("woff2");
}
.fas {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-style: normal;
}
/* Ваші власні стилі */

.search-no-results i {
    margin-right: 5px;
    /* Ви можете налаштувати відступ для іконки */
}
@media only screen and (min-width: 652px) {
    :root {
        --global--font-size-xl: 2.5rem;
        --global--font-size-xxl: 6rem;
        --global--font-size-xxxl: 9rem;
        --heading--font-size-h3: 2rem;
        --heading--font-size-h2: 3rem;
    }
}
html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
}
body {
    min-height: 100vh;
    max-width: 100vw;
    background-color: var(--global--color-white) !important;
    margin: 0 auto !important;
    padding: 0 !important;
    font-family: var(--global--font-primary) !important;
    overflow-x: hidden !important;
    display: flex;
    flex-direction: column;
}
main {
    flex: 1;
}
/* Header */

header {
    background: var(--global--color-dark-blue);
    box-shadow: 0 0.1rem 2rem 0.05rem var(--global--color-gray);
    position: sticky;
    /* Змінено на sticky замість fixed */
    display: block;
    z-index: 999;
    width: 100%;
    top: 0;
}
/* global font classes */

h1 {
    color: var(--global--color-dark-blue) !important;
    font-family: var(--heading--font-family);
    font-size: var(--heading--font-size-h1);
    font-style: normal;
    font-weight: 700;
    line-height: var(--heading--line-height-h1);
    width: fit-content;
    max-width: 100%;
    word-wrap: break-word;
}
h2 {
    color: var(--global--color-dark-blue) !important;
    font-family: var(--heading--font-family);
    font-size: var(--heading--font-size-h2);
    font-style: normal;
    font-weight: 700;
    line-height: var(--heading--line-height-h2);
}
h3 {
    color: var(--global--color-dark-blue) !important;
    font-family: var(--heading--font-family);
    font-size: var(--heading--font-size-h3);
    font-style: normal;
    font-weight: 700;
    line-height: var(--heading--line-height-h3);
}
h4 {
    color: var(--global--color-dark-blue) !important;
    font-family: var(--heading--font-family);
    font-size: var(--heading--font-size-h4);
    font-style: normal;
    font-weight: 700;
    line-height: var(--heading--line-height-h4);
}
h5 {
    color: var(--global--color-dark-blue) !important;
    font-family: var(--heading--font-family);
    font-size: var(--heading--font-size-h5);
    font-style: normal;
    font-weight: 700;
    line-height: var(--heading--line-height-h5);
}
h6 {
    color: var(--global--color-dark-blue) !important;
    font-family: var(--heading--font-family);
    font-size: var(--heading--font-size-h6);
    font-style: normal;
    font-weight: 700;
    line-height: var(--heading--line-height-h6);
}
p,
a,
span {
    font-family: var(--heading--font-family);
    font-size: calc(var(--global--font-size-base) * 1vw);
}
a {
    font-family: var(--heading--font-family) !important;
}
/* Navigation */

.nav-link.active {
    color: var(--global--color-white) !important;
}
.navbar-toggler {
    border: none !important;
}
.navbar-toggler:focus {
    box-shadow: none !important;
}
#navcol-1 {
    margin-left: 17px;
}
.languages a {
    color: var(--global--color-white) !important;
    text-decoration: none !important;
}
.languages .dropdown-menu {
    background-color: var(--global--color-dark-blue);
    width: auto;
    min-width: 50px;
}
.search_drop {
    margin: 0 2% 0 2% !important;
}
.search_drop > .dropdown-menu {
    background-color: var(--global--color-dark-blue);
}
/* search */

#searchform {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    background-color: var(--global--color-dark-blue);
}
#s {
    flex-grow: 1;
    margin-right: 10px;
}
#searchsubmit {
    background-color: var(--global--color-dark-blue);
    color: var(--global--color-white);
    border: none;
    padding: 5px 10px;
    cursor: pointer;
}
.search-title a {
    color: var(--global--color-gold) !important;
}
.search-title a:hover {
    color: var(--global--color-dark-blue) !important;
}
.pagination > .nav-links {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
    align-items: center;
    display: flex;
}
.pagination > .nav-links > a,
.pagination > .nav-links > span {
    padding-right: 0.5rem !important;
    color: var(--global--color-dark-blue) !important;
}
/* Banner Home */

.banner_top {
    max-width: 1400px;
    align-items: center;
    display: flex;
    justify-content: center;
    margin-right: auto;
    margin-left: auto;
}
.banner_top .container-lg {
    min-height: 580px;
}
/* About */

.block_about {
    margin-top: 4%;
}
.block_about_text {
    padding-right: 4vw;
    padding-left: 4vw;
}
.block_about_soc_icon {
    /* position: absolute; */
    bottom: 16%;
    background-color: var(--global--color-white);
    /* box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4); */
}
.block_about_img {
    position: relative;
    padding: 4vw 2vw 5vw 2vw !important;
}
.about_soc_icon {
    width: 2rem;
    height: 2rem;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
.img_about {
    width: 100%;
    border-radius: 15px;
    margin-right: 0;
    margin-left: 0;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4);
}
/* Blog */

.block_blog {
    background-color: var(--global--color-dark-blue-10);
}
.back_pipl {
    background-image: url(./img/fon_pipl.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
.block_pipl {
    padding: 20px;
    border-radius: 15px !important;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2) !important;
    --bs-card-inner-border-radius: 15px !important;
    background: rgba(255, 255, 255, 0.7);
}
.btn-primary {
    text-decoration: none;
    display: inline-block;
    color: var(--global--color-dark-blue) !important;
    margin: 10px 20px;
    border-radius: 10px;
    font-family: var(--heading--font-family) !important;
    text-transform: uppercase;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    transition: 0.2s ease-in-out;
    border-color: var(--global--color-dark-blue) !important;
    background-color: var(--global--color-white) !important;
    position: relative;
    overflow: hidden;
}
.btn-primary-dark {
    text-decoration: none;
    display: inline-block;
    color: var(--global--color-white) !important;
    margin: 10px 20px;
    border-radius: 10px;
    font-family: var(--heading--font-family) !important;
    text-transform: uppercase;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    transition: 0.2s ease-in-out;
    border-color: var(--global--color-dark-blue) !important;
    background-color: var(--global--color-dark-blue) !important;
    position: relative;
    overflow: hidden;
}
.btn-primary::before,
.btn-primary-dark::before,
.btn-gold::before {
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.1),
        rgba(255, 255, 255, 0.5)
    );
    height: 50px;
    width: 50px;
    position: absolute;
    top: -8px;
    left: -75px;
    transform: skewX(-45deg);
    content: "";
    will-change: left;
    transition: left 0.5s ease-in-out;
}
.btn-primary:hover,
.btn-primary-dark:hover,
.btn-gold:hover {
    background: var(--global--color-gold) !important;
    border-color: var(--global--color-gold) !important;
    color: var(--global--color-white) !important;
}
.btn-primary:hover:before,
.btn-primary-dark:hover:before,
.btn-gold:hover:before {
    left: 150px;
    transition: 0.5s ease-in-out;
}
/* Posts */

.breadcrumbs a {
    color: var(--global--color-dark-blue) !important;
    text-decoration: none;
    font-size: 0.8rem;
    font-weight: var(--heading--font-weight-strong);
}
.breadcrumbs span {
    font-size: 0.8rem;
    color: var(--global--color-gray) !important;
}
.img_post img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
}
p.text_gold {
    color: var(--global--color-gold) !important;
    text-transform: capitalize;
}
.card-body {
    min-height: 375px;
}
.card_blog {
    border-radius: 15px !important;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2) !important;
    --bs-card-inner-border-radius: 15px !important;
}
.card-title {
    min-height: 85px;
}
.card-text.text_min {
    min-height: 97px;
}
/* Pipl */

.accordion_but .accordion-button {
    padding: 0.5rem 0.3rem;
}
/* wp-bootstrap */

.has-text-align-center {
    text-align: center;
}
.Block_consultation {
    background: var(--global--color-dark-blue);
}
.Block_consultation h2,
.Block_consultation p {
    color: var(--global--color-white) !important;
}
/* Form */

.form-check-label > span,
.form-check-label > a {
    font-size: 0.8rem !important;
    color: var(--global--color-dark-blue) !important;
    text-decoration: none;
}
.btn-gold {
    text-decoration: none;
    display: inline-block;
    color: var(--global--color-white) !important;
    margin: 10px 20px;
    border-radius: 10px;
    font-family: var(--heading--font-family) !important;
    text-transform: uppercase;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    transition: 0.2s ease-in-out;
    border-color: var(--global--color-gold) !important;
    background-color: var(--global--color-gold) !important;
    position: relative;
    overflow: hidden;
}
.feedback_block {
    background: linear-gradient(
        to right,
        #bf953f,
        #fcf6ba,
        #b38728,
        #fbf5b7,
        #aa771c
    );
}
/* Message */

.message_block {
    border-radius: 15px;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
    background-color: var(--global--color-dark-blue-10);
    max-width: 49% !important;
}
.message_block_index {
    border-radius: 15px;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
    background-color: var(--global--color-dark-blue-10);
}
.carousel-indicators {
    position: absolute;
    right: 0;
    bottom: -20px !important;
    left: 0;
    z-index: 2;
    display: flex;
    justify-content: center;
    padding: 0;
    margin-right: 15%;
    margin-bottom: 1rem;
    margin-left: 15%;
}
.carousel-control-prev {
    left: -7.5% !important;
}
.carousel-control-next {
    right: -7.5% !important;
}
/* Soc link*/

.list--horizontal {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}
ul.social--nav li {
    list-style: none;
}
.popover--share-advanced .popover__container .copy {
    border: 1px solid #f0f0f0;
    border-radius: 8px;
}
.popover--share-advanced .popover__container .copy_link {
    background-color: #ffffff;
    border: none;
    border-radius: 8px 0 0 8px;
}
html .mg-bottom-lv2 {
    margin-bottom: 10px;
}
.copy {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    position: relative;
}
.copy_link {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    box-flex: 1;
    -webkit-flex: 1;
    -moz-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative;
    border: 1px solid #d8d8d8;
    border-width: 1px 0 1px 1px;
    border-radius: 3px 0 0 3px;
    background-color: #f2f2f2;
    align-self: stretch;
    overflow: hidden;
    /* Додаємо властивість overflow для скривання зайвого тексту */
    height: 30px;
    /* Задаємо фіксовану висоту */
}
.copy_link span {
    color: #777;
    font-size: 13px;
    font-weight: 400;
    white-space: nowrap;
    padding: 0 4%;
    overflow: hidden;
    /* Додаємо властивість overflow для скривання зайвого тексту */
    text-overflow: ellipsis;
    justify-content: start;
    display: flex;
}
.copy_link span label {
    display: block;
    padding: 5px;
    /* Додаємо відступи для кращого вигляду */
}
.btn-instagram {
    --bs-btn-border-color: none !important;
    background: linear-gradient(
        115deg,
        rgb(249, 206, 52),
        rgb(238, 42, 123),
        rgb(98, 40, 215)
    ) !important;
    color: var(--global--color-white) !important;
}
.btn-facebook {
    --bs-btn-border-color: none !important;
    background: #3b5998 !important;
    color: var(--global--color-white) !important;
}
.btn-telegram {
    --bs-btn-border-color: none !important;
    background: #229ed9 !important;
    color: var(--global--color-white) !important;
}
.page-numbers.current {
    font-weight: 900;
}
.page-numbers {
    padding: 0 1rem;
    color: var(--global--color-dark-blue) !important;
}
/* Magic PIPL Day*/

.top_magic_day {
    background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/Baner-top.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.MD_top_p {
    font-size: var(--global--font-size-md);
}
.about_academy {
    background-color: #f0f9ff;
}
/* Footer */

footer {
    background: var(--global--color-dark-blue);
}
footer li {
    color: var(--global--color-white) !important;
}
footer li a.link-secondary {
    color: var(--global--color-white) !important;
    text-decoration: none;
}
footer .logo_zaverukha_white {
    width: 185px;
    height: 65px;
}
footer .navbar-brand {
    width: auto;
}
.img_block img {
    width: 100%;
    height: auto;
    border-radius: 15px;
    margin-right: 0;
    margin-left: 0;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4);
}
img.img_feedback {
    width: 60%;
}
.dresscode_fon {
    background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/dresscode.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.tree_fon {
    background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/banner-tree-scaled.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    height: 40vh;
}
.zahid_1 {
    background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/фото-1.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    height: 496px;
}
.zahid_2 {
    background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/фото-2-1.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    height: 496px;
}
.citata_fon {
    background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/baner-citata-scaled.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    height: 40vh;
}
.bottom_fon {
    background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/bottom-fon.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.tab_MPD table.has-fixed-layout {
    border-collapse: collapse;
    /* Згладжує межі */
    width: 100%;
}
.tab_MPD table.has-fixed-layout tr {
    border-bottom: 2px solid #8cd0e5;
    /* Лінія синього кольору */
}
.tab_MPD table.has-fixed-layout td {
    padding: 8px;
    /* Простір у клітинках */
}
.vidguk img {
    width: 100%;
    height: auto;
}
.block-1 {
    order: 1;
}
.block-2 {
    order: 2;
}
.block-3 {
    order: 3;
}
.block-4 {
    order: 4;
}
.block-5 {
    order: 5;
}
.block-6 {
    order: 6;
}
.block-7 {
    order: 7;
}
.block-8 {
    order: 8;
}
.block-9 {
    order: 9;
}
.block-10 {
    order: 10;
}
.accordion-item {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    outline: none !important;
    /* Забирає обведення */
}
.accordion {
    --bs-accordion-btn-bg: #f4f4fc !important;
}
.telegram-button {
    position: relative;
    /* Для позиціонування іконки */
    padding-right: 40px !important;
    /* Місце для іконки праворуч */
    color: white;
    /* Колір тексту */
    font-size: 16px;
    /* Розмір шрифту */
    text-decoration: none;
    display: inline-block;
    background-color: #0088cc;
    /* Колір кнопки як у Telegram */
    border-radius: 5px;
    /* Закруглені краї */
    border: none;
    /* Без обрамлення */
    height: 40px;
    /* Висота кнопки */
    line-height: 40px;
    /* Вирівнювання тексту */
}
.telegram-button::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    /* Відступ від правого краю */
    transform: translateY(-50%);
    width: 20px;
    /* Ширина іконки */
    height: 20px;
    /* Висота іконки */
    background-image: url('data:image/svg+xml,%3csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"%3e%3cpath d="M11.944 24c-.43 0-.679-.235-.844-.799L9.3 17.279l-6.02-2.028c-.573-.193-.586-.477-.122-.673l21.724-8.348c.454-.19.865.11.713.753l-3.704 17.33c-.119.538-.429.656-.87.436l-6.012-4.435-2.9 2.799c-.238.238-.429.352-.611.352zM8.88 15.178l1.528 4.788c.083.26.212.32.334.065l2.4-4.989-4.256.136-.006-.002zm8.974 3.167l3.074 2.269c.216.123.352.06.404-.201l3.153-14.743c.054-.255-.084-.356-.289-.254l-18.605 7.147c-.24.095-.239.226.008.304l4.964 1.67 8.923-6.768c.145-.111.277-.05.17.06l-7.3 7.268 5.498 3.448z"%3e%3c/path%3e%3c/svg%3e');
    background-size: contain;
    /* Масштабування зображення */
    background-repeat: no-repeat;
    /* Іконка не повторюється */
}
/* =========================
   🎨 MY CREATIVE SECTION
========================= */

.my-creativity h2 {
    font-size: 2rem;
    font-weight: 500;
}
.creative-card {
    background: #fff;
    transition: 0.3s ease;
}
.creative-card:hover {
    transform: translateY(-6px);
}
.creative-card img {
    width: 100%;
    height: auto;
}
/* =========================
   📚 BOOKS SECTION WRAPPER
========================= */

.books-section {
    padding: 40px 0;
}
/* 🔥 MAIN WRAPPER (AREOI STYLE) */

.areoi-section-wrapper {
    border-radius: 30px;
    overflow: hidden;
    background: #fff;
    margin: 40px;
    padding: 40px 0;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.06);
}
/* =========================
   🏷 TITLE
========================= */

.areoi-section-title {
    font-size: 2rem;
    margin-top: 0;
    margin-bottom: 0.5rem;
    font-weight: 500;
    line-height: 1.2;
}
/* =========================
   🖼 IMAGE
========================= */

.areoi-image-wrap {
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4);
}
.areoi-image-wrap img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
}
/* =========================
   📝 TEXT CONTENT
========================= */

.areoi-text {
    font-size: 16px;
    opacity: 0.9;
}
/* списки WP */

.areoi-text ul {
    padding-left: 20px;
    margin: 10px 0;
}
.areoi-text li {
    margin-bottom: 8px;
    line-height: 1.6;
}
/* =========================
   🔘 BUTTONS
========================= */

.areoi-btn,
.block-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 28px;
    border-radius: 999px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s ease;
}
/* DARK BUTTON (primary style) */

.btn-primary-dark {
    background: #111;
    color: #fff;
    border: 1px solid #111;
}
.btn-primary-dark:hover {
    background: #fff;
    color: #111;
}
/* fallback */

.btn-primary {
    background: #000;
    color: #fff;
}
/* =========================
   📏 SEPARATOR
========================= */

.areoi-separator {
    margin: 40px auto;
    max-width: 1100px;
    opacity: 0.15;
}
/* =========================
        HEADER
========================= */

.books-header h2 {
    font-size: 2rem;
    font-weight: 500;
}
/* TOGGLE BUTTON */

.books-toggle-text {
    background-color: var(--global--color-gold);
    border: none;
    padding: 0 4px;
    font-size: 16px;
    cursor: pointer;
    color: #fff;
    opacity: 0.7;
    text-decoration: none;
    transition: 0.3s;
}
.books-toggle-text:hover {
    opacity: 1;
}
/* BANNER */

.books-banner img {
    width: 100%;
    border-radius: 18px;
    object-fit: cover;
}
/* HIDE CONTENT */

.is-hidden {
    display: none;
}
.books-banner img {
    width: 100%;
    border-radius: 18px;
    cursor: pointer;
}
/* rotation */

.books-open .arrow {
    transform: rotate(180deg);
}

/* =========================
   ACCORDION BASE
========================= */

.toggle-content {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.5s ease;
}

/* коли відкрито */
.toggle-content.is-open {
    max-height: 5000px; /* достатньо велике значення */
}

/* внутрішній блок */
.toggle-inner {
    padding-top: 20px;
}

/* банер */
.books-banner-wrap img {
    width: 100%;
    border-radius: 18px;
    cursor: pointer;
}

/* кнопка */
.toggle-trigger {
    background: none;
    border: none;
    font-size: 16px;
    cursor: pointer;
    opacity: 0.8;
}

.toggle-trigger:hover {
    opacity: 1;
}

.search-drop {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: 0.3s ease;
}

.search-drop.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

body.search-active {
    overflow: hidden;
}
/* video youtube */
.wp-block-embed {
    max-width: 100%;
}

.wp-block-embed__wrapper {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 */
}

.wp-block-embed__wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    border: 0;
}

/* wrapper */
.artifacts-wrapper {
    position: relative;
}

.artifacts-banner,
.banner-wrap,
.books-banner {
    position: relative;
}

/* banner */
.artifacts-banner img {
    width: 100%;
    border-radius: 18px;
    cursor: pointer;
}

.artifact-hand {
    position: absolute;

    bottom: -1rem; /* 🔥 трохи ВИХОДИТЬ знизу банера */
    right: 16px; /* справа всередині банера */

    font-size: 30px;
    z-index: 10;

    animation: blink 1.2s infinite;

    pointer-events: none;

    transition:
        opacity 0.3s ease,
        transform 0.3s ease;
}

.artifact-trigger {
    position: relative;
}

.artifact-hand-inside {
    position: absolute;

    bottom: 1rem; /* 🔥 трохи ВИХОДИТЬ знизу банера */
    right: 3%; /* справа всередині банера */

    font-size: 30px;
    z-index: 10;

    animation: blink 1.2s infinite;

    pointer-events: none;
    opacity: 1;
    transition:
        opacity 0.3s ease,
        transform 0.3s ease;
}

.artifact-item.is-open .artifact-hand-inside {
    opacity: 0;
    animation: none; /* 👈 ВАЖЛИВО */
    pointer-events: none;
}

@keyframes blink {
    0%,
    100% {
        opacity: 1;
        transform: translateY(0);
    }
    50% {
        opacity: 0.25;
        transform: translateY(-4px);
    }
}

/* коли відкрита секція */
.toggle-section.is-open .artifact-hand {
    opacity: 0;
    transform: scale(0.7);
    pointer-events: none;
}

/* щоб не було конфлікту — НЕ ховай через JS display */
.toggle-section .banner-wrap {
    display: block;
}

.toggle-section.is-open .banner-wrap {
    display: none;
}

/* accordion */
.content {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: all 0.5s ease;
}

.toggle-section.is-open .content {
    max-height: 5000px;
    opacity: 1;
}

.toggle-btn {
    width: 100%;
    display: flex;
    justify-content: flex-end; /* стрілка вправо */
    align-items: center;
}

.arrow {
    display: inline-block;
    transition: transform 0.3s ease;
}

.books-section,
.music-section,
.artifacts-section {
    position: relative;
}

.books-section::after,
.music-section::after,
.artifacts-section::after {
    content: "";
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 0;
    height: 1px;
    background: rgba(0, 0, 0, 0.08);
}

/* =========================
   📱 TABLET
========================= */

@media (max-width: 992px) {
    .areoi-section-wrapper {
        margin: 20px;
        border-radius: 22px;
    }
    .areoi-book-block {
        text-align: center;
    }
    .areoi-text {
        text-align: center;
    }
    .areoi-btn {
        margin: 0 auto;
    }
}
/* =========================
   📱 MOBILE
========================= */

@media (max-width: 576px) {
    .areoi-section-wrapper {
        margin: 10px;
        border-radius: 16px;
        padding: 30px 0;
    }
    .areoi-title {
        font-size: 22px;
    }
    .areoi-btn {
        width: 100%;
        text-align: center;
    }
    .areoi-book-block {
        text-align: center;
    }
}
@media only screen and (max-width: 1280px) {
}
@media only screen and (max-width: 992px) {
    .navbar-expand-md {
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
    .card-title {
        min-height: 85px;
    }
    .card-text.text_min {
        min-height: 97px;
    }
    footer .about_soc_icon {
        width: 1.2rem;
        height: 1.2rem;
    }
    .top_magic_day {
        background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/Baner-top-pad.jpg);
    }
    .dresscode_fon {
        background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/dresscode-pad.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
    }
    .tree_fon {
        background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/banner-tree-pad-scaled.jpg);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
        height: 40vh;
    }
    .citata_fon {
        background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/baner-citata-pad-scaled.jpg);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
        height: 40vh;
    }
    .bottom_fon {
        background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/bottom-fon-pad-scaled.jpg);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
        height: 40vh;
    }
    .block-3 {
        order: 4;
    }
    .block-4 {
        order: 3;
    }
    .block-7 {
        order: 8;
    }
    .block-8 {
        order: 7;
    }
}
@media only screen and (max-width: 768px) {
    footer .logo_zaverukha_white {
        margin: auto;
    }
    #carousel-1 {
        min-height: auto;
        margin-top: 15%;
    }
    .top_magic_day {
        background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/Baner-top-pad.jpg);
    }
    .icon_star img {
        width: 60px !important;
        height: auto !important;
        margin-right: 20%;
    }
    .warning_star img {
        width: 44px !important;
        height: auto !important;
    }
    .q_icon img {
        width: 50px !important;
        height: auto !important;
    }
    .block-1 {
        order: 1;
    }
    .block-2 {
        order: 2;
    }
    .block-3 {
        order: 3;
    }
    .block-4 {
        order: 4;
    }
    .block-5 {
        order: 5;
    }
    .block-6 {
        order: 6;
    }
    .block-7 {
        order: 7;
    }
    .block-8 {
        order: 8;
    }
    .block-9 {
        order: 9;
    }
    .block-10 {
        order: 10;
    }

    .artifact-hand-inside {
        right: 5%; /* справа всередині банера */
    }
}
@media only screen and (max-width: 576px) {
    .banner_top .container-lg {
        min-height: 350px;
    }
    .block_about_text h4 {
        font-size: calc(1.1rem + 0.3vw);
        margin-bottom: 0rem;
    }
    .block_about_text p {
        font-size: 0.9rem;
        margin-bottom: 0rem;
    }
    .block_about_text ul {
        font-size: 0.8rem;
    }
    .dropdown-menu[data-bs-popper] {
        top: 100%;
        left: auto !important;
        margin-top: var(--bs-dropdown-spacer);
        right: 0px;
        top: 25px !important;
    }
    .search_mob {
        left: 6px;
    }
    footer .logo_zaverukha_white {
        margin: auto;
    }
    .logo_zaverukha_white {
        width: 85px !important;
    }
    .message_block {
        max-width: 100% !important;
    }
    .desktop-block {
        display: none;
    }
    .card-body {
        min-height: auto;
    }
    img.img_feedback {
        width: 100%;
    }
    #carousel-1,
    .img_banner_top {
        min-height: auto;
    }
    .top_magic_day {
        background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/Baner-top-mob.jpg);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
    }
    .block-c69e2204-9d41-4087-a71a-c14d129d3a27 {
        height: 270px !important;
    }
    .dresscode_fon {
        background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/dresscode-mob.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
    }
    .tree_fon {
        background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/banner-tree-mob.png);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
        height: 40vh;
    }
    .citata_fon {
        background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/baner-citata-mob.jpg);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
        height: 40vh;
    }
    .bottom_fon {
        background-image: url(https://zaverukha.com/wp-content/uploads/2024/12/bottom-fon-mob.jpg);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
        height: 40vh;
    }
    .icon_star img {
        width: 42px !important;
        height: auto !important;
        margin-right: 50%;
    }
    .dress_star img {
        width: 30px !important;
        height: auto !important;
    }
    .warning_star img {
        width: 30px !important;
        height: auto !important;
    }
    .q_icon {
        margin-bottom: 0;
    }
    .q_icon img {
        width: 40px !important;
        height: auto !important;
    }
}
@media only screen and (min-width: 577px) {
    .mobile-block {
        display: none;
    }
}