/* Keep the B-Star about layout in normal flow as panel content changes. */
.bstar-about { isolation: isolate; padding: clamp(56px,7vw,100px) 0; scroll-margin-top: 110px; }
.bstar-about .container { width: 100%; max-width: 1320px; padding-inline: 24px; }
.bstar-about .design-about { --bs-gutter-x: 48px; row-gap: 48px; }
.bstar-about .design-about > div { min-width: 0; }
.bstar-about .second-heading { font-size: clamp(36px,4.5vw,64px); line-height: 1.2; margin-bottom: 24px; overflow-wrap: anywhere; }
.bstar-about .description-heading { font-size: clamp(18px,1.6vw,20px); line-height: 1.6; overflow-wrap: anywhere; }
.bstar-about .main-second-heading-data > img { top: 100%; inset-inline-start: 16%; width: min(80%,280px); pointer-events: none; }
.bstar-about .img { margin-top: 64px; }
.bstar-about .img-container { width: min(100%,340px); height: auto; aspect-ratio: 3 / 4; }
.bstar-about .img-container img { display: block; transform: none; }
.bstar-about .data-self { display: flex; flex-direction: column; align-items: center; gap: 32px; height: auto; }
.bstar-about .men-xxper-data { width: 100%; height: auto; display: grid; grid-template-columns: minmax(90px, .45fr) minmax(0,1fr); align-items: start; gap: 16px; margin-top: 36px; padding-inline-end: 32px; }
.bstar-about .experience-data { margin-top: 0; }
.bstar-about .ex-number { font-size: clamp(52px,5.6vw,80px); line-height: 1.1; }
.bstar-about .ex-name { font-size: 17px; line-height: 1.5; overflow-wrap: anywhere; }
.bstar-about .box-design-right { min-width: 0; }
.bstar-about .data-round-data { width: 100%; aspect-ratio: 1; overflow: hidden; }
.bstar-about .data-round-data img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bstar-about .round-image-about { position: absolute; top: -24px; inset-inline-end: 0; width: clamp(58px,7vw,100px); margin: 0; pointer-events: none; }
.bstar-about .self-intro { position: static; max-width: 100%; font-size: clamp(22px,2.2vw,32px); line-height: 1.65; overflow-wrap: anywhere; text-align: start; }
.bstar-about .btn-main { position: static; max-width: 100%; text-align: center; color: #06232d; flex-shrink: 0; }
.bstar-about .btn-main:hover { color: var(--body-color); }
.bstar-about .btn-main:focus-visible { outline: 3px solid var(--main-text); outline-offset: 4px; }
.bstar-about .botter-left { left: auto; inset-inline-start: 3%; max-width: 110px; pointer-events: none; opacity: .5; }
.bstar-about .fade_down,.bstar-about .zoom_in { opacity: 1; transform: none; }
@media(max-width:991px) {
    .bstar-about .img { margin-top: 40px; }
    .bstar-about .img-container { width: min(100%,440px); margin-inline: auto; aspect-ratio: 4 / 3; }
    .bstar-about .men-xxper-data { max-width: 560px; }
    .bstar-about .main-second-heading-data > img { width: 180px; }
}
@media(max-width:575px) {
    .bstar-about .container { padding-inline: 20px; }
    .bstar-about .design-about { --bs-gutter-x: 24px; }
    .bstar-about .men-xxper-data { gap: 12px; padding-inline-end: 12px; }
    .bstar-about .ex-name { font-size: 14px; }
    .bstar-about .data-self { gap: 24px; }
    .bstar-about .btn-main { padding: 13px 28px; font-size: 18px; }
}
@media(prefers-reduced-motion:reduce) { .bstar-about img { animation: none !important; transition: none !important; } }