
body.eg-site #mb-panel-desc:has(.fg-founder-stage) .mb-widget-reveal{order:0;margin:0;padding:64px 24px 24px;}
body.eg-site #mb-panel-desc:has(.fg-founder-stage) .mb-widget-body{order:1;}
body.eg-site #mb-panel-desc:has(.fg-founder-stage) .mb-panel-photo{order:2;}
body.eg-site #mb-panel-desc:has(.fg-founder-stage) .mb-widget-cta{order:3;}
/* 닫기 단추(position:absolute, 위 14px, 실측 높이 33.5px)와 겹치지 않도록, 네 문단은 위 64px 아래에서 시작한다.
   그 아래 Founder 상자는 이제 맨 위가 아니다. 닫기 단추를 피하려던 위 56px을 옆과 같은 24px로 맞춘다(옆 여백은 그대로). */
body.eg-site #mb-panel-desc .mb-widget-reveal:not([hidden]) ~ .mb-widget-body .fg-founder-stage{padding-top:24px;}

/* 한 문단씩 천천히: 이전에는 .62s로 0.27초 간격으로 겹쳐 나와 한꺼번에 뜨는 것처럼 보였다.
   이제 한 문단이 1초에 걸쳐 아래에서 스르륵 올라오며 밝아지고, 다음 문단은 앞 문단이 다 나온 뒤(1초 간격) 시작한다.
   (0.2s → 1.2s → 2.2s → 3.2s, 4.2초에 네 문단이 모두 보임)
   타이머(setTimeout)는 쓰지 않는다. 위젯 JS가 열 때마다 is-playing을 뗐다 붙여 CSS 애니메이션만 처음부터 다시 돈다.
   그래서 다시 열거나 등급을 바꿔도 겹치지 않는다. 움직임 줄이기 설정이면 바로 보인다(위젯 규칙 그대로). */
@media (prefers-reduced-motion:no-preference){
 body.eg-site #mb-panel-desc .mb-widget-reveal.is-playing .mb-reveal-line span{opacity:0;transform:translateY(100%);animation:mb-w3-line-in 1s cubic-bezier(.22,.61,.36,1) forwards;}
 body.eg-site #mb-panel-desc .mb-widget-reveal.is-playing .mb-reveal-line:nth-child(1) span{animation-delay:.2s;}
 body.eg-site #mb-panel-desc .mb-widget-reveal.is-playing .mb-reveal-line:nth-child(2) span{animation-delay:1.2s;}
 body.eg-site #mb-panel-desc .mb-widget-reveal.is-playing .mb-reveal-line:nth-child(3) span{animation-delay:2.2s;}
 body.eg-site #mb-panel-desc .mb-widget-reveal.is-playing .mb-reveal-line:nth-child(4) span{animation-delay:3.2s;}
}
@keyframes mb-w3-line-in{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}

body.eg-site #mb-panel-desc .mb-panel-photo{display:none;}
/* 한 스크롤: 본문 상자(.mb-widget-body)는 max-height:min(80svh,820px)인 안쪽 스크롤 상자였다.
   그래서 상자 아래 끝이 글 가운데를 지나가 글이 잘렸고(아이폰 1·2·3), 쪽 스크롤과 안쪽 스크롤이 겹쳤다.
   실측: 390 상자 675·내용 1441~1858, 1440 상자 720·내용 1643~1996.
   높이 제한을 풀어 칸이 내용만큼 늘고, 쪽 스크롤 하나로 읽게 한다. 고정 높이는 두지 않는다(모든 폭). */
body.eg-site #mb-panel-desc .mb-widget-body{max-height:none;overflow:visible;}
/* 화면 크기에 맞춤: Resident·Member·Club 칸의 세로 사진(916×1717)이 1440에서 582×1091로 화면(900)보다 컸다.
   위젯 CSS가 의도한 '.mb-widget-desc figure.rf-grade-photo' 규칙을 실제 칸(id="mb-widget-desc")에 건다.
   그 규칙은 class 이름이 달라 걸리지 않고 있었다. 높이는 화면의 50% 안에서 가운데 기준으로 채운다.
   Founder 상자 안 사진(.fg-founder-stage>figure)은 바로 아래 자식이 아니라 건드리지 않는다. */
