:root{
  --bg:#ffffff;
  --fg:#0b0f14;
  --muted:#556072;
  --border:rgba(15,23,42,.12);
  --shadow:0 22px 60px rgba(2,8,20,.12);
  --accent:#1d4ed8;
  --accent2:#60a5fa;
  --dark:#070b10;
  --dark2:#0b1220;
  --radius:18px;
  --max:1120px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Noto Sans KR", Arial, sans-serif;
  color:var(--fg);
  background:var(--bg);
  line-height:1.55;
}
a{color:inherit;text-decoration:none}
img,video{max-width:100%;display:block}
.wrap{max-width:var(--max);margin:0 auto;padding:0 22px}

.home{
  position:relative;
  isolation:isolate;  /* ::before를 안전하게 뒤로 */
  background:#fff;
}
.home::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:130vh;                 /* ✅ “상단”에만 은은한 글로우 */
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(1200px 700px at 25% 10%, rgba(96,165,250,.14), transparent 62%),
    radial-gradient(900px 600px at 80% 18%, rgba(167,139,250,.10), transparent 60%);
}
.section{padding:88px 0}
.section-wide{padding:96px 0 112px}
.section-dark{
  background:
    radial-gradient(1200px 700px at 20% 10%, rgba(96,165,250,.18), transparent 60%),
    radial-gradient(800px 500px at 80% 20%, rgba(29,78,216,.18), transparent 55%),
    linear-gradient(180deg, var(--dark), var(--dark2));
  color:#e8eefc;
}
.section-title{font-size:40px;letter-spacing:-.02em;margin:0 0 22px}
.section-sub{color:rgba(255,255,255,.78);max-width:62ch;margin:8px 0 0}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:22px}

/* Top bar */
.topbar{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.84);
  backdrop-filter: blur(12px);
  border-bottom:1px solid var(--border);
}
.topbar-inner{
  max-width:var(--max);
  margin:0 auto;
  padding:14px 22px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
}
.brand{display:flex;align-items:center;gap:10px;font-weight:700}
.brand-dot{
  width:12px;height:12px;border-radius:50%;
  background:linear-gradient(135deg, var(--accent2), var(--accent));
  box-shadow:0 0 0 4px rgba(96,165,250,.18);
}
.brand-text{letter-spacing:-.02em}
.topnav{display:flex;align-items:center;gap:16px}
.topnav a{padding:10px 12px;border-radius:999px;color:rgba(11,15,20,.82)}
.topnav a.active{background:rgba(15,23,42,.06);color:rgba(11,15,20,1)}
.topnav a.cta{
  background:linear-gradient(135deg, var(--accent2), var(--accent));
  color:#fff;
  box-shadow:0 12px 30px rgba(29,78,216,.22);
}
.hamburger{
  display:none;
  border:1px solid var(--border);
  background:#fff;
  border-radius:12px;
  padding:10px 12px;
  cursor:pointer;
}
.mobile-nav{
  display:none;
  border-top:1px solid var(--border);
  padding:10px 22px 18px;
  max-width:var(--max);margin:0 auto;
}
.mobile-nav a{display:block;padding:12px 8px;border-radius:12px}
.mobile-nav a.cta{background:rgba(29,78,216,.08);color:var(--accent);font-weight:700}
@media (max-width: 820px){
  .topnav{display:none}
  .hamburger{display:inline-flex}
  .mobile-nav.open{display:block}
}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:12px 16px;border-radius:999px;
  border:1px solid var(--border);
  font-weight:700;
  gap:10px;
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
}
.btn:hover{transform:translateY(-1px)}
.btn-primary{
  border:0;
  background:linear-gradient(135deg, var(--accent2), var(--accent));
  color:#fff;
  box-shadow:0 18px 46px rgba(29,78,216,.26);
}
.btn-ghost{background:rgba(255,255,255,.85)}
.btn-lg{padding:14px 18px;font-size:16px}

