/* =========================
   Home
========================= */
.about-section{	
	background: var(--bg-white);
	display:flex;
    align-items:center;
}
.about-underline{
	width: 140px;
	height: 3px;	
	margin: 0 0 14px;
	border-radius: var(--radius-line);
	background: var(--bg-line);
}

.about-grid{
    display:grid;
    grid-template-columns: 1.25fr .9fr;
    gap: clamp(18px, 4vw, 46px);
    align-items: center;
}  
/* LEFT collage */
.about-img-card{
	display:flex;
	justify-content:center;
	align-items:center;
}
.about-img-img{
	width: min(620px, 100%);
	/*aspect-ratio: 16 / 10;*/
	
	overflow:hidden;
	/*
	border-radius: 999px;
	background: radial-gradient(circle at 30% 30%, rgba(244,182,59,.25), transparent 60%),
				radial-gradient(circle at 70% 70%, rgba(244,182,59,.18), transparent 60%);*/
	position: relative;
}
.about-img-img img{
	width:100%;	 
	object-fit: contain;
	display:block;
}

/* RIGHT card */
.about-card{
	display: flex;
	flex-direction: column;
}
.about-head{
  display: flex;
  gap: 18px;
  align-items: center;
}
.about-body{
  margin-top: 10px;
}
.about-body p{
  margin: 0 0 10px;
  line-height: 1.7;
  text-justify: inter-word;
  text-align: justify;
  max-width: none;      
}
.about-avatar{
	/*width: 86px;
	height: 86px;
	border-radius: 999px;
	background: rgba(244,182,59,.18);
	border: 3px solid rgba(244,182,59,.35);
	*/	 
	width: clamp(88px, 18vw, 192px);  
	overflow:hidden;
	flex: 0 0 auto; 
} 
.about-avatar img{
	width:100%;
	height: auto;  
	object-fit: cover;
	display:block;
}
.about-title{
	margin: 6px 0 10px;
	font-weight: 400;
	/*font-size: clamp(18px, 2.2vw, 28px);
	line-height: 1.15;
	font-weight: 700;*/
}
.about-title span{
	color: var(--text);
	position: relative;
	display:inline-block;	 
}
/* --- Big slogan --- */
.about-slogan-wrap{
  display: flex;
  flex-direction: column;
  align-items: center;
  /*gap: clamp(14px, 3vw, 24px);*/
  margin-top: clamp(18px, 5vw, 46px);
}

.about-slogan{
	margin: clamp(18px, 5vw, 46px) 0 clamp(14px, 3vw, 28px);
	text-align:center;
	font-size: var(--fs-h1);
	font-weight: 700;
	/*font-size: clamp(22px, 3.6vw, 44px);
	line-height: 1.15;
	font-weight: 800;*/
	color: var(--text);
}
.about-slogan .quote{
	color: var(--textquote);
}

/* Media */
.about-media{
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;   
  cursor: pointer;
}

.about-media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .6s ease;
}

.about-media:hover img{
  transform: scale(1.05);
}

/* Play button */
.about-play{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);

  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--bg);
  box-shadow: 0 14px 30px rgba(0,0,0,.28);

  display: grid;
  place-items: center;
  pointer-events: none;  
}

.about-play::before{
  content:"";
  width: 0;
  height: 0;
  border-left: 12px solid #fff;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  margin-left: 3px;
}

/* --- Responsive --- */
@media (max-width: 860px){
	.about-grid{
	  grid-template-columns: 1fr;
	}
	.about-card{
	  justify-content:center;
	}
	.about-text p{
	  max-width: 70ch;
	}
}