/* Atorni 새 홈 표면 2/2 — **원본 CSS 기계 변환본**.
 * 정본 = _design/outbox/20260802_new_site_migration/site/index.html <style>
 * 변환 규칙: `:root`·`body` → `.site`, 나머지 선택자 앞에 `.site ` 부착. 값은 손대지 않았다.
 * ⚠️ 손으로 고치지 말 것 — 디자인을 바꾸려면 원본 파일을 고치고 다시 변환한다.
 */
.site .qanote { margin-top:26px;padding-top:20px;border-top:1px solid var(--sage-line);font-size:13.5px;color:var(--ink-45);max-width:60ch }
.site .signer { display:flex;align-items:center;gap:14px;margin-top:34px;padding-top:26px;border-top:1px solid var(--sage-line) }
.site .signer .avph { border-radius:100px;width:54px;height:54px;flex-shrink:0;overflow:hidden;background:#DCE7DF }
.site .signer .avph img { width:100%;height:100%;object-fit:cover }
.site .signer strong { font-family:var(--sans);font-weight:600;font-size:16px;color:var(--ink) }
.site .signer p { font-size:14px;color:var(--ink-45);margin-top:2px;max-width:40ch }
@media(min-width:920px) {
  .site .answer .wrapg { grid-template-columns:.8fr 1.2fr;gap:64px }
}
.site .svc { display:grid;gap:16px }
.site .card { border:1px solid var(--line);border-radius:10px;padding:26px 24px 24px;text-decoration:none;display:flex;flex-direction:column;transition:border-color .15s,transform .15s }
.site .card:hover { border-color:var(--forest);transform:translateY(-2px) }
.site .card .tag { font-family:var(--sans);font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--forest);background:var(--sage);padding:4px 9px;border-radius:4px;display:inline-block }
.site .card h3 { margin:16px 0 9px;font-family:var(--serif);font-weight:400;font-size:27px;letter-spacing:-.01em }
.site .card p { font-size:15.5px;color:var(--ink-70);margin-bottom:20px }
.site .card .price { margin-top:auto;padding-top:15px;border-top:1px solid var(--line);font-size:14px;color:var(--ink-45);display:flex;justify-content:space-between;align-items:center }
.site .card .price b { font-family:var(--sans);font-weight:600;color:var(--ink);font-size:16px }
@media(min-width:840px) {
  .site .svc { grid-template-columns:repeat(3,1fr) }
}
.site .step { display:grid;grid-template-columns:auto 1fr;gap:20px;padding:24px 0;border-top:1px solid var(--line) }
.site .step:last-child { border-bottom:1px solid var(--line) }
.site .step-n { font-family:var(--serif);font-size:26px;line-height:1;color:var(--forest);width:34px }
.site .step p { color:var(--ink-70);font-size:15.5px;margin-top:6px;max-width:56ch }
.site .casegrid { display:grid;gap:26px }
.site .casegrid h2 { max-width:17ch }
.site .casebody p { color:var(--ink-70);font-size:17px;max-width:56ch }
.site .tm { font-size:.55em;vertical-align:super;line-height:0;letter-spacing:.02em }
.site .casebody p+p { margin-top:18px;padding-top:18px;border-top:1px solid var(--line) }
@media(min-width:920px) {
  .site .casegrid { grid-template-columns:.9fr 1.1fr;gap:60px }
  .site .casebody { padding-top:34px }
}
.site .att { background:var(--mist);border-radius:12px;padding:30px 24px;display:grid;gap:26px }
.site .ph { width:100%;height:100%;display:flex;align-items:center;justify-content:center;text-align:center;font-size:12px;color:var(--ink-45);letter-spacing:.04em;padding:18px;line-height:1.5;background:repeating-linear-gradient(135deg,#EDEBE4,#EDEBE4 12px,#F6F4EF 12px,#F6F4EF 24px) }
.site .att .phbox { border-radius:8px;aspect-ratio:1/1;overflow:hidden;background:#EDEBE4 }
.site .att .phbox img { width:100%;height:100%;object-fit:cover }
.site .att h3.name { font-family:var(--serif);font-weight:400;font-size:34px;letter-spacing:-.02em;margin-top:12px }
.site .att .role { color:var(--ink-70);margin-top:5px;font-size:16px }
.site .att p.bio { margin-top:16px;color:var(--ink-70);font-size:16px;max-width:50ch }
.site .regs { margin-top:22px;padding-top:18px;border-top:1px solid var(--line);display:grid;gap:9px;font-size:14px;color:var(--ink-70) }
.site .regs b { font-weight:600;color:var(--ink) }
@media(min-width:840px) {
  .site .att { grid-template-columns:250px 1fr;padding:38px;gap:40px;align-items:start }
}
.site .testi { border:1px solid var(--line);border-radius:12px;overflow:hidden;display:grid }
.site .testi .phbox { aspect-ratio:16/10;overflow:hidden;background:#EDEBE4 }
.site .testi .phbox img { width:100%;height:100%;object-fit:cover }
.site .testi-body { padding:28px 24px }
.site .testi-body blockquote { font-family:var(--serif);font-weight:400;font-size:clamp(24px,3.4vw,34px);letter-spacing:-.015em;line-height:1.16;max-width:22ch }
.site .testi-body .who { margin-top:20px;font-size:14.5px;color:var(--ink-45) }
/* [SITE-7] 후기 = 큰 인용문 하나 + 사연으로 가는 링크(위·아래 중복 문구 제거). */
.site .testi-body .testi-link { display:inline-block;margin-top:22px;font-size:15px;font-weight:600;color:var(--forest);text-decoration:none;border-bottom:1px solid var(--sage-line);padding-bottom:2px }
.site .testi-body .testi-link:hover { border-bottom-color:var(--forest) }
@media(min-width:840px) {
  .site .testi { grid-template-columns:1fr 1fr;align-items:center }
  .site .testi-body { padding:44px }
}
.site .pricebox { border:1.5px solid var(--ink);border-radius:12px;padding:32px 26px;background:#fff;max-width:580px }
.site .pricebox .big { font-family:var(--serif);font-size:clamp(40px,7vw,58px);letter-spacing:-.025em;line-height:1 }
.site .pricebox .big small { font-family:var(--sans);font-size:16px;font-weight:500;color:var(--ink-45);letter-spacing:0;margin-left:10px }
.site .pricelist { margin-top:24px;display:grid;gap:12px;font-size:15.5px;color:var(--ink-70) }
.site .pricelist li { list-style:none;display:flex;gap:11px }
.site .pricelist svg { flex-shrink:0;margin-top:5px }
.site .pricegrid { display:grid;gap:32px;align-items:stretch }
.site .priceleft { display:flex;flex-direction:column }
.site .priceleft .pricebox { max-width:none }
.site .priceimg { border-radius:12px;overflow:hidden;min-height:320px;background:#EDEBE4 }
@media(min-width:900px) {
  .site .pricegrid { grid-template-columns:1.02fr .98fr;gap:56px }
  .site .priceimg { min-height:100% }
}
.site .final { background:var(--forest);text-align:center }
.site .final h2 { color:#fff;max-width:16ch;margin:0 auto }
.site .final p { color:#AFC6BB;margin-top:16px;font-size:17.5px }
.site .final .btn { margin-top:28px }
.site footer { background:var(--ink);color:#8C959C;font-size:14px;padding:54px 0 40px }
.site .f-top { display:grid;gap:30px;padding-bottom:32px;border-bottom:1px solid #262C31 }
.site .f-col h4 { font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#5E676E;margin-bottom:14px }
.site .f-col a { display:block;color:#C4CBD1;text-decoration:none;margin-bottom:9px }
.site .f-col a:hover { color:#fff }
.site .disclaimer { margin-top:30px;font-size:12.5px;line-height:1.7;color:#6D767D;max-width:none }
.site .disclaimer b { color:#98A1A8;font-weight:600 }
.site .f-legal { margin-top:22px;font-size:12.5px;color:#5E676E }
.site .f-entities { margin-top:22px;display:grid;gap:7px;font-size:12.5px;color:#6D767D;line-height:1.6 }
.site .f-entities b { color:#98A1A8;font-weight:600 }
.site .f-entities a { color:#C4CBD1;text-decoration:none }
.site .f-entities a:hover { color:#fff }
.site .f-bottom { margin-top:30px;padding-top:22px;border-top:1px solid #262C31;display:flex;flex-direction:column;gap:12px;font-size:12.5px;color:#5E676E }
.site .f-bottom-links { display:flex;gap:22px }
.site .f-bottom-links a { color:#8C959C;text-decoration:none }
.site .f-bottom-links a:hover { color:#fff }
@media(min-width:840px) {
  .site .f-top { grid-template-columns:1.6fr 1fr 1fr 1fr }
  .site .f-bottom { flex-direction:row;justify-content:space-between;align-items:center }
}
.site .burger { display:flex;flex-direction:column;justify-content:center;gap:4px;width:40px;height:38px; background:none;border:none;cursor:pointer;padding:0 8px }
.site .burger i { display:block;height:1.8px;background:var(--ink);border-radius:2px;transition:.2s }
.site .msheet { position:fixed;inset:0;z-index:200;background:var(--paper);display:flex;flex-direction:column; transform:translateY(-100%);transition:transform .26s ease;visibility:hidden }
.site .msheet.open { transform:translateY(0);visibility:visible }
.site .mtopbar { display:flex;align-items:center;justify-content:space-between;height:62px;padding:0 20px; border-bottom:1px solid var(--line);flex-shrink:0 }
.site .mclose { background:none;border:none;font-size:26px;line-height:1;color:var(--ink);cursor:pointer;padding:0 6px }
.site .mlist { flex:1;overflow-y:auto;padding:8px 20px 20px }
.site .macc { border-bottom:1px solid var(--line) }
.site .macc>button { width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px; background:none;border:none;font-family:var(--sans);font-size:19px;font-weight:500;color:var(--ink); padding:18px 2px;cursor:pointer;text-align:left }
.site .macc>button svg { transition:transform .2s;color:var(--ink-45);flex-shrink:0 }
.site .macc.open>button svg { transform:rotate(180deg) }
.site .macc .sub { display:none;padding:0 2px 16px }
.site .macc.open .sub { display:block }
.site .macc .sub a { display:block;font-size:16px;color:var(--ink-70);text-decoration:none;padding:9px 0 9px 14px; border-left:1px solid var(--line) }
.site .macc .sub a:hover { color:var(--forest) }
.site .macc .sub .off { display:block;font-size:16px;color:#BFC5C0;padding:9px 0 9px 14px;border-left:1px solid var(--line) }
.site .mfootbar { padding:16px 20px calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--line);flex-shrink:0 }
.site .mfootbar .btn { width:100% }
.site .mlang { width:100%;display:block;text-align:center;text-decoration:none;box-sizing:border-box;margin-top:10px;font-size:14px;font-weight:600;color:var(--ink-70); border:1px solid var(--line);border-radius:8px;padding:12px;background:none;font-family:var(--sans);cursor:pointer }
.site.locked { overflow:hidden }
@media(min-width:1060px) {
  .site .burger { display:none }
  .site .msheet { display:none }
}

/* ── 모바일 시트: 로그인 + 언어 (대표님 2026-08-07) ───────────────
   좁은 화면에선 드롭다운 대신 두 칸을 그냥 편다 — 손가락엔 이쪽이 낫다. */
.site .mlogin {
  display:block;text-align:center;text-decoration:none;box-sizing:border-box;margin-top:10px;
  font-size:14px;font-weight:600;color:var(--ink-70);
  border:1px solid var(--line);border-radius:8px;padding:12px
}
.site .mlangs { display:flex;gap:8px;margin-top:10px }
.site .mlangs .langopt {
  flex:1;text-align:center;font-family:var(--sans);font-size:14px;font-weight:600;
  color:var(--ink-70);background:none;border:1px solid var(--line);border-radius:8px;
  padding:12px 0;cursor:pointer
}
.site .mlangs .langopt.on { border-color:var(--sage-line);background:var(--sage);color:var(--forest) }
