@font-face {
  font-family: 'Pretendard Variable';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('assets/fonts/PretendardVariable.woff2') format('woff2');
}
@font-face {
  font-family: 'Questrial';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/Questrial.ttf') format('truetype');
}
@font-face {
  font-family: 'Spoqa Han Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/SpoqaHanSansRegular.woff2') format('woff2');
}
@font-face {
  font-family: 'Spoqa Han Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/SpoqaHanSansBold.woff2') format('woff2');
}

:root {
  --night:#14111c; --night2:#0d0b12; --card:#1d1926;
  --amber:#d6a253; --amber2:#e8c889; --amber3:#b9863d;
  --cream:#f5f0e6; --ink:#241f1a; --mut:#756a5e;
  --tin:#f3ede2; --tinmut:rgba(243,237,226,.68); --line:rgba(255,255,255,.1);
}
* { box-sizing:border-box; }
html { background:var(--night2); scroll-behavior:smooth; }
body { margin:0; font:13px/1.65 'Pretendard Variable',Pretendard,-apple-system,'Apple SD Gothic Neo',sans-serif; color:var(--tin); word-break:keep-all; -webkit-font-smoothing:antialiased; }
button,input,textarea { font:inherit; }
button { cursor:pointer; }
button,a,input,textarea { -webkit-tap-highlight-color:transparent; }
button { margin:0; }
img { display:block; max-width:100%; height:auto; }
a { color:inherit; text-decoration:none; }
figure { margin:0; }
h1,h2,h3 { font-family:Questrial,'Spoqa Han Sans','Apple SD Gothic Neo',sans-serif; line-height:1.2; }
b,strong { font-weight:700; }
:focus-visible { outline:3px solid var(--amber); outline-offset:5px; }
.skip-link { position:fixed; top:12px; left:12px; z-index:100; padding:12px 20px; border-radius:8px; color:var(--ink); background:var(--amber2); transform:translateY(-160%); }
.skip-link:focus { transform:none; }
#sbtop,#sbbot { background:var(--night); }
.sb-sec { padding:64px 22px; }
.sb-wrap { max-width:680px; margin:0 auto; }
.sb-eye { display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:800; letter-spacing:.12em; color:var(--amber); margin-bottom:14px; }
.sb-eye::before { content:''; width:7px; height:7px; border-radius:50%; background:currentColor; }
.sb-h2 { font-size:clamp(24px,5.2vw,33px); font-weight:800; line-height:1.4; letter-spacing:-.02em; margin:0; }
.sb-amber { color:var(--amber2); }
.section-desc { font-size:clamp(15px,3.2vw,17px); line-height:1.8; color:var(--tinmut); margin:18px 0 0; }
.sb-cta,.sb-outline,.sb-ghost { display:inline-flex; align-items:center; justify-content:center; gap:10px; font-size:15px; font-weight:800; padding:16px 28px; border-radius:99px; line-height:1.65; transition:transform .2s ease-out; }
.sb-cta { color:#241406; background:linear-gradient(120deg,var(--amber3),var(--amber2)); border:1px solid transparent; box-shadow:0 14px 34px -12px rgba(214,162,83,.55); }
.sb-cta:hover,.sb-outline:hover,.sb-ghost:hover { transform:translateY(-2px); }
.sb-outline,.sb-ghost { color:var(--tin); background:rgba(255,255,255,.06); border:1px solid rgba(232,200,137,.4); }
.sb-btns { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }
.sb-rv { opacity:1; transform:none; }
.js-motion .sb-rv { opacity:0; transform:translateY(26px); transition:opacity .7s ease-out,transform .7s ease-out; }
.js-motion .sb-rv.in { opacity:1; transform:none; }
.js-motion .sb-rv.d1 { transition-delay:.1s; }
.js-motion .sb-rv.d2 { transition-delay:.2s; }

.sb-hero { position:relative; overflow:hidden; text-align:center; padding:80px 24px 72px; color:#fff; background:linear-gradient(180deg,rgba(13,11,18,.4),rgba(13,11,18,.68) 55%,var(--night2)),url('generated-images/hero-poster-v2.png') center/cover; }
.sb-hero .in { position:relative; z-index:2; max-width:680px; margin:0 auto; }
.brand-logo { width:156px; height:auto; margin:0 auto; }
.sb-hero .logo { margin:0 0 26px; }
.hero-brand-name { font-family:Gulim,'굴림',AppleGothic,'Apple SD Gothic Neo',sans-serif; font-size:32px; font-weight:400; letter-spacing:.04em; line-height:1.3; }
.hero-brand-english { margin-top:8px; font-size:11.5px; letter-spacing:.18em; color:var(--amber2); }
.sb-hero .sub { color:var(--amber2); font-size:13px; font-weight:700; letter-spacing:.04em; margin-bottom:22px; }
.sb-hero h1 { font-size:clamp(38px,8vw,62px); font-weight:800; line-height:1.25; letter-spacing:-.035em; margin:0 0 22px; }
.sb-hero p { font-size:clamp(16px,3.4vw,19px); color:rgba(243,237,226,.9); line-height:1.7; margin:0; }
.sb-chips { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:26px 0 30px; }
.sb-chips span { font-size:12px; font-weight:700; background:rgba(255,255,255,.08); border:1px solid rgba(232,200,137,.3); border-radius:99px; padding:8px 13px; }
.hero-bottom { margin-top:32px; font-size:10px; letter-spacing:.18em; color:rgba(243,237,226,.5); }
.sb-hero .orb { position:absolute; border-radius:50%; filter:blur(64px); opacity:.4; z-index:0; animation:float 12s ease-in-out infinite paused; pointer-events:none; }
.sb-hero.is-visible .orb { animation-play-state:running; }
.sb-hero .orb.a { width:300px; height:300px; left:-70px; top:40px; background:radial-gradient(circle,rgba(214,162,83,.4),transparent 70%); }
.sb-hero .orb.b { width:260px; height:260px; right:-60px; bottom:-10px; background:radial-gradient(circle,rgba(232,200,137,.25),transparent 70%); animation-delay:-6s; }
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-24px)} }