.hero{
  position:relative;
  min-height:auto;                  /* ✅ 고정 높이 제거(각 영역이 100vh를 갖도록) */
  overflow:hidden;
  background:#05070b;
  display:flex;
  flex-direction:column;
}

.hero-head{
  position:relative;
  background:#05070b;
  z-index:2;
  text-align:center;

  /* ✅ 높이 2배 수준 */
  min-height:clamp(560px, 74vh, 880px);

  display:flex;
  align-items:center;
  justify-content:center;

  /* ✅ 여백도 2배 수준 */
  padding:clamp(88px, 12vh, 160px) 0;
}

.hero-head-inner{
  position:relative;
  z-index:2; /* ✅ 제목이 fade에 가려지지 않게 */
  display:flex;
  justify-content:center;
  align-items:center;
}
.hero-head .hero-title{margin:0;color:#fff;}
.hero-title-top{max-width:960px;}

/* ✅ 문구 영역 → 영상 영역 자연스러운 연결(그라데이션) */
.hero-head-fade{
  position:absolute;
  left:0; right:0;

  /* ✅ 핵심: hero-head "아래"에서 시작해서 영상으로 자연스럽게 사라지게 */
  top:100%;
  margin-top:-1px;   /* 경계선(틈) 방지 */

  height:220px;  /* ✅ 전환이 더 부드럽게 */
  background:linear-gradient(180deg, rgba(5,7,11,1) 0%, rgba(5,7,11,0) 100%);
  pointer-events:none;
  z-index:1;         /* 제목(.hero-head-inner z-index:2) 아래 */
}

.hero-media{
  position:relative;
  flex:0 0 auto;

  /* ✅ 영상도 1화면 고정 제거 */
  min-height:clamp(360px, 52vh, 640px);
}

/* ✅ 영상 → 아래 coreband 자연스러운 연결(바닥 페이드) */
.hero-media::after{
  content:"";
  position:absolute;
  left:0; right:0;
  bottom:-1px;            /* 경계선(틈) 방지 */
  height:180px;           /* 페이드 길이: 필요시 140~240 조절 */
  background:linear-gradient(
    180deg,
    rgba(5,7,11,0) 0%,
    rgba(5,7,11,1) 100%
  );
  pointer-events:none;
}
.hero-video{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;

  /* ✅ 아주 살짝만 ‘덜 정신없게’ */
  filter:saturate(.92) contrast(.98) brightness(.95) blur(.25px);

  cursor:pointer;
}
.hero-overlay{
  position:absolute;
  inset:0;

  /* ✅ 배경이 조금 더 눌리게 */
  opacity:.92;
  pointer-events:none;

  background:linear-gradient(
    180deg,
    rgba(0,0,0,.06) 0%,
    rgba(0,0,0,.22) 56%,
    rgba(5,7,11,.74) 88%,
    rgba(5,7,11,1) 100%
  );
}

@media (max-width: 820px){
  .hero-head{
    min-height:clamp(480px, 72vh, 840px);
    padding:clamp(64px, 10vh, 128px) 0;
  }
  .hero-title{font-size:clamp(26px, 6vw, 38px);}
}

/* Overview (Hero 아래 소개/개요) */
.overview{
  position:relative;
  padding:92px 0 70px;

  /* ✅ 핵심: overview 자체가 “밝은 바탕”을 확실히 갖도록 */
  background:
    radial-gradient(900px 420px at 20% 18%, rgba(96,165,250,.14), transparent 60%),
    radial-gradient(760px 460px at 88% 30%, rgba(167,139,250,.12), transparent 55%),
    linear-gradient(180deg, rgba(243,242,255,1) 0%, #ffffff 72%);

  border-bottom:1px solid var(--border);
}

/* ✅ 내용은 페이드 위로 올라오도록 */
.overview .wrap{
  position:relative;
  z-index:1;
}

.overview-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 0;
  align-items:start;
}

.overview-copy{
  max-width: 980px;
  margin: 0 auto;
}
.overview-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,.12);
  background:rgba(255,255,255,.75);
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:12px;
  color:rgba(11,15,20,.72);
  width:fit-content;
}
.overview-title{
  font-size:34px;
  letter-spacing:-.03em;
  line-height:1.15;
  margin:14px 0 10px;
}
.overview-desc{
  margin:0 0 18px;
  color:var(--muted);
  max-width:68ch;
}
.overview-points{
  display:grid;
  gap:12px;
  margin-top:10px;
}
.overview-point{
  border-left:3px solid rgba(29,78,216,.28);
  padding:8px 0 8px 12px;
}
.op-title{font-weight:900;letter-spacing:-.01em}
.op-desc{color:var(--muted);margin-top:2px}

