*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Pretendard,"Noto Sans KR",Arial,sans-serif;color:#1f2937;background:#fff;line-height:1.6}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
.container{width:min(1180px,calc(100% - 36px));margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid #edf1f7}
.header-inner{height:76px;display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;gap:9px;white-space:nowrap}
.brand-mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#3b82f6,#7dd3fc);display:grid;place-items:center;color:#fff;font-weight:900}
.brand strong{font-size:24px;color:#111827}
.brand strong span{color:#2563eb}
.desktop-nav{display:flex;gap:22px;font-weight:700;font-size:14px;flex:1;justify-content:center}
.desktop-nav a{transition:.2s}
.desktop-nav a:hover,.desktop-nav .active{color:#2563eb}
.header-search{display:flex;border:1px solid #dbe2eb;border-radius:10px;overflow:hidden;width:210px;background:#fff}
.header-search input{border:0;outline:0;padding:10px 12px;min-width:0;width:100%}
.header-search button{border:0;background:#fff;padding:0 12px;cursor:pointer;color:#2563eb;font-size:22px}
.menu-button{display:none;border:0;background:transparent;font-size:25px;cursor:pointer}
.mobile-menu{display:grid;background:#fff;border-top:1px solid #edf1f7;padding:12px 18px}
.mobile-menu a{padding:12px 6px;border-bottom:1px solid #f1f3f6;font-weight:700}
.hero{background:linear-gradient(90deg,#dcecff 0%,#eff7ff 50%,#fff 100%);overflow:hidden}
.hero-grid{min-height:520px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center}
.hero-copy{padding:66px 0}
.eyebrow{font-weight:800;color:#2563eb;margin:0 0 14px}
.hero h1{font-size:51px;line-height:1.18;margin:0 0 20px;color:#111827}
.hero h1 span{color:#2563eb}
.hero-desc{font-size:19px;color:#4b5563}
.hero-search{display:flex;max-width:560px;margin-top:30px;box-shadow:0 12px 28px rgba(37,99,235,.12)}
.hero-search input{flex:1;border:0;border-radius:12px 0 0 12px;padding:17px 18px;outline:0}
.hero-search button{border:0;background:#2563eb;color:#fff;padding:0 25px;border-radius:0 12px 12px 0;font-weight:900;cursor:pointer}
.popular-tags{display:flex;gap:13px;flex-wrap:wrap;margin-top:18px;font-size:14px}
.popular-tags span{font-weight:800;color:#6b7280}
.popular-tags a{color:#2563eb;font-weight:700}
.hero-visual{height:520px}
.hero-visual img{width:100%;height:100%;object-fit:cover;object-position:center}
.quick-categories{margin-top:-48px;position:relative;z-index:3}
.quick-grid{background:#fff;border-radius:20px;box-shadow:0 18px 44px rgba(31,41,55,.12);display:grid;grid-template-columns:repeat(8,1fr);padding:24px 20px}
.quick-grid a{text-align:center;padding:10px 8px}
.quick-grid span{width:58px;height:58px;border-radius:50%;margin:0 auto 10px;display:grid;place-items:center;font-size:25px;background:#eff6ff;color:#2563eb}
.quick-grid a:nth-child(3) span{background:#fff0f6;color:#ec4899}
.quick-grid a:nth-child(4) span{background:#fff7e8;color:#f59e0b}
.quick-grid a:nth-child(6) span{background:#ecfdf3;color:#22c55e}
.quick-grid a:nth-child(8) span{background:#fff7e8;color:#f59e0b}
.quick-grid strong{display:block;font-size:14px}
.section{padding:70px 0}
.soft{background:#f8fbff}
.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}
.section-heading p{margin:0;color:#2563eb;font-weight:800}
.section-heading h2{margin:5px 0 0;font-size:32px;color:#111827}
.slider-buttons{display:flex;gap:8px}
.slider-buttons button{width:38px;height:38px;border:1px solid #d9e2ec;background:#fff;border-radius:50%;font-size:23px;cursor:pointer}
.content-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.content-card{border:1px solid #e5eaf0;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 8px 26px rgba(31,41,55,.05)}
.content-card img{width:100%;height:180px;object-fit:cover}
.card-body{padding:18px}
.category{display:inline-block;padding:4px 9px;border-radius:999px;font-size:12px;font-weight:900;color:#fff}
.category.health{background:#2563eb}
.category.insurance{background:#6366f1}
.category.wedding{background:#ec4899}
.category.finance{background:#16a34a}
.card-body h3{font-size:19px;line-height:1.45;margin:12px 0 8px;color:#111827}
.card-body p{font-size:14px;color:#6b7280;margin:0 0 14px}
.card-body time{font-size:12px;color:#9ca3af}
.category-board{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.category-board article{border:1px solid #e3eaf2;border-radius:16px;padding:23px;background:#fff;display:grid;gap:8px;min-height:190px}
.category-board article:nth-child(1){background:linear-gradient(135deg,#f0fdf4,#fff)}
.category-board article:nth-child(2){background:linear-gradient(135deg,#eff6ff,#fff)}
.category-board article:nth-child(3){background:linear-gradient(135deg,#fff1f6,#fff)}
.category-board article:nth-child(4){background:linear-gradient(135deg,#effcf4,#fff)}
.category-board article:nth-child(5){background:linear-gradient(135deg,#fff1f3,#fff)}
.category-board article:nth-child(6){background:linear-gradient(135deg,#eff6ff,#fff)}
.category-board article:nth-child(7){background:linear-gradient(135deg,#eef6ff,#fff)}
.category-board article:nth-child(8){background:linear-gradient(135deg,#fff8eb,#fff)}
.board-title{display:flex;justify-content:space-between;align-items:center}
.board-title h3{margin:0;font-size:22px}
.board-title span{font-size:28px}
.category-board a{font-size:14px;color:#4b5563}
.category-board a:hover{color:#2563eb}
.newsletter{padding-top:20px}
.newsletter-inner{background:linear-gradient(135deg,#f0f6ff,#eef1ff);border:1px solid #dce7f7;border-radius:18px;padding:30px 34px;display:grid;grid-template-columns:1fr 430px 210px;align-items:center;gap:24px}
.newsletter-label{color:#2563eb;font-weight:900;margin:0}
.newsletter-inner h2{margin:6px 0;font-size:28px}
.newsletter-inner p{color:#6b7280}
.newsletter-inner form{display:flex}
.newsletter-inner input{flex:1;border:1px solid #d6deea;border-radius:10px 0 0 10px;padding:14px;outline:0}
.newsletter-inner button{border:0;background:#2563eb;color:#fff;border-radius:0 10px 10px 0;padding:0 20px;font-weight:900}
.newsletter-inner img{height:150px;width:210px;object-fit:cover;border-radius:16px}
footer{border-top:1px solid #e5eaf0;padding:52px 0 26px;background:#fff}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:34px}
.footer-grid h3{margin-top:0;font-size:15px;color:#111827}
.footer-grid>div:not(.footer-brand){display:grid;align-content:start;gap:9px;font-size:13px;color:#6b7280}
.footer-brand p{font-size:13px;color:#6b7280;max-width:260px}
.copyright{border-top:1px solid #e5eaf0;margin-top:34px;padding-top:22px;text-align:center;color:#9ca3af;font-size:12px}
@media(max-width:1050px){
  .desktop-nav{display:none}
  .menu-button{display:block}
  .header-search{margin-left:auto}
  .quick-grid{grid-template-columns:repeat(4,1fr)}
  .content-grid{grid-template-columns:repeat(2,1fr)}
  .category-board{grid-template-columns:repeat(2,1fr)}
  .newsletter-inner{grid-template-columns:1fr 1fr}
  .newsletter-inner img{display:none}
  .footer-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:720px){
  .container{width:min(100% - 24px,1180px)}
  .header-inner{height:68px}
  .brand strong{font-size:20px}
  .header-search{display:none}
  .hero-grid{grid-template-columns:1fr}
  .hero-copy{padding:48px 0 24px}
  .hero h1{font-size:39px}
  .hero-visual{height:300px}
  .quick-categories{margin-top:-24px}
  .quick-grid{grid-template-columns:repeat(2,1fr);padding:16px}
  .section{padding:52px 0}
  .section-heading h2{font-size:27px}
  .content-grid,.category-board{grid-template-columns:1fr}
  .newsletter-inner{grid-template-columns:1fr;padding:24px}
  .newsletter-inner form{display:grid;gap:8px}
  .newsletter-inner input,.newsletter-inner button{border-radius:10px;padding:14px}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-brand{grid-column:1/-1}
}

.mobile-menu[hidden]{display:none!important}
