/* ============================================================
   AICONPL — 섹션 스타일
   순서는 index.html 과 동일합니다.
   ============================================================ */

/* ══════ NAV ══════ */
.nav{
  position:sticky; top:0; z-index:60; height:var(--nav-h);
  background:#0B0B0D; color:#fff; border-bottom:1px solid #1C1C21;
}
.nav__inner{
  max-width:1360px; margin:0 auto; padding:0 24px; height:100%;
  display:flex; align-items:center; gap:28px;
}
.nav__logo{ display:flex; flex-direction:column; justify-content:center; flex:0 0 auto; line-height:1 }
.nav__logo img{ height:22px; width:auto }
.nav__logo-sub{ font-size:9px; letter-spacing:.14em; color:#9A9AA4; margin-top:3px }

.nav__menu{ display:flex; align-items:center; gap:26px; flex:1 1 auto }
.nav__menu a{ font-size:14px; color:#D4D4DB; transition:color .15s }
.nav__menu a:hover{ color:#fff }
.nav__menu a.is-current{ color:#9B7BFF; font-weight:600 }

.nav__tel{ display:flex; align-items:center; gap:7px; font-size:17px; font-weight:700; flex:0 0 auto }
.nav__burger{ display:none; width:38px; height:38px; flex-direction:column; justify-content:center; gap:5px; align-items:center }
.nav__burger span{ display:block; width:20px; height:2px; background:#fff; transition:.2s }
.nav__burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg) }
.nav__burger[aria-expanded="true"] span:nth-child(2){ opacity:0 }
.nav__burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg) }

/* ══════ 1. HERO ══════ */
.hero{ position:relative; min-height:100svh; display:grid; place-items:center; padding:0; overflow:hidden; background:#0B0B0D }
.hero__video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
.hero__scrim{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(8,8,12,.55) 0%, rgba(8,8,12,.42) 42%, rgba(8,8,12,.82) 100%);
}
.hero__body{ position:relative; z-index:2; text-align:center; padding:0 24px; max-width:960px }
.hero__title{ font-size:clamp(23px,4.4vw,52px); font-weight:500; line-height:1.34; color:#fff; letter-spacing:-.02em }
.hero__title strong{ font-weight:700 }
.hero__sub{ margin-top:18px; font-size:clamp(13px,1.3vw,16px); color:rgba(255,255,255,.82) }
.hero__cta{
  margin-top:34px; display:inline-flex; gap:4px; padding:7px;
  background:rgba(22,22,28,.55); border:1px solid rgba(255,255,255,.14);
  border-radius:var(--pill); backdrop-filter:blur(8px);
}

/* ══════ 2. 지표 ══════ */
.stats{ padding:72px 0 }
.stats__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px }
.stat{
  background:#17171B; border:1px solid #232329; border-radius:var(--r-lg);
  padding:26px 24px 24px; text-align:center;
}
.stat__art{ height:112px; display:grid; place-items:center; margin-bottom:10px }
.stat__num{ font-size:30px; font-weight:700; letter-spacing:-.02em; color:#fff; font-variant-numeric:tabular-nums }
.stat__label{ margin-top:6px; font-size:13px; color:#9C9CA6 }

/* ══════ 3. 리포트 배너 ══════ */
.report{ background:var(--brand); padding:0 }
.report__inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:168px; padding-block:22px }
.report__kicker{ font-size:12px; font-weight:700; color:rgba(255,255,255,.72) }
.report__title{ margin-top:6px; font-size:clamp(17px,2.2vw,24px); font-weight:700; color:#fff }
.report__link{ display:inline-block; margin-top:10px; font-size:13px; color:rgba(255,255,255,.9) }
.report__link:hover{ color:#fff; text-decoration:underline }
.report__art{ flex:0 0 auto }

/* ══════ 4. 고민 아코디언 ══════ */
.acc{ margin-top:48px; border-top:1px solid var(--d-line) }
.acc__item{ border-bottom:1px solid var(--d-line) }
.acc__head{
  display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:14px;
  padding:26px 20px; cursor:pointer; list-style:none; transition:background .15s;
}
.acc__head:hover{ background:#141418 }
.acc__q{ font-size:17px; font-weight:600; color:#fff }
.acc__who{ font-size:13px; color:#7C7C87 }
.acc__tag{
  font-size:11px; font-weight:600; padding:5px 11px; border-radius:var(--pill);
  background:rgba(108,43,242,.2); color:#B49BFF; border:1px solid rgba(108,43,242,.45);
}
.acc__arrow{ width:14px; height:14px; border-right:2px solid #6E6E79; border-bottom:2px solid #6E6E79;
  transform:rotate(45deg) translate(-3px,-3px); transition:transform .22s }
.acc__item[open] .acc__arrow{ transform:rotate(-135deg) translate(-3px,-3px) }
.acc__body{ padding:0 20px 28px; max-width:780px }
.acc__body p{ font-size:14.5px; color:#A6A6B0; line-height:1.8 }
.acc__chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px }
.acc__chips li{ font-size:12px; padding:6px 13px; border-radius:var(--pill); background:#1D1D22; color:#C9C9D2 }

/* ══════ 5. 요약 지표 ══════ */
.summary__grid{ margin-top:44px; display:grid; grid-template-columns:repeat(4,1fr); gap:14px }
.summary__card{
  border:1px solid var(--line); border-radius:var(--r-lg); padding:26px 20px; text-align:center; background:var(--surface);
}
.summary__card strong{ display:block; font-size:21px; font-weight:700; letter-spacing:-.02em }
.summary__card span{ display:block; margin-top:8px; font-size:13px; color:var(--muted) }
.summary__card span::before{ content:'●'; color:var(--brand); font-size:7px; vertical-align:middle; margin-right:5px }

/* ══════ 6. 기능 캐러셀 ══════ */
.feat{ padding-bottom:72px; overflow:hidden }
.feat__stage{ position:relative; margin-top:52px; min-height:430px }
.feat__slide{
  position:absolute; inset:0; opacity:0; visibility:hidden;
  transform:translateY(14px); transition:opacity .35s ease, transform .35s ease, visibility .35s;
}
.feat__slide.is-active{ opacity:1; visibility:visible; transform:none; position:relative }
.feat__row{ display:grid; grid-template-columns:minmax(0,360px) minmax(0,1fr); gap:48px; align-items:center }
.feat__en{ font-size:12px; font-weight:600; color:#9B7BFF; letter-spacing:.01em }
.feat__h{ margin-top:12px; font-size:clamp(24px,3vw,34px); font-weight:700; line-height:1.3; color:#fff; letter-spacing:-.02em }
.feat__rule{ width:28px; border:0; border-top:2px solid #4A4A55; margin:24px 0 }
.feat__d{ font-size:14.5px; color:#A6A6B0; line-height:1.8 }
.feat__n{ margin-top:26px; font-size:14px; color:#6E6E79 }
.feat__n b{ color:#fff; font-size:16px }

.feat__ctrl{ display:flex; align-items:center; justify-content:center; gap:16px; margin-top:40px }
.feat__nav{
  width:42px; height:42px; border-radius:50%; border:1px solid var(--d-line);
  color:#C9C9D2; font-size:22px; line-height:1; display:grid; place-items:center; transition:.15s;
}
.feat__nav:hover{ background:#1B1B20; color:#fff }
.feat__dots{ display:flex; gap:8px }
.feat__dots button{ width:9px; height:9px; border-radius:50%; background:#34343C; transition:.2s; display:block }
.feat__dots button[aria-selected="true"]{ background:var(--brand); width:26px; border-radius:var(--pill) }

/* 목업 */
.mock{ border-radius:14px; overflow:hidden; background:#1C1C22; border:1px solid #2A2A32; box-shadow:0 20px 60px rgba(0,0,0,.45) }
.mock__bar{ display:flex; gap:6px; padding:11px 14px; background:#24242B; border-bottom:1px solid #2E2E37 }
.mock__bar i{ width:9px; height:9px; border-radius:50%; background:#3D3D47 }
.mock__body{ padding:22px }

.score{ display:flex; align-items:baseline; gap:10px; margin-bottom:18px }
.score__num{ font-size:46px; font-weight:700; color:var(--accent); line-height:1 }
.score__cap{ font-size:11px; letter-spacing:.14em; color:#7C7C87 }
.score__list li{ display:grid; grid-template-columns:96px 1fr; align-items:center; gap:12px; margin-bottom:11px; font-size:12.5px; color:#9C9CA6 }
.score__list i{ display:block; height:7px; border-radius:4px; background:#2C2C34; position:relative }
.score__list i::after{ content:''; position:absolute; inset:0 auto 0 0; width:var(--w); border-radius:4px;
  background:linear-gradient(90deg,#4F8BFF,var(--brand)) }

.mapbox{ height:290px; background:#20202A; position:relative }
.mapbox__ph{ position:absolute; inset:0; display:grid; place-items:center; text-align:center; gap:6px; color:#8E8E99; font-size:13px }
.mapbox__ph b{ display:block; color:#C9C9D2; font-size:14px }
.mapbox__ph code{ font-size:11px; color:#7C7C87 }
.mock--map{ position:relative }
.map__pills{ position:absolute; right:16px; top:64px; display:flex; flex-direction:column; gap:9px }
.map__pills span{
  background:var(--brand); color:#fff; font-size:12px; font-weight:600;
  padding:9px 16px; border-radius:var(--pill); box-shadow:0 6px 18px rgba(0,0,0,.35);
}

.cards3{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px }
.pcard{ background:#24242B; border-radius:10px; padding:16px; text-align:center }
.pcard__av{ width:44px; height:44px; border-radius:50%; margin:0 auto 10px;
  background:linear-gradient(135deg,var(--brand),#4F8BFF) }
.pcard b{ display:block; font-size:12.5px; color:#fff }
.pcard span{ display:block; font-size:11px; color:#8E8E99; margin-top:3px }
.pcard em{ display:inline-block; margin-top:8px; font-style:normal; font-size:11px; font-weight:600;
  color:var(--accent-ink); background:var(--accent); padding:3px 9px; border-radius:var(--pill) }

.pick li{ display:grid; grid-template-columns:30px 1fr auto auto; align-items:center; gap:12px;
  padding:12px 0; border-bottom:1px solid #2A2A32; font-size:13px; color:#C9C9D2 }
.pick li:last-child{ border-bottom:0 }
.pick__av{ width:30px; height:30px; border-radius:50%; background:linear-gradient(135deg,#4F8BFF,var(--brand)) }
.pick i{ font-style:normal; font-size:12px; color:#8E8E99 }
.pick em{ font-style:normal; font-size:11px; font-weight:600; padding:4px 11px; border-radius:var(--pill);
  background:#2C2C34; color:#8E8E99 }
.pick em.on{ background:var(--accent); color:var(--accent-ink) }

.check li{ display:flex; align-items:center; gap:10px; padding:11px 0; font-size:13.5px; color:#C9C9D2;
  border-bottom:1px solid #2A2A32 }
.check li::before{ content:'✓'; width:20px; height:20px; border-radius:50%; display:grid; place-items:center;
  font-size:11px; font-weight:700; background:var(--accent); color:var(--accent-ink) }
.check li.ng::before{ content:'!'; background:#FF6B6B; color:#fff }
.check__note{ margin-top:14px; font-size:12px; color:#7C7C87 }

.mon li{ display:flex; align-items:center; justify-content:space-between; padding:12px 0;
  border-bottom:1px solid #2A2A32; font-size:13px; color:#C9C9D2 }
.mon li:last-child{ border-bottom:0 }
.mon em{ font-style:normal; font-size:11px; font-weight:600; padding:4px 11px; border-radius:var(--pill) }
.mon em.on{ background:rgba(140,233,154,.16); color:var(--accent) }
.mon em.warn{ background:rgba(255,107,107,.16); color:#FF8E8E }

/* ══════ 7. 매체 탭 ══════ */
.tabs{ margin-top:40px; display:flex; flex-wrap:wrap; justify-content:center; gap:8px }
.tabs button{
  height:40px; padding:0 18px; border-radius:var(--pill); border:1px solid var(--line);
  font-size:14px; color:var(--muted); background:var(--surface); transition:.15s;
}
.tabs button:hover{ border-color:var(--ink-2); color:var(--ink) }
.tabs button[aria-selected="true"]{ background:var(--ink); border-color:var(--ink); color:#fff; font-weight:600 }

.media__panels{ margin-top:36px; max-width:760px; margin-inline:auto }
.media__panel{ display:none }
.media__panel.is-active{ display:block; animation:fadeUp .3s ease both }
.media__en{ font-size:12px; font-weight:600; color:var(--brand) }
.media__panel h3{ margin-top:8px; font-size:26px; font-weight:700; letter-spacing:-.02em }
.media__d{ margin-top:14px; font-size:15px; color:var(--ink-2); line-height:1.8 }
.media__pts{ margin-top:20px; display:flex; flex-wrap:wrap; gap:8px }
.media__pts li{ font-size:13px; padding:8px 15px; border-radius:var(--pill); background:var(--surface-2); color:var(--ink-2) }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(8px) } to{ opacity:1; transform:none } }

/* ══════ 8. 성공사례 ══════ */
.cases__grid{ margin-top:44px; display:grid; grid-template-columns:repeat(3,1fr); gap:14px }
.case{
  border:1px solid var(--line); border-radius:var(--r-lg); padding:22px; background:var(--surface);
  display:flex; flex-direction:column; gap:12px; transition:.18s;
}
.case:hover{ border-color:var(--brand); transform:translateY(-2px) }
.case__tag{ align-self:flex-start; font-size:11px; font-weight:600; padding:5px 11px; border-radius:var(--pill);
  background:var(--brand-soft); color:var(--brand-ink) }
.case p{ font-size:14px; color:var(--ink-2); line-height:1.75; flex:1 }
.case cite{ font-style:normal; font-size:12.5px; color:var(--muted); text-align:right }

/* ══════ 9. 파트너 ══════ */
.partners{ background:var(--surface-2) }
.partners__inner{ display:grid; grid-template-columns:minmax(0,45%) minmax(0,55%); gap:48px; align-items:center }
.partners__chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:24px }
.partners__chips li{ font-size:12.5px; padding:7px 14px; border-radius:var(--pill);
  background:var(--brand-soft); color:var(--brand-ink); font-weight:600 }
.partners__cards{ display:grid; grid-template-columns:1fr 1fr; gap:14px }
.pcard2{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:18px }
.pcard2__img{ width:100%; height:128px; object-fit:cover; border-radius:10px; margin-bottom:14px;
  background:linear-gradient(135deg,#EFEAFD,#E4EDFB) }
.pcard2 strong{ display:block; font-size:15px; font-weight:700 }
.pcard2 p{ margin-top:6px; font-size:13px; color:var(--muted); line-height:1.7 }

/* ══════ 10. 로고월 ══════ */
.logos__grid{ margin-top:46px; display:grid; grid-template-columns:repeat(7,1fr); gap:10px }
.logos__grid li{
  height:74px; display:grid; place-items:center; border-radius:10px; background:#141418;
  font-size:13px; font-weight:700; letter-spacing:.02em; color:#fff; opacity:.72; transition:.18s;
}
.logos__grid li:hover{ opacity:1; background:#1C1C22 }
.logos__grid img{ max-height:26px; width:auto; filter:brightness(0) invert(1); opacity:.86 }
.logos__note{ margin-top:22px; text-align:center; font-size:12px; color:#6E6E79 }
.logos__note code{ background:#1C1C22; padding:2px 6px; border-radius:4px; font-size:11px }

/* ══════ 11. CTA 밴드 ══════ */
.cta-band{ background:linear-gradient(100deg,var(--brand) 0%,#8B4CF7 60%,#4F8BFF 100%); padding:0 }
.cta-band__inner{ min-height:210px; display:grid; place-items:center; text-align:center; padding-block:30px }
.cta-band p{ font-size:clamp(17px,2.4vw,26px); color:rgba(255,255,255,.82); line-height:1.5 }
.cta-band strong{ display:block; font-weight:700; color:#fff; margin-top:4px }

/* ══════ 12. 문의 폼 ══════ */
.contact__wrap{ max-width:820px }
.form{ margin-top:40px }
.form__tabs{ display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-bottom:28px }
.form__tabs button{
  height:52px; border-radius:10px; border:1px solid var(--d-line); background:transparent;
  font-size:14.5px; font-weight:600; color:#C9C9D2; transition:.15s;
}
.form__tabs button:hover{ border-color:#45454F; color:#fff }
.form__tabs button.is-on{ background:var(--accent); border-color:var(--accent); color:var(--accent-ink) }

.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden }
.form__row{ display:grid; grid-template-columns:1fr 1fr; gap:18px }
.field{ margin-bottom:18px }
.field label{ display:block; font-size:13.5px; font-weight:600; margin-bottom:9px; color:#E4E4EA }
.field label b{ color:var(--accent) }
.field label em{ font-style:normal; font-weight:400; font-size:12px; color:#7C7C87 }
.field input,.field select,.field textarea{
  width:100%; background:#131317; border:1px solid #2A2A32; border-radius:10px;
  padding:14px 15px; font-size:14.5px; color:#fff; transition:border-color .15s;
}
.field textarea{ resize:vertical; min-height:120px; line-height:1.8 }
.field input::placeholder,.field textarea::placeholder{ color:#5C5C66 }
.field input:focus,.field select:focus,.field textarea:focus{ border-color:var(--brand); outline:none }
.field select{ appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%237C7C87'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat:no-repeat; background-position:right 12px center; background-size:20px; padding-right:40px }
.field input[aria-invalid="true"],.field select[aria-invalid="true"]{ border-color:#FF6B6B }
.field__err{ min-height:0; font-size:12.5px; color:#FF8E8E; margin-top:6px }
.field__err:empty{ margin:0 }

.agree{ display:flex; align-items:center; gap:10px; margin:6px 0 4px; cursor:pointer; user-select:none }
.agree input{ position:absolute; opacity:0; width:0; height:0 }
.agree__box{ width:22px; height:22px; border-radius:50%; border:1.5px solid #45454F; flex:0 0 auto;
  display:grid; place-items:center; transition:.15s }
.agree__box::after{ content:'✓'; font-size:12px; font-weight:700; color:transparent; transition:.15s }
.agree input:checked + .agree__box{ background:var(--accent); border-color:var(--accent) }
.agree input:checked + .agree__box::after{ color:var(--accent-ink) }
.agree input:focus-visible + .agree__box{ outline:2px solid var(--brand); outline-offset:2px }
.agree__txt{ font-size:13.5px; color:#C9C9D2 }
.agree__txt b{ color:var(--accent) }
.agree__more{ font-size:12.5px; color:#8E8E99; text-decoration:underline; margin-left:2px }
.agree__panel{ margin:12px 0 4px; padding:16px 18px; border-radius:10px; background:#131317; border:1px solid #2A2A32 }
.agree__panel p{ font-size:12.5px; color:#9C9CA6; line-height:1.9 }
.agree__panel b{ color:#C9C9D2; margin-right:6px }

.btn--submit{ width:100%; height:56px; margin-top:20px; background:var(--brand); color:#fff; border-radius:10px; font-size:16px }
.btn--submit:hover{ background:var(--brand-ink) }
.form__note{ margin-top:14px; text-align:center; font-size:12.5px; color:#6E6E79 }
.form__result{ margin-top:16px; text-align:center; font-size:14px; font-weight:600; min-height:0 }
.form__result.ok{ color:var(--accent) }
.form__result.ng{ color:#FF8E8E }

/* ══════ FOOTER ══════ */
.foot{ background:#0B0B0D; color:#8E8E99; padding:54px 0 64px; border-top:1px solid #1C1C21 }
.foot__inner{ display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap }
/* 푸터 로고는 크기를 강제하지 않고 이미지 원래 크기 그대로 둡니다.
   (logo-light.png 324×90 · 화면이 좁으면 max-width 로만 줄어듭니다) */
.foot__logo{ display:inline-flex; flex-direction:column; align-items:flex-start;
  margin-bottom:18px; line-height:1 }
.foot__logo img{ width:auto; height:auto; max-width:100%; opacity:.92 }
.foot__logo span{ font-size:11px; letter-spacing:.14em; color:#5C5C66; margin-top:8px }
.foot__biz{ font-size:12px; line-height:2 }
.foot__copy{ margin-top:14px; font-size:12px; color:#5C5C66 }
.foot__right{ text-align:right }
.foot__tel{ font-size:26px; font-weight:700; color:#fff }
.foot__hours{ margin-top:6px; font-size:12px }
.foot__links{ margin-top:18px; display:flex; gap:16px; justify-content:flex-end; font-size:12px }
.foot__links a:hover{ color:#fff }

/* ══════ 하단 고정 바 ══════ */
.sticky-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:55;
  background:rgba(16,16,20,.96); border-top:1px solid #26262C; backdrop-filter:blur(10px);
  transform:translateY(100%); transition:transform .3s ease;
}
.sticky-bar.is-on{ transform:none }
.sticky-bar__inner{ display:flex; align-items:center; justify-content:center; gap:22px; padding:12px 24px }
.sticky-bar p{ font-size:14px; color:#D4D4DB }
.sticky-bar b{ color:var(--accent) }

/* ══════ 팝업 ══════ */
.pop{
  position:fixed; right:28px; bottom:28px; z-index:58; width:342px;
  border-radius:var(--r-lg); overflow:hidden; background:#fff;
  box-shadow:0 22px 60px rgba(0,0,0,.3); padding:26px 26px 0;
  background-image:linear-gradient(170deg,#F4F0FE 0%,#FFFFFF 46%);
  opacity:0; transform:translateY(16px); transition:opacity .3s ease, transform .3s ease;
}
.pop.is-on{ opacity:1; transform:none }
.pop__x{ position:absolute; top:14px; right:14px; width:28px; height:28px; border-radius:50%;
  background:rgba(0,0,0,.06); color:#5C5C66; font-size:17px; line-height:1; display:grid; place-items:center }
.pop__x:hover{ background:rgba(0,0,0,.12) }
.pop__brand{ text-align:center; font-size:14px; font-weight:800; letter-spacing:.06em; color:#1A1A1F }
.pop__kicker{ margin-top:20px; text-align:center; font-size:12.5px; font-weight:600; color:var(--brand) }
.pop__title{ margin-top:8px; text-align:center; font-size:20px; font-weight:700; line-height:1.4; color:#15151A }
.pop__title em{ font-style:normal; color:var(--brand) }
.pop__list{ margin-top:18px; display:flex; flex-direction:column; align-items:center; gap:8px }
.pop__list li{ font-size:12.5px; color:#3A3A40; background:#fff; padding:8px 15px; border-radius:var(--pill);
  box-shadow:0 2px 8px rgba(0,0,0,.06) }
.pop__list li::before{ content:'✓'; color:var(--brand); font-weight:700; margin-right:6px }
.pop__foot{ margin-top:20px; text-align:center; font-size:12.5px; color:#76767E }
.pop__cta{ display:block; margin:18px -26px 0; padding:17px; text-align:center;
  background:var(--brand); color:#fff; font-size:15px; font-weight:700 }
.pop__cta:hover{ background:var(--brand-ink) }

/* ══════ 전화 연결 확인창 ══════ */
.modal{ position:fixed; inset:0; z-index:200; display:grid; place-items:center; padding:20px }
.modal[hidden]{ display:none }
.modal__dim{ position:absolute; inset:0; background:rgba(10,10,14,.55); animation:mdFade .18s ease both }
.modal__box{
  position:relative; width:100%; max-width:340px; background:#fff;
  border-radius:18px; padding:30px 26px 22px; text-align:center;
  box-shadow:0 24px 60px rgba(0,0,0,.26);
  animation:mdPop .2s cubic-bezier(.2,.9,.3,1.3) both;
}
.modal__icon{
  width:52px; height:52px; margin:0 auto 16px; border-radius:50%;
  display:grid; place-items:center; background:var(--brand-soft); color:var(--brand);
}
.modal__title{ font-size:16px; font-weight:600; color:var(--muted); letter-spacing:-.01em }
.modal__num{
  margin-top:6px; font-size:25px; font-weight:800; color:var(--ink);
  letter-spacing:-.02em; font-variant-numeric:tabular-nums;
}
.modal__hours{ margin-top:10px; font-size:12.5px; color:var(--muted) }
.modal__btns{ display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:24px }
.modal__btn{
  height:50px; border-radius:var(--pill); font-size:15.5px; font-weight:700;
  transition:background-color .15s ease, transform .12s ease;
}
.modal__btn:active{ transform:scale(.97) }
.modal__btn--no{ background:var(--surface-2); color:var(--ink-2); border:1px solid var(--line) }
.modal__btn--no:hover{ background:#EFEFF2 }
.modal__btn--yes{ background:var(--brand); color:#fff }
.modal__btn--yes:hover{ background:var(--brand-ink) }

@keyframes mdFade{ from{ opacity:0 } to{ opacity:1 } }
@keyframes mdPop{ from{ opacity:0; transform:translateY(12px) scale(.96) } to{ opacity:1; transform:none } }

/* ══════ 반응형 ══════ */
@media (max-width:1100px){
  .nav__menu{ gap:18px }
  .nav__menu a{ font-size:13px }
  .logos__grid{ grid-template-columns:repeat(5,1fr) }
}
@media (max-width:900px){
  .nav__inner{ gap:12px; padding:0 16px }
  .nav__tel{ margin-left:auto }
  .nav__burger{ margin-left:0 }
  .hero__title{ line-height:1.38 }
  .hero__sub{ padding:0 4px }
  .nav__menu{
    position:fixed; inset:var(--nav-h) 0 auto 0; background:#0B0B0D; flex-direction:column;
    align-items:flex-start; gap:0; padding:8px 0 20px; border-bottom:1px solid #1C1C21;
    max-height:calc(100svh - var(--nav-h)); overflow-y:auto; display:none;
  }
  .nav__menu.is-open{ display:flex }
  .nav__menu a{ width:100%; padding:14px 20px; font-size:15px }
  .nav__tel span{ display:none }
  .nav__burger{ display:flex }

  .hero{ min-height:88svh }
  .hero__cta{ flex-direction:column; width:100%; max-width:320px; border-radius:var(--r-lg); padding:8px }
  .hero__cta .btn{ width:100% }

  .stats__grid,.summary__grid{ grid-template-columns:1fr 1fr }
  .stat__art{ height:78px }
  .report__inner{ flex-direction:column; align-items:flex-start; text-align:left }
  .report__art{ align-self:center }
  .report__art svg{ width:150px; height:102px }

  .acc__head{ grid-template-columns:1fr auto; gap:8px 10px; padding:20px 4px }
  .acc__who{ grid-column:1; grid-row:2 }
  .acc__tag{ grid-column:2; grid-row:1 }
  .acc__arrow{ grid-column:2; grid-row:2; justify-self:end }
  .acc__body{ padding:0 4px 22px }

  .feat__stage{ min-height:0 }
  .feat__slide{ position:absolute }
  .feat__slide.is-active{ position:relative }
  .feat__row{ grid-template-columns:1fr; gap:26px }
  .map__pills{ position:static; flex-direction:row; flex-wrap:wrap; padding:14px; justify-content:center }

  .cards3{ grid-template-columns:1fr }
  .cases__grid{ grid-template-columns:1fr }
  .partners__inner{ grid-template-columns:1fr; gap:28px }
  .partners__cards{ grid-template-columns:1fr 1fr }
  .logos__grid{ grid-template-columns:repeat(3,1fr) }

  .form__tabs{ grid-template-columns:1fr 1fr; gap:8px }
  .form__tabs button{ height:46px; font-size:13.5px }
  .form__row{ grid-template-columns:1fr; gap:0 }

  .foot__inner{ flex-direction:column }
  .foot__right{ text-align:left }
  .foot__links{ justify-content:flex-start }

  /* 모바일: 팝업 숨기고 하단 바만 */
  .pop{ display:none }
  .sticky-bar__inner{ gap:12px; padding:10px 16px }
  .sticky-bar p{ font-size:12.5px; line-height:1.45 }
}
@media (max-width:420px){
  .logos__grid{ grid-template-columns:repeat(2,1fr) }
  .partners__cards{ grid-template-columns:1fr }
}
