/*
Theme Name: Borstein

  1. >>> Headr Style
  2. >>> Banner Style
  3. >>> Resume Style
  4. >>> Project Style
  5. >>> Testimonials Style
  6. >>> Email Style
  7. >>> Footer Style

*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------*/
:root {
	--font_14:0.875rem;
	--font_16:1rem;
	--font_30:1.875rem;
	--font_36:2.25rem;
	--font_48:3rem;
	--40:2.5rem;
	--30:1.875rem;
	--margin_30:1.875rem;
	--margin-54:3.375rem;
	--margin-60:3.75rem;
	--margin-100:6.25rem;
	--margin-120:7.5rem;   
}
html {font-family: 'Poppins', sans-serif;background-color:#2A2A2A;scroll-behavior: smooth;}
body {font-family: 'Poppins', sans-serif;overflow-x: hidden; background-color:#2A2A2A; font-weight:400;font-style: normal; color: #FFF; font-size: var(--font_14)}
a,a:hover,a:focus,i,input,button,input:focus,.transition {text-decoration: none;outline: none;transition-delay: 0s;transition-duration: 0.4s;transition-property: all;transition-timing-function: ease;box-shadow: none;}
a{color: #008080}
iframe {border: 0;outline: none;}
::-moz-selection {background: var(--red);text-shadow: none;color:var(--white)}
::selection {background:var(--red);text-shadow: none;color:var(--white)}
img {max-width: 100%;border: none;outline: none;height: auto;}
input,textarea {border-radius: 0;resize: none;}
ul {padding: 0;margin: 0;}
@font-face {
font-family: 'DM Serif Display', serif;
font-family: 'Poppins', sans-serif;}
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {background-color: transparent;background-image: none;color:#000;}
/* 1.2 Typography */
h1,h2,h3,h4,h5,h6 {font-family: 'DM Serif Display', serif;}
figure{ margin: 0 }
svg,img { max-width: 100%; height: auto; }

/*------------
VC Paleta de Cores
-------------*/
.color-1 {color: #FFFFFF;}
.color-2 {color: #DC143C;}
.color-3 {color: #000000;}
.color-4 {color: #808080;}
.color-5 {color: #8B4513;}
.color-6 {color: #008080;}

.language-selector {
  display: flex; /* Organiza os itens do seletor de idioma lado a lado */
  gap: 10px; /* Adiciona um espaço entre os links dos idiomas */
  
}

.language-selector a {
  font-family: Arial, sans-serif; /* Usa uma fonte que suporte emojis */
  font-size: 24px; /* Ajusta o tamanho do emoji */
  color: inherit; /* Mantém a cor do texto herdada do elemento pai */
  text-decoration: none; /* Remove o sublinhado dos links */
  background-color: transparent; /* Fundo transparente para os links */
  border: none; /* Remove a borda dos links, se houver */
  cursor: pointer; /* Muda o cursor para indicar que o item é clicável */
  padding: 5px; /* Adiciona um pouco de espaço ao redor do emoji para torná-lo mais fácil de clicar */
}

/* Estilos para hover (quando o mouse está sobre o link) */
.language-selector a:hover {

  border-radius: 5px; /* Adiciona bordas arredondadas */
}
/*-----------------------------------------------------------------
  1. >>> Headr Style
----------------------------------------------------------------*/
.ds-header{ padding-top:2.5rem; padding-bottom: 7.8125rem; position: relative;  }
.ds-logo a{ display: inline-block; background-color: #008080; font-weight: 600; font-size: 1.125rem; padding: 0  0.4375rem; color: #000}
.ds-logo a:hover,.ds-logo a:focus{color: #000}
/*-----------------------------------------------------------------
  2. >>> Banner Style
----------------------------------------------------------------*/
.ds-banner{ margin-bottom: 8.125rem }
.ds-banner-hed{ font-size: 5.3125rem; line-height:5rem  }
.ds-image-shadow{box-shadow:30px 30px #008080;}
/*.ds-banner-left{display: flex; justify-content: space-between; flex-direction: column;}*/
.ds-social{ list-style: none; display: flex; align-items: center;margin-top: 2.5rem }
.ds-social li{ margin-right: 15px }
.ds-social li:alst-child{ margin-right: 0 }
.ds-social a{ width: 30px; height: 30px; background-color: #008080; border-radius: 100%; text-align: center; display: flex; justify-content: center; align-items: center; font-size:1.25rem; color:#2A2A2A }
.ds-social li:hover a{background-color: #008080; color:#000; transform: translateY(-3px); }
.ds-social a:hover{box-shadow: 0 4px 8px rgba(0,128,128,0.4);}

.ds-banner figure{width: 370px; position: relative;}
.ds-banner figure figcaption{ color: #FFF; font-size:1.875rem; position: absolute; bottom: 0; width: 100%; text-align: center; padding-bottom:2.5rem  }
/*-----------------------------------------------------------------
  3. >>> Resume Style
----------------------------------------------------------------*/
.ds-resume-section{ background-color: #000; padding: 7.5rem 0 }
.ds-resume-section h2{ font-size: 2.5rem; line-height: 3.375rem; width: 100%;max-width: 80%;margin: 0 }
.ds-resume-section p{ color:#9C9C9C; font-size: 1rem; line-height: 1.875rem }
.ds-download-button{ display: inline-block; color: #008080; border: 1px solid #008080; letter-spacing: 3px; text-transform: uppercase; font-size: 0.75rem; padding:0.875rem 1.25rem; margin-top: 30px  }
.ds-download-button i{ font-size:1.125rem; vertical-align: middle;  }
.ds-download-button:hover{ color: #000; background-color:#008080  }
/*-----------------------------------------------------------------
  4. >>> Projects Style
----------------------------------------------------------------*/
.ds-projects-section{padding: 7.5rem 0 }
.ds-projects-section h2{ font-size: 2.5rem; line-height: 3.375rem; width: 100%;max-width:40%;margin: 0}
.ds-projects-section h2 span{ display: block; font-family: 'Poppins', sans-serif; text-transform: uppercase; color: #008080; font-weight: 600; letter-spacing: 3px; font-size: 0.75rem; margin-bottom: 0.625rem}

.ds-projects-listing-section{ margin-top:5rem  }
.ds-projects-loop figure{ margin-right: 60px; position: relative; }
.ds-projects-loop:hover figure img.ds-image-shadow{box-shadow:20px 20px #C7F900;}
.ds-link-button{ position: absolute; right:0.4375rem; top:0.4375rem; width: 2rem; height: 2rem; border-radius: 3px; background-color: #000; display: block; justify-content: center; align-items: center; color: #008080; font-size: 1.125rem; text-align: center; opacity: 0 }
.ds-projects-loop:hover .ds-link-button{ opacity: 1 }
.ds-projects-loop section{ margin-top: 5.875rem }
.ds-projects-loop section h3{font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 1.25rem}
.ds-projects-loop section span{ font-size: 1rem; font-weight: 400 }
/*-----------------------------------------------------------------
  5. >>> Testimonials Style
----------------------------------------------------------------*/
.ds-testimonials-section{ background-color: #000;padding: 7.5rem 0 }
.ds-testimonials-section h2 span{ display: block; font-family: 'Poppins', sans-serif; text-transform: uppercase; color: #008080; font-weight: 600; letter-spacing: 3px; font-size: 0.75rem; margin-bottom:2.5rem}

.ds-testimonials-loop article{ color: #9C9C9C; font-size: 2rem; line-height: 2.8125rem }
.ds-testimonials-loop section{ margin-top: 3.75rem }
.ds-testimonials-loop section span{ display: block; font-size: 1rem; line-height: 1.375rem }
.ds-testimonials-loop section span.ds-name{ font-weight: 600 }
.ds-testimonials-slider .slick-arrow{ display: inline-block; outline: none; cursor: pointer; font-size:1.5rem; line-height:3.75rem; text-align: center;  border: 1px solid #575757; padding: 0; width: 3.75rem; height: 3.75rem; border-radius: 100%; background-color:#000; color: #575757; position: absolute; bottom: 0; right: 0; z-index: 2 }
.ds-testimonials-slider .slick-arrow:hover{ color: #008080; border-color: #008080 }
.ds-testimonials-slider .slick-arrow.slick-prev{ right: 4.375rem }
/*-----------------------------------------------------------------
  6. >>> Email Style
----------------------------------------------------------------*/
.ds-email-section{padding: 7.5rem 0; background-color: #008080; text-align: center;}
.ds-email-section h2{ font-size: 3.75rem;color: #000; margin-bottom: 1.875rem }
.ds-email-section a{ font-size:1.25rem; font-weight: 500; text-decoration: underline;  }
.ds-email-section a:hover{ color: #000; text-decoration: none; }


/*-----------------------------------------------------------------
  6. >>> Email Style
----------------------------------------------------------------*/
.ds-email-section-2{padding: 7.5rem 0; background-color: #2A2A2A; text-align: center;}
.ds-email-section-2 h2{ font-size: 3.75rem;color: #FFF; margin-bottom: 1.875rem }
.ds-email-section-2 a{ font-size:1.25rem; font-weight: 500; text-decoration: none;  }
.ds-email-section-2 a:hover{ color: #FFF; text-decoration: none; }

.ds-social-2{ list-style: none; display: flex; align-items: center;margin-top: 2.5rem;justify-content: center;text-decoration: none;}
.ds-social-2 li{ margin-right: 15px }
.ds-social-2 a{ width: 30px; height: 30px; text-decoration: none; background-color: #2A2A2A; border-radius:50%; text-align: center; display: flex; justify-content: center; align-items: center; font-size:1.25rem; color:#FFFFFF }
.ds-social-2 li:hover a{background-color: #FFFFFF; color:#2A2A2A; transform: translateY(-3px); }
.ds-social-2 a:hover{box-shadow: 0 4px 8px rgba(255,255,255,0.3);}
.ds-social-2 li:last-child{ margin-right: 0 }




/*-----------------------------------------------------------------


/*-----------------------------------------------------------------
  6. >>> Email Style
----------------------------------------------------------------*/
.ds-email-section-1{padding: 7.5rem 0; background-color: #000000; text-align: center;}
.ds-email-section-1 h2{ font-size: 3.75rem;color: #FFF; margin-bottom: 1.875rem }
.ds-email-section-1 a{ font-size:1.25rem; font-weight: 500; text-decoration: underline;  }
.ds-email-section-1 a:hover{ color: #FFF; text-decoration: none; }
/*-----------------------------------------------------------------

/* Work Experience Styles */
.ds-workexperience-section {
    padding: 7.5rem 0; /* Adjusted for work experience section */
}

.ds-workexperience-section h2 {
    font-size: 2.5rem;
    line-height: 3.375rem;
    max-width: 40%;
    margin: 0 auto; /* Center the title if you prefer */
}

.ds-workexperience-section h2 span {
    display: block;
    font-family: 'Poppins', sans-serif;
    text-transform: uppercase;
    color: #008080;
    font-weight: 600;
    letter-spacing: 3px;
    font-size: 0.75rem;
    margin-bottom: 0.625rem;
}

.ds-workexperience-listing-section {
    margin-top: 5rem; /* Adjust the top margin for listing */
}

.ds-workexperience-loop {
    margin-bottom: 2.5rem; /* Space between work experience entries */
    padding: 1.25rem; /* Inner padding */
    background: #1a1a1a; /* Background color for each loop item if needed */
    border-radius: 0.5rem; /* Rounded corners for the loop items */
}

.ds-workexperience-loop h3 {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 1.25rem;
    color: #fff;
    margin-bottom: 0.5rem;
}

.ds-workexperience-loop p {
    font-size: 1rem;
    font-weight: 400;
    color: #9C9C9C;
}

.ds-workexperience-loop .text-muted {
    color: #CCCCCC;
}



/*-----------------------------------------------------------------
  7. >>> Footer Style
----------------------------------------------------------------*/
.ds-footer{ padding: 2.5rem 0; text-align: center; color: #CECECE; font-size: 1.25rem }
.ds-footer a{color: #CECECE }
.ds-footer a:hover{color: #CECECE; text-decoration: underline; }
/*-------------------------------------------------------------------------------
 XS Style @media (max-width: 767px) 
-------------------------------------------------------------------------------*/
@media (max-width: 767px) {
	.ds-header {padding-top: 2.5rem;padding-bottom:2.5rem;}
	.ds-banner-hed {font-size: 2.3125rem;line-height: 3rem;}
	.ds-banner .container{ position: relative; padding-bottom: 90px }
	.ds-social{ position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }
	.ds-banner figure{ width: 90%; margin: 0 auto; margin-top: 40px }
	.ds-image-shadow {box-shadow:20px 20px #c7f900;}
	.ds-banner {margin-bottom: 3.5rem;}
	.ds-resume-section,.ds-projects-section,.ds-testimonials-section,.ds-email-section{ padding: 3.5rem 0 }
	.ds-resume-section h2,.ds-projects-section h2{ max-width: 100% }
	.ds-projects-section h2 span{ margin-bottom: 0 }
	.ds-projects-listing-section {margin-top: 3rem;}
	.ds-projects-loop section{margin-top: 2.875rem;}
	.ds-projects-loop figure{ margin-right: 20px }
	.ds-projects-loop{margin-bottom: 3.5rem;}
	.ds-projects-loop:last-child{ margin-bottom: 0 }
	.ds-testimonials-loop article{ font-size:1rem; line-height: 2rem  }
	.ds-email-section h2{ font-size: 2rem }
	.ds-testimonials-slider .slick-arrow{width: 2.75rem;height: 2.75rem;line-height: 2.75rem;}
}


@media (min-width: 768px) and (max-width: 991px) {
.ds-header{padding-bottom: 3.8125rem;}
.ds-banner-hed{font-size: 3.3125rem;line-height: 4rem;}
.ds-banner figure{ margin-right: 1.875rem }
.ds-projects-section h2{ max-width: 60% }
.ds-projects-loop figure{ margin-right: 40px }
}

@media (min-width: 992px) and (max-width: 1199px) {
.ds-banner figure{ margin-right: 1.875rem }

}

/*-----------------------------------------------------------------
  >>> Content Selection & Copy Permissions
----------------------------------------------------------------*/
/* Ensure all text content is selectable and copyable */
body, p, h1, h2, h3, h4, h5, h6, span, div, article, section {
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
  user-select: text !important;
}

/* Allow text selection for specific content areas */
.ds-banner, .ds-resume-section, .ds-email-section, .ds-email-section-2 {
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
  user-select: text !important;
}

/* Ensure links and interactive elements remain selectable */
a, button {
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
  user-select: text !important;
}

/* Allow copy operations */
body {
  -webkit-touch-callout: default !important;
  -webkit-user-select: text !important;
  -khtml-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
  user-select: text !important;
}

/*-----------------------------------------------------------------
  >>> Skip to Content (Accessibility)
----------------------------------------------------------------*/
.skip-to-content {
  position: absolute;
  top: -100%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #008080;
  color: #000;
  padding: 0.75rem 1.5rem;
  font-weight: 600;
  z-index: 9999;
  border-radius: 0 0 5px 5px;
  transition: top 0.3s;
}
.skip-to-content:focus {
  top: 0;
  color: #000;
}

/*-----------------------------------------------------------------
  >>> Focus Styles (Accessibility)
----------------------------------------------------------------*/
a:focus-visible, button:focus-visible, .ds-download-button:focus-visible {
  outline: 2px solid #008080;
  outline-offset: 3px;
}

/*-----------------------------------------------------------------
  >>> Back to Top Button
----------------------------------------------------------------*/
.back-to-top {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-color: #008080;
  color: #000;
  border: none;
  font-size: 1.25rem;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease, visibility 0.4s ease, transform 0.4s ease;
  z-index: 999;
  box-shadow: 0 2px 10px rgba(0,128,128,0.3);
}
.back-to-top.visible {
  opacity: 1;
  visibility: visible;
}
.back-to-top:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 15px rgba(0,128,128,0.5);
}


/*-----------------------------------------------------------------
  >>> Credentials strip
----------------------------------------------------------------*/
.ds-credentials{ background-color:#000; padding:4.375rem 0; border-top:1px solid #008080 }
.ds-cred-list{ list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; justify-content:center; gap:2.5rem 4rem }
.ds-cred-list li{ text-align:center; flex:0 1 12rem }
.ds-cred-n{ display:block; font-size:3rem; line-height:1; font-weight:600; color:#008080; font-variant-numeric:tabular-nums }
.ds-cred-l{ display:block; margin:.625rem auto 0; font-size:.875rem; line-height:1.45; color:#9C9C9C; max-width:15rem }
.ds-awards{ margin:3rem 0 0; text-align:center; font-size:.9375rem; letter-spacing:.03em; color:#CECECE }
.ds-awards-label{ display:block; margin-bottom:.625rem; font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; color:#008080 }
.ds-awards span[aria-hidden]{ color:#008080; margin:0 .375rem }

/*-----------------------------------------------------------------
  >>> Areas of Expertise (dois niveis)
----------------------------------------------------------------*/
.ds-expertise-label{ font-size:.75rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:#000; opacity:.6; margin:0 0 1.125rem }
.ds-expertise{ list-style:none; padding:0; margin:0 0 2.75rem; display:flex; flex-wrap:wrap; justify-content:center; gap:.625rem }
.ds-expertise:last-child{ margin-bottom:0 }
.ds-expertise li{ padding:.4375rem .9375rem; font-size:1rem; line-height:1.3; color:#000; border:1px solid rgba(0,0,0,.3) }
.ds-expertise--focus li{ background-color:#000; color:#008080; border-color:#000; font-weight:600 }
.ds-expertise--base li{ font-size:.9375rem; opacity:.85 }

@media (max-width: 767px){
  .ds-credentials{ padding:3rem 0 }
  .ds-cred-list{ gap:2rem }
  .ds-cred-list li{ flex:0 1 8rem }
  .ds-cred-n{ font-size:2.25rem }
  .ds-expertise li{ font-size:.9375rem; padding:.375rem .75rem }
}

/*-----------------------------------------------------------------
  >>> Passions list
----------------------------------------------------------------*/
.ds-passions{ list-style:none; padding:0; margin:2rem 0 0; display:flex; flex-wrap:wrap; justify-content:center; gap:.625rem }
.ds-passions li{ padding:.4375rem .9375rem; font-size:1rem; line-height:1.3; color:#FFF; border:1px solid rgba(255,255,255,.25) }
@media (max-width: 767px){
  .ds-passions li{ font-size:.9375rem; padding:.375rem .75rem }
}