:root {
    --second: hsl(221, 100%, 5%);
    --second-light: hsl(198, 61%, 31%);
    --primary: hsl(23, 83%, 53%);
    --gray: hsl(0, 0%, 40%);
    --dark-gray: hsl(0, 0%, 20%);
    --light-gray: hsl(200, 3%, 79%);
    --light-gray-opacity: hsla(200, 3%, 79%, 25%);
    --white: hsl(0, 0%, 100%);
    --white-opacity: rgb(255 255 255 / 0.8);
    --gray-opacity: rgb(102 102 102 / 0.8);
    --gray-opacity-strong: rgb(102 102 102 / 0.05);
    --text: hsl(0, 0%, 20%);
    --text-shadow: 1px 1px 2px rgb(0 0 0 / 0.3);
    --shadow: 0 10px 30px rgba(0, 0, 0, 0.08); 
    --shaddow-hover: transform 0.3s, box-shadow 0.3s; 
    --bg-dark: url('../img/bg_dark.webp');
    --bg-light: url('../img/bg_white.webp');
    --bg-repeat: repeat;
    --bg-position: top left;
    --font-oswald: 'Oswald', 'Arial Narrow', Arial, sans-serif;
    --font-arial-narrow: 'Arial Narrow', Arial, sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box;}
body { font-family: Arial, 'Helvetica Neue', sans-serif; background: var(--white); color: var(--text); padding-top: 104px;font-size: 16px;}
      @media (max-width: 1024px) {body {padding-top: 82px; font-size: 14px;}}  

.container {  margin: 0 auto; width: 100%;padding:0 20px}
@media (min-width: 1561px) {.container {padding:0;max-width: 1560px;}}
 @media (max-width: 768px) {.container {max-width: 100%; padding: 0 16px;}}

h1, h2, h3, .header-title, .stat-number, .header-nav a, .footer-nav a {
    font-family: var(--font-oswald);
}
.header { position: fixed;top: 0; left: 0;width: 100%; z-index: 10000;transition: background-color 0.3s ease;}

.header.header-scrolled {  background: var(--bg-light); background-size: 150px auto;  color: var(--second);}
    .header-scrolled .nav a, .header-scrolled .burger span, .header-scrolled .lang-switch a, .header-scrolled .icon-orange, .header-scrolled .logo-box, .header-scrolled .lang-switch  a:not(:last-child)::after { color: var(--second); }
    .header-scrolled .date-place {color: var(--gray-opacity);}
    .header-scrolled .lang-switch a.active { color: var(--gray); text-decoration: none; }
    .header-scrolled .header-row--first {border-bottom: 1px solid var(--gray-opacity);}
    .header-scrolled .burger span, .header-scrolled .burger::before, .header-scrolled .burger::after { background: var(--second);}
    .header.header-scrolled .btn-outline { border-color: var(--second); color: var(--second);}
    .header.header-scrolled .btn-primary { background: var(--second); border: none; color: var(--white);  border: 1px solid transparent;}
    .header.header-scrolled .btn-primary:hover {background: transparent; border: 1px solid var(--second); color: var(--second); }
    .header.header-scrolled .btn-outline:hover {background: var(--second); color: var(--white);  }

@media (max-width: 768px) {
        .header-scrolled .header-row--first {border-bottom: none} 
        .header-scrolled .nav a {color: var(--white);}
    }

.header { background: var(--bg-dark) var(--bg-repeat);  color: var(--white); background-size: 150px auto; padding: 20px 0 15px 0;  background-size: 180px auto; border-bottom: 4px solid var(--primary);}
.grid-header { display: grid; grid-template-columns: auto 1fr; gap: 20px; align-items: start; }
.grid-col-logo { display: flex; align-items: flex-start; }
.logo-box { background-color: var(--primary); border-radius: 5px; display: inline-block; padding: 4px 10px;}
    .logo-img { height: 50px; width: auto; display: block;}

.header-row--first { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; padding-bottom: 10px; border-bottom: 1px solid var(--white-opacity);}
.date-place { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; font-size: .9rem; color: var(--white-opacity);}
.icon-orange { color: var(--primary); }
.search-lang { display: flex; align-items: center; gap: 24px; }
.lang-switch { display: flex; gap: 8px; }
    .lang-switch a { color: var(--primary); text-decoration: none; }
    .lang-switch a.active { color: var(--white); text-decoration: none; }
    .lang-switch a:hover { color: var(--white-opacity); }
.lang-switch  a:not(:last-child)::after { content: ' /'; position: relative;  margin: 0px 0px 0 4px; color: var(--white); background: transparent;}
.header-row--second { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 24px; padding-top: 10px;}

.nav { display: flex; flex-wrap: wrap; gap: 0; justify-content: center; flex: 1; }
    .nav a { font-family: 'Oswald', sans-serif; font-size: 1.1rem; color: var(--white); text-decoration: none; padding: 0 1vw; position: relative; text-transform: uppercase;letter-spacing: 1px;}
        .nav a:not(:last-child)::after { content: '|'; position: relative; right: -1vw; color: var(--primary); background: transparent; width: auto; height: auto; }
        .nav a:hover, .nav li.active a { color: var(--primary); }
        .nav > ul { display: flex; flex-wrap: wrap; gap: 0; list-style: none; margin: 0; padding: 0; }
        .nav > ul > li { position: relative; }

    .nav .podmenu { position: absolute; top: 42px; left: 0; background: var(--white); min-width: 240px; padding: 10px 0 0 0 0; z-index: 10; border: 1px solid var(--primary); opacity: 0; visibility: hidden; transition: 0.2s; }
    .nav > ul > li:hover .podmenu { opacity: 1; visibility: visible; }
        .nav .podmenu li { display: block; margin: 0; padding: 0; }
         .nav li.active .podmenu a, .nav .podmenu a { font-family: 'Arial', sans-serif; font-size: 0.9rem; color: var(--second); padding: 8px 16px; display: block; white-space: nowrap; text-transform: none;letter-spacing: 0px;}
        .header-scrolled .nav .podmenu a:hover,  .nav .podmenu a:hover, .nav li.active .podmenu a:hover { background: var(--primary); color: var(--white); }
        .nav .podmenu a::after { display: none; }

    .burger { display: none; cursor: pointer; width: 30px; height: 20px; position: relative; }
        .burger span { position: absolute; left: 0; width: 100%; height: 3px; background: var(--primary); transition: 0.2s; top: 50%; transform: translateY(-50%); }
        .burger::before { content: ''; position: absolute; left: 0; width: 100%; height: 3px; background: var(--primary); transition: 0.2s; top: 0; }
        .burger::after { content: ''; position: absolute; left: 0; width: 100%; height: 3px; background: var(--primary); transition: 0.2s; bottom: 0; }
        .burger.active span { opacity: 0; }
        .burger.active::before { top: 50%; transform: translateY(-50%) rotate(45deg); }
        .burger.active::after { bottom: 50%; transform: translateY(50%) rotate(-45deg); }

@media (max-width: 1400px) {
    .action-buttons {display: none !important;}

}

@media (max-width: 768px) {
    .grid-header { display: grid; grid-template-columns: auto 1fr auto; gap: 20px; align-items: center; }
    .burger { display: flex; }
    .header-row--first {border-bottom: none;padding-bottom: 0;}
    .logo-img { height: 35px; width: auto; display: block;}
    .action-buttons, .date-place { display: none !important; }
    .nav { position: fixed; top: 82px; left: -100%; width: 80%; /*height: 100%;*/ background: var(--second); transition: 0.3s; z-index: 100; padding: 20px 20px 40px; overflow-y: auto; }
        .nav.active { left: 0; }
        .nav ul { flex-direction: column; gap: 0; width: 100%; height: auto;}
        .nav li { border-bottom: 1px solid rgba(255,255,255,0.1); }
        .nav a { display: block; padding: 12px 0; font-size: 1rem; }
        .nav a:not(:last-child)::after { display: none; }
        .nav .podmenu { position: static; border: none; background: transparent; padding-left: 20px; display: none; }
        .nav li.open .podmenu { display: block; }
        .nav .podmenu a { color: var(--white); white-space: normal; }
        body.menu-open { overflow: hidden; }
        .header-row--second { flex-direction: column; align-items: flex-start; }
        .search-lang svg, .lang-switch .active {display: none;}  
        .grid-col-content {justify-content: center;    align-items: center;   padding-bottom: 0;   margin: 0;    display: flex;}
}

