
    .top-ad-bar { display: flex; justify-content: center; padding: 1rem 5% 0.5rem; }
  
    .about-layout {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 2rem;
      padding: 1.5rem 5% 2rem;
      max-width: 1200px;
      margin: 0 auto;
    }
    .about-main { min-width: 0; }
    .about-hero { text-align: center; margin-bottom: 2.5rem; }
    .about-hero h1 { color: #076585; }
    .about-hero p { color: rgba(44,24,16,0.7); max-width: 55ch; margin: 0 auto; }
    .about-card {
      background: rgba(255,255,255,0.55);
      backdrop-filter: blur(14px) saturate(150%);
      -webkit-backdrop-filter: blur(14px) saturate(150%);
      border: 1px solid rgba(255,255,255,0.4);
      border-radius: 16px;
      box-shadow: 0 8px 32px rgba(166,95,49,0.08);
      padding: 2rem;
      margin-bottom: 1.5rem;
    }
    .about-card h2 { margin-top: 0; }
    .timeline {
      position: relative;
      padding-left: 1.5rem;
      border-left: 2px solid rgba(7,101,133,0.2);
      margin: 1.25rem 0;
    }
    .timeline-item {
      position: relative;
      padding-bottom: 1.25rem;
    }
    .timeline-item::before {
      content: '';
      position: absolute;
      left: -1.85rem;
      top: 0.35rem;
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: #076585;
      border: 2px solid #fff;
    }
    .timeline-item h4 { color: #076585; margin-bottom: 0.25rem; font-size: 1rem; }
    .timeline-item p { font-size: 0.9rem; color: rgba(44,24,16,0.75); margin: 0; }
    .tech-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
      gap: 1rem;
      margin-top: 1rem;
    }
    .tech-item {
      text-align: center;
      padding: 1rem;
      border-radius: 12px;
      background: rgba(255,239,213,0.4);
      font-size: 0.85rem;
    }
    .tech-item strong { display: block; color: #076585; margin-bottom: 0.25rem; font-size: 0.95rem; }
    .tech-item span { color: rgba(44,24,16,0.6); }
    .value-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 1rem;
      margin-top: 1rem;
    }
    .value-item {
      padding: 1.25rem;
      border-radius: 12px;
      background: rgba(162,230,219,0.2);
    }
    .value-item h4 { color: #0a5a4a; margin-bottom: 0.4rem; font-size: 1rem; }
    .value-item p { font-size: 0.88rem; color: rgba(44,24,16,0.75); margin: 0; }
    .sidebar { display: flex; flex-direction: column; gap: 1.25rem; padding-top: 0.5rem; }
    .bottom-ad-bar { display: flex; justify-content: center; padding: 0 5% 2rem; }
    .stats-row {
      display: flex;
      gap: 1.5rem;
      flex-wrap: wrap;
      justify-content: center;
      margin: 1.5rem 0;
    }
    .stat {
      text-align: center;
      padding: 1rem 1.5rem;
      border-radius: 12px;
      background: rgba(255,255,255,0.6);
      min-width: 140px;
    }
    .stat-number { font-size: 1.75rem; font-weight: 700; color: #076585; display: block; }
    .stat-label { font-size: 0.8rem; color: rgba(44,24,16,0.55); text-transform: uppercase; letter-spacing: 0.5px; }
    @media (max-width: 727px){
      body, html{max-width: 100%; width: 100%; }
      .about-layout {max-width: 100%; width: 100%; padding: 14px; border: 1px dashed red; grid-template-columns: 80% 20%;
        grid-template-rows: auto auto auto auto auto;
      }.about-hero {border: 0.6px dashed orange; width: 100%;}
      .about-main {max-width: 100%; width: 100%; min-width: 100%;}
  .nav-links {width: 64%;border: 0.2px double pink; padding: 0; border: 0.7px solid red;} 
  .nav-links a {font-size: 10px; padding-right: 0.5px; padding-left: 0.5px;}
  .nav-links li {border: none;}
  .nav-logo {width: 28%;border: 0.6px dashed black;} .nav-logo a {font-size: 20px;} 
  .nav-logo span{font-size: 18px; position: relative; display: flex; align-items: flex-end; height: 40%; border: none;}
  .glass-navbar {
    height: 51px; width: 100%;} .nav-placeholder {
    min-width: 100%; height: 51px; justify-content: stretch;
    width: 100%; max-width: 100%; border: 2px dashed blue;}
       .top-ad-bar iframe, .bottom-ad-bar iframe , .ad-300x250 iframe, .ad-160x300 iframe {max-width: 100%; width: 100%;}
    }.page-footer {max-width: 100%; width: 100%;}
.value-grid {width: 100%; grid-template-columns: 1fr; max-width: 100%;}
.about-card {width: 100%; max-width: 100%;}
  

