/* 通用按钮样式，全站统一 */
    .btn {
      padding: 8px 16px;
      font-size: 16px;
      border-radius: 2px;
      border: none;
      cursor: pointer;
    }
    .btn.light-blue {
      background: #ffae66;
      color: #111;
    }
    .btn.text-link {
      background: transparent;
      border: 1px solid #111;
    }
    .btn-group {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
    }

    /* 顶部About头部区块 */
    .about-header {
   
     padding-top:260px;padding-bottom:100px;background: #F4F1EA;
      margin-bottom: 60px;
    }
	
	 .about-header .container{ display: flex;
      flex-direction: column;
      gap: 40px;}
	.about-header .container video{width:100%}
    @media(min-width:768px) {
      .about-header  .container{
        flex-direction: row-reverse;
        align-items: flex-start;
      }
      .header-img, .header-text {
       
      }
    }
	.header-img{max-width:800px}
    .header-img img {
      width: auto;
      height: auto;
      display: block;
    }
    .header-text .tiny-label {
      font-size: 16px;
      color: #444;
      margin-bottom: 6px;
    }
    .header-text h1 {
      font-size: 44px;
      margin-bottom: 10px;
    }
    .header-text p {
      font-size: 18px;
      max-width: 440px;
     margin: 40px 0;
    line-height: 35px;
    }

    /* 通用图文内容行：移动端上下，PC左右 */
    .content-row {
      display: flex;
      flex-direction: column;
      gap: 32px;
      margin-bottom: 80px;
      align-items: center;
    }
    @media(min-width:768px) {
      .content-row {
        flex-direction: row;
      }
      .content-row.reverse {
        flex-direction: row-reverse;
      }
      .row-img, .row-text {
        flex: 1;
      }
    }
    .row-img img {
      width: 100%;
      height: auto;
      display: block;
    }
    .row-text h2 {
      font-size: 36px;
      margin-bottom: 12px;
    }
    .row-text p {
      font-size: 18px;
      color: #333;
      margin-bottom: 20px;
      max-width: 440px;
    }
    .row-text .small-link {
      font-size: 18px;
      margin-top: 8px;
      display: inline-block;
      color: #111;margin-left:30px;
    }

    /* 团队板块 Meet the HATO family */
    .team-section {
      margin-bottom: 80px;
    }
    .team-section h2 {
      font-size: 28px;
      margin-bottom: 40px;
    }
    .team-grid {
      display: flex;
      gap: 32px;
      margin-bottom: 60px;
    }
    .team-card {
      background: #fff;
      overflow: hidden;max-width:356px;-webkit-box-shadow: #ccc 0px 0px 5px;
-moz-box-shadow: #ccc 0px 0px 5px;
box-shadow: #ccc 0px 0px 5px;
    }
    .team-card .avatar-wrap {
     
      padding: 24px;
      display: flex;
      
    }
    .team-card .avatar-wrap img {
     max-width:100%;
     
      object-fit: cover;
    }
    .team-card .info {
      padding: 16px 20px 24px;
    }
    .team-card .info h4 {
      font-size: 22px;
      margin-bottom: 4px;
    }
    .team-card .info .job {
      font-size: 16px;
      color: #444;
      margin-bottom: 10px;
    }
    .team-card .info .quote {
      font-size: 16px;
      line-height: 1.5;
      color: #333;
    }
    .team-bottom-text {
    
      max-width: 100%;
      margin: 0 auto 24px;
    }
    .team-bottom-text h3 {
      font-size: 28px;
      margin-bottom: 12px;
    }
    .team-bottom-btn {
    
    }
	
	
	 /*  Contact Chat */
         .block-contact {
            background: #f5eae1; padding:50px 0;
         
        }
		
		 .block-contact .container{  display: flex;
            gap: 80px;align-items: center;}
        .contact-avatar-wrap {
            flex: 0 0 300px;
            position: relative;
        }
        .avatar-bg-circle {
            width: 400px;
            height: 400px;
            background: #ffae66;
            border-radius: 50%;
            position: relative;
            overflow: hidden;
        }
        .avatar-bg-circle::before {
            content: "";
            position: absolute;
            width: 100%;
            height: 100%;
            background-image: repeating-conic-gradient(transparent 0deg 15deg, #ffcfa4 15deg 30deg);
            opacity: 0.6;
        }
        .contact-avatar {
            width: 72%;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
           
        }
        .contact-text h4 {
            font-size: 16px;
            font-weight: normal;
            color: #333;
            margin-bottom: 8px;
        }
        .contact-text h2 {
            font-size: 48px;
            margin-bottom: 12px;
        }
        .contact-text p {
            font-size: 18px;
            line-height: 1.5;
            color: #444;
            max-width: 620px;margin-bottom:30px;
        }
		
		
		@media (max-width:768px) {
			.about-header{padding-top: 120px;}
			.header-img img{width:100%}
			.row-text h2{font-size: 26px;}
			.team-grid{display:block}
			.team-card{margin-bottom:10px;}
		}