.corner { position: relative; }
    .corner::before, .corner::after { content: ''; position: absolute; width: 150px; height: 81px; background: url('../img/border-card.svg') no-repeat; background-size: contain; pointer-events: none; opacity: 0.6; }
    .corner::before { top: 0; left: 0; }
    .corner::after { bottom: 0; right: 0; transform: scale(-1, -1); }

.corner-brutal { position: relative; }
    .corner-brutal::before, .corner::after { content: ''; position: absolute; width: 150px; height: 81px; background: url('../img/border-card.svg') no-repeat; background-size: contain; pointer-events: none; opacity: 0.6; }
    .corner-brutal::before { top: 0; left: 0; }
    .corner-brutal::after { bottom: 0; right: 0; transform: scale(-1, -1); }

.mask { position: relative; }
    .mask::before { content: ''; position: absolute; bottom: -1px; right: -1px; width: 100%; height: 100%;background: var(--bg-dark); background-repeat: repeat; background-size: 180px auto;  mask: url('../img/mask.svg') right/contain no-repeat; -webkit-mask: url('../img/mask.svg') right/contain no-repeat; opacity: 1; pointer-events: none; z-index: 0; }

.action-buttons { display: flex; gap: 16px; }
.header .btn { padding: 5px 10px; font-size: .8rem; cursor: pointer; }
.header .btn-outline { background: transparent; border: 1px solid var(--primary); color: var(--primary); }
.header .btn-primary { background: var(--primary); border: none; color: var(--second); }
.btn-primary:hover {background: transparent; border: 1px solid var(--primary); color: var(--primary); }
.btn-outline:hover {background: var(--primary); color: var(--second);  }

.footer { background: var(--bg-light) var(--bg-repeat);  color: var(--white);  padding: 20px 0 40px;  background-size: 200px auto; border-top: 2px solid #ccc;}
    .grid-footer { display: grid; grid-template-columns: auto 1fr auto; gap: 40px; align-items: start; }
    .footer .container {background-color: var(--white-opacity); padding: 20px 10px;}

.footer-col--center { display: flex; flex-direction: column; gap: 16px; }
.footer-nav { display: flex; flex-wrap: wrap; gap: 0;  justify-content: center; flex: 1;}
    .footer-nav a { font-family: 'Oswald', sans-serif; font-size: 1rem; color: var(--gray-opacity); text-decoration: none; padding: 0 12px; position: relative; }
        .footer-nav a:not(:last-child)::after { content: '|'; position: relative; right: -12px; color: var(--gray); background: transparent; width: auto; height: auto; }
        .footer-nav a:hover { color: var(--gray); }

.footer-consent { font-size: 0.75rem; color: var(--gray); text-align: center; border-top: 1px solid var(--gray-opacity);padding-top: 10px;}
    .footer-consent a { color: var(--gray-opacity); text-decoration: none; font-size: .8;}
    .footer-consent a:hover { color: var(--gray); text-decoration: underline;}
    .footer-consent .separator { color: var(--gray); margin: 0 8px; }

.footer-copyright { font-size: 0.95rem; color: var(--gray); text-align: center;}
  .footer-copyright img.logo-org {filter: grayscale(100%) opacity(.8);width: 100%;max-width:500px; height: auto;display: block; margin: 10px auto;}

.footer-col--contacts { display: flex; flex-direction: column; gap: 8px; font-size: 0.9rem; color: var(--text); }
.footer-address, .footer-phone { line-height: 1.4; }


.footer-socials { margin-top: 20px; display: flex; gap: 16px;   align-items: center;}
.social-link { color: var(--gray-opacity); font-size: 22px; transition: 0.2s; }
.social-link:hover { color: var(--gray); }
.footer-col--logo {display: flex; flex-direction: column;align-items: center;}
.footer-org img {margin: 20px auto 0 auto;display: block;}

@media (max-width: 1024px) { 
    .grid-footer { grid-template-columns: 1fr; gap: 0; text-align: center; } 
    .footer-nav { justify-content: center; } .footer-nav a { padding: 0 8px; display: none;} 
        .footer-nav a:not(:last-child)::after { right: -8px; } 
    .footer-consent { text-align: center; } 
    .footer-col--logo img {height: 50px;}
    .footer-col--contacts {margin: 20px auto;}
}

.hero { background: var(--bg-dark);  padding: 0 !important; border-bottom: 4px solid var(--primary); max-height: 500px;position: relative;margin: 0 auto;width: 100%;}
.videophone {  margin: 0 auto; width: 100%;}
    .videophone .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.3); z-index: 1; overflow: hidden;}
    .videophone.mask::before {transform: scale(-1, -1);z-index: 1000;}

.hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; align-items: flex-start;position: absolute;top: 20px;left: 25px;width: 98%;height: 100%;padding:0;}
.hero-left { color: var(--white);position: relative;z-index: 1000; width: 450px;}
.hero-title { font-family: var(--font-oswald); font-size: 4.5rem; margin-bottom: 15px; }
.hero-subtitle { font-size: 1.2rem; margin-bottom: 10px; opacity: 0.9; }
.hero-date-location { font-size: 1rem; margin-bottom: 30px; opacity: 0.7; margin: 30px 0;}

.hero-right .hero-cards {position: absolute;bottom: 10px; right: 20px;} 
    .hero-right .stat-item {text-align: center;width: 300px;}
    .hero-right .stat-number { font-family: var(--font-oswald); font-size: clamp(2rem, 6vw, 5.5rem); color: var(--white); font-weight: 700; text-shadow: var(--text-shadow);}
    .hero-right .stat-label { font-size: 1.2rem; text-transform: uppercase; color: var(--white);font-family: var(--font-arial-narrow);}
.hero-buttons {display: flex;  gap: 20px;  margin-top: 20px;  flex-direction: column;  max-width: 223px;   text-align: center;}
    .hero-buttons a {text-decoration: none;}
.btn-primary { background: var(--primary); color: var(--white); padding: 10px 24px; border: none; cursor: pointer; }
    .btn-outline:hover {color: var(--white);border: 1px solid var(--primary);}
.btn-outline { background: transparent; border: 1px solid var(--white); color: var(--white); padding: 10px 24px; cursor: pointer; }
.hero-right { position: absolute;  bottom: 60px; right: 0; width: 320px; height: 150px;z-index: 1000;}
.hero-video { width: 100%; height: 485px; object-fit: cover; display: block; }
.hero-cards {position: relative; min-height: 150px; width: 100%;}
.hero-cards .stat-item { transition: opacity 0.5s ease;}

@media (min-width: 1561px) {
    .hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; align-items: flex-start;position: absolute;top: 25px;left: 0;width: 100%;height: 100%;padding:0;}
    .hero {max-height: 590px;}
    .hero-video { height: 585px;}
    .hero-right { position: absolute;  bottom: 60px; right: 0; width: 320px; height: 150px;z-index: 1000;}
    .videophone {padding:0;max-width: 1560px;}
        .hero {background-size: 150px auto;}
        .videophone.mask::before {transform: scale(-1, -1);left: -130px !important;top: -30px !important;z-index: 1000;}
        .videophone .overlay.mask::before {bottom: -200px;right: -120px;} 
        .hero-right .hero-cards {position: absolute;bottom: 20px; right: 0px;} 
}

 @media (min-width: 768px) and (max-width: 1560px) {
    .videophone{overflow: hidden;} 
    .videophone.mask::before, .videophone .overlay.mask::before {opacity: .4;} 
    .videophone.mask::before {left: 0;top: 0;mask-size: 540px auto !important;}
    .videophone .overlay.mask::before {bottom: -210px;right: -60px;mask-size: 500px auto;} 
    .stat-number {text-shadow: var(--text-shadow);}  
    .hero-right { bottom: 10px; right: -35px; width: 320px;}

}
 
@media (max-width: 768px) {
  .hero { max-height: none; padding: 0 !important;    /* height: 98svh*/}
  .videophone { height: auto; min-height: 50vh; }
  .hero-video { height: 30vh; object-fit: cover; }
  .hero-grid { position: relative; top: 0; left: 0; width: 100%; height: auto; grid-template-columns: 1fr; gap: 30px; padding: 20px; text-align: center; }
  .hero-left { width: 100%; padding-top: 20px; text-align: center; }
  .hero-title { font-size: 2.5rem; }
  .hero-subtitle { font-size: 1rem; }
  .hero-date-location { margin: 20px 0; }
  .hero-buttons { max-width: 100%; flex-direction: column; justify-content: center; gap: 25px; }
  .hero-right { position: relative; bottom: auto; right: auto; width: 100%; height: auto; text-align: center; }
        .hero-right .stat-item {width: 100%;}
  .hero-right .hero-cards { position: relative; min-height: auto; margin: 10px 20px 20px 20px; width: 100%;}
    .hero-right .stat-number { font-size: 3.5rem; }
    .hero-right .stat-label { font-size: 1.2rem; }
  .videophone.mask::before, .videophone .overlay.mask::before { display: none; }  
}

