/* about.html — extracted page styles */

  :root{
    --ink:      #0B0E17;
    --slate:    #161926;
    --mid:      #252A3A;
    --accent:   #8B0000;
    --accent2:  #B22222;
    --blue:     #2563EB;
    --surface:  #F6F7FA;
    --border:   #E3E6EF;
    --muted:    #6B7280;
    --ff-h:     'Sora', 'DM Sans', system-ui, sans-serif;
    --ff-b:     'DM Sans', system-ui, sans-serif;
  }

  body{
    font-family: var(--ff-b);
    background-color: var(--surface);
    color: var(--ink);
  }

  h1,h2,h3,h4,h5,.ff-h{
    font-family: var(--ff-h);
  }

  /* ===== Page title band ===== */
  .page-title{
    background: var(--ink);
    padding: 64px 0 52px;
  }
  .page-title h1{
    color: #fff;
    font-weight: 800;
    letter-spacing: -0.02em;
  }
  .page-title .crumb{
    color: rgba(255,255,255,.55);
    font-size: .9rem;
  }
  .page-title .crumb a{
    color: rgba(255,255,255,.75);
    text-decoration: none;
  }

  /* ===== About Us ===== */
  .about-section{
    background: var(--slate);
    padding: 80px 0;
  }
  .eyebrow-rule{
    width: 54px;
    height: 4px;
    background: var(--accent);
    border-radius: 2px;
    margin-bottom: 20px;
  }
  .about-section h2{
    color: #fff;
    font-weight: 800;
    font-size: 2.1rem;
  }
  .about-section p{
    color: rgba(255,255,255,.68);
    line-height: 1.8;
    font-size: 1.02rem;
  }
  .about-img-wrap{
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid var(--mid);
    box-shadow: 0 20px 45px rgba(0,0,0,.45);
  }
  .about-img-wrap img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display:block;
  }
  .btn-accent{
    background: var(--accent);
    color: #fff;
    border: none;
    font-family: var(--ff-h);
    font-weight: 700;
    letter-spacing: .03em;
    padding: 14px 32px;
    border-radius: 6px;
    text-transform: uppercase;
    font-size: .85rem;
    transition: background .2s ease, transform .2s ease;
  }
  .btn-accent:hover{
    background: var(--accent2);
    color: #fff;
    transform: translateY(-2px);
  }

  /* ===== Core Values ===== */
  .values-section{
    background: var(--surface);
    padding: 80px 0;
  }
  .values-section h2{
    font-weight: 800;
    color: var(--ink);
  }
  .value-row{
    max-width: 760px;
    margin: 0 auto;
  }
  .value-item{
    display:flex;
    align-items:flex-start;
    gap: 28px;
    position: relative;
    padding-bottom: 56px;
  }
  .value-item:last-child{
    padding-bottom: 0;
  }
  .value-item:not(:last-child)::before{
    content:"";
    position:absolute;
    left: 34px;
    top: 76px;
    bottom: 8px;
    width: 2px;
    background: var(--border);
  }
  .value-diamond{
    flex: 0 0 68px;
    width: 68px;
    height: 68px;
    background: var(--accent);
    transform: rotate(45deg);
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius: 8px;
    box-shadow: 0 10px 22px rgba(139,0,0,.28);
  }
  .value-diamond i{
    transform: rotate(-45deg);
    color:#fff;
    font-size: 1.5rem;
  }
  .value-item:nth-child(2) .value-diamond{ background: var(--accent2); box-shadow: 0 10px 22px rgba(178,34,34,.28); }
  .value-item:nth-child(3) .value-diamond{ background: var(--ink); box-shadow: 0 10px 22px rgba(11,14,23,.28); }
  .value-text p{
    color: var(--muted);
    line-height: 1.75;
    margin: 0;
    font-size: 1rem;
    padding-top: 10px;
  }

  /* ===== Specialities ===== */
  .spec-section{
    background: var(--ink);
    padding: 84px 0;
    position: relative;
  }
  .spec-section h2{
    color:#fff;
    font-weight: 800;
    font-size: 2rem;
  }
  .spec-item{
    text-align:center;
    padding: 10px 12px 0;
  }
  .spec-icon{
    width: 78px;
    height: 78px;
    border-radius: 50%;
    background: var(--mid);
    border: 1px solid rgba(255,255,255,.08);
    display:flex;
    align-items:center;
    justify-content:center;
    margin: 0 auto 20px;
  }
  .spec-icon i{
    font-size: 1.9rem;
    color: var(--accent2);
  }
  .spec-item h5{
    color:#fff;
    font-family: var(--ff-h);
    font-weight: 700;
    font-size: 1.02rem;
  }
  .spec-para{
    max-width: 820px;
    margin: 56px auto 0;
    text-align:center;
    color: rgba(255,255,255,.6);
    line-height: 1.85;
    font-size: 1rem;
  }

  /* ===== Team ===== */
  .team-section{
    padding: 0;
  }
  .team-row{
    padding: 72px 0;
  }
  .team-row.light{ background: #fff; }
  .team-row.tint{ background: var(--surface); }
  .team-photo{
    border-radius: 12px;
    overflow: hidden;
  }
  .team-photo img{
    width:100%;
    height:100%;
    object-fit: cover;
    display:block;
  }
  .team-role{
    color: var(--accent);
    font-family: var(--ff-h);
    font-weight: 700;
    letter-spacing: .12em;
    font-size: .8rem;
    text-transform: uppercase;
  }
  .team-name{
    font-weight: 800;
    font-size: 2.6rem;
    color: var(--ink);
    margin-bottom: 18px;
  }
  .team-bio p{
    color: var(--muted);
    line-height: 1.8;
    margin-bottom: 6px;
  }

  .team-photo--sm{ max-width: 300px; margin: 0 auto; }

  /* ===== Key Metrics ===== */
  .metrics-section{ background:#fff; padding: 72px 0; }
  .metrics-section h2{ font-weight:800; color:var(--ink); }
  .metrics-eyebrow{ color:var(--accent); font-family:var(--ff-h); font-weight:700; letter-spacing:.12em; font-size:.8rem; text-transform:uppercase; margin-bottom:.5rem; }
  .metric-card{ height:100%; text-align:center; background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:28px 16px; }
  .metric-ic{ width:48px; height:48px; margin:0 auto 14px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(139,0,0,.09); color:var(--accent); font-size:1.25rem; }
  .metric-num{ font-family:var(--ff-h); font-weight:800; font-size:2rem; color:var(--ink); line-height:1.1; }
  .metric-lbl{ color:var(--muted); font-size:.9rem; margin-top:6px; line-height:1.5; }

  /* ===== Mission & Vision ===== */
  .mv-row{ max-width: 960px; margin: 0 auto 64px; }
  .mv-card{ height:100%; background:#fff; border:1px solid var(--border); border-top:4px solid var(--accent); border-radius:14px; padding:28px; }
  .mv-ic{ width:48px; height:48px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:var(--accent); color:#fff; font-size:1.3rem; margin-bottom:14px; }
  .mv-card h4{ font-weight:800; color:var(--ink); margin-bottom:10px; }
  .mv-card p{ color:var(--muted); line-height:1.75; margin-bottom:8px; }

  /* ===== Companies band ===== */
  .logo-band{
    --lb-d:#3d0000; --lb-m:#B22222; --lb-l:#ffb3a7;
    --lb-ease:cubic-bezier(.22,1,.36,1);
    position:relative; overflow:hidden; color:#fff;
    padding:64px 0;
    background:
      radial-gradient(700px 400px at 12% 30%, rgba(178,34,34,.55), transparent 70%),
      radial-gradient(600px 400px at 90% 80%, rgba(255,179,167,.18), transparent 70%),
      linear-gradient(135deg, var(--lb-d), var(--accent) 55%, var(--lb-m));
  }
  .lb-inner{ position:relative; z-index:5; }

  /* waves */
  .lb-wave{ position:absolute; left:0; width:100%; height:36px; z-index:4; pointer-events:none; }
  .lb-wave--bottom{ bottom:-1px; }
  .lb-wave--top{ top:-1px; transform:scaleY(-1); }
  .lb-wave__back{ fill:rgba(255,255,255,.22); animation:lbSway 9s ease-in-out infinite alternate; transform-origin:center; }
  .lb-wave--top .lb-wave__front{ fill:#fff; }
  .lb-wave--bottom .lb-wave__front{ fill:var(--surface); }
  @keyframes lbSway{ from{ transform:translateX(-2%); } to{ transform:translateX(2%) scaleY(1.08); } }

  /* heading */
  .lb-head{ text-align:center; margin:0 auto 18px; }
  .lb-kicker{ display:inline-flex; align-items:center; gap:10px; padding:8px 18px; border-radius:999px;
    background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.25);
    backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
    font-family:var(--ff-b); font-size:.78rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--lb-l); }
  .lb-kicker::before{ content:""; width:8px; height:8px; border-radius:50%; background:currentColor;
    box-shadow:0 0 0 4px rgba(255,179,167,.25); animation:lbPulse 2.4s ease-in-out infinite; }
  @keyframes lbPulse{ 50%{ box-shadow:0 0 0 8px rgba(255,179,167,0); } }

  /* marquee */
  .lb-marquee{ overflow:hidden; padding:14px 0;
    -webkit-mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
            mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
  .lb-track{ display:flex; width:max-content; animation:lbScroll 30s linear infinite; }
  .lb-marquee:hover .lb-track{ animation-play-state:paused; }
  .lb-set{ display:flex; gap:22px; padding-right:22px; }
  @keyframes lbScroll{ to{ transform:translateX(-50%); } }
  .lb-card{ position:relative; overflow:hidden; flex:0 0 auto; width:190px; height:84px; display:flex; align-items:center; justify-content:center;
    padding:16px 24px; border-radius:14px;
    background:#fff; border:0;
    box-shadow:0 14px 30px -18px rgba(0,0,0,.6);
    transition:transform .5s var(--lb-ease), background .5s var(--lb-ease), box-shadow .5s var(--lb-ease); }
  .lb-card img{ max-height:42px; max-width:100%; width:auto; object-fit:contain;
    mix-blend-mode:multiply; transition:transform .5s var(--lb-ease); }
  .lb-card::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:3px;
    background:linear-gradient(90deg, var(--accent), var(--lb-m));
    transform:scaleX(0); transform-origin:left; transition:transform .5s var(--lb-ease); }
  .lb-card:hover{ transform:translateY(-4px); box-shadow:0 24px 40px -20px rgba(0,0,0,.65); }
  .lb-card:hover::after{ transform:scaleX(1); }
  .lb-card:hover img, .lb-card:hover .logo-band-txt{ transform:scale(1.18); }
  .logo-band-txt{ display:inline-block; font-family:var(--ff-h); font-weight:800; font-size:1.35rem; color:var(--accent); letter-spacing:.02em; transition:transform .5s var(--lb-ease); }

  /* scroll reveal */
  .logo-band [data-anim]{ opacity:0; transform:translateY(40px); transition:opacity 1s var(--lb-ease), transform 1s var(--lb-ease); }
  .logo-band [data-anim].is-in{ opacity:1; transform:none; }
  .logo-band .lb-marquee[data-anim]{ transition-delay:.2s; }

  @media (max-width:640px){
    .logo-band{ padding:48px 0; }
    .lb-card{ width:150px; height:68px; padding:12px 16px; border-radius:12px; }
    .lb-card img{ max-height:34px; }
    .lb-wave{ height:24px; }
  }
  @media (hover:none){
    .lb-card:hover{ transform:none; }
  }
  @media (prefers-reduced-motion:reduce){
    .lb-track, .lb-wave__back, .lb-kicker::before{ animation:none; }
    .lb-track{ width:auto; }
    .lb-set{ flex-wrap:wrap; justify-content:center; padding-right:0; }
    .lb-set[aria-hidden="true"]{ display:none; }
    .lb-marquee{ -webkit-mask-image:none; mask-image:none; }
    .logo-band [data-anim]{ opacity:1; transform:none; transition:none; }
  }

  /* ===== Accreditation ===== */
  .accr-section{ background:#fff; padding: 72px 0; }
  .accr-section h2{ font-weight:800; color:var(--ink); }
  .accr-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; margin:0 auto; }
  .accr-item{ position:relative; overflow:hidden; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; text-align:center; gap:14px;
    background:#fff; border:1px solid var(--border); border-radius:16px; padding:28px 16px 24px;
    font-weight:600; font-size:.95rem; line-height:1.45; color:var(--ink);
    box-shadow:0 12px 30px -22px rgba(139,0,0,.45);
    transition:transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s, border-color .4s; }
  .accr-item::before{ content:""; position:absolute; left:0; right:0; top:0; height:3px;
    background:linear-gradient(90deg, var(--accent), var(--accent2));
    transform:scaleX(0); transform-origin:left; transition:transform .5s cubic-bezier(.22,1,.36,1); }
  .accr-item i{ width:54px; height:54px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center;
    background:rgba(139,0,0,.08); color:var(--accent); font-size:1.35rem; transition:background .4s, color .4s; }
  .accr-item span{ word-break:break-word; }
  .accr-item:hover{ transform:translateY(-6px); border-color:transparent; box-shadow:0 22px 40px -22px rgba(139,0,0,.55); }
  .accr-item:hover::before{ transform:scaleX(1); }
  .accr-item:hover i{ background:var(--accent); color:#fff; }
  @media (max-width:1199.98px){ .accr-item{ font-size:.88rem; padding:24px 12px 20px; } }
  @media (max-width:991.98px){ .accr-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
  @media (max-width:575.98px){ .accr-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .accr-item:last-child{ grid-column:1 / -1; } }
  @media (hover:none){ .accr-item:hover{ transform:none; } }

  @media (max-width: 767.98px){
    .page-title{ padding: 44px 0 36px; }
    .about-section, .values-section, .spec-section{ padding: 56px 0; }
    .team-row{ padding: 48px 0; }
    .team-name{ font-size: 2rem; }
    .about-img-wrap{ margin-top: 32px; }
    .value-diamond{ flex: 0 0 56px; width:56px; height:56px; }
    .value-item:not(:last-child)::before{ left: 27px; top: 64px; }
  }

  .back-to-top{position:fixed;bottom:calc(1.6rem + 52px + .75rem);right:calc(1.6rem + 4px);width:44px;height:44px;background:#0B0E17;border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:#fff;box-shadow:0 4px 16px rgba(0,0,0,.25);z-index:998;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .25s,transform .25s,visibility .25s}
  .back-to-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}
  .back-to-top:hover{transform:translateY(-3px)}

/* ── Former inline style="" attributes ──
   !important keeps the precedence they had as inline styles. */
.abt-s1{color:var(--ink) !important}
.abt-s2{height:46px !important;width:auto !important}
.abt-s3{cursor:default !important;color:rgba(255,255,255,.28) !important}
.abt-s4{font-size:.83rem !important}
.abt-s5{font-size:.75rem !important}