.features-icons {
  padding-top: 7rem;
  padding-bottom: 7rem;
}
.features-icons .features-icons-item {
  max-width: 20rem;
}
.features-icons .features-icons-item .features-icons-icon {
  height: 7rem;
}
.features-icons .features-icons-item .features-icons-icon i {
  font-size: 4.5rem;
}

header.masthead {
  position: relative;
  /*background-color: #343a40;*/
  /*background: url("../assets/img/istockphoto-1410821867-612x612-photoaidcom-2x-ai-zoom-photoaidcom-2x-ai-zoom.jpeg") no-repeat center center;*/
  /*background: url("../assets/img/blue-curves-18206-2560x1440.jpeg") no-repeat center center;*/
  background: url("../img/bgg.jpg") no-repeat center right;
  background-attachment: fixed;
  /*background: url("../assets/img/bg.png") no-repeat center center;*/
  /*background: url("../assets/img/background-4-1440.jpeg") no-repeat center center;*/
  /*background: url("../assets/img/dandelion_01.jpeg") no-repeat center center;*/
  background-size: cover;
  padding-top: 8rem;
  padding-bottom: 8rem;
}
header.masthead:before {
  content: "";
  position: absolute;
  /*background-color: #1c375e;*/
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  opacity: 0.5;
}
header.masthead h1, header.masthead .h1 {
  /*font-size: 2rem;*/
}
@media (min-width: 768px) {
  header.masthead {
    padding-top: 10rem;
    padding-bottom: 12rem;
  }
  header.masthead h1, header.masthead .h1 {
    font-size: 5rem;
  }
}

.showcase .showcase-text {
  padding: 3rem;
}
.showcase .showcase-img {
  min-height: 30rem;
  background-size: cover;
}
@media (min-width: 768px) {
  .showcase .showcase-text {
    padding: 4rem;
  }
}

.testimonials {
  padding-top: 7rem;
  padding-bottom: 7rem;
}
.testimonials .testimonial-item {
  max-width: 18rem;
}
.testimonials .testimonial-item img {
  max-width: 12rem;
  box-shadow: 0px 5px 5px 0px #adb5bd;
}

/* .call-to-action section removed — not used in current pages */

footer.footer {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.form-control, .btn {
  border-radius: 0;
}




/* Color of the links BEFORE scroll */
.navbar-scroll .nav-link,
.navbar-scroll .navbar-brand,
.navbar-scroll .navbar-toggler .fa-bars {
  color: #fff;
}

/* Color of the links AFTER scroll */
.navbar-scrolled .nav-link,
.navbar-scrolled .navbar-toggler .fa-bars {
  /*color: #4f4f4f;*/
}

/* Color of the navbar AFTER scroll */
.navbar-scrolled {
  background-color: #333;
  transition: background-color 0.5s ease;
}

/* ======= Fonts ======= */

@font-face {
    font-family: CL;
    src: url("../fonts/Comfortaa-Light.ttf") format("opentype");
}

@font-face {
    font-family: CSB;
    src: url("../fonts/Comfortaa-SemiBold.ttf") format("opentype");
}

@font-face {
    font-family: CM;
    src: url("../fonts/Comfortaa-Medium.ttf") format("opentype");
    font-style: normal;
    ascent-override: 90%;
}

@font-face {
    font-family: CR;
    src: url("../fonts/Comfortaa-Regular.ttf") format("opentype");
}

/* ======= Base ======= */

html, body {
    min-height: 100vh;
}

body {
    font-size: 18px;
}

/* ======= Accordion ======= */

.accordion-header {
    padding-top: 0.8rem;
    padding-bottom: 0.8rem;
}

.accordion-button {
    font-size: 14pt;
    cursor: pointer;
}

.accordion-button:not(.collapsed) {
    background-color: transparent !important;
    color: #000 !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

.accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' d='M8 0a1 1 0 0 1 1 1v6h6a1 1 0 1 1 0 2H9v6a1 1 0 1 1-2 0V9H1a1 1 0 0 1 0-2h6V1a1 1 0 0 1 1-1z' clip-rule='evenodd'/%3e%3c/svg%3e");
    font-size: 12pt;
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' d='M0 8a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H1a1 1 0 0 1-1-1z' clip-rule='evenodd'/%3e%3c/svg%3e");
    font-size: 12pt;
    rotate: 90deg;
}

.accordion-button:focus {
    outline: none;
    box-shadow: none;
    border: none;
}

.accordion {
    --bs-accordion-bg: transparent !important;
    --bs-accordion-btn-icon-width: 0.9rem;
    --bs-accordion-btn-icon-transform: rotate(90deg);
    --bs-accordion-border-color: #333;
}

.accordion-body {
    padding-top: 0;
}

/* ======= Flip animation (integration logos) ======= */

.flip-container {
    background: transparent;
    display: inline-block;
}

.flip-this {
    position: relative;
    width: 100%;
    height: 100%;
    transition: 0.8s;
    transform-style: preserve-3d;
    filter: grayscale(100%) brightness(75%) contrast(2.5);
}

.flip-this img {
    max-height: 42px;
    max-width: 132px;
}

.flip-container:hover .flip-this {
    animation: container-exiting-vertical 0.8s 1;
    filter: none;
}

@keyframes container-exiting-vertical {
    0%   { transform: rotate3d(1, 0, 0, 0deg); }
    25%  { transform: rotate3d(0, 1, 0, 60deg); }
    50%  { transform: rotate3d(1, 0, 0, 90deg); }
    75%  { transform: rotate3d(0, 1, 0, -60deg); }
    100% { transform: rotate3d(1, 0, 0, 0deg); }
}

/* ======= Navbar ======= */

.navbar-toggler {
    border: none;
}

.navbar-toggler:focus {
    text-decoration: none;
    outline: 0;
    box-shadow: none;
}

.navbar .navbar-toggler {
    filter: grayscale(1) invert(1);
}

.bg-black .navbar-brand img {
    height: 26px;
    transition: height .5s;
}

/* ======= Popover ======= */

.custom-popover {
    --bs-popover-border-radius: 0;
    --bs-popover-body-padding-x: 1rem;
    --bs-popover-body-padding-y: .5rem;
    --bs-popover-font-size: 1rem;
}

/* ======= Icon stack ======= */

.icon-stack {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    height: 4.5rem;
    width: 4.5rem;
    font-size: 2.5rem;
    background-color: #000;
    color: #fff;
    flex-shrink: 0;
}

/* ======= Hero section ======= */

#hero_main {
    position: absolute;
    width: 35%;
    height: 282px;
    animation: my1 0.8s 1;
    animation-fill-mode: forwards;
    background: url("../img/scaled/bg_hero_page_source.png") no-repeat center center;
    background-size: cover;
    right: 200px;
    top: 74px;
}