section {width: 100%;padding: 80px 0;
  & h2 {color: var(--second-light);text-transform: uppercase;font-size: clamp(1.5rem, 5vw, 2.25rem);border-bottom: 2px solid var(--primary);width: fit-content;margin-bottom: 40px;font-weight: 400;}
  & h2::first-letter {color: var(--primary);font-weight: 500;}
  & button {width: fit-content;   box-sizing: border-box;   background: var(--primary);   color: var(--white);  font-size: 1.2rem;  font-family: var(--font-arial-narrow);  text-transform: uppercase;   text-decoration: none;   padding: 10px 40px;  border: 0;   margin: 40px 20px 0 20px; cursor: pointer; display: inline-block; font-weight: 600;}
  & button:hover {transform: translateY(-3px); box-shadow: 0 2px 4px rgb(0 0 0/0.5); background: var(--second-light);}
}

  
  
@media (max-width: 768px) {section {padding: 60px 0;}}
@media (max-width: 1024px) {section {padding: 60px 0;}}

.about {z-index: 1; background-image: url(../img/bg-about.webp); background-size: contain; padding: 60px 0;}
.about-grid {display: grid;  grid-template-columns: 1fr 800px 1fr;  gap: 0; align-items: stretch;background: var(--second);}
.about-left {min-height: 250px; display: flex; align-items: center; justify-content: center; gap: 40px; background: url('../img/gallery.jpg') center/cover no-repeat;position: relative;}
    .about-left::after, .about-right::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.2); transition: opacity 0.3s; pointer-events: none; }
    .about-left:hover .news-img::after { opacity: 0; }
    .about-left a, .about-right a {text-decoration: none;}
    .icon-item {text-align: center; color: white;background: rgba(0,0,0,0.4);padding: 10px;margin-top: 40px;}
    .icon-item i {font-size: 48px; margin-bottom: 10px; display: block; text-shadow: 2px 2px 4px rgba(0,0,0,0.5);}
        .icon-item span {font-size: 1.9rem; text-transform: uppercase; display: block;  text-shadow: 1px 1px 1px rgba(0,0,0,0.3); font-weight: 700;}
.about-right {min-height: 250px; display: flex; align-items: center; justify-content: center; background: url('../img/map.png') center/cover no-repeat;position: relative;}
    .description.corner::before {top: 10px;left: 10px;}
    .description.corner::after {bottom: 10px;right: 10px;}
.description {max-width: 800px; box-shadow: 0 10px 20px rgba(0,0,0,0.05);background: var(--white);padding: 40px;order: 0;}
     .description p {font-size: 1.2rem; line-height: 1.5; padding: 10px 0;}
    .description h2.title {font-family: var(--font-oswald); font-size: 1.9rem; color: var(--primary); margin-bottom: 2px; border-bottom: 2px solid var(--second); width: fit-content;font-weight: normal;}
       .description h3.subtitle {font-family: var(--font-oswald); font-size: 1.25rem; color: var(--second); margin-top: -4px; padding-top: 10px; font-weight: normal; margin-bottom: 20px; text-transform: uppercase;  width: fit-content;}
       .description h3.subtitle b {font-weight: normal;color: var(--primary);font-size: 1.5rem;}
.about-slogan {text-align: center; margin-top: 0px;  font-size: clamp(0.9rem, 2.2vw, 2.15rem); font-weight: bold; text-transform: uppercase; color: var(--white); padding: 20px; grid-column: span 3;opacity: .85;}

 @media (min-width: 768px) and (max-width: 1560px) {
.about-grid {display: grid; grid-template-columns: 1fr 1fr; gap: 2px;}
.description {order: 1; grid-column: span 2; margin: 0; padding: 30px; max-width: 100%;}
.about-left {order: 2; grid-column: 1; margin: 0;}
.about-right {order: 3; grid-column: 2; margin: 0;}
.about-slogan {order: 4; grid-column: span 2; margin-top: 0px;}
}


@media (max-width: 768px) {
.about {margin: 0 auto;}
.about-grid {grid-template-columns: 1fr; gap: 2px;}
.about-left {min-height: 200px; gap: 20px;order: 3;}
.icon-item i {font-size: 32px;}
    .icon-item span {font-size: 1.2rem;}
.about-right {min-height: 200px;order: 2;}
.description {margin: 0; padding: 40px;order: 1;}
.description h2.title {font-size: 1.5rem;}
.description h3.subtitle {font-size: 0.9rem; margin-left: 0;}
.description h3.subtitle b {font-size: 1.1rem;}
.description p {font-size: 0.95rem; padding: 5px 0;}
.about-slogan {font-size: 0.9rem; padding: 15px; grid-column: auto;}
}

.benefits-main { padding: 60px 0; background: var(--white); }
.col-left {margin-top: 0px;}
    .benefits-grid { display: grid; grid-template-columns: 2fr 3fr; gap:40px}
        .col-right { display: flex; flex-direction: column; gap: 40px; padding-top:20px ;}
            .benefit-card { position: relative; padding: 35px; overflow: hidden; border-top: 4px solid var(--primary); 
               & button {margin-top: 20px;background: transparent;font-family: var(--font-oswald);color: var(--primary);text-transform: uppercase;text-decoration: underline;border: 0;font-size: 1.125rem;cursor: pointer;margin: 40px 0 0 0px;padding: 0;}
              & button:hover {color: var(--white);text-decoration: none;background: transparent;text-decoration: underline;}
            }
            .benefit-card-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../img/bg-benefit.jpg') center/cover no-repeat; z-index: 0; }
            .benefit-card-overlay { position: absolute; top: 0; left: 0; width: 65%; height: 100%; background: rgba(4,14,26,0.75); z-index: 1; }
                 .benefit-card.left .benefit-card-overlay {right: 35%;}
                 .benefit-card.right .benefit-card-overlay {left: 35%;}
            .benefit-card-content { position: relative; z-index: 2; color: var(--white); }
            .benefit-card-title { font-family: var(--font-oswald); font-size: 1.5rem; margin-bottom: 15px; text-transform: uppercase; font-weight: 500;}
            .benefit-card-text {  font-size: 1.0rem; line-height: 1.4; opacity: 0.9; max-width: 60%; }
            .benefit-card.left .benefit-card-content { text-align: left; }
            .benefit-card.right .benefit-card-content { text-align: right; }
            .benefit-card.right .benefit-card-text { margin-left: auto; }
            
@media (min-width: 1561px) {
        .col-left {padding-right: 60px;} 
        
}
@media (max-width: 1024px) { .benefits-grid { grid-template-columns: 1fr; gap: 60px; }  } 

@media (max-width: 768px) { 
    .benefit-card-text { max-width: 100%; } 
    .benefit-card--right .benefit-card-text { margin-left: 0; } 
     .benefit-card.left .benefit-card-overlay {right: 0;}
       .benefit-card.right .benefit-card-overlay {left: 0;}
       .benefit-card.right .benefit-card-content {text-align: left;}
       .benefit-card-overlay {width: 100%;} 
       .col-right {order: -1;}
}

