:root{
  --navy:#183047;--navy2:#244762;--green:#168a3f;--green2:#0f6e32;
  --mint:#eef8f1;--ink:#17231b;--muted:#66736a;--line:#dce6df;
  --bg:#f5f8f6;--white:#fff;--soft:#fbfdfb;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Pretendard,"Noto Sans KR",Arial,sans-serif;line-height:1.7}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{width:min(1120px,calc(100% - 36px));margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{font-weight:950;letter-spacing:-.04em;font-size:21px;color:var(--navy)}
.brand small{display:block;font-size:10px;letter-spacing:0;color:var(--green);font-weight:800}
.navlinks{display:flex;align-items:center;gap:22px;font-size:14px;font-weight:800}
.navlinks a:hover{color:var(--green)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:43px;padding:0 18px;border-radius:999px;font-weight:900;font-size:14px}
.btn.primary{background:var(--green);color:#fff}
.btn.dark{background:var(--navy);color:#fff}
.btn.ghost{border:1px solid var(--line);background:#fff}
.hero{padding:78px 0 52px;background:linear-gradient(135deg,#f5fbf6 0%,#fff 48%,#edf4f8 100%)}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:42px;align-items:center}
.kicker{font-size:12px;font-weight:950;color:var(--green);letter-spacing:.13em;text-transform:uppercase}
h1{font-size:clamp(38px,5vw,62px);line-height:1.12;letter-spacing:-.055em;margin:12px 0 20px;color:var(--navy)}
h2{font-size:clamp(27px,3vw,38px);line-height:1.25;letter-spacing:-.035em;margin:0 0 10px;color:var(--navy)}
h3{font-size:20px;line-height:1.35;letter-spacing:-.025em;margin:0 0 8px}
.lead{font-size:18px;color:#415247;max-width:760px;margin:0}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.hero-panel{background:var(--navy);color:#fff;border-radius:26px;padding:28px;box-shadow:0 24px 70px rgba(24,48,71,.18)}
.hero-panel strong{font-size:24px;display:block;margin-bottom:12px}
.hero-panel p{margin:0;color:rgba(255,255,255,.78)}
.hero-points{display:grid;gap:9px;margin-top:20px}
.hero-points div{padding:11px 13px;background:rgba(255,255,255,.08);border-radius:12px}
.section{padding:62px 0}
.section.alt{background:#fff}
.section-head{max-width:820px;margin-bottom:28px}
.section-head p{margin:0;color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 10px 34px rgba(19,45,27,.05)}
.card-media{aspect-ratio:16/10;background:#eaf1ec;overflow:hidden}
.card-media img{width:100%;height:100%;object-fit:cover}
.card-body{padding:21px}
.card-body p{color:var(--muted);margin:8px 0 0;font-size:14px}
.card-link{display:inline-block;margin-top:14px;font-weight:900;color:var(--green)}
.answer{padding:17px 18px;border-left:4px solid var(--green);background:var(--mint);border-radius:0 14px 14px 0;margin:14px 0}
.answer strong{color:var(--green2)}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.info{border:1px solid var(--line);border-radius:17px;background:#fff;padding:20px}
.info p{margin:6px 0 0;color:var(--muted);font-size:14px}
.process{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;counter-reset:step}
.step{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px}
.step:before{counter-increment:step;content:counter(step);display:flex;width:29px;height:29px;border-radius:50%;align-items:center;justify-content:center;background:var(--green);color:#fff;font-weight:950;margin-bottom:11px}
.step strong{font-size:14px}.step span{display:block;color:var(--muted);font-size:12px;margin-top:4px}
.case-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.case{display:block;border:1px solid var(--line);border-radius:16px;background:#fff;padding:18px;min-height:150px}
.case .tag{font-size:11px;color:var(--green);font-weight:950}
.case strong{display:block;font-size:17px;line-height:1.4;margin:7px 0}
.case p{font-size:13px;color:var(--muted);margin:0}
.case:hover{border-color:#a9cdb4;transform:translateY(-1px)}
.faq{display:grid;gap:10px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:15px;padding:16px 18px}
.faq summary{font-weight:900;cursor:pointer;color:var(--navy)}
.faq p{margin:10px 0 0;color:var(--muted)}
.cta{background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff;border-radius:26px;padding:34px}
.cta h2{color:#fff}
.cta p{color:rgba(255,255,255,.78)}
.footer{padding:30px 0 45px;background:#102436;color:#d9e2e8;font-size:13px}
.footer-grid{display:grid;grid-template-columns:1fr auto;gap:20px}
.footer strong{color:#fff}
.archive{display:grid;gap:9px}
.archive a{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:13px;background:#fff}
.archive a span{color:var(--muted);font-size:12px}
.pill{display:inline-flex;padding:5px 9px;border-radius:999px;background:var(--mint);color:var(--green2);font-size:11px;font-weight:900}
.page-hero{padding:54px 0 34px;background:linear-gradient(135deg,#f4faf5,#fff)}
.page-hero h1{font-size:clamp(34px,4.2vw,52px)}
.summary-band{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:24px}
.summary-band div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px}
.summary-band b{display:block;color:var(--green2);font-size:12px}
.summary-band span{font-size:13px}
.small-note{font-size:12px;color:var(--muted)}
.mobile-menu{display:none}
@media(max-width:900px){
  .wrap{width:min(100% - 28px,760px)}
  .nav{min-height:60px}.brand{font-size:17px}.brand small{display:none}
  .navlinks a:not(.talk){display:none}
  .hero{padding:46px 0 34px}.hero-grid{grid-template-columns:1fr;gap:24px}
  h1{font-size:clamp(34px,10vw,46px)}
  .lead{font-size:16px}
  .cards,.case-list{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr}
  .process{grid-template-columns:1fr 1fr}
  .summary-band{grid-template-columns:1fr 1fr}
  .section{padding:42px 0}
  .footer-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
  .process{grid-template-columns:1fr}
  .summary-band{grid-template-columns:1fr}
  .btn{width:100%}
  .actions{display:grid}
}

/* 2026-08-27 uploaded homepage visuals */
.brand-logo{display:flex;align-items:center;gap:10px}
.brand-logo img{width:42px;height:42px;object-fit:contain;border-radius:10px;background:#fff}
.hero-photo{margin-top:18px;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.14)}
.hero-photo img{width:100%;aspect-ratio:16/10;object-fit:cover}
.visual-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}
.visual-card{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 10px 34px rgba(19,45,27,.05)}
.visual-card img{width:100%;height:100%;object-fit:cover}
.visual-card .caption{position:absolute;left:14px;right:14px;bottom:14px;padding:12px 14px;border-radius:13px;background:rgba(16,36,54,.86);color:#fff;backdrop-filter:blur(8px)}
.visual-card .caption strong{display:block;font-size:15px}
.visual-card .caption span{display:block;font-size:11px;color:rgba(255,255,255,.78);margin-top:3px}
.visual-main{min-height:430px}
.visual-stack{display:grid;grid-template-rows:1fr 1fr;gap:18px}
.visual-stack .visual-card{min-height:206px}
.service-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.service-image-card{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden}
.service-image-card img{width:100%;aspect-ratio:16/10;object-fit:cover}
.service-image-card .copy{padding:18px}
.service-image-card .copy p{margin:6px 0 0;color:var(--muted);font-size:13px}
.talk-banner{display:block;border-radius:22px;overflow:hidden;border:1px solid var(--line);box-shadow:0 10px 30px rgba(19,45,27,.06);background:#fff}
.talk-banner img{width:100%;display:block}
.trust-photo{display:grid;grid-template-columns:.85fr 1.15fr;gap:18px;align-items:stretch;margin-top:18px}
.trust-photo .info{height:100%}
.trust-photo figure{margin:0;border-radius:20px;overflow:hidden;border:1px solid var(--line);background:#fff}
.trust-photo figure img{width:100%;height:100%;object-fit:cover}
@media(max-width:900px){
  .brand-logo img{width:34px;height:34px}
  .visual-grid,.trust-photo{grid-template-columns:1fr}
  .visual-main{min-height:280px}
  .visual-stack{grid-template-rows:auto}
  .visual-stack .visual-card{min-height:230px}
  .service-gallery{grid-template-columns:1fr}
}

/* 2026-08-27 visual/readability fix */
.compare-full-card{
  margin-top:18px;
  background:#fff;
  min-height:0 !important;
}
.compare-full-card img{
  width:100% !important;
  height:auto !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  background:#fff;
}
@media(max-width:900px){
  .compare-full-card{
    margin-top:14px;
  }
}

/* 2026-08-27 case thumbnail cards */
.case{
  padding:0 !important;
  overflow:hidden;
}
.case-thumb{
  width:100%;
  aspect-ratio:16/9;
  overflow:hidden;
  background:#eaf1ec;
  border-bottom:1px solid var(--line);
}
.case-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .25s ease;
}
.case:hover .case-thumb img{
  transform:scale(1.025);
}
.case > .tag,
.case > strong,
.case > p{
  display:block;
  margin-left:18px;
  margin-right:18px;
}
.case > .tag{
  margin-top:16px;
}
.case > strong{
  margin-top:7px;
}
.case > p{
  margin-top:0;
  margin-bottom:18px;
}
@media(max-width:900px){
  .case-thumb{aspect-ratio:16/10}
}

/* 2026-08-27 logo + GEO/AEO + responsive refinement */
.brand-logo{
  display:flex !important;
  align-items:center;
  gap:10px;
  min-width:0;
}
.brand-logo img{
  width:54px !important;
  height:46px !important;
  object-fit:contain !important;
  flex:0 0 auto;
  border-radius:8px;
  background:#fff;
}
.brand-logo .brand-copy{
  display:block;
  min-width:0;
}
.brand-logo small{
  display:block;
}

/* 검색/AI 요약에 적합한 핵심 답변 블록은 한 문단으로 독립 이해 가능하게 유지 */
.answer{
  max-width:100%;
}

/* 모바일에서도 메뉴를 숨기지 않고 좌우 스크롤형 칩으로 제공 */
@media(max-width:900px){
  .site-header .nav{
    flex-wrap:wrap;
    gap:6px 10px;
    padding:7px 0 8px;
  }
  .brand-logo img{
    width:42px !important;
    height:36px !important;
  }
  .brand-logo .brand-copy{
    font-size:15px;
  }
  .brand-logo small{
    display:none !important;
  }
  .navlinks{
    width:100%;
    display:flex !important;
    gap:7px !important;
    overflow-x:auto;
    padding:2px 0 3px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .navlinks::-webkit-scrollbar{display:none}
  .navlinks a:not(.talk){
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    white-space:nowrap;
    min-height:34px;
    padding:0 11px;
    border:1px solid var(--line);
    border-radius:999px;
    background:#fff;
    font-size:12px;
  }
  .navlinks .talk{
    width:auto !important;
    min-height:34px !important;
    padding:0 14px !important;
    flex:0 0 auto;
  }
  .page-hero{
    padding:38px 0 28px;
  }
  .page-hero h1{
    font-size:clamp(31px,9vw,42px);
    line-height:1.15;
  }
  .summary-band{
    grid-template-columns:1fr !important;
  }
  .case-list{
    grid-template-columns:1fr !important;
  }
  .case-thumb{
    aspect-ratio:16/10;
  }
}

/* 2026-08-27 company introduction section */
.company-intro-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:28px;
  align-items:start;
}
.company-intro-copy p{
  color:var(--muted);
  margin:10px 0 0;
}
.company-intro-copy .company-lead{
  font-size:17px;
  color:#405147;
}
.company-intro-points{
  display:grid;
  gap:10px;
}
.company-point{
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  padding:16px 17px;
}
.company-point b{
  display:block;
  color:var(--green2);
  font-size:12px;
  margin-bottom:4px;
}
.company-point span{
  display:block;
  font-size:14px;
  line-height:1.55;
}
.about-story-grid{
  display:grid;
  grid-template-columns:1fr .9fr;
  gap:28px;
  align-items:center;
}
.about-story-grid p{
  color:var(--muted);
}
.about-team-photo{
  margin:0;
  border-radius:20px;
  overflow:hidden;
  border:1px solid var(--line);
  background:#fff;
}
.about-team-photo img{
  width:100%;
  height:100%;
  min-height:350px;
  object-fit:cover;
}
.company-process{
  margin-top:18px;
}
@media(max-width:900px){
  .company-intro-grid,
  .about-story-grid{
    grid-template-columns:1fr;
    gap:20px;
  }
  .company-intro-copy .company-lead{
    font-size:16px;
  }
  .company-intro-points{
    grid-template-columns:1fr;
  }
  .about-team-photo img{
    min-height:260px;
  }
}

/* 2026-08-28 SEO/AEO/GEO content extraction + mobile refinement */
.answer-sentence{
  display:flex;
  gap:12px;
  align-items:flex-start;
  margin-top:18px;
  padding:14px 16px;
  border:1px solid #cfe4d5;
  border-radius:14px;
  background:#f1faf3;
  font-size:14px;
  line-height:1.6;
}
.answer-sentence strong{
  flex:0 0 auto;
  color:var(--green2);
  font-size:12px;
}
.reviewed-date,.evidence-note{
  color:var(--muted);
  font-size:12px;
  margin-top:10px;
}
.evidence-note{
  padding:10px 12px;
  border-radius:10px;
  background:#f7faf8;
}
.related-links{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
}
.related-links a{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:14px;
  padding:15px 16px;
  background:#fff;
  font-weight:800;
  color:var(--navy);
}
.record-trust{
  max-width:1120px;
  margin:28px auto;
  padding:18px 20px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fbfdfb;
}
.record-trust h2{
  font-size:18px;
  margin:0 0 8px;
}
.record-trust p{
  margin:5px 0;
  color:var(--muted);
  font-size:13px;
}
.record-trust a{color:var(--green2);font-weight:800}
.quick-answer{
  margin:14px 0 18px;
  padding:12px 14px;
  border-left:4px solid var(--green);
  background:#f1faf3;
  border-radius:0 12px 12px 0;
}
.quick-answer strong{display:block;color:var(--green2);font-size:11px;margin-bottom:3px}
.quick-answer span{display:block;font-size:14px;line-height:1.55}
.compare-figure{margin:0;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff}
.compare-figure img{width:100%;height:auto;display:block}
@media(max-width:900px){
  .answer-sentence{display:block}
  .answer-sentence strong{display:block;margin-bottom:4px}
  .related-links{grid-template-columns:1fr}
  .record-trust{margin:20px 14px;padding:16px}
}

/* 2026-08-28 office mobile case refinement */
@media(max-width:900px){
  .office-page .mobile-hide-case{display:none!important}
}


/* office page meta card v3 */
.office-page .page-meta-card{
  padding:16px 18px;
  border-radius:14px;
  margin-top:18px;
}
.office-page .page-meta-card h2{
  margin:0 0 8px;
  font-size:18px;
  line-height:1.35;
}
.office-page .page-meta-card p{
  margin:4px 0 0;
  font-size:13px;
  line-height:1.55;
}
.office-page .page-meta-card strong{
  color:var(--ink);
}
.office-page .page-meta-card .page-meta-note{
  margin-top:8px;
  padding-top:8px;
  border-top:1px solid var(--line);
  font-size:12px;
}
@media(max-width:900px){
  .office-page .page-meta-card{
    padding:14px 15px;
    margin-top:14px;
  }
  .office-page .page-meta-card h2{
    font-size:17px;
  }
}