/* 4Q 123 / launch-banner editorial visual refinement only.
   Scoped to the exact current launch title. No data or route changes. */
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) {
  min-height: 164px;
  max-height: none;
  padding: 21px 32px;
  background: linear-gradient(108deg,#fffdf9 0%,#fcf7f6 40%,#f4e0e6 100%);
  border: 0;
  isolation:isolate;
  position:relative;
  align-items:center;
  box-sizing:border-box;
}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image)::after {
  content:"";
  position:absolute;
  right:7%;top:9%;bottom:9%;width:28%;
  background: url('/assets/brand-q-ribbon.webp') no-repeat center / contain;
  opacity:.19;pointer-events:none;z-index:0;
}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy {
  position:relative;z-index:1;display:flex;align-items:center;
  justify-content:flex-start;gap:0;padding:0;inset:auto;
}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy > div {max-width:71%;min-width:0;}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy > div::before {
  content:"4Q OFFICIAL OPEN";display:block;margin-bottom:9px;
  color:#a45676;font:800 10px/1.3 "DM Sans",sans-serif;letter-spacing:.16em;
}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-title {
  font-size:clamp(25px,2.6vw,29px);line-height:1.22;
  margin-bottom:9px;letter-spacing:-.055em;color:#36232d;font-weight:850;
}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) p {
  font-size:13px;line-height:1.65;color:#66545d;max-width:600px;
}
/* The existing whole-card click behavior remains unchanged.
   Visual CTA is decoration only; no nested button/link. */
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy > div::after {
  content:"첫 이야기 남기기  →";display:table;
  margin-top:14px;padding:12px 18px;min-height:44px;box-sizing:border-box;
  border-radius:10px;background:#683249;color:#fff;
  font:800 13px/20px "Noto Sans KR",sans-serif;
}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image):hover .promo-copy > div::after {background:#54243a;}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:focus-visible {outline:3px solid #8d4161;outline-offset:-4px;}
@media(max-width:750px) {
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) {
    min-height:190px;max-height:none;padding:20px 19px 30px;
  }
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image)::after {
    right:2%;top:16%;bottom:6%;width:40%;opacity:.12;
  }
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy > div {max-width:100%;padding-right:0;}
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-title {font-size:22px;margin-bottom:7px;}
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) p {font-size:12px;line-height:1.55;max-width:85%;}
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy > div::after {margin-top:12px;min-height:44px;}
}
@media(max-width:390px){
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) {min-height:210px;max-height:none;padding:19px 18px 38px;}
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) p {max-width:92%;}
}

/* 4Q BUILD 123 — compact launch carousel slide (R3).
   Replaces R2 visual-only CSS; preserves carousel track and click routing. */
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) {
  min-height: 120px;
  max-height: 148px;
  padding: 14px 25px;
  background: linear-gradient(108deg,#fffdfa 0%,#fcf7f6 47%,#f4e1e8 100%);
  align-items: center;
}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image)::after {
  right: 8%; top: 12%; bottom: 12%; width: 20%; opacity: .13;
}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy {align-items:center}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy > div {max-width:76%}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy > div::before {
  content:"4Q OFFICIAL OPEN";margin-bottom:5px;font-size:9px;letter-spacing:.13em;
}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-title {
  font-size:clamp(18px,1.85vw,22px);line-height:1.22;margin-bottom:5px;
}
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) p {
  font-size:11px;line-height:1.5;max-width:560px;
}
/* R2 added a decorative fake CTA; remove it entirely. */
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy > div::after {
  content:none!important;display:none!important;
}
/* Any actual CTA remains part of the whole-slide click, but is not shown. */
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-action,
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy > div > a,
#home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy > div > button {display:none!important}
@media(max-width:750px) {
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) {
    min-height:132px;max-height:160px;padding:16px 18px;
  }
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image)::after {
    right:3%;top:18%;bottom:12%;width:32%;opacity:.09;
  }
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-copy > div {max-width:100%}
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) .promo-title {font-size:18px;margin-bottom:5px}
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) p {font-size:11px;line-height:1.45;max-width:82%}
}
@media(max-width:390px) {
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) {
    min-height:140px;max-height:160px;padding:15px 17px;
  }
  #home #promo-carousel .promo-item[aria-label="4Q, 이제 시작합니다."]:not(.has-image) p {max-width:90%}
}