.development-hero-content { min-height: 766px; padding: 224px 0 120px; color: var(--fig-grey-light); }
.development-hero-bg { width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: var(--fig-green); }
.development-hero-bg img { width: 100%; height: 100%; object-fit: cover; }
.development-hero-video { padding-bottom: 56.25%; position: relative; overflow: hidden; background: var(--fig-black); }
.development-hero-video iframe { width: 100%; height: 100%; border: 0; position: absolute; left: 0; top: 0; }
.development-hero-heading h1 { font-size: 70px; margin-bottom: 0; }
.development-hero-cta { margin-top: 40px; }
.development-hero-img { width: 100%; position: relative; padding-bottom: 40.4%; background: var(--fig-green); }
.development-hero-img img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; }
.development-hero-quarter-circle { width: auto; height: 48.5%; position: absolute; bottom: 0; left: 0; }
.development-hero-quarter-circle img { width: 100%; height: 100%; object-fit: contain; }
.development-hero-lines { height: 100%; position: absolute; top: 0; left: 0; right: 0; }
.development-hero-line.line-1 { width: 1px; height: 100%; position: absolute; top: 0; left: calc(50% + 172px); background: var(--fig-grey); opacity: 0.3; }
.development-hero-line.line-2 { width: 100vw; height: 1px; position: absolute; top: 51.5%; left: 0; right: 0; background: var(--fig-grey); opacity: 0.3; }
.development-hero-dashed-line.line-1 { width: 100vw; height: 1px; position: absolute; top: 51.5%; left: calc(50% + 172px); background-image: linear-gradient(90deg, var(--fig-grey), var(--fig-grey) 60%, transparent 60%, transparent 100%); background-size: 20px 1px; opacity: 0.3; transform: rotate(-47.5deg); transform-origin: top left; }
.development-hero-dashed-line.line-2 { width: 100vw; height: 1px; position: absolute; top: 51.5%; left: calc(50% + 172px); background-image: linear-gradient(90deg, var(--fig-grey), var(--fig-grey) 60%, transparent 60%, transparent 100%); background-size: 20px 1px; opacity: 0.3; transform: rotate(45deg); transform-origin: top left; }
/* ========================================== 
! Large devices (desktops, less than 1200px)
=========================================== */
@media (max-width:1199.98px) {
 .development-hero-heading h1 { font-size: 60px; }
 }
/*==========================================
! Medium devices (tablets, less than 992px)
========================================== */
@media (max-width:991.98px) {
 .development-hero-content { padding: 160px 0 46px; }
.development-hero-heading h1 { font-size: 50px; margin-bottom: 42px; }
 }
/* =================================================  
! Small devices (landscape phones, less than 768px)
================================================= */
@media (max-width:767.98px) {
 .development-hero-content { min-height: auto; }
.development-hero-heading h1 { font-size: 35px; }
.development-hero-img { height: 100%; padding-bottom: 0; }
.development-hero-img img { position: relative; inset: 0; }
 }
/* ======================================================
! Extra small devices (portrait phones, less than 576px)
====================================================== */
@media (max-width:575.98px) {
 }