.hotlinks { padding: 40px 0; background: var(--white); position: relative;}
    .hotlinks-grid { display: flex; justify-content: left; gap: 15px; align-items: flex-start;flex-direction: column; }
      .hotlink-card {position: relative; width: stretch;; height: auto; background: var(--bg-light);background-size: 100px auto; padding: 15px 25px; text-align: left; display: flex; flex-direction: column; transition: all 0.3s ease; cursor: pointer;}   
        .hotlink-card:hover { background: var(--bg-dark);background-size: 120px auto;} 
        .hotlink-title { font-family: var(--font-oswald); font-size: 1.2rem; margin-bottom: 15px; text-transform: uppercase; color: var(--gray);font-weight: 500;margin-top: 10px;}
           .hotlink-card:hover  .hotlink-title {color: var(--white);}
        .hotlink-btn {z-index: 1500; display: inline-block; background: #858586;color: var(--white); font-family: var(--font-arial-narrow);  font-size: 1rem;  text-transform: uppercase;  text-decoration: none;  padding: 5px 15px;  align-self: flex-start; transition: background 0.3s ease;margin: -25px 0 10px auto;min-width: 150px;text-align: center;}
         .hotlink-card:hover  .hotlink-btn {background: var(--primary);z-index: 1000;}
         .hotlink-card.corner::before {left: 1px;top: 1px;  filter: grayscale(100%) opacity(0.5);}
         .hotlink-card.corner::after {right: 1px;bottom: 1px;  filter: grayscale(100%) opacity(0.5);}
         .hotlink-card:hover::before, .hotlink-card:hover::after {filter: brightness(0) invert(1);}


 @media (min-width: 768px) and (max-width: 1560px)  {
     .hotlinks-grid { gap: 20px; flex-wrap: wrap; height:auto;} 
     .hotlinks-col { align-items: center; } 
        .hotlinks-col {flex-direction: row;}
        .bg-hotlinks {display: none;}
        .hotlink-card, .hotlink-card--center {flex-direction: column;display: flex;}  
        .hotlink-btn {margin-top: -3px;}              
    } 
@media (min-width: 768px) and (max-width: 1024px) {
  .hotlinks-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .hotlink-card:nth-child(5) { grid-column: span 2; width: 100%; max-width: 400px; margin: 0 auto; }
}

@media (max-width: 767px) { 
    .hotlinks {background: #e6e6e6;}    
       .hotlinks-grid { flex-direction: column; gap: 20px;}
    .hotlinks-col, .hotlinks-col-center { width: 100%; align-items: center;gap: 40px;flex-direction: column ;}
         .bg-hotlinks {display: none;}
         .hotlink-card  {background: var(--second); padding: 25px 33px; width: 100%;flex-direction: column;}
          .hotlink-card .hotlink-btn {background: var(--primary);z-index: 1000; width: 100%; padding: 5px 0;text-align: center;margin: 0;}
          .hotlink-card  .hotlink-title {color: var(--white);}
            .hotlink-card.corner::before,  .hotlink-card.corner::after {filter: brightness(0) invert(1);}
    }


.news-grid {display: grid; gap: 3.2em; align-items: start; grid-template-columns: 1fr 422px; background: var(--white);}

.cards-news {display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
    .card-news { background: #f7f7f7; padding: 20px 15px; transition: transform 0.2s ease, box-shadow 0.2s ease, border 0.2s ease; box-shadow: 0 2px 5px rgba(0,0,0,0.1); border: 1px solid transparent; }
        .card-news:hover { transform: translateY(-5px); box-shadow: 0 8px 20px rgba(0,0,0,0.15); border: 1px solid var(--primary); }
        .card-news .news-preview  {margin: 10px -15px;}
            .card-news .news-preview img {width: 100%;}
    .card-news .news-link {color: var(--second);font-size: 1.0rem;text-decoration: none;font-family: var(--font-arial-narrow);}
    .card-news:hover .news-link {color: var(--primary);}
.news-date {font-size: 1.0rem;  font-family: var(--font-arial-narrow); color: var(--primary);  display: flex; align-items: center;  gap: 10px; }


.news-subscribe {border-top: 4px solid var(--primary);padding: 30px 35px 0px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); border-left:  #f7f7f7; border-right:  #f7f7f7;border-bottom:  #f7f7f7;}
    .news-subscribe h3 {font-weight: 500;color: var(--second-light);font-size: 1.5rem; text-align: center;margin-top: -5px;}
    .subscribe-form { display: flex; flex-direction: column; gap: 20px; padding: 20px 25px;
        & input[type="text"], input[type="email"] { border: 1px solid var(--second-light); color: var(--second-light); padding: 10px 15px; width: 100%; box-sizing: border-box; }
        & button { width: 100%; box-sizing: border-box;  background: var(--primary);color: var(--white); font-family: var(--font-arial-narrow);  font-size: 1rem;  text-transform: uppercase;  text-decoration: none;  padding: 10px 0px;border: 0;margin: 0;}
        & label { align-items: baseline; gap: 8px; font-size: 0.8rem; color: var(--gray);}
        & label a {color: var(--primary);flex-wrap: wrap;}
        & label a:hover {text-decoration: underline;} 
        & label input { width: auto; margin: 0; }
        & input::-webkit-input-placeholder { color: var(--second); opacity: 1; }
        & input::-moz-placeholder { color: var(--second); opacity: 1; }
        & input:-ms-input-placeholder { color: var(--secondy); opacity: 1; }
        & input::placeholder { color: var(--second); opacity: 1; }
    }

@media (min-width: 1561px) {.news-grid {gap: 100px;}}        

@media (max-width: 1024px) and (min-width: 786px){
    .news-grid  {grid-template-columns: repeat(2, 1fr);}
    .cards-news {display: grid; grid-template-columns: repeat(1, 1fr); gap: 30px; }
 .subscribe-form {padding: 20px 0;}
    .card-news .news-preview img {display: none;}
}

@media (max-width: 787px) {
    .news-grid  {grid-template-columns: repeat(1, 1fr);}
    .cards-news {display: grid; grid-template-columns: repeat(1, 1fr); gap: 30px; }
    .subscribe-form {padding: 20px 0;}
}

.video { background: var(--light-gray-opacity); z-index: 1; margin: 40px auto; text-align: center; }
.bg-video { background: url(../img/i_5.webp); background-size: cover; background-position-y: center; background-repeat: no-repeat; padding: 60px 80px; border-top: 4px solid var(--primary) !important; max-width: 100%; margin: 0 auto; display: flex; justify-content: center; align-items: center; }
.bg-video iframe { display: block; width: 100%; max-width: 720px; height: auto; aspect-ratio: 16 / 9; margin: 0 auto; }

@media (max-width: 787px) {
    .bg-video{padding: 0;}
}

.banners {padding: 40px 0; position: relative; background: var(--bg-light); background-size: 180px;z-index: 1;}
    .banners .container img {margin: 0 auto;display: block;width: 100%;max-width: 1280px;z-index: 1000;position: relative;}
    .banners .container p {text-align: center;padding-top: 10px;}
@media (max-width: 1024px) {
.bg-banners {display: none;} 
}

.partners { padding: 60px 0; background: var(--bg-dark); background-size: 200px; }
    .partners h2 { color: var(--white); border-bottom: 2px solid var(--primary); text-transform: uppercase; font-size:  clamp(1.5rem, 5vw, 2.25rem);font-weight: 500;display: inline-block;font-weight: 400;}
        .partners h2::first-letter {color: var(--white);}
   .partners-top { display: grid;  grid-template-columns: 1fr; margin-bottom: 60px; }
    .partners-top-left {width: fit-content;margin-right: auto;}
    .partners-cards { display: grid; grid-template-columns: repeat(3, minmax(auto, max-content)); gap: 60px; justify-content: center;}
    .partner-card { display: flex; background: var(--white); border: 1px solid var(--white); width: fit-content; padding: 20px; text-align: center; position: relative; outline: 1px solid var(--white);  outline-offset: 2px; align-items: center; }
        .partner-card img { max-width: 100%; height: auto; display: block; margin: auto;  }
    .partner-label { background: var(--second); color: var(--white); display: inline-block; padding: 5px 15px; position: absolute; top: -15px; left: 50%; transform: translateX(-50%); white-space: nowrap; font-size: 0.8rem;font-family: var(--font-arial-narrow); }

    .slider-animated {     display: flex;  gap: 2rem;  padding-right: 2rem;  animation: scrollPartners 25s infinite linear;}
        .partners-slider:hover .slider-animated {  animation-play-state: paused;}
        @keyframes scrollPartners {
            from { transform: translateX(0); }
            to { transform: translateX(-100%); }
        }

    .partners-slider-viewport {display: flex; align-items: stretch;position: relative; display: flex; overflow-x: auto;  scrollbar-width: none;}
        .slider-card { flex: 0 0 auto; scroll-snap-align: start; background: var(--white); padding: 5px 20px; width: 208px; display: flex; align-items: center; justify-content: center; filter: grayscale(100%);opacity: .8;}
         .slider-card:hover { border: 1px solid var(--primary); opacity: 1; filter: grayscale(0%);}
            .slider-card img { max-width: 100%; height: auto; display: block; }

@media (min-width: 1561px) {
.partners h2 { color: var(--white); border-bottom: 2px solid var(--primary); text-transform: uppercase; font-size: 2.25rem; width: fit-content; max-width: auto !important;}
    .partners h2::first-letter {color: var(--white);}
    .partners-top { display: grid;  grid-template-columns: 30% 70%; margin-bottom: 120px; }
        .partners-top-left {width: fit-content;margin-right: auto;}
    .partners-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 120px; }
    .partner-card { display: flex; background: var(--white); border: 1px solid var(--white); padding: 20px; text-align: center; position: relative; outline: 1px solid var(--white);  outline-offset: 2px; align-items: center; }
        .partner-card img { max-width: 100%; height: auto; display: block; margin: auto;  }
    .partner-label { background: var(--second); color: var(--white); display: inline-block; padding: 5px 15px; position: absolute; top: -15px; left: 50%; transform: translateX(-50%); white-space: nowrap; font-size: 0.8rem;font-family: var(--font-arial-narrow);min-height: 20px;}
}

@media (max-width: 768px) {
    .partners-top, .partners-cards {grid-template-columns: repeat(1, 1fr);} 
        .partners-top-left {width: auto;text-align: center; margin: 0 auto;}
    .partners-top, .slider-track {gap: 0;}
    .partners-cards {gap: 40px;}
    .partners h2 {font-size: 1.9rem;margin: 0 auto 40px auto;}
    .partner-card  {width: 280px;   margin: 0 auto;   min-height: 125px; display: flex; align-items: center; justify-content: center;}
    .slider-card  {width: 250px;   margin: 0 auto;   min-height: 85px; display: flex; align-items: center; justify-content: center;}
     .partners-slider {padding: 0 60px;}
    .slider-prev, .slider-next {width: 30px;height: 30px; background-size: contain;} 
     .slider-prev { left: 0px; transform: translateY(-50%) scaleX(-1);}
        .slider-next { right: 0px; }
}
 

/*update 28.05*/
    .cards-news.new a { display: block; text-decoration: none; color: inherit;}
    .cards-news.new .news-grid { justify-content: space-between;}
        .news-card.corner { position: relative; background: var(--white); overflow: hidden; transition: 0.2s;     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);  border-left: #f7f7f7; border-right: #f7f7f7;  border-bottom: #f7f7f7;}
        .news-card.corner:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.05); }
        .news-card.corner .news-img { position: relative; width: 100%; height: 240px; background-size: cover; background-position: center; }
          .news-card.corner .news-img::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.4); transition: opacity 0.3s; pointer-events: none; }
          .news-card.corner:hover .news-img::after { opacity: 0; }
        .news-card.corner .news-date-badge { position: absolute; top: 10px; right: 10px; background: var(--primary); color: var(--white); padding: 5px 12px; font-size: 0.8rem; font-weight: 600; z-index: 2; border-radius: 0; }
        .news-card.corner .news-title-overlay { position: absolute; bottom: 20px; left: 20px; right: 20px; color: var(--white); font-family: var(--font-oswald); font-size: 1.2rem; line-height: 1.3; z-index: 2; text-shadow: 1px 1px 2px rgba(0,0,0,0.5); }
        .news-card.corner .news-content { padding: 25px 25px 10px 25px;min-height: 40px;}    
        .news-card.corner .news-excerpt { font-size: 0.9rem; color: var(--gray); margin-bottom: 25px; line-height: 1.4;  text-decoration: none;    display: -webkit-box;  -webkit-line-clamp: 3;  -webkit-box-orient: vertical;    overflow: hidden;  word-break: break-word;}
        .news-card.corner .news-link { color: var(--primary); text-decoration: none; font-weight: 600; border-bottom: 1px solid transparent; }
        .news-card.corner:hover .news-excerpt { color: var(--primary); }
        .news-card.corner::before { top: 10px !important; left: 10px;  filter: brightness(0) invert(1); z-index: 100;}
        .news-card.corner::after { bottom: 10px; right: 10px; }
        .cards-news.new button.btn {border: 0; background: var(--primary); font-family: var(--font-arial-narrow); font-size: 1rem; padding: 10px 40px; text-transform: uppercase; color: var(--white);}


        
