@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca&display=swap');
:root{
  /* COLOR */
  --black:#0A0C1B;
  --card_background:hsl(244, 38%, 16%);
  --Soft_violet:hsl(277, 64%, 61%);
  --white_main_heading: hsl(0, 0%, 100%);
  --purple-font:#A6A4B5;
  --Slightly_transparent_white:hsla(0, 0%, 100%, 0.75);
  --size-p:13px;
  --size-h1:1.5em;
  --size-p-fullVW:13px;
  --size-h1-fullVW:2.5em;
  --size-h1-fullVW-small:1.7rem;
  --Slightly_transparent_white:hsla(0, 0%, 100%, 0.6);  
  --font-family:'Inter', sans-serif;
  --font-family2:'Lexend Deca', sans-serif;
}

html {
  font-family: var(--font-family);
}

body {
  background-color: var(--black);
  color:var(--white_main_heading);
}

p {
  color:var(--purple-font);
  font-family: var(--font-family2);
}

.card_texts p {
  letter-spacing: .2px;
}

/* movil view */
@media screen and (max-width:1319px) {
  body {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  img{
    opacity: .4;
    height: 250px;
    width: 100%;
  }

  p {
    font-size: var(--size-p);
    font-weight: 400;
  }

  h1 {
    font-size: var(--size-h1);
  }

  .card {
    overflow: hidden;
    border-radius: 8px;
    margin:1.5rem;
    background: var(--card_background);
    width: 300px;
  }

  .img_movil {
    background: var(--Soft_violet);
    height: 250px;
  }

  .card_texts {
    padding: 3.7rem;    
  }

  .card_texts p {
    margin-top: 1rem;
  }

  .card_texts h1 {
    margin:0
  }

  .p_movil {
    line-height: 2em;
  }

  .contaniner{
    margin-top: 2.3rem;
  }

  .contaniner h1{
    margin-top:1.9rem;
  }

  .contaniner p{
    margin-top:.5rem;
    text-transform: uppercase;
    letter-spacing: 1px;
  }
  
  .card_texts--title-color{
    color:var(--Soft_violet);
  }

}
/* fullscreen */
@media (min-width:1319px)  {
  p {
    font-size: var(--size-p-fullVW);
    font-weight: 700;
    font-family: var(--font-famil1);
  }

  h1 {
    font-size: var(--size-h1-fullVW);
  }

  body {
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  img{
    opacity: .4;
    background: var(--Soft_violet);

  }

  .card {
    margin:7vw;
    display: flex;
    flex-direction: row-reverse;
    overflow: hidden;
    border-radius: 8px;
    background: var(--card_background);
  }

  .img_movil {
    background: var(--Soft_violet);
  }

  .card_texts {
    text-align: left;
    padding: 1rem;
  }

  .box1 {
    margin: auto;
    
  }
  .box1 p {
    line-height: 2em;
    letter-spacing: 1px;
  }
 
  .contaniner{
    display: flex;
    margin-top: 2.1rem;
  }

  .contaniner h1{
    margin:0;
    margin-bottom:.3rem;
    font-size: var(--size-h1-fullVW-small);
  }

  .contaniner p{
    text-transform: uppercase;
    letter-spacing: 1px;
  }
  .contaniner_item{
    margin-right: 5rem;
  }
  
  .card_texts_content{
    width: 431px;
  }
  .card_texts--title-color{
    color:var(--Soft_violet);
  }

}