.overview-panel{
  border:1px solid rgba(15,23,42,.10);
  border-radius:28px;
  padding:18px 18px 20px;
  background:
    radial-gradient(760px 380px at 30% 20%, rgba(96,165,250,.18), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.75));
  box-shadow:var(--shadow);
}
.overview-panel-title{
  font-weight:900;
  letter-spacing:-.02em;
  margin-bottom:12px;
}
.overview-stats{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:10px;
  margin-bottom:14px;
}
.stat{
  border:1px solid rgba(15,23,42,.10);
  border-radius:18px;
  padding:12px 10px;
  background:#fff;
  text-align:center;
}
.stat-num{font-size:22px;font-weight:1000;letter-spacing:-.02em}
.stat-label{font-size:12px;color:var(--muted);margin-top:2px;font-weight:800}

@media (max-width: 980px){
  .overview-grid{grid-template-columns:1fr}
  .overview-stats{grid-template-columns:repeat(3, 1fr)}
}
@media (max-width: 520px){
  .overview-stats{grid-template-columns:1fr;}
}

/* Local nav (sticky inside hero) */
.localnav{
  position:sticky;
  top:60px;
  margin-top:52px;
  border-top:1px solid rgba(255,255,255,.10);
  border-bottom:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
}
.localnav-inner{
  max-width:var(--max);
  margin:0 auto;
  padding:10px 22px;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.local-link{
  color:rgba(255,255,255,.86);
  padding:8px 12px;border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  font-weight:700;font-size:13px;
}
.local-link.active{background:rgba(255,255,255,.12)}
.local-cta{margin-left:auto;background:linear-gradient(135deg, rgba(96,165,250,.95), rgba(29,78,216,.95));border:0}
@media (max-width: 820px){
  .local-cta{margin-left:0}
}
.foundation{
  padding-top:104px;
  padding-bottom:120px;
}
.foundation .section-title{
  text-align:center;               /* ✅ 삼성처럼 중앙 타이틀 */
}

.foundation-grid{
  max-width:980px;
  margin:46px auto 0;
  display:grid;

  /* ✅ 항목 1개씩 세로로 */
  grid-template-columns:1fr;
  gap:72px;
}

.foundation-item{ text-align:center; }

.foundation-img{
  width:100%;
  max-width:980px;                 /* ✅ 크게 */
  margin:0 auto 24px;
  border-radius:28px;
  background:#f3f6fb;
  border:1px solid rgba(15,23,42,.10);
  box-shadow:var(--shadow);
}

.foundation-item-title{
  margin:0 0 10px;
  font-size:26px;                  /* ✅ 더 크게 */
  font-weight:1000;
  letter-spacing:-.02em;
}

.foundation-item-desc{
  margin:0;
  color:var(--muted);
  font-size:17px;                  /* ✅ 더 크게 */
  line-height:1.7;
  max-width:68ch;
  margin-inline:auto;
}

@media (max-width: 820px){
  .foundation{ padding-top:86px; padding-bottom:96px; }
  .foundation-grid{ gap:46px; margin-top:34px; }
  .foundation-item-title{ font-size:22px; }
  .foundation-item-desc{ font-size:15px; }
}

/* Carousel */
.carousel{
  border:1px solid rgba(255,255,255,.12);
  border-radius:28px;
  overflow:hidden;
  background:rgba(255,255,255,.04);
  box-shadow:0 30px 90px rgba(0,0,0,.38);
}
.carousel-top{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 16px 10px;
  gap:10px;
}
.tabs{display:flex;gap:8px;flex-wrap:wrap}
.tab{
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.86);
  padding:8px 12px;border-radius:999px;
  font-weight:800;
  cursor:pointer;
}
.tab.active{background:rgba(96,165,250,.18);border-color:rgba(96,165,250,.28)}
.carousel-controls{display:flex;gap:8px}
.iconbtn{
  border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.18);
  color:#fff;
  padding:8px 12px;border-radius:999px;
  cursor:pointer;font-weight:800;
}
.slide{
  display:none;
  grid-template-columns: 1fr 1.25fr;
  gap:18px;
  padding:18px 18px 22px;
  align-items:center;
}
.slide.active{display:grid}
.slide-copy{padding:10px 10px 10px 8px}
.slide-kicker{color:rgba(255,255,255,.72);font-weight:900;letter-spacing:.12em;font-size:12px}
.slide-title{margin:8px 0 8px;font-size:28px;letter-spacing:-.02em}
.slide-desc{margin:0 0 16px;color:rgba(255,255,255,.78);max-width:50ch}
.slide-media img{
  border-radius:20px;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 24px 70px rgba(0,0,0,.36);
}
@media (max-width: 980px){
  .slide{grid-template-columns:1fr}
}
.dots{
  display:flex;gap:8px;
  padding:0 18px 18px;
}
.dot{
  width:10px;height:10px;border-radius:999px;
  border:1px solid rgba(255,255,255,.28);
  background:transparent;
  cursor:pointer;
}
.dot.active{background:rgba(96,165,250,.85);border-color:rgba(96,165,250,.95)}

