@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+KR:wght@400;500;600;700&display=swap');

:root { color-scheme: dark; font-family: 'IBM Plex Sans KR', system-ui, sans-serif; background: #09070c; color: #f4e4ce; }
* { box-sizing: border-box; }
body { margin: 0; background: radial-gradient(circle at 50% 0, #3a2118 0, #130d13 32rem, #09070c 72rem); line-height: 1.72; }
a { color: #75dfff; }
.page { width: min(920px, calc(100% - 32px)); margin: 0 auto; padding: 48px 0 80px; }
.hero { overflow: hidden; border: 2px solid #8c5933; background: #171015; box-shadow: 0 22px 70px rgba(0,0,0,.55); }
.hero img { display: block; width: 100%; aspect-ratio: 1.9; object-fit: cover; }
.hero-copy { padding: 28px clamp(22px, 5vw, 54px) 36px; }
.eyebrow { color: #f4bd47; font-size: .85rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
h1, h2, h3 { line-height: 1.25; color: #fff1d4; }
h1 { margin: 8px 0 12px; font-size: clamp(2rem, 6vw, 3.8rem); }
h2 { margin-top: 42px; color: #ffd268; }
h3 { margin-top: 28px; }
p, li { color: #d5c2b4; }
.lead { color: #f0deca; font-size: 1.12rem; }
.cta { display: inline-block; margin-top: 14px; padding: 13px 24px; border: 2px solid #f2b84e; background: #9d5728; color: #fff8dc; font-weight: 700; text-decoration: none; box-shadow: 4px 4px 0 #3a2118; }
.lang { margin-left: 14px; color: #d8c4b2; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; margin: 20px 0; }
.card { padding: 20px; border: 1px solid #60402c; background: rgba(29,19,25,.9); }
.card h3 { margin-top: 0; color: #9eeaff; }
.faq details { margin: 12px 0; padding: 14px 17px; border: 1px solid #523528; background: #171015; }
.faq summary { cursor: pointer; color: #ffe091; font-weight: 700; }
footer { margin-top: 54px; padding-top: 22px; border-top: 1px solid #4f3328; color: #9f8a81; }
@media (max-width: 600px) { .page { padding-top: 16px; } .hero-copy { padding: 22px; } .lang { display: inline-block; margin: 18px 0 0 14px; } }