/* Reset & base */
* {margin:0; padding:0; box-sizing:border-box;}
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  line-height: 1.7;
  color: #1a202c;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  min-height: 100vh;
}
a {text-decoration:none;}

/* Container */
.container {width:90%; max-width:1200px; margin:0 auto;}

.hamburger {
  display: none;  /* 기본은 숨김 */
  font-size: 1.8rem;
  cursor: pointer;
  color: #4a5568;
}
@media (max-width: 768px) {
  .hamburger {
    display: block; 
    margin-left: auto;    /* 로고와 떨어지게 */
    padding: 0.5rem 0.8rem;
  }
}

/* Header */
.header {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
  position: sticky; top:0; z-index:100;
}
.header-content {display:flex; justify-content:space-between; align-items:center; padding:1rem 0;}
.logo {
  font-size:1.8rem; font-weight:800;
  background: linear-gradient(135deg, #667eea, #764ba2);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip:text;
}
.nav-menu {display:flex; gap:2rem; align-items:center;}
.nav-link {
  color:#4a5568; font-weight:600; position:relative; transition:color .3s;
}
.nav-link:hover {color:#667eea;}
.nav-link.active {color:#667eea;}
.nav-link::after {
  content:''; position:absolute; width:0; height:2px; bottom:-5px; left:0;
  background:#667eea; transition:width .3s;
}
.nav-link:hover::after {width:100%;}

/* Hero */
.hero {text-align:center; margin:2rem 0;}
.hero h1, .hero p {color:#ffffff;} /* 흰색 글씨 */
.hero-text-container {
  max-width: 900px;
  margin: 0 auto;
  padding-left: 1rem; /* 좌우 여백 추가 */
  padding-right: 1rem; /* 좌우 여백 추가 */
}

/* Info sections / card style (서브 페이지용) */
.info-section {
  background:white;
  border-radius:20px;
  box-shadow:0 20px 40px rgba(0,0,0,0.1);
  margin:2rem auto; 
  padding:2rem;
  max-width:900px;   /* 폭 제한 */
}
.form-row {display:flex; gap:1rem; flex-wrap:wrap;}
.form-group {flex:1; display:flex; flex-direction:column;}
label {margin-bottom:0.5rem; font-weight:700; color:#2d3748;}
input, select, textarea {
  padding:0.7rem; border:1px solid #e2e8f0; border-radius:8px; margin-bottom:1rem;
}
textarea {min-height:100px;}
.button-group {display:flex; gap:1rem; margin-top:1rem;}
.btn {padding:0.7rem 1.2rem; border:none; border-radius:8px; cursor:pointer; font-weight:600;}
.btn-primary {background:#667eea; color:#fff;}
.btn-primary:hover {background:#4c51bf;}
.btn-secondary {background:#e2e8f0; color:#1a202c;}
.btn-secondary:hover {background:#cbd5e0;}

/* Result box */
.result {display:none; background:#f8fafc; border:1px solid #e2e8f0; border-radius:12px; margin-top:1.5rem;}
.result.show {display:block;}
.result-header {background:#edf2f7; padding:0.5rem 1rem; border-bottom:1px solid #e2e8f0;}
.result-content {padding:1rem; color:#2d3748;}

/* Ads placeholder */
.ad-space {
  background:#f8fafc; border:2px dashed #e2e8f0;
  border-radius:12px; padding:2rem; text-align:center; margin:2rem 0;
  color:#64748b; font-size:0.9rem;
}
.ad-space-horizontal {min-height:120px; margin:1.5rem 0;}

/* Banner icons */
.banner-icon img {
  border-radius:15px; box-shadow:0 2px 5px rgba(0,0,0,.2);
  transition:transform .3s;
}
.banner-icon img:hover {transform:scale(1.05);}

/* Footer */
.footer {background:#1f2937; color:white; margin-top:4rem;}
.footer-content {
  max-width:1200px; margin:0 auto;
  display:flex; flex-wrap:wrap; justify-content:space-around; padding:0 20px;
}
.footer-section h4 {color:#667eea; margin-bottom:1rem; font-weight:700;}
.footer-section p {color:#d1d5db; line-height:1.6; margin-bottom:1rem;}
.footer-section ul {list-style:none;}
.footer-section ul li {margin-bottom:0.5rem;}
.footer-section ul li a {color:#d1d5db; transition:color .3s;}
.footer-section ul li a:hover {color:#667eea;}
.footer-bottom {border-top:1px solid #374151; padding:2rem 0; text-align:center; color:#9ca3af; font-size:0.9rem;}

/* Card Section (index 페이지용) */
.card-section {margin:3rem auto; max-width:1100px;}
.card-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:1.5rem;
}
.card {
  background:white;
  border-radius:16px;
  box-shadow:0 8px 20px rgba(0,0,0,0.1);
  padding:2rem;
  text-align:center;
  transition:transform .3s;
  max-width:320px;
  margin:0 auto;
}
.card:hover {transform:translateY(-5px);}
.card h3 {color:#1a202c; margin-bottom:1rem;}
.card p {color:#4a5568; margin-bottom:1.2rem;}
.card .btn {display:inline-block;}
@media (max-width: 768px) {
  .nav-menu {
    display: none;
    flex-direction: column;
    background: rgba(255,255,255,0.97);
    position: absolute;
    top: 70px;   /* 헤더 아래로 */
    right: 10px;
    width: 220px;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.2);
    padding: 1rem;
    z-index: 999; /* 메뉴가 다른 요소 위로 */
  }
  .nav-menu.show { display: flex; }
}


/* Responsive */
@media (max-width:768px){
  .nav-menu {display:none;}
  .header-content {justify-content:center;}
  .footer-content {flex-direction:column; align-items:center; text-align:center;}
  .footer-section {margin-bottom:2rem;}
}