@media (max-width: 1024px) and (min-width: 786px){
    .news-grid  {grid-template-columns: repeat(2, 1fr);}
    .cards-news {display: grid; grid-template-columns: repeat(1, 1fr); gap: 30px; }
    .news-card.corner .news-img  {background-image: none !important;}
     .news-card.corner .news-img { position: relative; width: 100%; height: auto;padding: 15px 20px}
        .news-card.corner .news-img::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0); transition: opacity 0.3s; pointer-events: none; }
        .news-card.corner .news-title-overlay { position: relative; color: var(--second);  z-index: 2;   text-shadow: 1px 1px 2px rgba(0, 0, 0, 0);   padding: 40px 40px 0 0px;}
     .news-card.corner .news-content {display: none;}
      .news-card.corner .news-date-badge {position: relative;  width: fit-content;  margin: -10px 0 0 auto; color: var(--second);background: transparent;border-bottom: 1px solid var(--primary);font-weight: normal; padding: 0;line-height: 1.2;}      
    .news-card.corner::before { filter: brightness(0) invert(0);}
}

/*--INNER--*/

.hero.inner {position:relative; padding:40px 0 60px 0 !important;}
.hero.inner.participant {background-image: url(../img/bg-participation.webp);background-repeat: no-repeat;background-size: cover;background-position: 0% 0%;max-height: 335px;}
.hero.inner::before {content: ""; position: absolute; right: 0; bottom: 0; width: 100%; height: 100%; max-width: 583px; max-height: 335px; background-image: url(../img/bg-participation-right.webp); background-repeat: no-repeat; background-size: contain; background-position: bottom right; pointer-events: none;}
.hero.inner .bg-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.05); z-index: 1; overflow: hidden;}
.hero.inner .container {position:relative; z-index: 100;}
.hero.inner ul.section-menu {font-size:0.9rem; line-height:2.5vh; display:flex; justify-content:center; margin:0; padding:0; list-style:none; font-family: var(--font-arial-narrow); font-weight:600;  letter-spacing:0; text-align: center;  flex-wrap: wrap;
}
  .hero.inner ul.section-menu li {padding:0 2vh;}
  .hero.inner ul.section-menu li a {color:var(--white); text-decoration: none;text-transform: uppercase;opacity: .6;}
    .hero.inner ul.section-menu li.active a, .hero.inner ul.section-menu li a:hover { text-decoration: underline; opacity:1.0;} 
    .hero.inner .breadcrumbs {display:none}
.hero.inner h1 {margin:80px 0 0 0; text-align:center; color:var(--primary); text-transform: uppercase; font-size: clamp(2rem, 6vw, 3.5rem); margin-bottom: 40px;text-shadow: var(--text-shadow);}
.hero.inner .breadcrumbs { margin: 20px 0 40px 0; text-align: center; font-weight: 600; font-size: 12px; line-height: 15px; letter-spacing: 0; text-transform: uppercase;  color: var(--white);  display: none;}
.breadcrumbs {display: flex; justify-content: center;}
@media (max-width: 1280px) {
  .hero.inner .bg-overlay { background: rgba(0,0,0,0.5);}
        .hero.inner .breadcrumbs {display: block; margin: 0; color: var(--white); }
        .hero.inner ul.section-menu {display: none;}
             .hero.inner .breadcrumbs a {text-decoration: none;}
         .hero.inner .breadcrumbs a > span {color: var(--white);text-decoration: none;opacity: 1; line-height: 2;}
     .hero.inner .breadcrumbs span { opacity: .6; line-height: 2;}
}


@media (max-width: 767px) {
  .hero.inner h1 {color:var(--white);}
  .hero.inner .bg-overlay {background: rgba(0,0,0,0.4); }
     .breadcrumbs {  display: block;}
     .hero.inner ul.section-menu {display: none;}
     .hero.inner .breadcrumbs a {text-decoration: none;}
         .hero.inner .breadcrumbs a > span {color: var(--white);text-decoration: none;opacity: 1; line-height: 2;}
     .hero.inner .breadcrumbs span { opacity: .6; line-height: 2;}
}

.welcome-photo {
    & img {width: 33%;} 
 }

 @media (min-width: 1024px) {
    section.welcome-photo  {padding: 0 16px 40px 16px}
 }
@media (max-width: 768px) {.welcome-photo img {width: 100%;}}

