/* v136 · 브랜드 석판 장면: 돌덩이 · 파편 · 석판은 흐림 없이 선명하게 (사물이 있는 곳은 100% 그대로).
   장면 판의 바깥쪽(글자 쪽 · 위 · 아래)만 넓고 완만하게 배경에 녹여서 사각형 경계 없이 이어짐 */
#app .brand-visual,#app .brand-visual .hero-visual{-webkit-mask-image:none !important;mask-image:none !important}
#app .brand-visual .hero-visual>:not(.hero-hotspots){mix-blend-mode:normal;
 -webkit-mask-image:linear-gradient(90deg,transparent 0%,transparent 22%,rgba(0,0,0,.08) 28%,rgba(0,0,0,.3) 34%,rgba(0,0,0,.62) 40%,rgba(0,0,0,.88) 46%,#000 52%,#000 100%),linear-gradient(180deg,transparent 0%,#000 5%,#000 78%,rgba(0,0,0,.7) 85%,rgba(0,0,0,.35) 91%,rgba(0,0,0,.1) 96%,transparent 100%) !important;
 -webkit-mask-composite:source-in;
 mask-image:linear-gradient(90deg,transparent 0%,transparent 22%,rgba(0,0,0,.08) 28%,rgba(0,0,0,.3) 34%,rgba(0,0,0,.62) 40%,rgba(0,0,0,.88) 46%,#000 52%,#000 100%),linear-gradient(180deg,transparent 0%,#000 5%,#000 78%,rgba(0,0,0,.7) 85%,rgba(0,0,0,.35) 91%,rgba(0,0,0,.1) 96%,transparent 100%) !important;
 mask-composite:intersect}
#app .about2-brand>div:first-child{position:relative;z-index:2}
/* v139 · 하단 석판 뒤 배경: 흐린 구름 무늬를 눌러서 심볼이 또렷하게 */
#app .ct-brick::before{content:'';position:absolute;inset:-18% -14%;z-index:-1;border-radius:50%;
 background:radial-gradient(closest-side,rgba(8,8,10,.82),rgba(8,8,10,.55) 45%,rgba(8,8,10,.18) 75%,transparent 100%);pointer-events:none}
#app .ct-brick{isolation:isolate}
#app .ct-v78 .ct-bg{filter:blur(22px) grayscale(1) brightness(.34) contrast(1.05) !important}
/* v140 · 석판 장면 윗경계: 장면 판(어두운 바탕) 둘레에 넓고 부드러운 어둠을 먼저 깔아,
   판의 경계가 이미 어두운 곳에 놓이게 함 → 위 장면에서 내려와도 띠가 보이지 않음 */
#app .brand-visual::before{content:'';position:absolute;left:-55%;right:-25%;top:-45%;bottom:-35%;z-index:0;pointer-events:none;
 background:radial-gradient(closest-side at 62% 52%,rgba(9,9,11,.9),rgba(9,9,11,.78) 30%,rgba(9,9,11,.52) 52%,rgba(9,9,11,.26) 72%,rgba(9,9,11,.08) 88%,transparent 100%)}
