*,*::before,*::after{box-sizing:border-box;}
    html{width:100%;overflow-x:hidden;}
    body{
      width:100%;
      margin:0;
      overflow-x:hidden;
      background:#050816;
      color:#F8FAFC;
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
      line-height:1.6;
    }
    img{max-width:100%;height:auto;display:block;}
    a{text-decoration:none;color:inherit;}

    :root {
      --bg-main: #050816;
      --bg-darker: #02040a;
      --bg-card: rgba(16, 24, 39, 0.92);
      --sapphire: #2563EB;
      --cyan: #22D3EE;
      --purple: #8B5CF6;
      --text-main: #F8FAFC;
      --text-muted: #A8B3C7;
      --border-color: rgba(37, 99, 235, 0.22);
    }

    .container {
      width: min(1240px, calc(100% - 32px));
      margin-inline: auto;
    }
    .section-padding {
      padding-block: 80px;
    }

    
    .site-header{position:sticky;top:0;z-index:1000;width:100%;background:rgba(5,8,22,.84);backdrop-filter:blur(22px) saturate(150%);border-bottom:1px solid rgba(37,99,235,.22);box-shadow:0 16px 48px rgba(0,0,0,.38);}
    .header-inner{width:min(1240px, calc(100% - 32px));min-height:76px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:18px;}
    .logo{display:inline-flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0;}
    .logo img{display:block;height:40px;width:auto;max-width:150px;object-fit:contain;}
    .logo span{font-size:18px;font-weight:900;color:#F8FAFC;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:190px;}
    .desktop-nav-wrap{flex:1 1 auto;display:flex;justify-content:flex-end;}
    .desktop-nav{display:flex;gap:8px;white-space:nowrap;}
    .desktop-nav a{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;color:#CBD5E1;font-size:14px;font-weight:800;border:1px solid transparent;}
    .desktop-nav a:hover{color:#F8FAFC;background:rgba(37,99,235,.18);border-color:rgba(214,168,79,.24);}
    .mobile-menu-btn{display:none;width:46px;height:46px;border:1px solid rgba(37,99,235,.32);border-radius:16px;background:rgba(37,99,235,.14);align-items:center;justify-content:center;flex-direction:column;gap:5px;cursor:pointer;}
    .mobile-menu-btn span{display:block;width:20px;height:2px;background:#F8FAFC;}
    @media (max-width:900px){
      .header-inner{width:min(100% - 24px, 1240px);min-height:68px;}
      .desktop-nav-wrap,.desktop-nav{display:none !important;}
      .mobile-menu-btn{display:inline-flex !important;}
    }

    
    .mobile-nav-mask{position:fixed;inset:0;z-index:1100;background:rgba(0,0,0,.66);opacity:0;visibility:hidden;transition:opacity .25s ease;}
    .mobile-drawer{position:fixed;top:0;left:0;z-index:1110;width:min(86vw, 360px);height:100vh;background:linear-gradient(180deg,#050816 0%,#0A1020 100%);transform:translateX(-105%);transition:transform .28s ease;display:flex;flex-direction:column;overflow:hidden;}
    .drawer-head{min-height:76px;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(37,99,235,.18);}
    .drawer-close{width:40px;height:40px;border:0;border-radius:14px;background:rgba(255,255,255,.10);color:#F8FAFC;font-size:26px;cursor:pointer;}
    .drawer-body{flex:1;overflow-y:auto;padding:14px;}
    .drawer-nav{display:flex;flex-direction:column;gap:8px;}
    .drawer-nav a{display:flex;align-items:center;min-height:48px;padding:13px 14px;border-radius:14px;background:rgba(255,255,255,.07);color:#F8FAFC;font-size:15px;font-weight:800;border:1px solid rgba(255,255,255,.10);}
    body.drawer-open{overflow:hidden;}
    body.drawer-open .mobile-nav-mask{opacity:1;visibility:visible;}
    body.drawer-open .mobile-drawer{transform:translateX(0);}

    
    .about-hero {
      background: linear-gradient(180deg, #07111F 0%, #050816 100%);
      padding-block: 80px;
      text-align: center;
      border-bottom: 1px solid var(--border-color);
    }
    .about-hero-title {
      font-size: clamp(32px, 5vw, 48px);
      font-weight: 900;
      background: linear-gradient(135deg, var(--text-main) 30%, var(--cyan) 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      margin: 0 0 16px;
    }
    .about-hero-desc {
      color: var(--text-muted);
      max-width: 720px;
      margin-inline: auto;
      font-size: clamp(15px, 2.5vw, 18px);
      margin-bottom: 0;
    }

    
    .overview-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 48px;
      align-items: center;
    }
    @media (max-width: 768px) {
      .overview-grid {
        grid-template-columns: 1fr;
        gap: 32px;
      }
    }
    .overview-content h2 {
      font-size: clamp(24px, 3.5vw, 32px);
      font-weight: 800;
      color: var(--text-main);
      margin: 0 0 20px;
    }
    .overview-content p {
      color: var(--text-muted);
      font-size: 15px;
      line-height: 1.7;
      margin-bottom: 24px;
    }

    
    .pillars-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
      margin-top: 40px;
    }
    @media (max-width: 768px) {
      .pillars-grid {
        grid-template-columns: 1fr;
      }
    }
    .pillar-card {
      background: var(--bg-card);
      border: 1px solid var(--border-color);
      padding: 30px;
      border-radius: 16px;
    }
    .pillar-card h3 {
      font-size: 18px;
      font-weight: 800;
      color: var(--text-main);
      margin: 0 0 12px;
    }
    .pillar-card p {
      color: var(--text-muted);
      font-size: 14px;
      line-height: 1.6;
      margin: 0;
    }

    
    .about-cta {
      background: radial-gradient(circle at 50% 50%, rgba(37, 99, 235, 0.15) 0%, rgba(5,8,22,0) 80%), #07111F;
      padding-block: 80px;
      text-align: center;
      border-top: 1px solid var(--border-color);
      border-bottom: 1px solid var(--border-color);
    }
    .about-cta-title {
      font-size: clamp(26px, 4vw, 36px);
      font-weight: 800;
      color: var(--text-main);
      margin: 0 0 16px;
    }
    .about-cta-desc {
      color: var(--text-muted);
      max-width: 600px;
      margin-inline: auto;
      font-size: 15px;
      margin-bottom: 30px;
    }
    .btn-primary {
      display: inline-flex;
      align-items: center;
      padding: 12px 30px;
      border-radius: 999px;
      background: linear-gradient(135deg, var(--sapphire), var(--purple));
      color: var(--text-main);
      font-weight: 800;
      box-shadow: 0 4px 20px rgba(37, 99, 235, 0.3);
    }
    .btn-primary:hover {
      box-shadow: 0 4px 30px rgba(37, 99, 235, 0.5);
      transform: translateY(-2px);
    }

    
    .site-footer {background: var(--bg-darker); border-top:1px solid rgba(37,99,235,0.2); padding-top:80px; padding-bottom:40px; color:var(--text-muted);}
    .footer-inner {width:min(1240px, calc(100% - 32px)); margin:0 auto; display:grid; grid-template-columns:2fr repeat(3, 1fr); gap:40px; margin-bottom:60px;}
    @media(max-width:900px){.footer-inner{grid-template-columns:1fr; gap:30px;}}
    .footer-brand p{font-size:13px; line-height:1.6; max-width:420px;}
    .footer-column h3{font-size:15px; font-weight:800; color:var(--text-main); margin-bottom:20px; text-transform:uppercase; letter-spacing:0.05em;}
    .footer-column ul{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:12px;}
    .footer-column a{font-size:13px; color:var(--text-muted);}
    .footer-column a:hover{color:var(--text-main);}
    .footer-bottom{border-top:1px solid rgba(255,255,255,0.06); padding-top:30px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; font-size:12px; width:min(1240px, calc(100% - 32px)); margin:0 auto;}
    .footer-bottom p{margin:0;}
    .footer-bottom a{margin-left:8px;}
    .footer-bottom a:hover{color:var(--text-main);}