:root {
    --primary-color: #F97316;
    --dark-primary-color: #e95f00;
    --black-color: #333333;
    --light-black-color: #555555;
    --white-color: #ffffff;
/*    --gray-color: #E5E7EB;*/
/*    --gray-color: #efe5d8;*/
    --gray-color: #efedea;
    --dark-gray-color: #efe5d8;
    

    --text-font: 'Montserrat';

    --padding-page: 20px;
    --padding-page-mobile: 15px;

    --font-size-small: 16px;
    --font-size-regular: 18px;
    --font-size-navigation: 24px;

    --border-radius: 20px;
    --border-radius-btn: 25px;

    --primary-color-filter: brightness(0) saturate(100%) invert(72%) sepia(58%) saturate(5650%) hue-rotate(347deg) brightness(96%) contrast(104%);
    --white-color-filter: brightness(0) saturate(100%) invert(92%) sepia(95%) saturate(25%) hue-rotate(223deg) brightness(107%) contrast(100%);
    --gray-color-filter: brightness(0) saturate(100%) invert(97%) sepia(2%) saturate(390%) hue-rotate(339deg) brightness(102%) contrast(87%);
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: var(--text-font);
    font-size: 17px;
    color: var(--black-color);
}
html {
    scroll-behavior: smooth;
}

body {position: relative;}
main { margin-top: 100px; margin-bottom: 100px}

main section + section { margin-top: 100px}

.padding_page { padding-left: var(--padding-page); padding-right: var(--padding-page)}
.section_text { max-width: 500px}
.section_text p + p { margin-top: 10px}

.horizontal_section { display: flex; justify-content: space-evenly; align-items: center; gap: 20px; }
.horizontal_item { display: flex; gap: 10px; }

h2 { 
    text-align: center;
    font-weight: 700;
    /*    font-size: 32px;*/
    font-size: 36px;
    margin-bottom: 10px;
}
h3 {
    /* font-size: 28px; */
    font-size: 26px;
    font-weight: 700;
    margin-bottom: 10px;
}
p { line-height: 1.5 }
.subtitle { text-align: center; margin-bottom: 60px; }

.btn {
    display: block;
    width: fit-content;
    padding: 10px 15px;
    font-weight: 500;
    text-decoration: none;
    line-height: 1;
    border-radius: var(--border-radius-btn);
    border: 2px solid;
    cursor: pointer;
    transition: all 0.3s ease-out;
}
.btn--primary { 
    background-color: var(--primary-color); 
    color: var(--white-color); 
    border-color: var(--primary-color); 
}
.btn--primary:hover { 
    /*background: transparent; 
    color: var(--primary-color); 
    border-color: var(--primary-color);*/

    background: var(--dark-primary-color);
    border-color: var(--dark-primary-color);
}
.btn--info { 
    background-color: var(--gray-color); 
    color: var(--black-color); 
    border-color: var(--gray-color); 
}
.btn--info:hover { 
    /*    border-color: var(--black-color);*/
    background-color: var(--dark-gray-color); 
    border-color: var(--dark-gray-color); 
}

.image, .icon { 
    position: relative; 
    width: 50px; 
    height: 50px;
}
.image img, .icon img { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    object-fit: cover;
}
.image {
    width: 500px; 
    height: 500px;
    box-shadow: 2px 12px 40px 20px var(--gray-color); 
    border-radius: var(--border-radius); 
}
.image img { border-radius: var(--border-radius); }


/* || Accorion */
/* |||| Functionality */
.accordion { position: relative; }
.accordion input { position: absolute; opacity: 0; z-index: -1; }
.accordion__content { max-height: 0; overflow: hidden; transition: all 0.35s; }
.accordion input:checked ~ .accordion__content { max-height: 10rem; }

/* |||| Visual styles */
.accordion__label { display: flex; cursor: pointer; }
.accordion__label { justify-content: space-between; }
.accordion__label::after {
    content: "\276F";
    width: 18px;
    height: 18px;
    text-align: center;
    transform: rotate(90deg);
    transition: all 0.35s;
    color: var(--black-color);
}
.accordion input:checked + .accordion__label::after { transform: rotate(270deg); }
.accordion__content p { margin: 0; }
/* || End Accorion */



/* || Collapsible */
.collapsible { width: 600px; font-family: Arial, sans-serif; line-height: 1.5; position: relative; }
.collapsible__label { cursor:pointer; }
.collapsible__checkbox { display: none; }
.collapsible__content { display: flex; }
.collapsible__text_wrapper { overflow: hidden; max-height: 22px; position: relative; transition: all 0.35s; }

.collapsible__checkbox:checked + .collapsible__content .collapsible__text_wrapper { max-height: 300px;}
.collapsible__checkbox:checked + .collapsible__content .collapsible__label__show { display:none; opacity: 0; visibility: 0; pointer-events:none; font-size:1px; }
.collapsible__label__hide { color: blue; cursor: pointer; display:none; }
/* || End Collapsible */


.home_page { margin-top: 0; margin-bottom: 0;}

@media screen and (max-width: 767px) {
    main section + section { margin-top: 70px;}
    .horizontal_section { flex-direction: column;}
    .image { box-shadow: 2px 2px 15px 5px var(--gray-color); }
}

@media screen and (max-width: 500px) {
    .image { width: 100%; height: 350px; }
}


/* || Privacy Policy */
.privacy_policy { max-width: 800px; margin: 100px auto; padding: 0 var(--padding-page)}
.privacy_policy h1 {font-size: 36px;text-align: center;margin-bottom: 20px;}
.privacy_policy h2 {font-size: 22px;text-align: left}
.privacy_policy p { margin-top: 10px; margin-bottom: 10px}
.privacy_policy__content { margin-top: 30px}
.privacy_policy ul { padding-left: 20px}
.privacy_policy ul li { margin-bottom: 5px}
.privacy_policy a { word-break: break-all;}