 .passos-3d {
      background-color: #e3f0ff;
      padding: 20px;
      height: 100%;
      min-height: 340px;
    }

    .passos-img {
      background-color: white;
      max-height: 150px;
      min-height: 150px;
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 10px;
    }

    .passos-img img {
      width: 120px;
    }

    .passos-txt {
      height: 100%;
      margin-top: 15px;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
    }

    .passos-titulo {
      font-size: 20px;
      color: #5aa5f9;
      margin-bottom: 3px;
      font-family: 'Arboria-Bold', Arial, sans-serif;
    }

    .seccao {
      font-weight: 400;
      font-size: 1rem;
      color: #000000 !important;
      text-transform: none;
      padding: 5px;
      margin-top: 3px;
      margin-bottom: 0;
      border-bottom: 1px solid #e2f0ff;
      cursor: pointer;
      text-align: left;
      display: inline-block;
      width: 70%;
      margin: auto;
      font-family: 'Arboria-Book', Arial, sans-serif;
    }

    .seccao:before {
      font-family: 'Glyphicons Halflings';
      content: "\002b" !important;
      color: #4ea4f6 !important;
      font-size: 1.1rem;
      font-weight: bold;
      padding-right: 5px;
    }

    .panel-heading a:before {
      font-family: 'Glyphicons Halflings';
      content: "\002b" !important;
      color: #4ea4f6 !important;
      font-size: 2.5rem;
      font-weight: 600;
      padding-right: 5px;

    }

    .panel-body {
      font-size: 1rem;
      color: #000000;
      text-align: left;
      padding: 10px 30px 10px 30px;
      background-color: #e2f0ff !important;
      width: 70%;
      margin: auto;
      font-weight: 500;
      font-family: 'Arboria-Book', Arial, sans-serif;
    }

    .resposta-3d {
      margin: 0;
      font-size: 1rem;
      font-weight: 500;
      font-family: 'Arboria-Book', Arial, sans-serif;
    }

    .dark-mode .texto-3d .resposta-3d {
      color: #ffffff !important;
    }

    .titulo-3d {
      font-size: 32px;
      color: #5aa5f9;
      font-family: 'Arboria-Bold', Arial, sans-serif;
    }

    .video-3d>.row>div {
      padding-left: 3rem !important;
    }

    .content-video {
      position: relative;
      height: 100%;
      min-height: 500px;
    }

    .content-video video {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .video-txt {
      font-size: 1.3rem;
      color: black;
      margin-bottom: 30px;
      font-family: 'Arboria-Book', Arial, sans-serif;
    }

    .projetos-txt {
      margin: 0;
      font-size: 1rem;
      color: black;
      margin-top: 5px;
      font-family: 'Arboria-Bold', Arial, sans-serif;
    }

    .btn-3d {
      background: #26a2fc;
      border: none;
      padding: 5px 20px;
      color: white;
      font-size: 16px;
      font-weight: 500;
      font-family: 'Arboria-Bold', Arial, sans-serif;
    }

    .btn-3d:hover {
      color: white;
    }

    .bg-3d {
      background-image: url(https://www.castroelectronica.pt/Imgs/outros/PRODUTOS_PERSONALIZADOS/Simulador_3D/Duvidas-1000x400.jpg?v=1756734742550);
      background-size: cover;
      background-position: center;
    }

    .dark-mode .resposta-3d {
      color: #000000 !important;
    }

    .dark-mode .seccao {
      color: rgb(255, 255, 255) !important;
    }

    #carousel3d .carousel-control-next,
    #carousel3d .carousel-control-prev,
    #carousel3dmobile .carousel-control-next,
    #carousel3dmobile .carousel-control-prev {
      background-color: rgba(0, 0, 255, 0) !important;
    }

    #carousel3d .carousel-indicators li,
    #carousel3dmobile .carousel-indicators li,
    #carouselsimuladormobile .carousel-indicators li {
      background-color: #e3f0ff;
    }

    #carousel3d .carousel-indicators .active,
    #carousel3dmobile .carousel-indicators .active,
    #carouselsimuladormobile .carousel-indicators .active {
      background-color: #26A2FC;
    }

    #carouselsimuladormobile .carousel-indicators li {
      background-color: #e3f0ff;
    }

    #carouselsimuladormobile .carousel-indicators .active {
      background-color: #26A2FC;
    }


    .galeria-3d {
      background: #e3f0ff;
      display: flex;
      overflow-x: auto;
      white-space: nowrap;
    }

    .galeria-3d>div {
      position: relative;
      overflow: hidden;
    }

    .galeria-3d .projetos-txt {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      color: white;
      font-size: 1.3rem;
      text-shadow: 0 2px 6px rgba(0, 0, 0, 0.6);
      opacity: 0;
      transition: opacity 0.8s ease;
      pointer-events: none;
      font-family: 'Arboria-Bold', Arial, sans-serif;
    }

    .galeria-3d>div:hover .projetos-txt {
      opacity: 1;
    }

    .galeria-3d img {
      display: block;
      transition: all 1s ease;
    }

    .galeria-3d>div:hover img {
      transform: scale(1.05);
      filter: brightness(0.8);
    }

    /* Estilo da barra de scroll */
    .galeria-3d::-webkit-scrollbar {
      height: 5px;
    }

    /* Fundo da barra */
    .galeria-3d::-webkit-scrollbar-track {
      background: #f7f7f7;
      border-radius: 10px;
    }

    /* Scroll (parte que arrasta) */
    .galeria-3d::-webkit-scrollbar-thumb {
      background: #26A2FC;
      border-radius: 10px;
    }

    .duvidas>.row>div {
      padding-left: 3rem !important;
    }


    /*Simulador 3D Canvas*/

    #container {
      display: flex;
      height: 100%;
    }

    #canvasContainer {
      flex: 2;
      background: #333;
    }

    #renderCanvas {
      width: 100%;
      height: 100%;
      display: block;
    }

    #steps {
      flex: 1;
      background: #e2f0ff;
      display: flex;
      flex-direction: column;
      padding: 20px;
      overflow-y: auto;
      font-size: 14px;
      font-family: 'Arboria-Book', Arial, sans-serif;
      overflow: visible;
      min-width: 240px;
    }

    #steps h3 {
      font-size: 16px;
    }

    #steps>div {
      margin-bottom: 20px;
    }

    #step1 input[type="file"]::file-selector-button {
      border-radius: 0;
      background: #26a2fc;
      color: white;
    }

    #step2 button {
      width: 20px;
      height: 20px;
      border: none;
      border-radius: 100%;
      margin-right: 5px;
    }

    #step2 label {
      width: 90px;
      min-width: 90px;
    }

    .nextstep {
      background: #26a2fc;
      border: none;
      padding: 5px 20px;
      color: white;
      float: right;
    }

    .prevstep {
      background: #fff;
      border: none;
      padding: 5px 20px;
      color: #26a2fc;
    }

    .prevstep:focus,
    #step5 input:focus-visible {
      outline: 0px auto #e5f4ff;
    }

    .nextstep:focus {
      outline: 0px auto #26a2fc;
    }

    #step3 select,
    #step5 input,
    #step6 input[type='text'],
    #step6 input[type='email'] {
      font-size: 13px;
      height: 40px;
      padding-left: 10px;
      border: solid 2px #e4f3fe;
      background-color: #ffffff;
      border-radius: 24px;
    }

    #step3 select:focus-visible,
    #step5 input:focus-visible,
    #step6 input[type='text']:focus-visible,
    #step6 input[type='email']:focus-visible,
    #step6 textarea:focus-visible {
      outline: 1px auto #e2f0ff;
    }

    #step6 textarea {
      font-size: 13px;
      padding-left: 10px;
      border: solid 2px #e4f3fe;
      background-color: #ffffff;
      border-radius: 24px;
    }

    /*@media (max-width: 768px) {
      #container {
        flex-direction: column;
      }

      #canvasContainer {
        order: 1;
        max-height: 400px;
      }

      #steps {
        order: 2;
      }
    }*/

    .colores {
      display: flex;
      flex-wrap: wrap;
      width: 400px;
      max-width: 400px;
    }

    .color-option {
      position: relative;
      display: inline-block;
    }

    .color-btn {
      width: 50px;
      height: 50px;
      border: none;
      border-radius: 50%;
      cursor: pointer;
    }

    .tooltip-color {
      visibility: hidden;
      opacity: 0;
      position: absolute;
      bottom: 26px;
      left: 46%;
      transform: translateX(-50%);
      background: white;
      border: 1px solid #ccc;
      border-radius: 5px;
      padding: 5px;
      transition: opacity 0.2s;
      z-index: 10;
    }

    .tooltip-color::after {
      content: "";
      position: absolute;
      top: 100%;
      left: 48%;
      transform: translateX(-50%);
      width: 0;
      height: 0;
      border-left: 8px solid transparent;
      border-right: 8px solid transparent;
      border-top: 8px solid #ccc;
    }


    .tooltip-color::before {
      content: "";
      position: absolute;
      top: 100%;
      left: 48%;
      transform: translateX(-50%);
      width: 0;
      height: 0;
      border-left: 7px solid transparent;
      border-right: 7px solid transparent;
      border-top: 7px solid #fff;
      margin-top: 1px;
    }

    .tooltip-color img {
      width: 150px;
      height: auto;
      display: block;
    }


    .tooltip-color a {
      display: block;
      margin-top: 4px;
      font-size: 11px;
      color: #26a2fc;
      text-decoration: none;
      text-align: center;
      font-weight: 600;
    }

    .tooltip-color a:hover {
      text-decoration: underline;
    }

    .color-option:hover .tooltip-color,
    .color-option .tooltip-color:hover {
      visibility: visible;
      opacity: 1;
    }

    .preenchimento-container {
      position: relative;
      width: 100%;
      max-width: 400px;
      margin-top: 30px;
    }

    .preenchimento-range-labels {
      display: flex;
      justify-content: space-between;
      margin-bottom: 8px;
      font-size: 14px;
      font-weight: 500;
      color: #444;
    }

    @font-face {
      font-family: 'Arboria-Bold';
      src: url('https://www.castroelectronica.pt/interface/fonts/Arboria-Bold.woff') format('woff');
      font-weight: normal;
      font-style: normal;

    }

    @font-face {
      font-family: 'Arboria-Book';
      src: url('https://www.castroelectronica.pt/interface/fonts/Arboria-Book.woff') format('woff');
      font-weight: normal;
      font-style: normal;

    }

    /*@Media*/
    @media (max-width: 1290px) {
      .passos-3d {
        padding: 10px;
      }
    }

    @media (max-width: 1199px) {
      .passos-3d {
        padding: 20px;
      }
    }

    @media (max-width: 991px) {
      .duvidas>.row>div {
        padding-left: 1.5rem !important;
      }

      .video-3d .text-left {
        text-align: center !important;
      }

      .video-3d video {
        margin-top: 30px;
      }

      .video-3d>.row>div {
        padding-left: 1.5rem !important;
      }
    }

    @media (max-width: 767px) {
      .titulo-3d {
        font-size: 28px;
      }

      .seccao,
      .panel-body {
        width: 100%;
      }

      .video-txt {
        font-size: 1rem;
      }

      .content-video {
        min-height: 300px;
      }

      #container {
        flex-direction: column;
      }

      #canvasContainer {
        order: 1;
        max-height: 400px;
      }

      #steps {
        order: 2;
      }
    }