section.stats { position: relative; padding: 40px 0 15px;}
    section.stats .stat-bg { position: absolute; top: 70px; left: 0; width: 100%; height: 85px; background: var(--bg-light); background-repeat: var(--bg-repeat); background-size: 180px auto; z-index: 0; border: 1px solid var(--gray-opacity-strong)}
    section.stats .stat-grid { display: grid; grid-template-columns: repeat(4, auto); gap: 100px; text-align: center; justify-content: center; }
    section.stats .stat-item { position: relative; padding: 20px 50px; background: var(--white);box-shadow: 0 10px 30px rgba(0,0,0,0.08); transition: transform 0.3s, box-shadow 0.3s; }
      section.stats .stat-item:hover {transform: translateY(-4px); box-shadow: 0 20px 40px rgba(0,0,0,0.5);}
    section.stats .stat-number { font-family: var(--font-oswald); font-size: 3.75rem; font-weight: 700; color: var(--primary); line-height: 1.2; margin-bottom: 10px; white-space: nowrap;}
    section.stats .stat-label { font-family: var(--font-arial-narrow); font-size: 0.9rem; text-transform: uppercase; color: var(--gray); letter-spacing: 1px; font-weight: 700;}
       .themie .themie-item::before, section.stats .stat-item::before {left: 1px;top: 1px;filter: opacity(.15);}
       .themie .themie-item::after, section.stats .stat-item::after {right: 1px;bottom: 1px;filter: opacity(.15);}
       .themie:hover .themie-item:hover::before, section.stats:hover .stat-item:hover::before {left: 0px;top: 0px;filter: opacity(.4)}
       .themie:hover .themie-item:hover::after, section.stats:hover .stat-item:hover::after {right: 0px;bottom: 0px;filter: opacity(.4)}
@media (max-width: 1400px) { 
       section.stats .stat-grid { grid-template-columns: repeat(2, 1fr); gap: 2em 5rem;}
       section.stats .stat-bg {height: 250px;}
    }  
@media (max-width: 768px) { section.stats .stat-bg {height: 487px;}}
@media (max-width: 640px) { section.stats .stat-grid { grid-template-columns: 1fr; gap: 30px; } .stat-number { font-size: 2.5rem; } }

section.benefits {position: relative;}
section.benefits::before  { content: ''; background-image: url(../img/i_7.webp); background-repeat: var(--bg-repeat); background-size: 250px auto; opacity: .1;position: absolute; top: 0;left: 0;width: 100%;height: 100%;filter: grayscale(100%);}

section.intro { position: relative; padding: 40px 0 20px 0;
  & p {font-size: 1.5rem;padding: 20px 0;}

}

.b2b {
    & .container {display: grid;gap: 30px;}
}

.reason-cards {display: flex; flex-wrap: wrap; gap: 30px; margin-top: 40px; justify-content: center;}
.reason-card {background: var(--white); padding: 30px 50px; text-align: center; box-shadow: 0 10px 30px rgba(0,0,0,0.08); transition: transform 0.3s, box-shadow 0.3s; flex: 1 1 calc(33.333% - 30px); min-width: 250px;border: 1px solid var(--gray-opacity-strong);}
.reason-card:hover {transform: translateY(-8px); box-shadow: 0 20px 40px rgba(0,0,0,0.15);}
.reason-icon {width: 75px; height: auto; margin-top: 5px; margin-bottom: 10px; display: block; margin-left: auto; margin-right: auto;}
.reason-card h3 {font-family: var(--font-oswald); font-size: 1.5rem; color: var(--second); margin-bottom: 15px;font-weight: 400;color: var(--primary);line-height: 2rem;}
.reason-card p {font-family: var(--font-arial-narrow); font-size: 1.05rem; color: var(--second); line-height: 1.4; margin: 0;}

  .reason-card::before {left: 1px;top: 1px;filter: opacity(.65);}
  .reason-card::after {right: 1px;bottom: 1px;filter: opacity(.65);}

@media (max-width: 768px) {
.reason-card {flex: 1 1 100%; padding: 20px;}
.reason-icon {width: 60px;margin-top: 10px; margin-bottom: 5px;}
.reason-card h3 {font-size: 1.25rem;}
}

.mit-prtcp-specials-item-img .new {background: var(--primary);color: var(--white);font-family: var(--font-arial-narrow);font-weight: 600;padding: 10px;position: absolute; bottom: 10px; right: -50px; transform: rotate(-35deg);width: 200px;text-align: center;box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}

@media (min-width: 1561px) {
.mit-prtcp-specials-item:nth-child(odd) {justify-content: space-between; flex-direction: row-reverse;}
.mit-prtcp-specials-item {display: flex; gap: 30px;}
}
.mit-prtcp_flex-row:hover {transform: translateY(-8px); box-shadow: 0 20px 40px rgba(0,0,0,0.15);}
.mit-prtcp_flex-row:nth-child(odd)::before {top:auto; bottom: 10px; left: 10px; transform: scaleY(-1);filter: opacity(.8);}
.mit-prtcp_flex-row:nth-child(odd)::after {display: none;}
.mit-prtcp_flex-row:nth-child(even)::after {bottom: 10px; right: 10px;filter: opacity(.8);}
.mit-prtcp_flex-row:nth-child(even)::before {display: none;}
.mit-prtcp-blocks-item-button:hover {transform: translateY(-3px); box-shadow: 0 2px 4px rgb(0 0 0/0.5); } 

@media (max-width: 980px) {
     .mit-prtcp-specials-item {flex-direction: column !important;}
        .mit-prtcp-specials-item-text::after {display: none;} 
    }


.stat-bar-item {margin-bottom: 35px; position: relative; height: 60px;}
.stat-bar-bg {height: 100%; background: var(--gray-opacity-strong); position: relative;}
.stat-bar-fill {height: 100%; background: var(--bg-dark); filter:opacity(.8); background-size: 180px auto; width: 0%; position: relative; white-space: nowrap; display: flex; align-items: center;}
.stat-bar-label {color: var(--white); font-family: var(--font-arial-narrow); font-weight: 700; text-transform: uppercase; font-size: 1rem;padding: .5vh 1vh;text-transform: uppercase;  font-size: clamp(0.8rem, 2vw, 1.2rem);}
.stat-bar-percent {position: absolute; right: 20px; top: 50%; transform: translateY(-50%); font-family: var(--font-arial-narrow); font-size: clamp(1.2rem, 4vw, 2.8rem);;  font-weight: 700; color: var(--primary);}

@media (max-width: 768px) {
.stat-bar-item {height: auto;  margin-bottom: 2vh;}
.stat-bar-fill {white-space: normal;}
.stat-bar-label {font-size: 0.8rem; padding-left: 10px;}
.stat-bar-percent {font-size: 1.2rem; right: 10px;}
}

.who_participant {padding: 0 0 60px 0;
  & img {border-bottom: 4px solid var(--primary);width: 100%;}
  & button {margin: 40px auto 0 auto; display: block; }
}

.participation-help {padding-bottom: 0;}
.participation-help .container {background: var(--gray-opacity-strong); padding:40px;}
.participation-help-text {display: grid; grid-template-columns: auto 1fr; gap: 10vw; align-items: start;}
.participation-help-text h2 {margin: 0;}
.participation-help-right {display: flex; flex-direction: column; gap: 20px;line-height: 1.8rem;}
.participation-help-contacts-item {margin: 13px 0 0 0;}
.participation-help-contacts-item b,
.participation-help-contacts div { color: var(--gray); font-size: 1.1rem;padding: 0 0 10px 0;}
.participation-help-right a, .participation-help-contacts div a {align-items: center; color: var(--primary); text-decoration: none;}
.participation-help-contacts-item div a svg {width: 24px; height: 24px; fill: none; stroke: var(--primary); margin: 0 11px 0 0;}

@media (max-width: 768px) {
.participation-help .container {padding: 20px;}
.participation-help-text {grid-template-columns: 1fr; gap: 20px;}
}

.themie {
    & h2 {margin-bottom: 10px;} 
    & .container section.intro {padding: 0;}
    & .container a {text-decoration: none;}
  }

.themie-grid {display: grid; grid-template-columns: repeat(7, 1fr); gap: 20px; margin: 40px 0;}
.themie-item {display: flex; flex-direction: column; justify-content: center; align-items: center;  background: var(--light-gray-opacity); padding: 20px; font-family: var(--font-arial-narrow); font-size: 1.1rem; text-align: center; color: var(--second); line-height: 1.4; transition: transform 0.3s, box-shadow 0.3s; min-height: 200px; box-shadow: var(--text-shadow);
  & img {max-width:75px; height: auto; margin: 20px auto;}
  & p {display: none;}
}
.themie-item:hover {transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.1); background: var(--white);  min-height: 200px;
 & img {display: none;}
  & p {display: block;}
}
 .themie-item:hover::before {left: 5px;top: 5px; filter: opacity(1);}
 .themie-item:hover::after {right: 5px;bottom: 5px; filter: opacity(1);}
