/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : May 13, 2025, 9:59:28 AM
    Author     : DELL
*/
/* صفحه‌های موبایل */
@media (max-width: 768px) {
* {
      box-sizing: border-box;
      font-family: sans-serif;
    }
    .card{
    background: transparent;
    display: block;
    width: 100%;
    justify-content: center;   /* افقی */
    align-items: center;       /* عمودی */
    height: fit-content;             /* لازم است ارتفاع داشته باشد */
    border: 0px solid white;
    }
    .content {
      background: black;
      width: 96%;
      height:100% ;
      position: relative;
      text-align: center;
      box-shadow: 0 6px 20px rgba(0,0,0,0.1);
      overflow: hidden;
      border: 0px solid black;
      transition: 0.4s ease;
      margin: 2% 2%;
      border-radius: 0px;
    }
    
    .content h3 {
      font-size: 6vw;
      color: white;
      padding: 4% 1%;
      z-index: 6;

    }
    .content div{
        width: 100%;
        background-color: white;
        margin: 0;
        padding: 2%;
        border:0px solid white;
        border-radius: 0px;
        height: 100%;
    }
    .content div p{
        padding: 0% 13%;
        text-align: justify;
        hyphens: auto;
        padding: 0% 13%;
    }
    .content p,.content ul li{
      text-align: left;
      font-size: 4vw;
      color: #777;
      line-height: 1.5;
      font-family: 'Inter', sans-serif;
    }
}

/* صفحه‌های بزرگتر از 768px */
@media (min-width: 768px) {
    * {
      box-sizing: border-box;
      font-family: sans-serif;
    }
    .card{
    background: transparent;
    display: flex;
    width: 100%;
    justify-content: center;   /* افقی */
    align-items: center;       /* عمودی */
    height: fit-content;             /* لازم است ارتفاع داشته باشد */
    border: 0px solid white;
    }
    .content {
      background: black;
      width: 25%;
      height:100% ;
      position: relative;
      text-align: center;
      box-shadow: 0 6px 20px rgba(0,0,0,0.1);
      overflow: hidden;
      border: 0px solid black;
      transition: 0.4s ease;
      margin: 0 2%;
    }
    
    .content h3 {
      font-size: 2vw;
      color: white;
      padding: 4% 1%;
      z-index: 6;

    }
    .content div{
        width: 100%;
        background-color: white;
        margin: 0;
        padding: 2%;
        border:0px solid white;
        border-radius: 0px;
        height: 310px;
    }
    .content div p{
        padding: 0% 11%;
        text-align: justify;
        hyphens: auto;
        text-align: left;
      font-size: 1.2vw;
      color: #777;
      line-height: 1.5;
      font-family: 'Inter', sans-serif;
    }
    .content ul li{
      text-align: left;
      font-size: 1.3vw;
      color: #777;
      line-height: 1.5;
      font-family: 'Inter', sans-serif;
    }
}