/* 견적 조합기 · 영수증형(2026-11-05 대표 확정) — 시안 페이지(estimate-1)·구독 페이지·홈이 같이 쓴다 */
.e-cfg{padding:14vh 0 16vh}
.e-top{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:5vh}
.e-top h2{font-size:clamp(34px,4.2vw,68px);font-weight:700;letter-spacing:-.05em;line-height:1.05}
.e-top .mono{display:block;opacity:.6;margin-bottom:22px}
.e-grid{display:grid;grid-template-columns:7fr 5fr;gap:5vw;align-items:start}

/* 왼쪽 항목 줄 */
.er-rows{border-top:1px solid var(--ink)}
.er-row{position:relative;display:grid;grid-template-columns:44px 26px 1fr auto;gap:16px;align-items:center;padding:22px 18px;border-bottom:1px solid var(--ln);cursor:pointer;isolation:isolate;transition:color .45s;user-select:none}
.er-row::before{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleY(0);transform-origin:bottom;transition:transform .55s cubic-bezier(.7,0,.2,1);z-index:-1}
.er-row input{position:absolute;opacity:0;width:1px;height:1px}
.er-row .er-n{opacity:.5}
.er-row .er-nm{font-size:clamp(19px,1.7vw,26px);font-weight:700;letter-spacing:-.04em;transition:transform .55s cubic-bezier(.7,0,.2,1)}
.er-row .er-nm small{display:block;font-size:13px;font-weight:400;letter-spacing:0;opacity:.6;margin-top:4px}
.er-row .er-pr{font-family:var(--mono);font-size:14px;text-align:right;white-space:nowrap}
.er-row.on{color:var(--white)}
.er-row.on::before{transform:scaleY(1);transform-origin:top}
.er-row.on .er-nm{transform:translateX(8px)}
.er-row.on .e-box svg{stroke:var(--ink)}
.er-row.fx{cursor:default}
.er-row.fx .er-pr s{opacity:.5;margin-right:6px}
.e-tools{margin-top:22px}

/* 오른쪽 계산서 */
.rc-wrap{position:sticky;top:96px}
.rc{position:relative;background:#FBFAF7;color:var(--ink);padding:30px 30px 46px;box-shadow:0 30px 60px -30px rgba(11,12,16,.35);
  -webkit-mask:linear-gradient(#000 0 0) top/100% calc(100% - 12px) no-repeat,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/16px 12px repeat-x;
          mask:linear-gradient(#000 0 0) top/100% calc(100% - 12px) no-repeat,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/16px 12px repeat-x}
.rc-hd{text-align:center;padding-bottom:18px;border-bottom:1px dashed rgba(11,12,16,.35)}
.rc-hd b{display:block;font-size:20px;letter-spacing:-.03em;margin-top:8px}
.rc-hd span{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.06em;opacity:.6;margin-top:6px}
.rc-lines{list-style:none;padding:10px 0;min-height:60px;border-bottom:1px dashed rgba(11,12,16,.35)}
.rc-lines li{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:14px;overflow:hidden}
.rc-lines li em{font-style:normal;opacity:.55;font-size:12px;margin-left:6px}
.rc-lines li .p{font-family:var(--mono);font-size:13px;white-space:nowrap}
.rc-lines li .p s{opacity:.45;margin-right:6px}
.rc-lines .empty{opacity:.5;justify-content:center}
.rc-sub{position:relative;display:flex;justify-content:space-between;font-size:14px;padding:14px 0 6px}
.rc-sub .p{font-family:var(--mono);position:relative}
.rc-sub .p::after{content:"";position:absolute;left:-4px;right:-4px;top:50%;height:2px;background:var(--navy);transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.7,0,.2,1)}
.rc.capped .rc-sub .p::after{transform:scaleX(1)}
.rc-tot{display:flex;justify-content:space-between;align-items:baseline;padding-top:12px;border-top:2px solid var(--ink);margin-top:8px}
.rc-tot > span{font-size:15px;font-weight:600}
.rc-tot b{font-size:clamp(34px,3vw,46px);letter-spacing:-.05em;color:var(--navy);font-variant-numeric:tabular-nums}
.rc-tot b small{font-size:.42em;letter-spacing:0;color:var(--ink);margin-left:4px}
.rc-vat{text-align:right;font-size:12px;opacity:.6;margin-top:2px}
.rc-save{font-size:14px;font-weight:600;margin-top:14px;min-height:1.4em}
.rc .e-note{color:rgba(11,12,16,.66);margin-top:6px}
.stamp{position:absolute;left:50%;top:50%;margin:-34px 0 0 -74px;width:148px;z-index:2;border:3px solid var(--navy);color:var(--navy);padding:10px 14px;text-align:center;transform:rotate(-8deg) scale(0);opacity:0;pointer-events:none;background:rgba(251,250,247,.86)}
.stamp b{display:block;font-size:18px;letter-spacing:-.02em}
.stamp span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.08em}
.rc-btn{display:block;text-align:center;margin-top:18px;font-weight:700;font-size:15px;padding:16px;background:var(--ink);color:var(--white);transition:background .3s}
.rc-btn:hover{background:var(--navy)}
.rc-bar{display:none}

@media (max-width:860px){
  .e-top{flex-direction:column;align-items:flex-start}
  .e-grid{grid-template-columns:1fr}
  .er-row{grid-template-columns:24px 20px 1fr auto;gap:8px;padding:9px 6px}
  .er-row .er-nm{font-size:16px}
  /* 휴대폰은 횟수만 이름 옆 한 줄로(긴 설명은 숨김) */ .er-row .er-nm small{display:inline;font-size:12px;margin:0 0 0 6px} .er-row .er-nm .er-nt{display:none}
  .er-row .er-pr{font-size:13px}
  .e-tools{margin-top:16px}
  .er-row.on .er-nm{transform:none}
  /* 계산서는 아래 띠로 접힘 */
  .rc-wrap{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:60;transform:translateY(110%);transition:transform .45s cubic-bezier(.7,0,.2,1)}
  .rc-wrap.show{transform:none}
  .rc{-webkit-mask:none;mask:none;box-shadow:0 -12px 40px rgba(11,12,16,.25);padding:0 20px;max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.7,0,.2,1),padding .5s}
  .rc-wrap.open .rc{max-height:72vh;overflow-y:auto;padding:22px 20px 26px}
  .rc-bar{display:flex;justify-content:space-between;align-items:center;width:100%;border:0;background:var(--ink);color:var(--white);padding:16px 20px;font:600 15px var(--sans);cursor:pointer}
  .rc-bar b{font-size:20px;letter-spacing:-.03em}
}