body.eg-site #mb-widget-desc>figure.rf-grade-photo{margin:0 0 16px;border-radius:10px;overflow:hidden;}
body.eg-site #mb-widget-desc>figure.rf-grade-photo img{display:block;width:100%;height:auto;max-height:50vh;object-fit:cover;}
/* 아이폰 1·7: 칸 제목의 영문(.om-en)이 한글 바로 뒤에 붙어 흘렀다('멤버Estate', '클럽 멤버Club Member').
   본문 원본은 .rf-grade .om-en{display:block}을 받는다. 칸에는 섹션 안쪽만 복제돼 그 조상이 없다.
   위젯 CSS의 .mb-widget-desc .om-en 규칙도 이름이 달라 걸리지 않았다. 그 규칙대로 영문만 한글 아래 줄로 내린다. */
body.eg-site #mb-widget-desc h2 .om-en{display:block;margin-top:6px;font-size:12px;letter-spacing:.06em;opacity:.7;}
/* 아이폰 6: 접힌 카드 'EXPIRY' 칸은 라벨 폭(390에서 36px)만큼인데 점선은 48px라 오른쪽으로 12px 넘쳤다.
   그래서 오른쪽 여백이 7.1px, 왼쪽은 19px였다(768은 15.2/27.1, 1440은 26.3/31).
   오른쪽 칸만 끝 맞춤으로 바꿔 점선 오른끝을 카드 안쪽 여백선에 맞춘다. 라벨 자리는 그대로다. */
body.eg-site #main .mb-card-stack .mb-card .mb-card-field:last-child{align-items:flex-end;}

/* ── 2단계 덧붙임(아이폰 흐름 확인 중 발견) ──
   한 스크롤로 Founder 혜택 표가 다 보이게 되자, 390에서 'TROON EXECUTIVE CARD'가 'EXECUTI / VE CARD'로 끊겨 보였다.
   adapter.css의 좁은 폭 규칙이 표 제목 칸을 56px로 줄이는데, 13px 'EXECUTIVE'(약 63px)가 들어가지 않아서다.
   펼친 칸 안 Founder 표만 PC와 같은 68px로 둔다. 1440은 원래 68px이라 그대로다(글자 변경 0). */
body.eg-site #mb-panel-desc .mb-widget-body .fg-founder-stage .mb-facts>div{grid-template-columns:68px 1fr;}

@media (prefers-reduced-motion:no-preference){
 body.eg-site #mb-panel-desc.is-closing{opacity:0;transform:translateX(12px);transition:opacity .35s ease,transform .35s ease;pointer-events:none;}
}

body.eg-site #mb-panel-desc .vol5-tier-benefits{padding:8px 40px 32px;}
body.eg-site #mb-panel-desc .vol5-tier-benefits h3{font-size:18px;margin:0 0 4px;}
body.eg-site #mb-panel-desc .vol5-tier-benefits .mb-facts{margin-top:12px;}
body.eg-site #mb-panel-desc .vol5-tier-benefits .mb-facts>div{grid-template-columns:10em 1fr;gap:24px;padding:12px 0;}
body.eg-site #mb-panel-desc .vol5-tier-benefits .mb-facts dt{font-size:14px;line-height:1.6;}
body.eg-site #mb-panel-desc .vol5-tier-benefits .mb-facts dd{font-size:15px;line-height:1.7;}
@media (max-width:700px){
 body.eg-site #mb-panel-desc .vol5-tier-benefits{padding:4px 20px 24px;}
 body.eg-site #mb-panel-desc .vol5-tier-benefits .mb-facts>div{grid-template-columns:1fr;gap:2px;padding:10px 0;}
 body.eg-site #mb-panel-desc .vol5-tier-benefits .mb-facts dd{font-size:14px;}
}