/* Cards */
.cards{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
}
.card{
  border:1px solid var(--border);
  border-radius:var(--radius);
  overflow:hidden;
  background:#fff;
  box-shadow:var(--shadow);
}
.card img{background:#f3f6fb}
.card-body{padding:16px 16px 18px}
.card-body h3{margin:0 0 6px;font-size:18px}
.card-body p{margin:0;color:var(--muted)}
@media (max-width: 980px){
  .cards{grid-template-columns:1fr}
}

/* Demo */
.video-shell{
  border-radius:28px;
  overflow:hidden;
  border:1px solid var(--border);
  box-shadow:var(--shadow);
  background:#000;
}
.demo-video{width:100%;height:auto}

/* CTA */
.cta{
  padding:92px 0;
  background:linear-gradient(180deg, rgba(29,78,216,.07), rgba(96,165,250,.08));
}
.cta-inner{text-align:center}
.cta-title{font-size:40px;letter-spacing:-.02em;margin:0 0 10px}
.cta-sub{margin:0 0 18px;color:var(--muted)}

/* Pages / forms */
.page{min-height:70vh}
.page-hero{
  padding:88px 0 28px;
  background:linear-gradient(180deg, rgba(96,165,250,.10), transparent);
  border-bottom:1px solid var(--border);
}
.page-title{font-size:44px;letter-spacing:-.03em;margin:0 0 10px}
.page-sub{margin:0;color:var(--muted);max-width:70ch}
.prose{max-width:760px}
.prose h2{margin:30px 0 10px}
.prose p, .prose li{color:var(--muted)}
.prose-cta{margin-top:20px}
.form{
  max-width:720px;
  border:1px solid var(--border);
  border-radius:26px;
  padding:20px;
  box-shadow:var(--shadow);
  background:#fff;
}
label{display:block;margin:12px 0}
label span{display:block;font-weight:800;margin-bottom:8px}
input, select, textarea{
  width:100%;
  border:1px solid rgba(15,23,42,.14);
  border-radius:14px;
  padding:12px 12px;
  font:inherit;
  outline:none;
}
input:focus, select:focus, textarea:focus{
  border-color:rgba(29,78,216,.45);
  box-shadow:0 0 0 4px rgba(29,78,216,.10);
}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width: 720px){ .grid2{grid-template-columns:1fr} }
.check{display:flex;gap:10px;align-items:flex-start}
.check input{width:auto;margin-top:4px}
.form-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.hint{margin-top:14px;color:var(--muted);font-size:13px}

