/* AyarLine About page — tuned to the supplied Desktop and Mobile reference compositions. */
.ayar-about-root,
.ayar-about-root .about-desktop-stage,
.ayar-about-root .about-mobile-stage{
  background-color:var(--paper,#f7f5f0);
  background-image:none!important;
}
.ayar-about-root h1,
.ayar-about-root h2,
.ayar-about-root h3,
.ayar-about-root p{margin-top:0}
.ayar-about-root .about-desktop-stage,
.ayar-about-root .about-mobile-stage{overflow:hidden}

.ayar-about-root .about-desktop-intro h1 span,
.ayar-about-root .about-desktop-services h2 span,
.ayar-about-root .about-service h3 span,
.ayar-about-root .about-mobile-intro h1 span,
.ayar-about-root .about-mobile-services h2 span,
.ayar-about-root .about-mobile-services h3 span,
.ayar-about-root .about-desktop-why h2 span,
.ayar-about-root .about-mobile-why h2 span{
  position:relative;
  z-index:1;
  display:inline-block;
}
.ayar-about-root .about-desktop-intro h1 span::after,
.ayar-about-root .about-desktop-services h2 span::after,
.ayar-about-root .about-service h3 span::after,
.ayar-about-root .about-mobile-intro h1 span::after,
.ayar-about-root .about-mobile-services h2 span::after,
.ayar-about-root .about-mobile-services h3 span::after{
  content:"";
  position:absolute;
  right:0;
  left:0;
  bottom:.04em;
  z-index:-1;
  height:.32em;
  background:var(--yellow,#f0b61d);
}
.ayar-about-root .about-desktop-why h2 span::after,
.ayar-about-root .about-mobile-why h2 span::after{
  content:"";
  position:absolute;
  right:0;
  left:0;
  bottom:-.04em;
  height:.34em;
  z-index:-1;
  background:#fff;
}

@media(min-width:768px){
  .ayar-about-root .about-desktop-stage{
    position:relative;
    width:min(100vw, 1440px);
    height:166.764418cqw;
    margin:0 auto;
    container-type:inline-size;
  }

  .ayar-about-root .about-desktop-header{
    position:absolute;
    inset:0 0 auto 0;
    width:100%;
    height:15cqw;
  }
  .ayar-about-root .about-desktop-header .desktop-social{top:8.7cqw}
  .ayar-about-root .about-desktop-header .desktop-nav{top:8.75cqw}
  .ayar-about-root .about-desktop-header .desktop-logo{top:6.1cqw;width:6.05cqw}

  .ayar-about-root .about-desktop-intro,
  .ayar-about-root .about-desktop-services,
  .ayar-about-root .about-desktop-why{
    position:absolute;
    inset:0;
    text-align:center;
  }

  .ayar-about-root .about-desktop-intro h1{
    position:absolute;
    top:21.95cqw;
    left:18.2cqw;
    width:63.6cqw;
    margin:0;
    font-size:4.46cqw;
    line-height:1.12;
    font-weight:700;
    letter-spacing:-.09cqw;
    color:#202020;
  }
  .ayar-about-root .about-intro-copy{
    position:absolute;
    top:35.05cqw;
    left:18.15cqw;
    width:63.7cqw;
    text-align:right;
  }
  .ayar-about-root .about-intro-copy p{
    margin:0 0 2.35cqw;
    font-size:1.50cqw;
    line-height:1.78;
    font-weight:500;
    color:#252525;
  }

  .ayar-about-root .about-desktop-services>h2{
    position:absolute;
    top:64.1cqw;
    left:34.7cqw;
    width:30.6cqw;
    margin:0;
    font-size:2.42cqw;
    line-height:1.14;
    font-weight:700;
    color:#202020;
  }
  .ayar-about-root .about-service{
    position:absolute;
    width:26.85cqw;
    text-align:right;
  }
  .ayar-about-root .about-service h3{
    margin:0 0 2.0cqw;
    font-size:2.20cqw;
    line-height:1.12;
    font-weight:700;
    color:#202020;
  }
  .ayar-about-root .about-service p{
    margin:0;
    font-size:1.42cqw;
    line-height:1.82;
    font-weight:500;
    color:#252525;
  }
  .ayar-about-root .about-service-courses{top:76.05cqw;left:55.05cqw}
  .ayar-about-root .about-service-collection{top:76.05cqw;left:18.65cqw}
  .ayar-about-root .about-service-portfolio{top:95.15cqw;left:55.05cqw}
  .ayar-about-root .about-service-ai{top:95.15cqw;left:18.65cqw}

  .ayar-about-root .about-desktop-why::before{
    content:"";
    position:absolute;
    top:116.55cqw;
    left:0;
    width:100%;
    height:16.85cqw;
    background:#fdbb25;
  }
  .ayar-about-root .about-desktop-why h2{
    position:absolute;
    top:121.5cqw;
    left:36cqw;
    width:27cqw;
    margin:0;
    font-size:4.28cqw;
    line-height:1;
    font-weight:700;
    color:#202020;
  }
  .ayar-about-root .about-why-copy{
    position:absolute;
    top:140.55cqw;
    left:17.95cqw;
    width:64.4cqw;
    text-align:right;
    z-index:2;
  }
  .ayar-about-root .about-why-copy p{
    margin:0 0 4.35cqw;
    font-size:1.47cqw;
    line-height:1.82;
    font-weight:500;
    color:#252525;
  }
  .ayar-about-root .about-desktop-pattern{
    position:absolute;
    z-index:1;
    left:21.75cqw;
    top:151.7cqw;
    width:56.4cqw;
    height:auto;
    opacity:.18;
    pointer-events:none;
  }

  .ayar-about-root .about-desktop-footer .desktop-footer-inner{
    width:min(100vw,1440px);
    height:33.431085cqw;
    aspect-ratio:auto;
  }
  .ayar-about-root .about-desktop-footer .desktop-contact{
    left:16.25cqw;
    top:6.55cqw;
    width:16.5cqw;
  }
  .ayar-about-root .about-desktop-footer .desktop-services{
    left:42.2cqw;
    top:6.55cqw;
    width:16.5cqw;
  }
  .ayar-about-root .about-desktop-footer .desktop-brand{
    left:66.3cqw;
    top:4.3cqw;
    width:21cqw;
  }
  .ayar-about-root .about-desktop-footer .desktop-contact h3,
  .ayar-about-root .about-desktop-footer .desktop-services h3{
    margin-bottom:3.0cqw;
    font-size:1.52cqw;
  }
  .ayar-about-root .about-desktop-footer .desktop-contact p,
  .ayar-about-root .about-desktop-footer .desktop-services p,
  .ayar-about-root .about-desktop-footer .desktop-brand p{
    font-size:1.14cqw;
    line-height:1.95;
    font-weight:500;
  }
  .ayar-about-root .about-desktop-footer .desktop-brand img{
    width:6.34cqw;
    margin-bottom:1.4cqw;
  }
  .ayar-about-root .about-desktop-footer .footer-icons{
    gap:1.52cqw;
    margin-top:1.76cqw;
  }
  .ayar-about-root .about-desktop-footer .footer-icons .social-icon-link{
    width:1.55cqw;
    height:1.55cqw;
    color:#fff;
    box-shadow:none;
  }
  .ayar-about-root .about-desktop-footer .desktop-footer-rule{
    left:17.75cqw!important;
    right:17.75cqw!important;
    top:27.76cqw!important;
    width:auto!important;
    height:1px!important;
    background-size:1.45% 100%!important;
  }
  .ayar-about-root .about-desktop-footer .desktop-copyright{
    left:25.22cqw;
    top:32.58cqw;
    width:49.68cqw;
    font-size:1.14cqw;
  }
}

@media(max-width:767px){
  .ayar-about-root .about-mobile-stage{
    position:relative;
    width:100vw;
    height:396.111111vw;
  }
  .ayar-about-root .about-mobile-header{height:42vw}
  .ayar-about-root .about-mobile-header .mobile-social{top:17.4vw}
  .ayar-about-root .about-mobile-header .mobile-logo{left:43.3vw;top:16.35vw;width:13.3vw}
  .ayar-about-root .about-mobile-header .mobile-menu-toggle{top:20.35vw}

  .ayar-about-root .about-mobile-intro,
  .ayar-about-root .about-mobile-services,
  .ayar-about-root .about-mobile-why{
    position:absolute;
    inset:0;
    text-align:center;
  }

  .ayar-about-root .about-mobile-intro h1{
    position:absolute;
    top:52.85vw;
    left:18vw;
    width:64vw;
    margin:0;
    font-size:7.92vw;
    line-height:1.18;
    font-weight:700;
    letter-spacing:-.14vw;
    color:#202020;
  }
  .ayar-about-root .about-mobile-intro h1 span{display:block;width:max-content;margin:0 auto}
  .ayar-about-root .about-mobile-intro h1 span::after{height:.30em}
  .ayar-about-root .about-mobile-intro .about-intro-copy{
    position:absolute;
    top:82.2vw;
    left:12.3vw;
    width:75.4vw;
    text-align:right;
  }
  .ayar-about-root .about-mobile-intro .about-intro-copy p{
    margin:0 0 6.35vw;
    font-size:2.62vw;
    line-height:1.78;
    font-weight:500;
    color:#252525;
  }

  .ayar-about-root .about-mobile-services>h2{
    position:absolute;
    top:142.7vw;
    left:20vw;
    width:60vw;
    margin:0;
    font-size:5.1vw;
    line-height:1.15;
    font-weight:700;
    color:#202020;
  }
  .ayar-about-root .about-mobile-services .about-service{
    position:absolute;
    left:11.8vw;
    width:76.4vw;
    text-align:center;
  }
  .ayar-about-root .about-mobile-services .about-service h3{
    margin:0 0 3.2vw;
    font-size:5vw;
    line-height:1.12;
    font-weight:700;
    color:#202020;
  }
  .ayar-about-root .about-mobile-services .about-service p{
    margin:0;
    font-size:2.62vw;
    line-height:1.72;
    font-weight:500;
    color:#252525;
  }
  .ayar-about-root .about-mobile-services .about-service-courses{top:170.15vw}
  .ayar-about-root .about-mobile-services .about-service-collection{top:198.45vw}
  .ayar-about-root .about-mobile-services .about-service-portfolio{top:230.85vw}
  .ayar-about-root .about-mobile-services .about-service-ai{top:264vw}

  .ayar-about-root .about-mobile-why::before{
    content:"";
    position:absolute;
    top:292.15vw;
    left:0;
    width:100%;
    height:20.25vw;
    background:#fdbb25;
  }
  .ayar-about-root .about-mobile-why h2{
    position:absolute;
    top:298.5vw;
    left:26vw;
    width:48vw;
    margin:0;
    font-size:8.02vw;
    line-height:1;
    font-weight:700;
    color:#202020;
  }
  .ayar-about-root .about-mobile-why .about-why-copy{
    position:absolute;
    top:324.7vw;
    left:11.9vw;
    width:76.2vw;
    text-align:right;
    z-index:2;
  }
  .ayar-about-root .about-mobile-why .about-why-copy p{
    margin:0 0 10.4vw;
    font-size:2.65vw;
    line-height:1.78;
    font-weight:500;
    color:#252525;
  }
  .ayar-about-root .about-mobile-pattern{
    position:absolute;
    left:14.2vw;
    top:357.1vw;
    width:71.6vw;
    height:auto;
    z-index:1;
    opacity:.18;
    pointer-events:none;
  }

  .ayar-about-root .about-mobile-footer{
    position:relative;
    width:100vw;
    height:172.777778vw;
    padding:0;
    overflow:hidden;
  }
  .ayar-about-root .about-mobile-footer .mobile-footer-logo{
    position:absolute;
    top:16.6vw;
    left:40.85vw;
    width:18.3vw;
    margin:0;
  }
  .ayar-about-root .about-mobile-footer .mobile-brand-copy{
    position:absolute;
    top:42.3vw;
    left:10.5vw;
    width:79vw;
    margin:0!important;
    font-size:3.18vw;
    line-height:1.67;
    font-weight:500;
  }
  .ayar-about-root .about-mobile-footer h3{
    position:absolute;
    left:20vw;
    width:60vw;
    margin:0;
    font-size:3.8vw;
    line-height:1;
  }
  .ayar-about-root .about-mobile-footer .about-mobile-services-title{top:69.1vw}
  .ayar-about-root .about-mobile-footer .about-mobile-services-list{
    position:absolute;
    top:76.1vw;
    left:20vw;
    width:60vw;
    font-size:3.2vw;
    line-height:1.7;
  }
  .ayar-about-root .about-mobile-footer .about-mobile-contact-title{top:101.8vw}
  .ayar-about-root .about-mobile-footer .about-mobile-contact-copy{
    position:absolute;
    top:108.8vw;
    left:20vw;
    width:60vw;
    font-size:3.08vw;
    line-height:1.75;
  }
  .ayar-about-root .about-mobile-footer .mobile-footer-social{
    position:absolute;
    top:126.2vw;
    left:30vw;
    width:40vw;
    margin:0;
    gap:6.2vw;
  }
  .ayar-about-root .about-mobile-footer .mobile-footer-social .social-icon-link{
    width:4.3vw;
    height:4.3vw;
  }
  .ayar-about-root .about-mobile-footer .mobile-footer-rule{
    position:absolute;
    top:141.5vw;
    left:20.7vw;
    width:58.6vw!important;
    margin:0!important;
  }
  .ayar-about-root .about-mobile-footer .mobile-copyright{
    position:absolute;
    top:154.3vw;
    left:11vw;
    width:78vw;
    font-size:3.02vw!important;
    line-height:1.72!important;
  }
}


/* v4.9.29 — use the exact home-page title highlight model */
.ayar-about-root .about-desktop-intro h1 span::after,
.ayar-about-root .about-desktop-services>h2 span::after,
.ayar-about-root .about-desktop-services .about-service h3 span::after,
.ayar-about-root .about-mobile-intro h1 span::after,
.ayar-about-root .about-mobile-services>h2 span::after,
.ayar-about-root .about-mobile-services .about-service h3 span::after{
  content:""!important;
  position:absolute!important;
  right:0!important;
  left:0!important;
  bottom:.06em!important;
  height:.4em!important;
  background:var(--yellow)!important;
  z-index:-1!important;
}

@media(min-width:768px){
  .ayar-about-root .about-desktop-intro .about-intro-copy,
  .ayar-about-root .about-desktop-services .about-service,
  .ayar-about-root .about-desktop-why .about-why-copy{
    text-align:center!important;
  }
}


/* v4.9.30 — Desktop why-us section and footer aligned to the supplied reference image. */
@media(min-width:768px){
  .ayar-about-root .about-desktop-stage{
    height:154.25cqw;
  }

  .ayar-about-root .about-desktop-why::before{
    top:114.35cqw;
    left:0;
    width:100%;
    height:15.18cqw;
    background:#f0b61d;
  }

  .ayar-about-root .about-desktop-why h2{
    top:118.75cqw;
    left:50%;
    width:auto;
    transform:translateX(-50%);
    font-size:4.18cqw;
    line-height:1;
    letter-spacing:-.06cqw;
    text-align:center;
  }

  .ayar-about-root .about-desktop-why h2 span::after{
    left:-.11em;
    right:-.11em;
    bottom:.03em;
    height:.28em;
    background:#fff;
  }

  .ayar-about-root .about-desktop-why .about-why-copy{
    top:136.8cqw;
    left:16.45cqw;
    width:67.1cqw;
    text-align:center!important;
    z-index:2;
  }

  .ayar-about-root .about-desktop-why .about-why-copy p{
    margin:0;
    font-size:1.48cqw;
    line-height:1.92;
    font-weight:500;
    color:#252525;
  }

  .ayar-about-root .about-desktop-why .about-why-copy p:first-child{
    margin-bottom:7.15cqw;
  }

  .ayar-about-root .about-desktop-pattern{
    left:25.8cqw;
    top:145.55cqw;
    width:48.4cqw;
    opacity:.16;
  }
  .ayar-about-root .about-desktop-footer{background:#252326;}
.ayar-about-root .about-desktop-footer .desktop-footer-inner{
    width:min(100vw,1440px);
    height:31.25cqw;
  }

  .ayar-about-root .about-desktop-footer .desktop-contact{
    left:15.25cqw;
    top:5.25cqw;
    width:17.4cqw;
  }

  .ayar-about-root .about-desktop-footer .desktop-services{
    left:41.05cqw;
    top:5.2cqw;
    width:17.9cqw;
  }

  .ayar-about-root .about-desktop-footer .desktop-brand{
    left:67.55cqw;
    top:3.95cqw;
    width:19.9cqw;
  }

  .ayar-about-root .about-desktop-footer .desktop-contact h3,
  .ayar-about-root .about-desktop-footer .desktop-services h3{
    margin-bottom:3.05cqw;
    font-size:1.64cqw;
    line-height:1.1;
    font-weight:700;
  }

  .ayar-about-root .about-desktop-footer .desktop-contact p,
  .ayar-about-root .about-desktop-footer .desktop-services p{
    font-size:1.16cqw;
    line-height:1.93;
    font-weight:500;
  }

  .ayar-about-root .about-desktop-footer .desktop-brand img{
    width:6.05cqw;
    margin-bottom:1.45cqw;
  }

  .ayar-about-root .about-desktop-footer .desktop-brand p{
    font-size:1.16cqw;
    line-height:1.86;
    font-weight:500;
  }

  .ayar-about-root .about-desktop-footer .footer-icons{
    gap:2.25cqw;
    justify-content:center;
    margin-top:2.25cqw;
  }

  .ayar-about-root .about-desktop-footer .footer-icons .social-icon-link{
    width:2.05cqw;
    height:2.05cqw;
    color:#fff;
    box-shadow:none;
  }

  .ayar-about-root .about-desktop-footer .desktop-footer-rule{
    left:15.55cqw!important;
    right:15.55cqw!important;
    top:24.55cqw!important;
    width:auto!important;
    height:1px!important;
    border-top:0!important;
    background:repeating-linear-gradient(to left, rgba(255,255,255,.92) 0 10px, transparent 10px 18px)!important;
  }

  .ayar-about-root .about-desktop-footer .desktop-copyright{
    left:24.6cqw;
    top:27.85cqw;
    width:50.8cqw;
    font-size:1.24cqw;
    line-height:1.45;
    text-align:center;
  }
}


/* v4.9.31 — exact desktop pattern scale, tone and footer contact */
@media(min-width:768px){
  .ayar-about-root .about-desktop-stage{
    height:164.30cqw;
  }

  .ayar-about-root .about-desktop-pattern{
    left:26.10cqw;
    top:132.20cqw;
    width:47.80cqw;
    max-width:none;
    opacity:.40;
    z-index:1;
    pointer-events:none;
  }
}


/* v4.9.32 — match desktop reference: larger/lower pattern and footer closer */
@media(min-width:768px){
  .ayar-about-root .about-desktop-stage{
    height:160.65cqw;
  }

  .ayar-about-root .about-desktop-pattern{
    left:18.10cqw;
    top:136.85cqw;
    width:63.80cqw;
    max-width:none;
    opacity:.24;
    z-index:1;
    pointer-events:none;
  }
}


/* v4.9.33 — remove remaining gap between pattern bottom and footer top in Desktop */
@media(min-width:768px){
  .ayar-about-root .about-desktop-stage{
    height:159.15cqw;
  }

  .ayar-about-root .about-desktop-pattern{
    left:18.10cqw;
    top:136.85cqw;
    width:63.80cqw;
    max-width:none;
    opacity:.24;
    z-index:1;
    pointer-events:none;
  }
}


/* v4.9.34 — exact Desktop pattern/footer contact and solid footer background */
.ayar-about-root .about-desktop-footer,
.ayar-about-root .about-mobile-footer{
  background:#252326!important;
  background-color:#252326!important;
  background-image:none!important;
}

@media(min-width:768px){
  .ayar-about-root .about-desktop-stage{
    height:159.15cqw;
  }

  .ayar-about-root .about-desktop-pattern{
    left:18.10cqw;
    top:129.53cqw;
    width:63.80cqw;
    max-width:none;
    height:auto;
    opacity:.18;
    z-index:1;
    pointer-events:none;
  }
}

/* v4.9.35 — use the supplied gradient pattern and remove every visible gap above footer */
@media(min-width:768px){
  .ayar-about-root .about-desktop-pattern{
    left:18.10cqw;
    width:63.80cqw;
    max-width:none;
    height:auto;
    top:auto!important;
    bottom:0!important;
    opacity:1!important;
    z-index:1;
    pointer-events:none;
  }

  .ayar-about-root .about-desktop-footer,
  .ayar-about-root .about-desktop-footer .desktop-footer-inner{
    margin-top:0!important;
  }
}

@media(max-width:767px){
  .ayar-about-root .about-mobile-pattern{
    left:14.2vw;
    width:71.6vw;
    max-width:none;
    height:auto;
    top:auto!important;
    bottom:0!important;
    opacity:1!important;
    z-index:1;
    pointer-events:none;
  }

  .ayar-about-root .about-mobile-footer{
    margin-top:0!important;
  }
}

/* v4.9.36 — About page header/footer must match Home exactly; stabilize pattern so zoom does not shift it. */
@media (min-width:768px){
  /* Use the exact Home-page header metrics on About. */
  .ayar-about-root .about-desktop-header{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:14.575412cqw;
  }
  .ayar-about-root .about-desktop-header .desktop-social{
    left:17.870722cqw!important;
    top:8.111534cqw!important;
  }
  .ayar-about-root .about-desktop-header .desktop-nav{
    left:33.460076cqw!important;
    top:8.111534cqw!important;
  }
  .ayar-about-root .about-desktop-header .desktop-logo{
    left:74.651458cqw!important;
    top:5.576679cqw!important;
    width:5.323194cqw!important;
  }

  /* Use the exact Home-page footer metrics on About. */
  .ayar-about-root .about-desktop-footer{
    position:relative;
    width:100%;
    margin:0;
    background:var(--footer,#252326)!important;
    color:#fff;
  }
  .ayar-about-root .about-desktop-footer .desktop-footer-inner{
    position:relative;
    width:min(100vw,1440px);
    aspect-ratio:100 / 39.797212;
    height:auto!important;
    margin:0 auto;
    container-type:inline-size;
  }
  .ayar-about-root .about-desktop-footer .desktop-contact{
    position:absolute;
    left:16.223067cqw!important;
    top:6.590621cqw!important;
    width:16.223067cqw!important;
    text-align:center;
  }
  .ayar-about-root .about-desktop-footer .desktop-services{
    position:absolute;
    left:42.205323cqw!important;
    top:6.590621cqw!important;
    width:16.476553cqw!important;
    text-align:center;
  }
  .ayar-about-root .about-desktop-footer .desktop-brand{
    position:absolute;
    left:66.159696cqw!important;
    top:4.309252cqw!important;
    width:21.039290cqw!important;
    text-align:right;
  }
  .ayar-about-root .about-desktop-footer .desktop-contact h3,
  .ayar-about-root .about-desktop-footer .desktop-services h3{
    margin:0 0 3.041825cqw!important;
    font-size:1.520913cqw!important;
    line-height:1!important;
    font-weight:700!important;
  }
  .ayar-about-root .about-desktop-footer .desktop-contact p,
  .ayar-about-root .about-desktop-footer .desktop-services p,
  .ayar-about-root .about-desktop-footer .desktop-brand p{
    margin:0!important;
    font-size:1.140684cqw!important;
    line-height:1.95!important;
    color:#fff!important;
    font-weight:500!important;
  }
  .ayar-about-root .about-desktop-footer .desktop-brand img{
    display:block;
    width:6.337136cqw!important;
    height:auto;
    margin:0 0 1.394170cqw auto!important;
  }
  .ayar-about-root .about-desktop-footer .footer-icons{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:1.520000cqw!important;
    margin-top:1.760000cqw!important;
  }
  .ayar-about-root .about-desktop-footer .desktop-footer-rule{
    position:absolute;
    left:17.743980cqw!important;
    top:27.756654cqw!important;
    width:64.385298cqw!important;
    border-top:1px dashed rgba(255,255,255,.85)!important;
    height:0!important;
    background:none!important;
  }
  .ayar-about-root .about-desktop-footer .desktop-copyright{
    position:absolute;
    left:25.221800cqw!important;
    top:32.572877cqw!important;
    width:49.683143cqw!important;
    margin:0!important;
    text-align:center;
    font-size:1.140684cqw!important;
    line-height:1.5!important;
    color:#fff!important;
    font-weight:500!important;
  }

  /* Keep the Why pattern visually locked to the footer edge and centered, so browser zoom does not drift it. */
  .ayar-about-root .about-desktop-why{
    overflow:hidden;
  }
  .ayar-about-root .about-desktop-pattern{
    position:absolute;
    left:50%!important;
    right:auto!important;
    top:auto!important;
    bottom:-0.10cqw!important;
    width:63.20cqw!important;
    height:auto!important;
    max-width:none!important;
    transform:translateX(-50%)!important;
    opacity:.18!important;
    display:block;
    z-index:1;
    pointer-events:none;
  }
}

@media (max-width:767px){
  /* Use the exact Home-page mobile header metrics on About. */
  .ayar-about-root .about-mobile-header{
    position:absolute;
    left:0;
    top:0;
    width:100vw;
    height:43.75vw;
  }
  .ayar-about-root .about-mobile-header .mobile-social{
    left:12.083333vw!important;
    top:17.916667vw!important;
  }
  .ayar-about-root .about-mobile-header .mobile-logo{
    left:43.333333vw!important;
    top:17.5vw!important;
    width:15vw!important;
  }
  .ayar-about-root .about-mobile-header .mobile-menu-toggle{
    left:82.5vw!important;
    top:20.6vw!important;
  }

  /* Use the exact Home-page mobile footer metrics on About. */
  .ayar-about-root .about-mobile-footer{
    position:relative;
    width:100vw;
    height:174.166667vw!important;
    background:var(--footer,#252326)!important;
    color:#fff;
    text-align:center;
    padding-top:10vw!important;
    margin-top:0!important;
    overflow:hidden;
  }
  .ayar-about-root .about-mobile-footer .mobile-footer-logo{
    display:block;
    position:static!important;
    width:23.75vw!important;
    height:auto;
    margin:0 auto 5vw!important;
  }
  .ayar-about-root .about-mobile-footer .mobile-brand-copy{
    position:static!important;
    display:block;
    width:auto!important;
    margin:0 0 8.333333vw!important;
    font-size:3.416667vw!important;
    line-height:1.85!important;
    color:#fff!important;
    font-weight:500!important;
  }
  .ayar-about-root .about-mobile-footer h3{
    position:static!important;
    left:auto!important;
    width:auto!important;
    margin:5.833333vw 0 3.333333vw!important;
    font-size:4.166667vw!important;
    line-height:1!important;
    font-weight:700!important;
  }
  .ayar-about-root .about-mobile-footer p{
    position:static!important;
    left:auto!important;
    width:auto!important;
    margin:0;
    font-size:3.416667vw!important;
    line-height:1.85!important;
    color:#fff!important;
    font-weight:500!important;
  }
  .ayar-about-root .about-mobile-footer .about-mobile-services-title,
  .ayar-about-root .about-mobile-footer .about-mobile-services-list,
  .ayar-about-root .about-mobile-footer .about-mobile-contact-title,
  .ayar-about-root .about-mobile-footer .about-mobile-contact-copy{
    position:static!important;
    left:auto!important;
    width:auto!important;
  }
  .ayar-about-root .about-mobile-footer .mobile-footer-social{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:6.100000vw!important;
    margin-top:5.416667vw!important;
    font-size:4.050000vw!important;
    line-height:1;
    color:#fff;
  }
  .ayar-about-root .about-mobile-footer .mobile-footer-rule{
    display:block;
    width:59.583333vw!important;
    margin:7.083333vw auto 6.25vw!important;
    border-top:1px dashed rgba(255,255,255,.85)!important;
    height:0!important;
    background:none!important;
  }
  .ayar-about-root .about-mobile-footer .mobile-copyright{
    display:block;
    width:auto!important;
    margin:0 auto!important;
    font-size:3.041667vw!important;
    line-height:1.85!important;
    text-align:center;
    color:#fff!important;
    font-weight:500!important;
  }

  /* Mobile pattern: center it and anchor to the footer edge. */
  .ayar-about-root .about-mobile-why{
    overflow:hidden;
  }
  .ayar-about-root .about-mobile-pattern{
    position:absolute;
    left:50%!important;
    right:auto!important;
    top:auto!important;
    bottom:-0.3vw!important;
    width:71.6vw!important;
    height:auto!important;
    transform:translateX(-50%)!important;
    opacity:.18!important;
    display:block;
    z-index:1;
    pointer-events:none;
  }
}

/* v4.9.38 — keep Home header/footer untouched; refine Desktop why-pattern only.
   Goal: pattern sits under the final two paragraphs, appears slightly stronger,
   remains centered under browser zoom, and touches the footer with no gap. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why{
    overflow:hidden;
  }

  .ayar-about-root .about-desktop-why .about-why-copy{
    z-index:2;
  }

  .ayar-about-root .about-desktop-pattern{
    position:absolute;
    left:50%!important;
    right:auto!important;
    top:auto!important;
    bottom:0!important;
    width:56.8cqw!important;
    max-width:none!important;
    height:auto!important;
    transform:translateX(-50%)!important;
    transform-origin:center bottom!important;
    opacity:.24!important;
    display:block;
    z-index:1;
    pointer-events:none;
  }

  .ayar-about-root .about-desktop-footer,
  .ayar-about-root .about-desktop-footer .desktop-footer-inner{
    margin-top:0!important;
  }
}

/* v4.9.39 — make Desktop "Why us" pattern clearly visible under the final two paragraphs,
   keep it centered and touching the footer edge, and do not modify header/footer. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why{
    overflow:hidden;
  }

  .ayar-about-root .about-desktop-why .about-why-copy{
    z-index:2;
  }

  .ayar-about-root .about-desktop-pattern{
    position:absolute;
    left:50%!important;
    right:auto!important;
    top:auto!important;
    bottom:0!important;
    width:63.2cqw!important;
    max-width:none!important;
    height:auto!important;
    transform:translateX(-50%)!important;
    transform-origin:center bottom!important;
    opacity:.42!important;
    display:block!important;
    z-index:1!important;
    pointer-events:none!important;
  }

  .ayar-about-root .about-desktop-footer,
  .ayar-about-root .about-desktop-footer .desktop-footer-inner{
    margin-top:0!important;
  }
}

/* v4.9.40 — keep Desktop pattern locked behind the final two paragraphs across browser zoom levels.
   Header and footer remain unchanged. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why .about-why-copy{
    overflow:visible!important;
    z-index:2!important;
  }

  .ayar-about-root .about-desktop-why .about-why-copy p{
    position:relative;
    z-index:2;
  }

  .ayar-about-root .about-desktop-why .about-why-copy .about-desktop-pattern{
    position:absolute!important;
    left:50%!important;
    right:auto!important;
    top:41.5%!important;
    bottom:auto!important;
    width:63.2cqw!important;
    max-width:none!important;
    height:auto!important;
    transform:translateX(-50%)!important;
    transform-origin:center top!important;
    opacity:.42!important;
    display:block!important;
    z-index:1!important;
    pointer-events:none!important;
  }
}

/* v4.9.42 — restore the previous pattern position, prevent yellow-band overlap,
   keep it behind both final paragraphs, and make its lower edge meet the footer. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why{
    overflow:hidden!important;
  }

  .ayar-about-root .about-desktop-why::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:129.53cqw;
    bottom:0;
    background-image:url("../images/pattern-1-desktop.svg");
    background-repeat:no-repeat;
    background-position:center bottom;
    background-size:63.2cqw auto;
    opacity:0.50!important;
    z-index:1;
    pointer-events:none;
  }

  .ayar-about-root .about-desktop-why .about-why-copy{
    min-height:0!important;
    overflow:visible!important;
    z-index:2!important;
  }

  .ayar-about-root .about-desktop-why .about-why-copy p{
    position:relative;
    z-index:2;
  }

  .ayar-about-root .about-desktop-pattern{
    display:none!important;
  }

  .ayar-about-root .about-desktop-footer,
  .ayar-about-root .about-desktop-footer .desktop-footer-inner{
    margin-top:0!important;
  }
}

@media (max-width:767px){
  .ayar-about-root .about-mobile-pattern{
    opacity:0.50!important;
  }
}

/* v4.9.43 — one Desktop pattern only.
   It starts immediately after the yellow band, stays behind both final paragraphs,
   and its lower edge meets the footer with zero gap at every browser zoom level. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why{
    overflow:hidden!important;
  }

  .ayar-about-root .about-desktop-why::after{
    content:""!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:129.53cqw!important;
    bottom:0!important;
    background-image:url("../images/pattern-1-desktop-footer.svg")!important;
    background-repeat:no-repeat!important;
    background-position:center bottom!important;
    background-size:63.2cqw auto!important;
    opacity:0.50!important;
    z-index:1!important;
    pointer-events:none!important;
  }

  .ayar-about-root .about-desktop-why .about-why-copy{
    min-height:0!important;
    overflow:visible!important;
    z-index:2!important;
  }

  .ayar-about-root .about-desktop-why .about-why-copy p{
    position:relative!important;
    z-index:2!important;
  }

  /* Defensive removal of any legacy image-based duplicate. */
  .ayar-about-root .about-desktop-pattern{
    display:none!important;
  }
}

/* v4.9.44 — Desktop only: one shared coordinate layer for the two final paragraphs and Pattern.
   The copy layer starts at its existing position and ends exactly at the footer boundary.
   Pattern is rendered only inside this same layer, anchored to its bottom. */
@media (min-width:768px){
  /* Disable the previous section-level Pattern. */
  .ayar-about-root .about-desktop-why::after{
    content:none!important;
    display:none!important;
    background-image:none!important;
  }

  /* One coordinate system shared by text and Pattern. */
  .ayar-about-root .about-desktop-why .about-why-copy{
    position:absolute!important;
    top:136.8cqw!important;
    bottom:0!important;
    left:16.45cqw!important;
    width:67.1cqw!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    z-index:2!important;
  }

  .ayar-about-root .about-desktop-why .about-why-copy::before{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    right:auto!important;
    top:0!important;
    bottom:0!important;
    width:63.2cqw!important;
    height:auto!important;
    transform:translateX(-50%)!important;
    background-image:url("../images/pattern-1-desktop-footer.svg")!important;
    background-repeat:no-repeat!important;
    background-position:center bottom!important;
    background-size:63.2cqw auto!important;
    opacity:0.50!important;
    display:block!important;
    z-index:0!important;
    pointer-events:none!important;
  }

  .ayar-about-root .about-desktop-why .about-why-copy p{
    position:relative!important;
    z-index:2!important;
  }

  /* Defensive removal of every legacy image-based Pattern. */
  .ayar-about-root .about-desktop-pattern{
    display:none!important;
  }
}

/* v4.9.45 — Desktop only: Pattern and the final two paragraphs use one exact box.
   The Pattern fills that box from the first paragraph area to the footer edge,
   so browser zoom cannot separate it from the text. No other section is changed. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why .about-why-copy{
    position:absolute!important;
    top:136.8cqw!important;
    bottom:0!important;
    left:16.45cqw!important;
    width:67.1cqw!important;
    height:auto!important;
    min-height:0!important;
    overflow:hidden!important;
    isolation:isolate!important;
    z-index:2!important;
  }

  .ayar-about-root .about-desktop-why .about-why-copy::before{
    content:""!important;
    position:absolute!important;
    top:0!important;
    right:1.95cqw!important;
    bottom:0!important;
    left:1.95cqw!important;
    width:auto!important;
    height:auto!important;
    transform:none!important;
    transform-origin:center center!important;
    background-image:url("../images/pattern-1-desktop-footer.svg")!important;
    background-repeat:no-repeat!important;
    background-position:center center!important;
    background-size:100% 100%!important;
    opacity:0.50!important;
    display:block!important;
    z-index:0!important;
    pointer-events:none!important;
  }

  .ayar-about-root .about-desktop-why .about-why-copy p{
    position:relative!important;
    z-index:2!important;
  }

  .ayar-about-root .about-desktop-why::after,
  .ayar-about-root .about-desktop-pattern{
    content:none!important;
    display:none!important;
    background-image:none!important;
  }
}

/* v4.9.46 — Desktop only.
   Text and Pattern are locked to one shared coordinate box.
   Explicit line boxes prevent browser zoom from reflowing the two paragraphs. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why .about-why-copy{
    position:absolute!important;
    top:136.8cqw!important;
    right:auto!important;
    bottom:0!important;
    left:16.45cqw!important;
    width:67.1cqw!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    overflow:hidden!important;
    isolation:isolate!important;
    text-align:center!important;
    z-index:2!important;
  }

  .ayar-about-root .about-desktop-why .about-why-copy::before{
    content:""!important;
    position:absolute!important;
    inset:0 1.95cqw 0 1.95cqw!important;
    width:auto!important;
    height:auto!important;
    margin:0!important;
    transform:none!important;
    background-image:url("../images/pattern-1-desktop-footer.svg")!important;
    background-repeat:no-repeat!important;
    background-position:center center!important;
    background-size:100% 100%!important;
    opacity:0.50!important;
    display:block!important;
    z-index:0!important;
    pointer-events:none!important;
  }

  .ayar-about-root .about-desktop-why .about-why-copy p{
    position:absolute!important;
    right:0!important;
    left:0!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    text-align:center!important;
    z-index:2!important;
  }

  .ayar-about-root .about-desktop-why .about-why-primary-copy{
    top:0!important;
    bottom:auto!important;
  }

  .ayar-about-root .about-desktop-why .about-why-secondary-copy{
    top:70.133333%!important;
    bottom:auto!important;
  }

  .ayar-about-root .about-desktop-why .about-why-fixed-line{
    display:block!important;
    width:100%!important;
    white-space:nowrap!important;
    overflow:visible!important;
  }

  .ayar-about-root .about-desktop-why::after,
  .ayar-about-root .about-desktop-pattern{
    content:none!important;
    display:none!important;
    background-image:none!important;
  }
}

/* v4.9.47 — Desktop About only.
   The stage height must be derived from its capped width, not from viewport cqw.
   This keeps the shared text/Pattern box identical at every Desktop zoom level. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-stage{
    height:auto!important;
    aspect-ratio:100 / 159.15!important;
  }
}

/* v4.9.48 — Desktop About only: retain the accepted fixed text/Pattern layer,
   and expand the Pattern to the exact full width of the paragraph container. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why .about-why-copy::before{
    inset:0!important;
  }
}

/* v4.9.49 — Desktop About only.
   The SVG artwork has transparent side margins inside its viewBox.
   Expand only the Pattern layer by 0.97cqw on each side so the visible artwork,
   not merely the SVG canvas, matches the full paragraph width. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why .about-why-copy::before{
    inset:0 -0.97cqw!important;
  }
}

/* v4.9.50 — Desktop About Pattern width only.
   Match the supplied second reference: enlarge the visible artwork horizontally
   from roughly 58% to roughly 75% of the paragraph-line width.
   Vertical geometry, text positions, footer contact and every other component stay unchanged. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why .about-why-copy::before{
    inset:0 -11.10cqw!important;
  }
}

/* v4.9.51 — Desktop About Pattern size only.
   Enlarge the existing Pattern horizontally by about 32% to match the supplied
   second reference more closely. Vertical position, footer contact, text layer,
   opacity and all other components remain unchanged. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why .about-why-copy::before{
    inset:0 -25.50cqw!important;
  }
}

/* v4.9.52 — About Desktop only.
   1) The yellow "Why us" band spans the full viewport width.
   2) The accepted Pattern is scaled to exactly 1.5x from its current size.
   All text positions, footer contact, opacity and mobile layout remain unchanged. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-stage,
  .ayar-about-root .about-desktop-why{
    overflow:visible!important;
  }

  .ayar-about-root .about-desktop-why::before{
    left:50%!important;
    right:auto!important;
    width:100vw!important;
    transform:translateX(-50%)!important;
  }

  .ayar-about-root .about-desktop-why .about-why-copy{
    overflow:hidden!important;
  }

  .ayar-about-root .about-desktop-why .about-why-copy::before{
    transform:scale(1.5)!important;
    transform-origin:center bottom!important;
  }
}

/* v4.9.53 — Desktop About Pattern only.
   Preserve the accepted 1.5x size and shared text coordinate box.
   Move the same Pattern layer downward inside that box so its upper contour is fully visible.
   The lower artwork remains clipped exactly at the footer edge, with no gap. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why .about-why-copy::before{
    top:11.80cqw!important;
    bottom:-11.80cqw!important;
    transform:scale(1.5)!important;
    transform-origin:center bottom!important;
  }
}

/* v4.9.55 — Desktop About: adjust only the shared final-paragraph/Pattern layer position. */
@media (min-width:768px){
  .ayar-about-root .about-desktop-why .about-why-copy{
    top:133.4cqw!important;
  }
}

/* v4.9.56 — Mobile About only: center-align both final "Why us" paragraphs. */
@media (max-width:767px){
  .ayar-about-root .about-mobile-why .about-why-copy,
  .ayar-about-root .about-mobile-why .about-why-copy p{
    text-align:center!important;
  }
}