.themie-buttons {text-align: center;}

@media (max-width: 1024px) {
.themie-grid {grid-template-columns: repeat(3, 1fr);}
}

@media (max-width: 768px) {
.themie-grid {grid-template-columns: repeat(2, 1fr);}
.themie-item {position: relative; padding: 0;
 & img {height:65px;margin: 30px auto 0 auto;}
 & p {background: rgba(0,0,0,0.4); color: var(--white); padding: 10px; margin: auto 10px 10px 10px; display: block; font-size: 0.8rem; text-align: center;}
}
.themie-item:hover img {display: block;}
.themie-item:hover p {display: block;}
.themie  {  & button {display: block;width: 80%; margin: 2vh auto;}}
}

.inner-themie {
  & h2 {margin-bottom: -15px;}
  & .back-link a {width: fit-content;   box-sizing: border-box;   background: var(--primary);   color: var(--white);  font-size: 1.2rem;  font-family: var(--font-arial-narrow);  text-transform: uppercase;   text-decoration: none;   padding: 10px 40px;  margin: 40px 20px 0 20px; font-weight: 600;}
  & .back-link a:hover {transform: translateY(-3px); box-shadow: 0 2px 4px rgb(0 0 0/0.5); background: var(--second);}
}

.section-head {display: flex; align-items: flex-start; gap: 20px; margin-bottom: 40px; flex-wrap: nowrap;
  & img {width: clamp(40px, 8vw, 80px); height: auto; flex-shrink: 0;}
  
}

@media (min-width: 1561px) {
.section-head {display: flex; gap: 20px; align-items: flex-start;  flex-wrap: wrap; margin-bottom: 40px;
  & img  {width: clamp(40px, 8vw, 80px); height: auto; flex-shrink: 0;}
  & h2 {margin: 0;}
}}

@media (max-width: 768px) {.section-head img {display: none;}}

.back-link { margin-bottom: 30px; }
.back-link a { color: var(--second); text-decoration: none; display: inline-flex; align-items: center; gap: 8px; }
.two-columns { display: flex; gap: 40px; margin-bottom: 40px; flex-wrap: wrap; }
.two-columns .col { flex: 1; background: var(--light-gray); padding: 20px; }
.form-block { background: var(--gray-opacity-strong); padding: 40px; text-align: center; margin: 40px 0; }
.form-block form { display: flex; flex-wrap: wrap; gap: 15px; justify-content: center; margin-top: 20px; }
.form-block input { padding: 12px 20px; width: 250px; background: var(--white); border: 1px solid var(--gray-opacity); }
@media (max-width: 768px) { .two-columns { flex-direction: column; } .form-block input { width: 100%; } }

.sections-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin: 40px 0;}
.section-card {background: var(--light-gray-opacity);  padding: 20px; transition: all 0.3s;position: relative;}
  .section-card:hover {transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.1); background: var(--white);}
  .section-card h3 {font-family: var(--font-oswald); font-size: 1.5rem; color: var(--primary); margin-bottom: 12px; padding-bottom: 8px; font-weight: 400; border-bottom: 2px solid var(--second);}
  .section-card ul {list-style: none; padding: 0; margin: 0 0 20px 0;}
    .section-card li {font-family: var(--font-arial-narrow); font-size: 1.15rem; color: var(--text); padding: 5px 0 5px 35px; position: relative; line-height: 1.3;}
   /* .section-card li::before {content: "\f013"; font-family: "Font Awesome 6 Free"; font-weight: 900; color: var(--light-gray); position: absolute; left: 4px;}*/

   .section-card li::before {content: ""; display: inline-block; width: 20px; height: 20px; background-image: url("data:image/svg+xml,%3Csvg enable-background='new 0 0 512 512' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m475.397 214.475-56.582-5.904c-3.166-10.507-7.4-20.718-12.645-30.494l35.911-44.112c3.24-3.98 2.941-9.766-.69-13.392l-47.008-46.915c-3.627-3.618-9.397-3.912-13.369-.684l-44.111 35.829c-9.812-5.268-20.026-9.507-30.504-12.657l-5.903-56.572c-.532-5.094-4.825-8.964-9.946-8.964h-66.38c-5.121 0-9.415 3.87-9.946 8.964l-5.904 56.581c-10.51 3.167-20.724 7.403-30.502 12.649l-44.113-35.831c-3.976-3.23-9.752-2.932-13.375.691l-46.916 46.916c-3.624 3.623-3.922 9.399-.691 13.376l35.831 44.113c-5.246 9.777-9.481 19.99-12.649 30.501l-56.581 5.904c-5.093.531-8.963 4.825-8.963 9.946v66.38c0 5.121 3.87 9.414 8.963 9.946l56.573 5.903c3.15 10.479 7.388 20.693 12.656 30.504l-35.83 44.111c-3.228 3.975-2.933 9.745.684 13.369l46.916 47.008c3.625 3.631 9.411 3.932 13.392.69l44.111-35.911c9.775 5.244 19.986 9.479 30.496 12.645l5.904 56.582c.531 5.093 4.825 8.963 9.946 8.963h66.38c5.121 0 9.414-3.87 9.946-8.963l5.903-56.574c10.477-3.148 20.688-7.386 30.497-12.651l44.109 35.91c3.976 3.237 9.758 2.943 13.385-.684l47.008-47.008c3.626-3.626 3.921-9.408.684-13.385l-35.91-44.109c5.267-9.811 9.504-20.021 12.652-30.497l56.573-5.903c5.092-.532 8.963-4.825 8.963-9.946v-66.38c-.002-5.121-3.873-9.414-8.965-9.945zm-11.037 67.314-54.391 5.676c-4.17.436-7.628 3.427-8.657 7.492-3.347 13.221-8.664 26.049-15.807 38.129-2.131 3.604-1.79 8.155.854 11.402l34.513 42.394-34.24 34.24-42.394-34.513c-3.247-2.644-7.798-2.986-11.403-.853-12.076 7.141-24.904 12.459-38.128 15.807-4.065 1.029-7.057 4.485-7.492 8.656l-5.676 54.391h-48.358l-5.675-54.391c-.435-4.165-3.419-7.619-7.477-8.653-13.296-3.387-26.13-8.706-38.143-15.81-3.604-2.133-8.156-1.793-11.403.853l-42.387 34.508-34.168-34.235 34.442-42.402c2.638-3.247 2.975-7.793.845-11.395-7.141-12.077-12.459-24.905-15.808-38.128-1.028-4.065-4.486-7.057-8.656-7.492l-54.39-5.676v-48.358l54.389-5.675c4.166-.435 7.62-3.418 8.654-7.477 3.388-13.296 8.708-26.129 15.811-38.143 2.129-3.602 1.792-8.147-.846-11.395l-34.437-42.396 34.163-34.163 42.396 34.436c3.248 2.638 7.793 2.975 11.394.845 12.016-7.104 24.849-12.424 38.144-15.812 4.058-1.034 7.042-4.488 7.477-8.653l5.675-54.39h48.358l5.676 54.39c.436 4.17 3.427 7.628 7.492 8.658 13.221 3.347 26.05 8.666 38.129 15.807 3.602 2.13 8.148 1.792 11.394-.846l42.402-34.441 34.235 34.167-34.508 42.388c-2.644 3.248-2.984 7.798-.854 11.403 7.104 12.016 12.425 24.85 15.812 38.143 1.034 4.058 4.488 7.042 8.652 7.477l54.391 5.675z' fill='%23999999'/%3E%3Cpath d='m257.406 155.845c-56.14 0-101.812 45.672-101.812 101.811 0 56.089 45.672 101.72 101.812 101.72 56.089 0 101.72-45.631 101.72-101.72 0-56.138-45.631-101.811-101.72-101.811zm0 183.531c-45.111 0-81.812-36.659-81.812-81.72 0-45.11 36.701-81.811 81.812-81.811 45.061 0 81.72 36.701 81.72 81.811 0 45.061-36.659 81.72-81.72 81.72z' fill='%23666666'/%3E%3C/svg%3E"); background-size: contain; background-repeat: no-repeat; position: absolute; left: 5px; top: 7px;}

  .section-card::before,  .section-card:hover::before {display: none;}
 .section-card::after {right: 15px;bottom: 15px; filter: opacity(.65);}
 .section-card:hover::after {right: 15px;bottom: 15px; filter: opacity(1);}

@media (max-width: 992px) {.sections-grid {grid-template-columns: repeat(2, 1fr);}}
@media (max-width: 576px) {.sections-grid {grid-template-columns: 1fr;}}