/* Footer */
.footer{
  border-top:1px solid var(--border);
  padding:40px 0 34px;
  background:#fff;
}
.footer-inner{max-width:var(--max);margin:0 auto;padding:0 22px}
.footer-grid{display:grid;grid-template-columns: 2fr 1fr 1fr;gap:18px}
.footer-title{font-weight:900}
.footer-muted{color:var(--muted);margin-top:6px}
.footer-k{font-weight:900;margin-bottom:8px}
.footer-link{display:block;color:var(--muted);margin:6px 0}
.footer-link:hover{color:var(--fg)}
.footer-bottom{margin-top:18px;color:var(--muted);font-size:13px}
@media (max-width: 820px){ .footer-grid{grid-template-columns:1fr} }

/* Reveal */
.reveal{
  opacity:0;
  transform:translateY(10px);
  transition:opacity .6s ease, transform .6s ease;
}
.reveal.in{opacity:1;transform:translateY(0)}

.brand-sub{
  font-size:12px;
  color:rgba(11,15,20,.6);
  font-weight:600;
  letter-spacing:-.01em;
  margin-left:6px;
}

.hero-inner.hero-centered .hero-copy{
  margin:0 auto;
  max-width: 920px;
}

.hero-core{
  width:100%;
  max-width: 960px;
  margin: 0 auto;
  padding-top: 18px;
  text-align:center; /* ✅ 코어 문구 중앙 정렬 */
}

.hero-coreband{
  position:relative;
  isolation:isolate;
  background:#05070b;
  margin-top:-1px;
  overflow:hidden;

  /* ✅ 위/아래 패딩 2배 */
  padding:clamp(84px, 12vh, 150px) 0 clamp(72px, 12vh, 140px);
  border-bottom:1px solid rgba(255,255,255,.06);
}

/* =========================================================
   NEED (WHY) - “멈춰서 읽게” 만드는 인터스티셜 섹션
   ========================================================= */
.need{
  position:relative;

  /* ✅ 너무 길지 않게 (sticky 효과는 유지) */
  min-height: 160vh;

  padding: clamp(96px, 14vh, 170px) 0 clamp(110px, 16vh, 190px);

  background:
    radial-gradient(980px 520px at 22% 18%, rgba(96,165,250,.14), transparent 60%),
    radial-gradient(760px 480px at 88% 32%, rgba(167,139,250,.12), transparent 55%),
    linear-gradient(180deg, #05070b 0%, #05070b 100%);
  color: rgba(255,255,255,.92);
  overflow:hidden;
  scroll-margin-top: 92px;
}

/* ✅ 아래 밝은 섹션으로 넘어가는 페이드(조금만) */
.need::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-1px;
  height:260px;
  background:linear-gradient(180deg, rgba(5,7,11,0) 0%, rgba(243,242,255,1) 100%);
  pointer-events:none;
}

.need-inner{
  max-width: 980px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

/* ✅ 핵심: 카드가 sticky로 잠깐 붙잡는다 */
.need-card{
  position: sticky;
  top: clamp(84px, 16vh, 170px);

  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.045);
  backdrop-filter: blur(10px);

  padding: clamp(22px, 3.2vw, 44px);
  box-shadow: 0 30px 90px rgba(0,0,0,.55);
  overflow: hidden;
}

/* 왼쪽 포커스 라인 */
.need-card::before{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width:6px;
  background: linear-gradient(180deg, rgba(96,165,250,.95), rgba(167,139,250,.75));
  opacity:.85;
}