.sb-insight { text-align:center; }
.sb-insight p { font-size:clamp(15px,3.2vw,17px); color:var(--tinmut); line-height:1.8; margin:18px 0 0; }
.service-pair { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:30px; text-align:left; }
.service-pair a { position:relative; display:flex; flex-direction:column; gap:8px; padding:24px 22px; border:1px solid rgba(232,200,137,.25); border-radius:16px; background:var(--card); }
.service-pair strong { font-size:17px; color:#fff; }
.service-pair a > span:not(.service-tag):not(.service-arrow) { font-size:13px; color:var(--tinmut); }
.service-tag { display:block; font-size:10.5px; font-weight:800; letter-spacing:.09em; color:var(--amber); }
.service-arrow { position:absolute; top:20px; right:20px; font-size:20px; color:var(--amber2); }
.sb-day { text-align:center; background:var(--cream); color:var(--ink); }
.sb-day .sb-eye { color:var(--amber3); }
.day-accent { color:#a67432; }
.sb-day .section-desc { color:var(--mut); }
.scene { margin-top:28px; }
.scene img { width:100%; border-radius:18px; }
.scene figcaption { margin-top:12px; font-size:11px; letter-spacing:.03em; color:var(--tinmut); }
.sb-day .scene figcaption { color:var(--mut); }
.sb-inc4 { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:24px; }
.sb-inc4 .c { background:#fff; border:1px solid rgba(0,0,0,.09); border-radius:14px; padding:22px 16px; }
.sb-inc4 .ic { font-size:25px; margin-bottom:10px; }
.sb-inc4 h3 { font-size:14.5px; font-weight:800; color:var(--ink); margin:0; }
.sb-inc4 p { font-size:12px; color:var(--mut); margin:7px 0 0; line-height:1.6; }
.service-summary { text-align:center; margin-top:28px; }
.service-summary p { margin:0 0 20px; font-size:16px; line-height:1.8; }
.service-summary small { display:block; font-size:11.5px; color:var(--tinmut); margin-top:16px; }
.sb-day .service-summary small { color:var(--mut); }
.day-brand-logo { width:132px; margin:0 auto 22px; border-radius:12px; }
.sb-night { text-align:center; }
.sb-grid3 { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.sb-pill { flex:1 1 28%; min-width:150px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:24px 14px; text-align:center; }
.sb-pill .ic { font-size:24px; margin-bottom:8px; }
.sb-pill h3 { font-size:14.5px; font-weight:800; color:#fff; margin:0; }
.sb-pill p { font-size:12px; color:var(--tinmut); margin:6px 0 0; }
.sb-quote { background:var(--card); border:1px solid rgba(232,200,137,.28); border-radius:16px; padding:24px 22px; margin-top:14px; }
.sb-quote p { font-size:clamp(16px,3.6vw,19px); font-weight:800; line-height:1.6; color:#fff; margin:0; }
.sb-inc { background:var(--cream); text-align:center; color:var(--ink); }
.sb-inc .sb-eye { color:var(--amber3); }
.sb-inc .section-desc { color:var(--mut); }
.sb-inc img.lead { width:100%; border-radius:18px; margin-top:28px; }
.sb-drink { background:#fff; border:1px solid rgba(0,0,0,.1); border-radius:18px; padding:28px 22px; margin-top:14px; text-align:left; }
.sb-drink .lab { font-size:12px; font-weight:800; letter-spacing:.08em; color:#99692c; }
.sb-drink h3 { font-size:clamp(18px,4vw,22px); font-weight:800; color:var(--ink); margin:8px 0 8px; }
.sb-drink .desc { font-size:13px; color:var(--mut); margin:0; line-height:1.75; }
.sb-axis { display:flex; justify-content:space-between; font-size:11px; font-weight:800; color:#99692c; margin:20px 2px 8px; }
.sb-cards { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.sb-cards .cc { min-width:0; background:#faf5ec; border:1px solid rgba(185,134,61,.25); border-radius:12px; overflow:hidden; }
.sb-cards .cc img { width:100%; aspect-ratio:1; object-fit:cover; }
.sb-cards .pad { padding:14px; }
.sb-cards .q { font-size:10.5px; font-weight:800; color:#99692c; }
.sb-cards .nm { font-size:15.5px; font-weight:800; color:var(--ink); margin-top:4px; }
.sb-cards .dt { font-size:12px; color:var(--mut); margin-top:4px; line-height:1.5; }
.sb-note { font-size:11px; color:var(--mut); margin:14px 0 0; line-height:1.7; }
.sb-pick { background:var(--night2); text-align:center; }
.sb-pick h2 { font-size:clamp(24px,5.4vw,32px); font-weight:800; color:#fff; margin:0; line-height:1.4; }
.sb-pick > .sb-wrap > .sb-rv p { font-size:15px; color:var(--tinmut); margin:16px 0 0; line-height:1.8; }
.application-cards { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:30px; }
.application-cards article { display:flex; flex-direction:column; align-items:flex-start; text-align:left; background:var(--card); border:1px solid rgba(232,200,137,.24); border-radius:18px; padding:28px 22px; }
.application-cards h3 { font-size:21px; font-weight:800; margin:12px 0; }
.application-cards p { font-size:13px; line-height:1.8; color:var(--tinmut); margin:0 0 24px; }
.application-cards .sb-cta { margin-top:auto; width:100%; padding:13px 18px; font-size:14px; }
.sb-gal { background:var(--night2); text-align:center; }
.sb-gal .grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:28px; }
.sb-gal .it { min-width:0; }
.sb-gal .grid img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:12px; }
.sb-gal figcaption { font-size:12px; color:var(--tinmut); margin-top:12px; }
.concept-note { font-size:10.5px; color:var(--tinmut); margin:24px 0 0; line-height:1.7; }
.sb-faq { background:var(--cream); color:var(--ink); }
.sb-faq .sb-rv:first-child { text-align:center; }
.sb-faq .sb-eye { color:var(--amber3); }
.sb-faq .list { display:flex; flex-direction:column; gap:10px; margin-top:28px; }
.sb-faq details { background:#fff; border:1px solid rgba(0,0,0,.1); border-radius:14px; overflow:hidden; }
.sb-faq summary { display:flex; align-items:center; justify-content:space-between; gap:12px; list-style:none; cursor:pointer; padding:18px 22px; font-size:14px; font-weight:800; color:var(--ink); }
.sb-faq summary::-webkit-details-marker { display:none; }
.sb-faq .ar { color:#99692c; flex:0 0 auto; }
.sb-faq p { font-size:13.5px; color:#4d453d; margin:0; padding:0 22px 20px; line-height:1.8; }
.sb-cta-sec { position:relative; text-align:center; color:#fff; padding:76px 24px 112px; background:linear-gradient(180deg,rgba(13,11,18,.74),rgba(13,11,18,.64) 45%,rgba(13,11,18,.94)),url('generated-images/hero.png') center/cover; }
.sb-cta-sec h2 { font-size:clamp(24px,5vw,32px); font-weight:800; line-height:1.5; margin:0; }
.sb-cta-sec .brand { margin-top:22px; }
.sb-cta-sec .brand-logo { width:144px; }
.closing-desc { font-size:13px; color:var(--tinmut); margin:14px 0 26px; }
#day,#night,#services,#sb-list { scroll-margin-top:20px; }
#sb-sticky { position:fixed; left:0; right:0; bottom:0; z-index:90; transform:translateY(130%); transition:transform .2s ease-out; background:rgba(20,16,22,.96); border-top:1px solid rgba(232,200,137,.2); padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px)); }
#sb-sticky.show { transform:translateY(0); }
#sb-sticky .in { max-width:680px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:12px; }
#sb-sticky .t { font-size:16px; font-weight:800; color:#fff; }
#sb-sticky small { display:block; font-size:10px; color:var(--amber2); font-weight:500; margin-top:2px; }
.sticky-actions { display:flex; gap:8px; }
.sticky-actions button { font-size:13px; font-weight:800; padding:12px 20px; border-radius:99px; white-space:nowrap; line-height:1.5; }
.sticky-primary { color:#241406; background:linear-gradient(120deg,var(--amber3),var(--amber2)); border:1px solid transparent; }
.sticky-secondary { color:var(--amber2); background:transparent; border:1px solid rgba(232,200,137,.5); }
.application-dialog { width:min(460px,calc(100% - 28px)); max-height:90dvh; padding:30px 28px 24px; border:1px solid rgba(232,200,137,.3); border-radius:20px; background:var(--cream); color:var(--ink); overscroll-behavior:contain; }
.application-dialog::backdrop { background:rgba(8,6,12,.8); }
body:has(dialog[open]) { overflow:hidden; }
.application-dialog form { position:relative; }
.dialog-close { position:absolute; top:-18px; right:-16px; width:44px; height:44px; border:0; background:transparent; color:var(--ink); font-size:28px; line-height:1; }
.application-dialog .service-tag { color:#99692c; margin:4px 30px 0 0; }
.application-dialog h2 { font-size:25px; font-weight:800; margin:12px 0 10px; }
.dialog-description { color:var(--mut); font-size:12.5px; margin:0 0 24px; line-height:1.7; }
.application-dialog label { display:flex; flex-direction:column; gap:7px; font-size:12px; font-weight:700; margin-bottom:14px; }
.application-dialog input,.application-dialog textarea { display:block; width:100%; min-width:0; border:1px solid #ddd4c7; background:#fff; color:var(--ink); border-radius:9px; padding:12px; font-size:15px; font-weight:400; }
.application-dialog textarea { resize:vertical; }
.form-row { display:grid; grid-template-columns:1.3fr 1fr; gap:10px; }
.application-submit { width:100%; border:0; border-radius:99px; padding:14px; margin-top:4px; background:var(--amber2); color:#6b5637; font-weight:800; cursor:default; }
.preview-note { font-size:11px; line-height:1.7; text-align:center; color:var(--mut); margin:14px 0 0; }
@media (max-width:560px) {
  .sb-hero { padding:56px 22px 56px; }
  .brand-logo { width:138px; }
  .sb-hero .sub { font-size:12px; }
  .hero-actions { flex-direction:column; align-items:center; }
  .hero-actions a { width:100%; max-width:290px; }
  .sb-chips { gap:6px; }
  .sb-chips span { font-size:10.5px; padding:7px 10px; }
  .hero-bottom { font-size:8.5px; letter-spacing:.12em; }
  .service-pair,.application-cards { grid-template-columns:1fr; }
  .sb-pill { flex:1 1 100%; display:grid; grid-template-columns:42px 1fr; column-gap:10px; text-align:left; padding:18px 20px; }
  .sb-pill .ic { grid-row:1/3; margin:0; align-self:center; }
  .sb-pill h3 { align-self:end; }
  .sb-pill p { grid-column:2; margin-top:4px; }
  .sb-gal .grid { gap:8px; }
  .sb-gal figcaption { font-size:10px; }
  #sb-sticky .t { display:none; }
  .sticky-actions { width:100%; }
  .sticky-actions button { flex:1; padding:12px 10px; font-size:12.5px; }
  .sb-cta-sec .sb-btns { flex-direction:column; }
}
@media (max-width:360px) {
  .sb-sec { padding-inline:18px; }
  .sb-inc4 { gap:8px; }
  .sb-inc4 .c { padding:18px 10px; }
  .sb-inc4 h3 { font-size:13px; }
  .sb-inc4 p { font-size:11px; }
  .sb-drink { padding:24px 16px; }
  .sb-cards .pad { padding:10px; }
  .application-dialog { padding-inline:20px; }
  .application-dialog h2 { font-size:22px; }
  .form-row { grid-template-columns:1fr; gap:0; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .js-motion .sb-rv { opacity:1; transform:none; }
}