main {
       padding-top: 140px;
       max-width: 1400px;
       margin: 0 auto;
       padding-left: 5rem;
       padding-right: 5rem;
       padding-bottom: 8rem;
   }

   .page-header {
       text-align: center;
       padding: 4rem 0 3rem;
   }

   .page-header h1 {
       font-size: 3.8rem;
       font-weight: 800;
       letter-spacing: 3px;
       margin-bottom: 1.2rem;
   }

   .page-header p.subtitle {
       font-size: 1.4rem;
       color: var(--muted);
       max-width: 720px;
       margin: 0 auto;
   }

   .section-title {
       font-size: 2.6rem;
       font-weight: 700;
       text-align: center;
       margin-bottom: 3rem;
       color: var(--primary);
       position: relative;
   }

   .section-title::after {
       content: '';
       width: 80px;
       height: 3px;
       background: var(--primary);
       position: absolute;
       bottom: -12px;
       left: 50%;
       transform: translateX(-50%);
   }

   .about-content {
       max-width: 900px;
       margin: 0 auto;
       font-size: 1.15rem;
       color: #d8d8da;
   }

   .about-content p {
       margin-bottom: 1.8rem;
   }

   .highlight {
       color: var(--primary);
       font-weight: 600;
   }

   .values-grid {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
       gap: 2.5rem;
       margin-top: 4rem;
   }

   .value-card {
       background: var(--card);
       border-radius: 16px;
       padding: 2.5rem 2rem;
       text-align: center;
       transition: all 0.4s ease;
       border: 1px solid rgba(212, 175, 55, 0.1);
   }

   .value-card:hover {
       transform: translateY(-12px);
       border-color: var(--primary);
       box-shadow: 0 20px 50px rgba(212, 175, 55, 0.15);
   }

   .value-icon {
       font-size: 3.2rem;
       color: var(--primary);
       margin-bottom: 1.2rem;
   }

   .value-title {
       font-size: 1.5rem;
       font-weight: 600;
       margin-bottom: 1rem;
   }

   @media (max-width: 1024px) {
       main {
           padding-left: 3rem;
           padding-right: 3rem;
       }

       .page-header h1 {
           font-size: 3.2rem;
       }
   }

   @media (max-width: 600px) {
       main {
           padding-top: 110px;
           padding-left: 1.5rem;
           padding-right: 1.5rem;
           padding-bottom: 6rem;
       }

       .page-header h1 {
           font-size: 2.6rem;
       }

       .page-header p.subtitle {
           font-size: 1.1rem;
       }

       .section-title {
           font-size: 2.2rem;
       }
   }