/*Стили ОГ*/


.mit-prtcp-wrapper {
    & .mit-prtcp_flex-col {
        display: flex;
        flex-direction: column;
        max-width: 1560px;
        margin: 0 auto;
        gap: 5vh;

    }
        & .mit-prtcp_flex-row {
        display: flex;
        box-shadow: 0 10px 30px rgba(0,0,0,0.08);
        border: 1px solid var(--gray-opacity-strong);
        position: relative;
    }
        & .mit-prtcp_txt-accent {
        font-weight: bold;
        color:  var(--primary);
    }
        & p:first-child {
        font-size: 1.2rem;
        font-weight: bold;
        margin-top: 0;
        color: var(--second)
    }
        
}


 .mit-prtcp-specials-item-text {
    flex-basis: 49%;
    margin:auto 1vw;

    & p:first-child {
      font-size: 1.2rem;
      font-weight: bold;
      margin-top: 30px;
      color: var(--second-light)
    }

    & img {
      display: inline-block;
      height: 20px;
      width: auto;
      vertical-align: middle;
      margin-right: 5px;
    }
    & p {margin-bottom: 1.5rem;line-height: 1.5rem;margin-left: 1.5rem;}
  }

   .mit-prtcp-specials-item-img {
    flex-basis: 49%;
    position: relative;
    overflow: hidden;
    & img {    
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;}
  }


.mit-prtcp-importance-collage {
    width: 100%;
    height: 730px;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(12, 1fr);
    grid-gap: 3px;
    max-width: 1560px;
    margin: 0 auto;
  }

  .mit-prtcp-importance-collage-item {
    background-size: cover;
    background-position: top center;
    color: rgba(0, 0, 0, 0);
    font-size: 0;

    &#mpici_01 {
      background-image: url(../upload/tp8ppqcbvh8ltzv8lg8684y42hcjnk2q.webp);
      grid-area: 1 / 1 / 7 / 3;
    }

    &#mpici_02 {
      background-image: url(../upload/p0xrgo7v5abr5em6od2pe4c56s7b51e2.webp);
      grid-area: 7 / 1 / 13 / 3;
    }

    &#mpici_03 {
      background-image: url(../upload/wy30fuu1nork5j397l3tv5kv42k29rrl.webp);
      grid-area: 1 / 3 / 5 / 5;
    }

    &#mpici_04 {
      background-image: url(../upload/puovnkjwu0xyg86ivcxfjmwlowpb9rrd.webp);
      grid-area: 5 / 3 / 9 / 5;
    }

    &#mpici_05 {
      background-image: url(../upload/blsn46li13gri3x2xgpm0gc7ztlxytuj.webp);
      grid-area: 9 / 3 / 13 / 5;
    }

    &#mpici_06 {
      background-image: url(../upload/qhzfg85ey8daus360gr6a3j37vjejjov.webp);
      grid-area: 1 / 5 / 4 / 5;
    }

    &#mpici_07 {
      background-image: url(../upload/wuevz22fcjj2lwoa1w590wsl166zt6xo.webp);
      grid-area: 4 / 5 / 7 / 5;
    }

    &#mpici_08 {
      background-image: url(../upload/ew5kp2e8zr4bj0i7ys01kz09dgy00i99.webp);
      grid-area: 1 / 6 / 7 / 7;
    }

    &#mpici_09 {
      background-image: url(../upload/ul318rs45vk9yh1zxtscf97d3wsr3qqp.webp);
      grid-area: 7 / 5 / 13 / 7;
    }
  }
 .mit-prctp-blocks-container {
    display: grid;
    grid-template-rows: repeat(2, 1fr);
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    max-width: 1560px;
    margin: 0 auto;
  }

  .mit-prtcp-blocks-item {
    background-color: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(5px);
    border-top: 5px solid var(--primary);
    box-shadow: 2px 3px 15px 2px rgba(73, 73, 73, 0.2);
    padding: 20px 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    &#mpbi-01 {
      grid-area: 1 / 1 / 3 / 2;
    }

    &#mpbi-02 {
      grid-area: 1/2/2/4;
    }

    &#mpbi-03 {
      grid-area: 1/4/2/5;
    }

    &#mpbi-04 {
      grid-area: 2/2/3/3;
    }

    &#mpbi-05 {
      grid-area: 2/3/3/5;
    }
  }

  .mit-prtcp-blocks-item-text {
    & p:first-of-type {
      font-weight: bold;
      margin: 0 0 10px 0;
      color: var(--second-light);
    }

    & p:last-of-type {
      font-size: 0.9rem;
      padding-bottom: 2vh;
        line-height: 1.5;
    }
  }

  .mit-prtcp-blocks-item-button {
    width: fit-content;
    padding: 5px 15px;
    background-color:var(--second-light);

    & p {
      margin: 0;
    }

    & a {
      color: #fff;
      text-decoration: none;
      font-size: 0.9rem;
    }
 & a:hover {color: var(--white);}
  }

    .mit-prtcp-blocks-item-button:hover {background-color:var(--primary);color: var(--second);}

@media (max-width: 980px) {
    .mit-prtcp-wrapper {
        & .mit-prtcp_txt-large {
            font-size: 1.3rem;
            text-align: center;
        }
    }
}

 @media (max-width: 980px) {
    .mit-prtcp-wrapper {
      & .mit-prtcp-buttons {
        display: flex;
        flex-direction: column;
        gap: 10px;
      }
      & .mit-prtcp_txt-large {
      font-size: 1.3rem;
      text-align: center;
      }
    }
    .mit-prtcp-intro-photos {
      flex-direction: column !important;
      & img {
        width: 100%;
        margin: 5px;
      }
    }
    .mit-prtcp-importance-container {
      flex-direction: column !important;
      gap: 20px;
    }
    .mit-prtcp-importance-item {
      width: 100%;
      & p:first-of-type {
        font-size: 1.1rem;
      }
      & p:last-of-type {
        font-size: 1rem;
      }
    }
    .mit-prtcp-importance-numbers-container {
      flex-direction: column !important;
      gap: 20px;
    }
    .mit-prtcp-importance-numbers-item {
      width: 100%;
      & p:last-of-type {font-size: 1.3rem;}
    }
    .mit-prtcp-topic-container {
      flex-direction: column !important;
      gap: 20px;
    }
    .mit-prtcp-topic-item {
      display: flex;
      flex-direction: row !important;
      align-items: center;
      align-content: center;
      width: 100%;
      & p {font-size: 1.1rem; text-align: left;}
      & img {margin: 0 20px 0 10px; width: 40px; height: auto;}
    }
    .mit-prctp-blocks-container {
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
    .mit-prtcp-specials-item {
      gap: 20px;
    }
    /*.mit-prtcp-specials-item:nth-child(odd) {
      flex-direction: column !important;
    }
    .mit-prtcp-specials-item:nth-child(even) {
      flex-direction: column-reverse !important;
    }*/
    .mit-prtcp-auditory-container {
      flex-direction: column !important;
      gap: 20px;
    }
    .mit-prtcp-auditory-item {
      flex-basis: 100%;
      background-size: contain;
    }

    .mit-prtcp-reviews-item {
      flex-direction: column !important;
      gap: 20px;
    }
    .mit-prtcp-reviews-item-img {
      text-align: center;
      & img {margin: 0 auto;}
    }
    .mit-prtcp-reviews-item-text {
      & p:first-of-type {
        text-align: center;
      }
    }
    .mit-prtcp-outro-container {
      flex-direction: column !important;
    }
    .mit-prtcp-outro-right {
      & p:first-of-type {
        margin-top: -5px;
      }
    }
    .mit-prtcp-importance-collage {
      grid-template-columns: repeat(3, 1fr);
      grid-template-rows: repeat(3, 1fr);
    }
    .mit-prtcp-importance-collage-item {
      &#mpici_01 {grid-area: 1 / 1 / 1 / 2}
      &#mpici_02 {grid-area: 1 / 2 / 1 / 3}
      &#mpici_03 {grid-area: 1 / 3 / 1 / 4}
      &#mpici_04 {grid-area: 2 / 1 / 2 / 2}
      &#mpici_05 {grid-area: 2 / 2 / 2 / 3}
      &#mpici_06 {grid-area: 2 / 3 / 2 / 4}
      &#mpici_07 {grid-area: 3 / 1 / 3 / 2}
      &#mpici_08 {grid-area: 3 / 2 / 3 / 3}
      &#mpici_09 {grid-area: 3 / 3 / 3 / 4}
    }
  }