:root{
  --h: 116;
  --c-brand: hsl(var(--h) 45% 32%);
  --c-brand-dark: hsl(var(--h) 42% 20%);
  --c-brand-light: hsl(var(--h) 40% 92%);
  --c-accent: hsl(calc(var(--h) + 25) 50% 40%);
  --c-text: hsl(var(--h) 10% 18%);
  --c-sub: hsl(var(--h) 8% 40%);
  --c-line: hsl(var(--h) 15% 84%);
  --c-bg: hsl(var(--h) 20% 98%);
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:'Pretendard',-apple-system,BlinkMacSystemFont,"Malgun Gothic",sans-serif;
  color:var(--c-text);
  background:var(--c-bg);
  line-height:1.7;
}
.wrap{max-width:824px;margin-inline:auto;padding-inline:20px;}
a{color:inherit;text-decoration:none;}

/* Header H1: simple left-logo / right-nav single row */
.site-header{
  background:#fff;
  border-bottom:1px solid var(--c-line);
}
.head-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-block:16px;
}
.logo{font-weight:700;font-size:1.2rem;color:var(--c-brand-dark);}
.site-header nav{display:flex;gap:20px;}
.site-header nav a{font-size:.94rem;color:var(--c-sub);}
.site-header nav a:hover{color:var(--c-brand);}

/* Hero V4: overlapping card */
.hero{
  background:linear-gradient(135deg,var(--c-brand),var(--c-brand-dark));
  padding-top:56px;
  padding-bottom:90px;
}
.hero-card{
  background:#fff;
  border-radius:16px;
  padding:34px 32px;
  box-shadow:0 18px 40px hsl(var(--h) 30% 20% / .22);
  transform:translateY(46px);
  max-width:640px;
}
.hero h1{
  font-size:2rem;
  margin:0 0 16px;
  color:var(--c-brand-dark);
}
.hero .lead{
  font-size:1rem;
  color:var(--c-sub);
  margin:0;
}

main{padding-top:78px;padding-bottom:48px;}
.blk{margin-bottom:34px;}
.blk h2{
  font-size:1.24rem;
  color:var(--c-brand-dark);
  margin:0 0 12px;
  display:flex;
  align-items:center;
  gap:10px;
}
.blk p{margin:0;color:var(--c-text);}

.faq h2{color:var(--c-accent);}
.faq-item{
  background:#fff;
  border:1px solid var(--c-line);
  border-radius:10px;
  padding:18px 20px;
  margin-bottom:12px;
}
.faq-item h3{
  font-size:1rem;
  margin:0 0 6px;
  color:var(--c-brand-dark);
}
.faq-item p{margin:0;color:var(--c-sub);font-size:.94rem;}

.ph{margin:0 0 48px;}
.ph-row{display:flex;flex-wrap:nowrap;justify-content:center;align-items:flex-start;gap:16px;max-width:900px;margin-inline:auto;}
.ph-row img{flex:1 1 0;min-width:0;width:100%;height:auto;display:block;border-radius:8px;}
@media (max-width:600px){.ph-row{gap:10px;}}

/* CTA C3: left/right split */
.cta{
  background:var(--c-brand-light);
  padding-block:40px;
}
.cta-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}
.cta-text{
  margin:0;
  font-size:1.05rem;
  color:var(--c-brand-dark);
}
.cta-btn{
  display:inline-block;
  background:var(--c-brand);
  color:#fff;
  font-weight:700;
  padding:13px 28px;
  border-radius:8px;
  white-space:nowrap;
}
.cta-btn:hover{background:var(--c-brand-dark);}

/* Footer F1: single row */
footer{
  padding:14px 20px;
  background:var(--c-bg);
}
footer .wrap{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:6px 20px;
}
footer p{
  margin:0;
  font-size:.86rem;
  color:var(--c-sub);
}

@media (max-width:1024px){
  .wrap{padding-inline:18px;}
}
@media (max-width:768px){
  .hero h1{font-size:1.7rem;}
  .hero-card{padding:26px 24px;}
}
@media (max-width:480px){
  .head-inner{flex-direction:column;gap:10px;}
  .cta-inner{flex-direction:column;align-items:flex-start;}
  .hero-card{transform:translateY(30px);}
  main{padding-top:56px;}
}