/* Brand entrance only. Home layout is unchanged when the layer closes. */
.db-intro { display: none; }
html.db-intro-pending { overflow: hidden; }
html.db-intro-pending .db-intro { display: grid; }
.db-intro { position: fixed; inset: 0; z-index: 10000; place-items: center; overflow: hidden; background: #1d1f21; color: #f4eedf; isolation: isolate; }
.db-intro::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 50% 48%,rgba(201,163,90,.055),transparent 55%); }
.db-intro__lockup { display: flex; align-items: center; gap: clamp(8px,2vw,26px); width: max-content; max-width: calc(100vw - 32px); position: relative; }
.db-intro__pig { display: block; flex: 0 0 auto; width: clamp(56px,10vw,150px); height: auto; object-fit: contain; opacity: 0; will-change: transform,opacity; }
.db-intro__name { display: flex; align-items: center; gap: clamp(5px,.9vw,14px); color: #fff; font-family: 'Do Hyeon', 'Pretendard Variable', sans-serif; font-size: clamp(18px,5.2vw,58px); font-weight: 400; letter-spacing: -.025em; line-height: 1.15; white-space: nowrap; opacity: 0; will-change: transform,opacity,clip-path; }
.db-intro__brand, .db-intro__detail, .db-intro__lower, .db-intro__food { display: block; }
.db-intro__detail { display: flex; flex-direction: column; align-items: flex-end; }
.db-intro__since { display: block; font-size: clamp(11px,.34em,22px); line-height: 1.1; letter-spacing: 0; }
.db-intro__lower { display: flex; align-items: baseline; gap: clamp(3px,.5vw,8px); }
.db-intro__branch { display: block; font-family: 'Pretendard Variable', sans-serif; font-size: clamp(11px,.29em,18px); font-weight: 400; letter-spacing: -.03em; }
/* Reference: warm peach at the top, soft pink at the bottom. */
@supports (-webkit-background-clip: text) {
  .db-intro__branch {
    background: linear-gradient(180deg,#ffc08a 0%,#fbaa82 48%,#ff80a4 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}
/* Korean homepage header wordmark; the first-visit intro above is independent. */
body .site-header .brandmark strong:has(.db-header-brand) { display: inline-flex; align-items: baseline; gap: .22em; white-space: nowrap; }
body .site-header .brandmark strong > :is(.db-header-brand,.db-header-food,.db-header-branch) { display: inline-block; flex: none; white-space: nowrap; }
body .site-header .brandmark strong .db-header-brand { font-size: 1em; color: #fff !important; }
body .site-header .brandmark strong .db-header-food { font-size: .76em; color: #fff !important; }
body .site-header .brandmark .db-header-branch { font-family: 'Pretendard Variable',sans-serif; font-size: clamp(9px,.4em,16px); font-weight: 400; letter-spacing: -.03em; color: #ffc08a; }
@supports (-webkit-background-clip: text) {
  body .site-header .brandmark .db-header-branch { background: linear-gradient(180deg,#ffc08a 0%,#fbaa82 48%,#ff80a4 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
}
@media (max-width: 480px) and (min-width: 360px) {
  body .site-header .brandmark strong:has(.db-header-brand) { font-size: 16px !important; gap: .18em; }
  body .site-header .brandmark .db-header-food { font-size: .78em; }
}
@media (max-width: 359px) {
  body .site-header .brandmark strong:has(.db-header-brand) { display: flex; flex-wrap: wrap; width: 102px; gap: 0 3px; font-size: 13px !important; line-height: 1.08; }
  body .site-header .brandmark strong .db-header-brand { width: 100%; }
  body .site-header .brandmark strong .db-header-food { font-size: 10px; }
  body .site-header .brandmark .db-header-branch { font-size: 8px; }
}
.db-intro__skip { position: absolute; bottom: max(30px,env(safe-area-inset-bottom)); right: max(32px,env(safe-area-inset-right)); display: inline-flex; align-items: center; gap: 18px; border: 0; border-bottom: 1px solid #776441; border-radius: 0; padding: 10px 0; background: transparent; color: #c6bfaf; font: 12px/1.5 var(--don-font-body, sans-serif); cursor: pointer; }

.db-intro__skip:hover { color: #f4eedf; }
.db-intro__skip:focus-visible { outline: 2px solid #d8b46a; outline-offset: 6px; }
@media(max-width:480px) { .db-intro__skip { right: 22px; bottom: 24px; } }
@media(prefers-reduced-motion:reduce) { html.db-intro-pending { overflow: auto; } html.db-intro-pending .db-intro { display: none; } }
