.custom-hero-container { height: 30vw;  background-color: #3e392f;}
.custom-hero-container .item-1-wrap { top: -40px; left: -2vw; width: 25vw; height: 25vw; }
.custom-hero-container .item-2-wrap { top: -90px; right: -30px; width: 35vw; height: 35vw; }
.custom-hero-container .item-3-wrap { top: 100px; left: 20vw; width: 22vw; height: 22vw; }
.custom-hero-container .item-1-wrap .shape-demo { background-color: #edde3d7c; }
.custom-hero-container .item-2-wrap .shape-demo { background-color: #2259c6b4; }
.custom-hero-container .item-3-wrap .shape-demo { background-color: #e98e6aad; }
/* 中型螢幕 (1200px ~ 1400px) */
@media (max-width:1400px) {
.custom-hero-container { height: 30vw; }
.custom-hero-container .item-1-wrap { top: -40px; left: -2vw; width: 25vw; height: 25vw; }
.custom-hero-container .item-2-wrap { top: -90px; right: -30px; width: 35vw; height: 35vw; }
.custom-hero-container .item-3-wrap { top: 100px; left: 20vw; width: 22vw; height: 22vw; }
}
/* 小型螢幕 / 筆電 (768px ~ 1200px) */
@media (max-width:1200px) {
.custom-hero-container { height: 40vw; }
.custom-hero-container .item-1-wrap { top: -10px; left: -2vw; width: 25vw; height: 25vw; }
.custom-hero-container .item-1-wrap .shape-demo { background-color: #edde3d7c; filter: blur(2px); }
.custom-hero-container .item-2-wrap { top: -40px; right: -30px; width: 35vw; height: 35vw; }
.custom-hero-container .item-2-wrap .shape-demo { background-color: #2259c6b4; filter: blur(1px); }
.custom-hero-container .item-3-wrap { top: 110px; left: 12vw; width: 28vw; height: 28vw; }
.custom-hero-container .item-3-wrap .shape-demo { background-color: #e98e6aad; filter: blur(1px); }
}
/* 手機模式 (768px 以下) */
@media (max-width:768px) {
.custom-hero-container { height: 46vw; }
.custom-hero-container .item-3-wrap { display: none !important; }
.custom-hero-container .item-1-wrap { top: -20px; left: -40px; width: 35vw; height: 35vw; }
.custom-hero-container .item-2-wrap { top: -40px; right: -50px; width: 55vw; height: 55vw; }
}
/* 極小手機模式 (520px 以下) */
@media (max-width:520px) {
.custom-hero-container { height: 46vw; }
.custom-hero-container .item-3-wrap { display: none !important; }
.custom-hero-container .item-1-wrap { top: 15px; left: -15px; width: 35vw; height: 35vw; opacity: 0.4; }
.custom-hero-container .item-2-wrap { top: -30px; right: -50px; width: 55vw; height: 55vw; opacity: 0.4; }
}