#app .brand-visual .hero-visual{z-index:1}
/* top edge of the scene plate: longer, eased fade */
#app .brand-visual .hero-visual>:not(.hero-hotspots){
 -webkit-mask-image:linear-gradient(90deg,transparent 0%,transparent 22%,rgba(0,0,0,.08) 28%,rgba(0,0,0,.3) 34%,rgba(0,0,0,.62) 40%,rgba(0,0,0,.88) 46%,#000 52%,#000 100%),linear-gradient(180deg,transparent 0%,rgba(0,0,0,.18) 3%,rgba(0,0,0,.5) 6%,rgba(0,0,0,.82) 9%,#000 12%,#000 78%,rgba(0,0,0,.7) 85%,rgba(0,0,0,.35) 91%,rgba(0,0,0,.1) 96%,transparent 100%) !important;
 mask-image:linear-gradient(90deg,transparent 0%,transparent 22%,rgba(0,0,0,.08) 28%,rgba(0,0,0,.3) 34%,rgba(0,0,0,.62) 40%,rgba(0,0,0,.88) 46%,#000 52%,#000 100%),linear-gradient(180deg,transparent 0%,rgba(0,0,0,.18) 3%,rgba(0,0,0,.5) 6%,rgba(0,0,0,.82) 9%,#000 12%,#000 78%,rgba(0,0,0,.7) 85%,rgba(0,0,0,.35) 91%,rgba(0,0,0,.1) 96%,transparent 100%) !important}
/* v141 · 장면이 위에서 잘리지 않게: 장면 판을 원본 비율(16:9)만큼 키워 위아래 잘림을 없애고, 윗쪽 페이드는 아주 짧게 */
#app .brand-visual .hero-visual{top:-12% !important;height:124% !important}
#app .brand-visual .hero-visual>:not(.hero-hotspots){
 -webkit-mask-image:linear-gradient(90deg,transparent 0%,transparent 22%,rgba(0,0,0,.08) 28%,rgba(0,0,0,.3) 34%,rgba(0,0,0,.62) 40%,rgba(0,0,0,.88) 46%,#000 52%,#000 100%),linear-gradient(180deg,transparent 0%,rgba(0,0,0,.45) 1.5%,#000 4%,#000 80%,rgba(0,0,0,.7) 86%,rgba(0,0,0,.35) 92%,rgba(0,0,0,.1) 97%,transparent 100%) !important;
 mask-image:linear-gradient(90deg,transparent 0%,transparent 22%,rgba(0,0,0,.08) 28%,rgba(0,0,0,.3) 34%,rgba(0,0,0,.62) 40%,rgba(0,0,0,.88) 46%,#000 52%,#000 100%),linear-gradient(180deg,transparent 0%,rgba(0,0,0,.45) 1.5%,#000 4%,#000 80%,rgba(0,0,0,.7) 86%,rgba(0,0,0,.35) 92%,rgba(0,0,0,.1) 97%,transparent 100%) !important}
/* labels land with a snap ("착!") */
#app .brand-visual .hero-hotspot.is-label{transition:none !important}
#app .brand-visual .hero-hotspot.is-label.is-ready{animation:labelSnap .55s cubic-bezier(.2,1.6,.4,1) both}
@keyframes labelSnap{0%{opacity:0;transform:translate(-22px,-50%) scale(.92)}55%{opacity:1}100%{opacity:1;transform:translate(0,-50%) scale(1)}}
#app .brand-visual .hero-hotspot.is-label.is-ready .note-line{animation:lineSnap .45s cubic-bezier(.22,1,.36,1) both}
@keyframes lineSnap{from{transform:scaleX(0);transform-origin:right}to{transform:scaleX(1);transform-origin:right}}
/* v142 · 근본 해결: 장면의 사진 배경판(어두운 사각형)을 아예 그리지 않음.
   돌 · 파편 · 석판 · 빛만 투명한 화면에 그려져 페이지 배경 위에 바로 놓임 → 그라데이션 경계 자체가 없음 */
#app .brand-visual .render-plane{display:none !important}
#app .brand-visual::before{display:none !important}
#app .brand-visual .hero-visual>*{-webkit-mask-image:none !important;mask-image:none !important}
/* v144 · 라벨이 판이 닿는 바로 그 순간 '탁' (짧고 단단하게) */
#app .brand-visual .hero-hotspot.is-label.is-ready{animation:labelSnap .34s cubic-bezier(.25,1.8,.45,1) both !important}
@keyframes labelSnap{0%{opacity:0;transform:translate(-14px,-50%) scale(.94)}30%{opacity:1}100%{opacity:1;transform:translate(0,-50%) scale(1)}}
#app .brand-visual .hero-hotspot.is-label.is-ready .note-line{animation:lineSnap .3s cubic-bezier(.22,1,.36,1) both !important}