.about-container{padding: 15px 100px;display: grid;gap: 15px;}
.about-main{background-color: #fff;width: 100%;padding-top: var(--header-height);overflow-x: hidden;}
.about-hero-section{width: 100%;height: 100%;overflow: hidden;background: var(--color-brand1);}
.skewdiv{display: flex;position: absolute;width: 100%;height: 100%;overflow: hidden;z-index: 0;}
.skewdiv::after{content: url("data:image/svg+xml,%3Csvg viewBox='0 0 1440 138' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 137.5L1440 26.5V0.5H0V137.5Z' fill='%23445E7E'/%3E%3C/svg%3E%0A");position: absolute;right: 0;top: -10px;width: 100%;height: auto;}
.about-hero-section-img{position: relative;width: 100%;height: 120px;background-size: 100% 100%;display: flex;justify-content: center;align-items: center;}
.about-hero-section-img::after{position: absolute;content: url("data:image/svg+xml,%3Csvg viewBox='0 0 72 76' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='72' height='12' fill='%23D9D9D9' fill-opacity='0.08'/%3E%3Crect y='64' width='72' height='12' fill='%23D9D9D9' fill-opacity='0.08'/%3E%3Crect x='14' y='32' width='58' height='12' fill='%23D9D9D9' fill-opacity='0.08'/%3E%3C/svg%3E%0A");width: 50px;height: 50px;right: 0;top: 50%;transform: translateY(-50%);}
.about-hero-section-img::before{position: absolute;content: url("data:image/svg+xml,%3Csvg viewBox='0 0 72 76' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='72' height='12' transform='matrix(-1 0 0 1 72 0)' fill='%23D9D9D9' fill-opacity='0.08'/%3E%3Crect width='72' height='12' transform='matrix(-1 0 0 1 72 64)' fill='%23D9D9D9' fill-opacity='0.08'/%3E%3Crect width='58' height='12' transform='matrix(-1 0 0 1 58 32)' fill='%23D9D9D9' fill-opacity='0.08'/%3E%3C/svg%3E%0A");width: 50px;height: 50px;left: 0;top: 50%;transform: translateY(-50%);}
.about-hero-section-img .txt h2{color: #fff;}
.about-main-div{width: 100%;min-height: 200px;background-color: #fff;border-radius: var(--border-radius-sm);overflow: hidden;box-shadow: 0 0 25px 8px #00000011;padding: 50px;display: flex;flex-direction: column;gap: 100px;}
/* Image */
.about-2grid{position: relative;width: 100%;display: grid;grid-template-columns: repeat(2,1fr);gap: 25px;}
.about-2grid .para{width: 90%;}
.about-image-withafter{position: relative;width: 100%;display: flex;justify-content: flex-end;padding-left: 25px;z-index: 1;}
.about-image-withafter img{width: 500px;max-width: 100%;height: 350px;border-radius: var(--border-radius-sm);position: relative;z-index: 2;object-fit: cover;object-position: center;}
.about-image-withafter::after{content: "";width: 500px;max-width: calc(100% - 25px);height: 350px;background-color: var(--color-brand1);border-radius: var(--border-radius-sm);position: absolute;left: 0;top: 25px;z-index: 0;}
/* Video */
.about-video-withafter{position: relative;width: 100%;display: flex;justify-content: center;padding: 50px;z-index: 1;}
.about-video-withafter::after{content: "";width: 500px;max-width: calc(100% - 25px);height: 350px;background-color: var(--color-brand1);border-radius: var(--border-radius-sm);position: absolute;left: 0;bottom: 0;z-index: 0;}
.about-video-withafter::before{content: "";width: 400px;max-width: calc(100% - 25px);height: 250px;background-color: var(--color-brand1);border-radius: var(--border-radius-sm);position: absolute;right: 0;top: 0;z-index: 0;}
.about-video-wrapper{position:relative;width: 100%;max-width: 100%;height: 100%;position: relative;z-index: 2;}
.about-video{width: 100%;max-width: 100%;height: auto;object-fit: cover;aspect-ratio: 2/1;overflow: hidden;border-radius: var(--border-radius-sm);margin: 0;padding: 0;border: 1px solid #fff;}
.about-playpause{position: absolute;width: 100%;height: 100%;background: url('../img/videoView.svg') no-repeat center;background-size: cover;left:0;right:0;top:0;bottom:0;}
.about-playpause.isHidden{opacity: 0;}
/* Contact */
.contact-text{width: 100%;display: flex;flex-direction: column;gap: 10px;padding: 25px 0;}
.contact-text span{font-size: 14px;font-weight: 600;color: var(--color-brand1);}
.contact-text h2{font-size: 22px;font-weight: 800;color: var(--color-brand1);}
.contact-text p{font-size: 14px;font-weight: 600;color: var(--color-brand1);}
.contact-text .contact-address{display: flex;flex-direction: column;margin-top: 50px;gap: 25px;}
.contact-text .contact-address div{display: flex;align-items: center;gap: 15px;}
.contact-text .contact-address div svg{width: 45px;height: 45px;}
.contact-text .contact-address div a{font-size: 16px;font-weight: 800;color: var(--color-brand1);}
.contact-form{position: relative;width: 100%;border-radius: var(--border-radius-sm);border: 1px solid var(--color-border);padding: var(--div-padding);background-color: #fff;z-index: 2;box-shadow: var(--div-boxshadow-low);}
.absolute-circle{position: absolute;left: calc(50% - 140px);top: -60px;z-index: 1;display: flex;justify-content: center;align-items: center;}
.absolute-circle::after{content: url("data:image/svg+xml,%3Csvg viewBox='0 0 311 311' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='0.3'%3E%3Cmask id='mask0_546_1452' style='mask-type:luminance' maskUnits='userSpaceOnUse' x='43' y='43' width='225' height='225'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M217.284 61.8366C268.984 95.9878 283.211 165.584 249.059 217.284C214.908 268.985 145.312 283.211 93.6116 249.06C41.9113 214.909 27.685 145.312 61.8362 93.612C95.9874 41.9118 165.584 27.6854 217.284 61.8366Z' fill='white'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_546_1452)'%3E%3Cpath d='M32.5263 72.1362L269.407 228.611' stroke='%23FF6D31' stroke-width='3'/%3E%3Cpath d='M27.1904 83.3061L264.071 239.781' stroke='%23FF6D31' stroke-width='3'/%3E%3Cpath d='M22.1904 97.3061L259.071 253.781' stroke='%23FF6D31' stroke-width='3'/%3E%3Cpath d='M15.1904 108.306L252.071 264.781' stroke='%23FF6D31' stroke-width='3'/%3E%3Cpath d='M35.9384 46.2485L272.819 202.723' stroke='%23FF6D31' stroke-width='3'/%3E%3Cpath d='M34.2233 59.3656L271.104 215.84' stroke='%23FF6D31' stroke-width='3'/%3E%3Cpath d='M39.3689 20.0151L276.25 176.489' stroke='%23FF6D31' stroke-width='3'/%3E%3Cpath d='M37.6538 33.1322L274.535 189.607' stroke='%23FF6D31' stroke-width='3'/%3E%3Cpath d='M42.7612 -5.52596L279.642 150.948' stroke='%23FF6D31' stroke-width='3'/%3E%3Cpath d='M41.0461 7.59123L277.927 164.066' stroke='%23FF6D31' stroke-width='3'/%3E%3Cpath d='M46.1916 -31.7603L283.073 124.714' stroke='%23FF6D31' stroke-width='3'/%3E%3Cpath d='M44.4765 -18.6431L281.358 137.831' stroke='%23FF6D31' stroke-width='3'/%3E%3Cpath d='M47.9067 -44.8765L284.788 111.598' stroke='%23FF6D31' stroke-width='3'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");width: 200px;height: 200px;}

@media screen and (max-width: 1300px)
{
    .about-container{padding: 15px 50px;}
}
@media screen and (max-width: 1024px)
{
    .about-container{padding: 15px 25px;}
    .about-main-div{padding: 25px}
    .about-video-withafter{padding: 25px;}
    .about-2grid{grid-template-columns: 1fr;}
    .absolute-circle{display: none;}
    .about-image-withafter{justify-content: center;}
}
@media screen and (max-width: 768px)
{
    .about-video-withafter::after{width: 100%;height: 100%;max-width: 100%;}
    .about-video-withafter::before{display: none;}
}
@media screen and (max-width: 480px)
{
    .about-container{padding: 15px;}
    .about-main-div{padding: 15px}
    .about-hero-section-img .txt h2{font-size: 15px;}
    .about-image-withafter{padding-left: 0;}
    .about-image-withafter::after{display: none;}
    .about-image-withafter img{height: auto;}
    .about-video-withafter::after{display: none;}
    .about-video-withafter{padding: 0;}
}