#hero_roadmap {
    position: absolute;
    width: 20%;
    height: 188px;
    animation: my2 1s 1;
    animation-fill-mode: forwards;
    background: url("../img/scaled/bg_jira_roadmap.jpg") no-repeat center left;
    background-size: cover;
    right: 52px;
    top: 112px;
}

#hero_terminal {
    position: absolute;
    width: 64px;
    height: 64px;
    animation: my3 1.8s 1;
    animation-fill-mode: forwards;
    right: 196px;
    top: 64px;
    cursor: pointer;
}

#hero_code_edit {
    position: absolute;
    width: 20%;
    height: 180px;
    animation: my4 2s 1;
    animation-fill-mode: forwards;
    background: url("../img/scaled/bg_ide_programm_interface.jpg") no-repeat center center;
    background-size: cover;
    right: 120px;
    top: 280px;
    z-index: 3;
}

@keyframes my1 { 0% { right: -200px; } }
@keyframes my2 { 0% { right: -120px; } }
@keyframes my3 { 0% { top: -660px; } }
@keyframes my4 { 0% { right: -90px; } }

#hero_main_top {
    animation-name: fade;
    animation-timing-function: ease-in-out;
    animation-duration: 15s;
    animation-direction: alternate;
    animation-iteration-count: 1;
}

@keyframes fade {
    0%  { transform: translateY(0%); }
    25% { transform: translateY(-20%); }
    50% { opacity: 1; transform: translateY(-20%); }
    75% { transform: translateY(-20%); }
    90% { transform: translateY(0%); }
}

.hero-text h1 {
    line-height: 0.9em;
}

/* ======= Contact form ======= */

.sendmail {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

@keyframes popDiv {
    0%   { transform: scale(1) rotate(0deg); }
    25%  { transform: scale(0) rotate(360deg); opacity: 0; }
    100% { transform: scale(1) rotate(360deg); opacity: 1; }
}

.pop {
    animation: popDiv 8s ease-in-out;
    -webkit-animation-fill-mode: forwards;
}

.form-control.is-valid,
.was-validated .form-control:valid {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='green' class='bi bi-check2-circle' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8a5.5 5.5 0 0 1 8.25-4.764.5.5 0 0 0 .5-.866A6.5 6.5 0 1 0 14.5 8a.5.5 0 0 0-1 0 5.5 5.5 0 1 1-11 0z'%3E%3C/path%3E%3Cpath d='M15.354 3.354a.5.5 0 0 0-.708-.708L8 9.293 5.354 6.646a.5.5 0 1 0-.708.708l3 3a.5.5 0 0 0 .708 0l7-7z'%3E%3C/path%3E%3C/svg%3E");
}

.was-validated .form-control:invalid {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='red' class='bi bi-x-circle' viewBox='0 0 16 16'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'%3E%3C/path%3E%3Cpath d='M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z'%3E%3C/path%3E%3C/svg%3E");
}

/* ======= Misc ======= */

.scene-icon {
    width: 64px;
    height: 64px;
}

.brands {
    filter: grayscale(100%) brightness(75%) contrast(2.5);
}