/* ②-추가: 간판만 바뀌는 그림 + 본사 대표 방문 컨설팅 (2차 시안 블록 재사용) */
.s02b {
  --s02b-cream: #fbf3d6;
  background: linear-gradient(180deg, var(--s02b-cream), var(--c-cream-2));
  padding: clamp(48px, 5vw, 96px) 0 clamp(56px, 5.5vw, 110px);
  color: var(--c-ink);
}
.s02b .s02b-in { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(28px, 4vw, 72px); align-items: center; max-width: 1360px; }
.s02b .s02b-shops { margin: 0; display: grid; grid-template-columns: 1fr clamp(40px, 4vw, 70px) 1fr; align-items: end; gap: clamp(8px, 1vw, 18px); }
.s02b .s02b-shop { position: relative; background: #2b2e2a; border: 2px solid #3c403a; border-radius: 10px 10px 4px 4px; padding: 0 0 12px; text-align: center; box-shadow: 0 14px 30px rgba(40, 30, 10, .18); }
.s02b .s02b-shop .roof { height: clamp(10px, 1vw, 16px); background: #1b1d1a; border-radius: 8px 8px 0 0; }
.s02b .s02b-shop .sign { height: clamp(58px, 6vw, 104px); margin: 8px 10px 0; display: grid; place-items: center; border-radius: 6px; font-family: var(--f-display); font-weight: 900; font-size: clamp(20px, 2vw, 36px); }
.s02b .s02b-shop .sign img { height: clamp(46px, 4.8vw, 86px); max-width: 92%; object-fit: contain; width: auto; filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .35)); }
.s02b .s02b-shop .win { height: clamp(78px, 8vw, 150px); margin: 10px 10px 0; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: 1fr 1fr; gap: 4px; }
.s02b .s02b-shop .win i { display: block; border-radius: 2px; background: #3d413b; }
.s02b .s02b-shop .door { height: clamp(36px, 3.4vw, 64px); width: 30%; margin: 6px auto 0; background: #22241f; border: 2px solid #474b44; border-bottom: 0; }
.s02b .s02b-shop .cap { margin-top: 10px; font-size: clamp(14px, 1.05vw, 18px); font-weight: 700; color: #d6dad1; }
.s02b .before .sign { background: #5f645c; color: #d6d9d1; text-decoration: line-through; text-decoration-thickness: 3px; }
.s02b .after { border-color: var(--c-gold); box-shadow: 0 0 0 1px rgba(226, 200, 120, .4), 0 0 34px rgba(226, 200, 120, .45), 0 14px 30px rgba(40, 30, 10, .2); }
.s02b .after .sign { background: linear-gradient(180deg, #f3e8c8, #e2d2a6); }
.s02b .after .win i { background: linear-gradient(180deg, #f9d98a, #c98a2f); animation: s02b-flicker 3.2s ease-in-out infinite; }
.s02b .after .win i:nth-child(2n) { animation-delay: -1.1s; }
.s02b .after .win i:nth-child(3n) { animation-delay: -2.2s; }
.s02b .after .cap { color: var(--c-gold-light); }
@keyframes s02b-flicker { 0%, 100% { filter: brightness(1); } 50% { filter: brightness(1.18); } }
/* 사진판(10-27): 지붕·창문 그림 대신 실제 사진 */
.s02b .s02b-shop.photo { padding: 0 0 10px; overflow: hidden; border-radius: 10px; }
.s02b .s02b-shop.photo .ph { display: block; width: 100%; height: auto; aspect-ratio: 1120 / 800; object-fit: cover; }
.s02b .s02b-shop.before.photo .ph { filter: brightness(.92); }
.s02b .s02b-arrow { align-self: center; display: grid; place-items: center; width: 100%; aspect-ratio: 1; border-radius: 50%; background: var(--c-green); color: #fff; font-weight: 900; font-size: clamp(20px, 2vw, 34px); box-shadow: 0 6px 16px rgba(0, 83, 47, .35); }
.s02b .s02b-arrow span { animation: s02b-nudge 1.6s ease-in-out infinite; }
@keyframes s02b-nudge { 0%, 100% { transform: translateX(-3px); } 50% { transform: translateX(4px); } }

.s02b .s02b-ceo { background: var(--c-green-deep); color: #fff; border-radius: 22px; padding: clamp(22px, 2.4vw, 40px); display: grid; grid-template-columns: clamp(86px, 8vw, 140px) 1fr; gap: clamp(16px, 1.8vw, 30px); align-items: center; box-shadow: 0 18px 40px rgba(2, 47, 27, .25); }
.s02b .s02b-ceo .face { aspect-ratio: 1; border-radius: 50%; border: 2px solid var(--c-gold); display: grid; place-items: center; text-align: center; font-size: clamp(13px, 1vw, 16px); line-height: 1.35; color: var(--c-gold); overflow: hidden; }
.s02b .s02b-ceo .face img { width: 100%; height: 100%; object-fit: cover; }
.s02b .s02b-ceo small { display: block; color: var(--c-gold); font-weight: 700; font-size: clamp(14px, 1.1vw, 19px); }
.s02b .s02b-ceo b { display: block; margin: 6px 0 10px; font-size: clamp(21px, 1.7vw, 32px); line-height: 1.3; }
.s02b .s02b-ceo p { font-size: clamp(14px, 1.05vw, 18px); color: #dde3da; line-height: 1.6; }

@media (max-width: 1024px) {
  .s02b .s02b-in { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .s02b .s02b-shops { grid-template-columns: 1fr 34px 1fr; }
  .s02b .s02b-shop .sign { margin: 6px 6px 0; font-size: 18px; }
  .s02b .s02b-shop .win { margin: 8px 6px 0; }
  .s02b .s02b-shop .cap { font-size: 14px; }
  .s02b .s02b-ceo { grid-template-columns: 80px 1fr; align-items: start; }
  .s02b .s02b-ceo b { font-size: 21px; }
  .s02b .s02b-ceo p { font-size: 14px; }
}