/* WHY 워터마크(‘섹션 성격’을 즉시 인지) */
.need-card::after{
  content:"WHY";
  position:absolute;
  right:-18px;
  top:-26px;
  font-weight: 1000;
  letter-spacing: -.06em;
  font-size: clamp(96px, 10vw, 140px);
  color: rgba(255,255,255,.06);
  pointer-events:none;
}

.need-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 7px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(0,0,0,.22);
  font-weight: 900;
  letter-spacing: .10em;
  text-transform: uppercase;
  font-size: 12px;
  color: rgba(255,255,255,.82);
  width: fit-content;
}

.need-title{
  /* ✅ 타이틀 조금 더 크게 */
  font-size: clamp(38px, 5.2vw, 62px);
  letter-spacing: -.04em;
  line-height: 1.08;
  margin: 14px 0 14px;
  color: rgba(255,255,255,.98);
}

.need-desc{
  margin: 0;
  max-width: 74ch;
  font-size: clamp(19px, 1.9vw, 24px);
  line-height: 1.75;
  color: rgba(255,255,255,.86);
  word-break: keep-all;
}

/* ✅ 문단 간격(내용은 그대로, 가독성만) */
.need-desc p{ margin: 0 0 14px; }
.need-desc p:last-child{ margin-bottom: 0; }

.need-hl{
  color: rgba(255,255,255,1);
  padding: 0 .18em;
  border-radius: 10px;
  background:
    linear-gradient(180deg,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,0) 46%,
      rgba(96,165,250,.36) 46%,
      rgba(96,165,250,.36) 100%);
}

/* ✅ (NEW) 단계/문단을 더 잘 읽히게 만드는 스타일 */
.need-steps{
  margin: 18px 0 16px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.need-steps li{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.18);
}
.need-step-n{
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 1000;
  font-size: 13px;
  margin-top: 2px;
  background: rgba(96,165,250,.18);
  border: 1px solid rgba(96,165,250,.42);
  color: rgba(255,255,255,.92);
}
.need-step-t{
  color: rgba(255,255,255,.88);
}

/* ✅ 첫 문단은 “리드 문장”처럼 */
.need-lead{
  font-weight: 900;
  color: rgba(255,255,255,.94);
}

/* ✅ 문제/전환 문단은 살짝 박스 처리 */
.need-callout{
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(96,165,250,.10);
  border: 1px solid rgba(96,165,250,.22);
}

/* ✅ 해결책 문단은 다른 톤으로 강조 */
.need-solution{
  padding: 14px 14px;
  border-radius: 14px;
  background: rgba(167,139,250,.12);
  border: 1px solid rgba(167,139,250,.22);
}

/* ✅ 읽는 느낌: 진행바(아주 얇게) */
.need-progress{
  margin-top: 22px;
  height: 3px;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  overflow: hidden;
}
.need-progress-bar{
  display:block;
  height:100%;
  width: 0%;
  border-radius: 999px;
  background: rgba(255,255,255,.70);
}

@media (max-width: 820px){
  .need{
    min-height: 145vh;
    padding: 96px 0 150px;
  }
}

/* 기존 hero-core는 그대로 쓰되, 밴드 안에서 위쪽 패딩은 줄임 */
.hero-coreband .hero-core{ padding-top:0; }

.hero-core::before{
  content:"";
  display:block;
  width: 140px;
  height: 1px;
  background: rgba(255,255,255,.18);
  margin: 0 auto 18px;
}
.hero-core-line{
  margin:0;
  font-size:26px;                 /* ✅ 크게 */
  font-weight:900;
  line-height:1.25;
  color: rgba(255,255,255,.94);
  letter-spacing:-.02em;
}
.hero-core-line strong{
  font-weight:1000;
}
.hero-core-desc{
  margin:14px 0 0;
  font-size:18px;                 /* ✅ 크게 */
  font-weight:700;
  line-height:1.55;
  color: rgba(255,255,255,.82);
}

@media (max-width: 820px){
  .hero-core-line{ font-size:20px; }
  .hero-core-desc{ font-size:15px; }
}