main>#about-us{position:relative;isolation:isolate;aspect-ratio:1.5;overflow:hidden;background:#041220;box-shadow:none;scroll-margin-top:95px}.about-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}.about-number{position:absolute;left:2%;top:2%;color:#b2c5d6;font:18px Georgia,serif}.about-copy{position:absolute;right:5.5%;top:12%;width:34%;text-align:right}.about-eyebrow{font-size:clamp(14px,1.6vw,24px);margin:0 0 25px}.about-eyebrow:after{content:'';display:inline-block;width:55px;height:1px;background:#66c9ee;vertical-align:middle;margin-inline-start:18px}.about-copy h2{font:500 clamp(30px,4.8vw,76px)/1.35 ArabicUI,Arial,sans-serif;margin:0 0 32px;color:#f3efe9}.about-description{font-size:clamp(13px,1.4vw,22px);line-height:1.85;color:#c5c8d1;margin:0 0 32px}.about-values{display:flex;gap:0;list-style:none;padding:0;margin:0;justify-content:space-between}.about-values li{flex:1;text-align:center;color:#f5efe4;font-size:clamp(10px,1vw,15px);border-inline-start:1px solid #489dca88;padding:0 8px}.about-values li:first-child{border:0}.about-values svg{height:30px;width:30px;stroke:#dfb66d;stroke-width:1.2;fill:none;margin:0 auto 12px}.about-copy.is-animated>*{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}.about-copy.is-visible>*{opacity:1;transform:none}.about-copy.is-visible h2{transition-delay:.08s}.about-copy.is-visible .about-description{transition-delay:.14s}.about-copy.is-visible .about-values{transition-delay:.2s}html[dir=ltr] .about-copy{text-align:left}html[dir=ltr] .about-copy h2{font-size:clamp(30px,4vw,62px)}
@media(min-width:1600px){main>#about-us{max-height:1067px}.about-copy{right:max(5.5%,calc((100vw - 1536px)/2 + 85px));width:522px}.about-art{object-fit:contain}}
@media(max-width:760px){main>#about-us{aspect-ratio:auto;padding:345px 24px 265px;min-height:960px;background-image:var(--site-waves);background-size:auto 100%}.about-art{height:350px;width:160%;max-width:none;object-fit:cover;object-position:left top;mask-image:linear-gradient(#000 75%,transparent)}.about-copy{position:relative;inset:auto;width:100%;max-width:500px;margin:auto;text-align:right}.about-eyebrow{font-size:16px;margin-bottom:16px}.about-copy h2{font-size:39px;line-height:1.35;margin-bottom:20px}.about-description{font-size:15px;line-height:1.9;margin-bottom:24px}.about-values li{font-size:11px}.about-values svg{width:26px;height:26px}.about-number{top:18px;left:20px}main>#about-us:after{content:'';position:absolute;bottom:0;left:0;right:0;height:240px;background:url('/assets/sections/about-craft-v1.webp') no-repeat right bottom;background-size:auto 550px;mask-image:linear-gradient(transparent,#000 18%,#000 85%,transparent)}html[dir=ltr] .about-copy h2{font-size:38px}}
@media(prefers-reduced-motion:reduce){.about-copy.is-animated>*{opacity:1;transform:none;transition:none}}
.about-custom-art{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}.about-copy,.about-number{z-index:2}.about-custom-bottom{display:none}.about-long-copy .about-copy{top:9%}.about-long-copy .about-copy h2{font-size:clamp(28px,3.3vw,52px);margin-bottom:20px}.about-long-copy .about-description{font-size:clamp(12px,1.2vw,18px);margin-bottom:20px;overflow-wrap:anywhere}.about-copy h2{overflow-wrap:anywhere}
@media(min-width:1600px){.about-custom-main{width:1600px;left:calc((100% - 1600px)/2)}}
@media(max-width:760px){.about-custom-main{height:350px;width:160%;max-width:none;mask-image:linear-gradient(#000 75%,transparent)}.about-custom-bottom{display:block;top:auto;bottom:0;height:240px;mask-image:linear-gradient(transparent,#000 18%,#000 85%,transparent);z-index:1}main>#about-us:after{display:none}.about-long-copy .about-copy{top:auto}.about-long-copy .about-copy h2{font-size:32px}.about-long-copy .about-description{font-size:15px}}
/* Keep artwork, masks and copy in one shared coordinate system. */
main>#about-us{width:calc(100% - 48px);max-width:1100px;margin:40px auto;max-height:none;container-type:inline-size;border-radius:16px}
.about-art,.about-custom-main{width:100%;height:100%;left:0;object-fit:fill}
.about-copy{top:10%;right:5%;width:35%;max-height:53%;overflow:auto;scrollbar-width:thin;scrollbar-color:#507086 transparent;padding-bottom:8px}
.about-eyebrow{font-size:clamp(14px,1.6cqw,18px);margin-bottom:18px}
.about-copy h2{font-size:clamp(28px,4.4cqw,48px);line-height:1.35;margin-bottom:22px}
.about-description{font-size:clamp(12px,1.4cqw,15.5px);line-height:1.8;margin-bottom:22px}
.about-values li{font-size:clamp(9px,1cqw,11px)}.about-values svg{height:24px;width:24px;margin-bottom:8px}
.about-long-copy .about-copy{top:8%}.about-long-copy .about-copy h2{font-size:clamp(26px,3.2cqw,36px);margin-bottom:14px}.about-long-copy .about-description{font-size:clamp(12px,1.25cqw,14px);margin-bottom:16px}
html[dir=ltr] .about-copy h2{font-size:clamp(28px,3.8cqw,42px)}
@media(max-width:760px){main>#about-us{width:calc(100% - 24px);margin:24px auto;padding:265px 20px 235px;min-height:0;border-radius:12px}.about-art,.about-custom-main{height:280px;width:160%;left:0;object-fit:cover;object-position:left top;mask-image:linear-gradient(#000 70%,transparent)}.about-copy,.about-long-copy .about-copy{position:relative;top:auto;right:auto;width:100%;max-height:none;overflow:visible;padding:0}.about-eyebrow{font-size:15px;margin-bottom:14px}.about-copy h2,.about-long-copy .about-copy h2,html[dir=ltr] .about-copy h2{font-size:30px;line-height:1.4;margin-bottom:18px}.about-description,.about-long-copy .about-description{font-size:14px;line-height:1.85;margin-bottom:22px}.about-values li{font-size:10px}.about-custom-bottom{height:215px}.about-values svg{height:23px;width:23px}}
/* Fade artwork only; copy and editable image masks retain their shared coordinates. */
main>#about-us{background:transparent;border-radius:0;margin-block:24px}
.about-art,.about-custom-main{
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 94%,transparent),linear-gradient(transparent,#000 12%,#000 84%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 94%,transparent),linear-gradient(transparent,#000 12%,#000 84%,transparent);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
@media(max-width:760px){
  main>#about-us{width:100%;margin-block:0;padding-inline:24px}
  .about-art,.about-custom-main{-webkit-mask-image:linear-gradient(transparent,#000 12%,#000 68%,transparent);mask-image:linear-gradient(transparent,#000 12%,#000 68%,transparent)}
  .about-custom-bottom{-webkit-mask-image:linear-gradient(transparent,#000 23%,#000 67%,transparent);mask-image:linear-gradient(transparent,#000 23%,#000 67%,transparent)}
}