/* ═══════════════════════════════════════════════════════════════════
   ledger.css — the Ledger design layer. Loads after site.css and the
   page stylesheets, and states the few things the whole site now shares:
   one paper ground, one ink, one accent, two type families, three radii.
   The palette itself was moved into site.css tokens; this file removes
   the surfaces that no longer belong (glass, gradients, grain, photos
   behind text) and sets the components that every page repeats.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Ground and type ─────────────────────────────────────────────── */
html{background:#F6F4EE;}
body{background:#F6F4EE;color:#141A1F;font-family:'IBM Plex Sans','IBM Plex Sans KR','Helvetica Neue',Arial,sans-serif;
  -webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;}
html[lang^="ko"] body{font-family:'IBM Plex Sans KR','IBM Plex Sans','Apple SD Gothic Neo','Malgun Gothic',sans-serif;word-break:keep-all;}
h1,h2,h3,.h1,.h2,.h3,.disp,.nav .logo,.bigfooter .brand .logo,.price,.stat .n,.num.big{
  font-family:'Bricolage Grotesque','IBM Plex Sans',sans-serif;font-optical-sizing:auto;font-weight:600;letter-spacing:-.02em;}
html[lang^="ko"] h1,html[lang^="ko"] h2,html[lang^="ko"] h3,html[lang^="ko"] .h1,html[lang^="ko"] .h2,html[lang^="ko"] .h3{
  font-family:'IBM Plex Sans KR','Apple SD Gothic Neo','Malgun Gothic',sans-serif;font-weight:700;letter-spacing:-.02em;line-height:1.22;}
html[lang^="ko"] .nav .logo,html[lang^="ko"] .bigfooter .brand .logo{font-family:'Bricolage Grotesque',sans-serif;font-weight:600;}
h1{font-size:clamp(36px,4.4vw,60px);line-height:1.04;}
html[lang^="ko"] h1{font-size:clamp(30px,3.9vw,54px);line-height:1.22;}
.h2,h2{font-size:clamp(28px,3vw,40px);line-height:1.1;color:#141A1F;}
html[lang^="ko"] .h2,html[lang^="ko"] h2{font-size:clamp(24px,2.6vw,36px);line-height:1.28;}
.lead,.sub,.lede{color:#3B454D;}
.mono,.num,code,kbd,[data-tel-label],.telcta b{font-family:'IBM Plex Mono','SFMono-Regular',Consolas,monospace;}
.h1 .huge,h1 .huge{letter-spacing:-.03em;}
a{color:#0B7878;}
a:hover{color:#141A1F;}

/* ── Surfaces that the direction removes ──────────────────────────── */
.bgimg,.scrim,.tint,.grainlayer,.grain,.stars,.aurora,
section.bg-grid::before,section.bg-grid::after,section.bg-spot::before,section.bg-spot::after,
section.bg-dusk::before,section.bg-dusk::after,section.bg-aurora::before,section.bg-aurora::after,
.hero::before,.hero::after{display:none !important;}
.sec-dark,.sec-dark2,.nightsec,.bg-dusk,.bg-grid,.bg-spot,.bg-aurora,.hero,.photohero,header.nophoto,
.closer,.bigfooter{background:#F6F4EE !important;background-image:none !important;}
.sec-light,.sec-light2,.bg-paper,.bg-clinical{background:#FFFFFF !important;background-image:none !important;}
.gradtext,.gradtext.warm,h1 .gradtext,.h2 .gradtext{background:none !important;-webkit-background-clip:initial !important;
  background-clip:initial !important;-webkit-text-fill-color:currentColor !important;color:#141A1F !important;}
[class*="glass"],.hero-panel,.heroband{background:none !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
  border:0 !important;box-shadow:none !important;padding:0 !important;}
*{text-shadow:none !important;}

/* ── Rhythm ───────────────────────────────────────────────────────── */
.wrap{max-width:1240px;padding:0 56px;}
section,.sec{border-top:1px solid #E2DDD3;}
section.hero,section:first-of-type,.hero + section{border-top:0;}
.sec-light + .sec-light,.sec-dark + .sec-dark{border-top:1px solid #E2DDD3;}

/* ── Nav: a bar on the paper, not a floating pill ─────────────────── */
.navwrap{background:rgba(246,244,238,.92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid #E2DDD3;}
.navwrap .nav,.nav{background:none !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;
  backdrop-filter:none !important;-webkit-backdrop-filter:none !important;padding:0 !important;min-height:64px;gap:28px;}
.nav .logo{color:#141A1F;font-size:20px;}
.nav .ver{display:none !important;}
.nav .links,.nav .navtop{color:#3B454D;font-weight:500;font-size:15px;letter-spacing:0;}
.nav .navtop:hover,.nav .navtop[aria-expanded="true"],.nav .navtop.on{color:#141A1F;}
.nav .telcta b{color:#141A1F;font-weight:500;}
.nav .telcta{color:#3B454D;}
.langsw{border-color:#E2DDD3;color:#3B454D;border-radius:6px;}
.langsw:hover{border-color:#141A1F;color:#141A1F;background:none;}
.nav .burger span{background:#141A1F;}
.navpanel{background:#FFFFFF !important;border:1px solid #E2DDD3 !important;border-radius:14px !important;
  box-shadow:0 1px 2px rgba(20,26,31,.05),0 24px 48px -24px rgba(20,26,31,.25) !important;backdrop-filter:none !important;
  color:#141A1F;--tx:#141A1F;--tx2:#3B454D;--tx3:#616B75;}
.navpanel .np-h{color:#616B75;letter-spacing:.06em;font-size:12px;}
.navpanel a{color:#141A1F;}
.navpanel a:hover{color:#0B7878;}

/* ── Buttons: one solid accent, one outline, one text link ───────── */
.btn{border-radius:8px;padding:0 22px;min-height:52px;gap:10px;font-weight:600;font-size:16px;letter-spacing:0;
  box-shadow:none !important;background-image:none !important;transition:background .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease);}
.btn .cir{display:none !important;}
.btn-teal,.btn-white,.plan .cta.teal,.btn-primary,body[data-chan] .btn-teal{background:#0B7878 !important;color:#FFFFFF !important;border:1px solid #0B7878 !important;}
.btn-teal:hover,.btn-white:hover,.plan .cta.teal:hover,.btn-primary:hover,body[data-chan] .btn-teal:hover{background:#0A5F5F !important;border-color:#0A5F5F !important;color:#FFFFFF !important;}
.btn-ghostd,.btn-ghost,.btn-outline,.plan .cta{background:none !important;color:#141A1F !important;border:1px solid #CFC9BC !important;}
.btn-ghostd:hover,.btn-ghost:hover,.btn-outline:hover,.plan .cta:hover{border-color:#141A1F !important;}
.btn:active{transform:none;}
.nav .btn{min-height:40px;padding:0 16px;font-size:14px;}
.linkcta{border-bottom:0;color:#0B7878;font-weight:600;padding-bottom:0;}
.linkcta:hover{color:#141A1F;}
.hero .ctas{gap:24px;align-items:center;}
.hero .ctas .btn-ghostd{background:none !important;border:0 !important;color:#0B7878 !important;padding:0 !important;font-weight:600;}
.hero .ctas .btn-ghostd:hover{color:#141A1F !important;}

/* ── Labels, chips, pills ─────────────────────────────────────────── */
.eyebrow{border:0 !important;background:none !important;padding:0 !important;border-radius:0;gap:0;
  font-size:12px;letter-spacing:.08em;font-weight:600;color:#616B75;text-transform:uppercase;margin-left:0 !important;}
html[lang^="ko"] .eyebrow{text-transform:none;letter-spacing:.06em;}
.eyebrow i{display:none !important;}
.chip,.exfilter button{background:none;border:1px solid #CFC9BC;color:#3B454D;border-radius:999px;box-shadow:none;}
.chip:hover,.exfilter button:hover{border-color:#141A1F;color:#141A1F;}
.chip.on,.exfilter button.on{background:#141A1F;border-color:#141A1F;color:#FFFFFF;}
.herotrio{display:none !important;}
.appwin .bar .illus,.illus{border:0;padding:0;letter-spacing:.04em;text-transform:none;color:#616B75;font-weight:500;}
.appwin .bar .closed{color:#8D642F;letter-spacing:.04em;text-transform:none;font-weight:600;}

/* ── Cards and windows: one white sheet, one shadow ──────────────── */
.appwin,.plan,.plan.dark,.custcard,.quotedoc,.statcard,.pkcard,.regcard,.tdcard,.kpitile,
.pipecol,.pipecolx,.proofcard,.audcard,.pack,.thumb,.reccard,.qbcard,.d60card,.faq details,.ownerbox,.card{
  background:#FFFFFF !important;background-image:none !important;border:1px solid #E2DDD3 !important;border-radius:14px !important;
  color:#141A1F;--tx:#141A1F;--tx2:#3B454D;--tx3:#616B75;--teal-deep:#0A5F5F;--amber:#B7791F;
  box-shadow:0 1px 2px rgba(20,26,31,.05),0 24px 48px -32px rgba(20,26,31,.22) !important;}
.sec-light .appwin,.sec-light2 .appwin,.bg-paper .appwin,.bg-clinical .appwin,.sec-light .altcol.win,.sec-light2 .altcol.win{
  color:#141A1F;--tx:#141A1F;--tx2:#3B454D;--tx3:#616B75;}
.appwin .bar{background:#F6F4EE;border-bottom:1px solid #E2DDD3;}
.appwin .bar i{background:#CFC9BC;}
.icard:hover,.photocard:hover,.plan:hover,.thumb:hover,.pack:hover,.audcard:hover{transform:none;border-color:#141A1F;
  box-shadow:0 1px 2px rgba(20,26,31,.05),0 24px 48px -32px rgba(20,26,31,.22) !important;}
.icard.photocard{border-radius:14px;box-shadow:0 1px 2px rgba(20,26,31,.05),0 24px 48px -32px rgba(20,26,31,.22);}
.plan .pop{border-color:#0B7878;color:#0B7878;}
.plan .nm{color:#616B75;}
.baCol,.baGrid > div{background:#FFFFFF;border:1px solid #E2DDD3;border-radius:14px;}
.baCol.after{border-color:#0B7878;}
.faq summary:after{color:#0B7878;}
.dtable th,.dtable td{border-color:#E2DDD3;}
.dtable thead th{color:#616B75;font-size:12px;letter-spacing:.06em;text-transform:uppercase;}
input,select,textarea{background:#FFFFFF;border:1px solid #CFC9BC;border-radius:8px;color:#141A1F;}
input:focus,select:focus,textarea:focus{border-color:#0B7878;outline:none;box-shadow:0 0 0 3px rgba(11,120,120,.15);}
:focus-visible{outline:2px solid #0B7878;outline-offset:3px;box-shadow:none !important;}

/* ── The record card in the hero ─────────────────────────────────── */
.reccard{padding:22px 26px 18px;display:flex;flex-direction:column;gap:16px;max-width:520px;}
.reccard .rc-top{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.reccard .pill{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;
  font-size:12px;font-weight:600;background:rgba(11,120,120,.10);color:#0B7878;letter-spacing:.02em;}
.reccard .pill svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.reccard .rc-when{font-size:14px;color:#616B75;}
.reccard .rc-kicker{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#616B75;font-weight:600;margin:0;}
html[lang^="ko"] .reccard .rc-kicker{text-transform:none;letter-spacing:.06em;}
.reccard .rc-title{font-size:24px;margin:2px 0 0;line-height:1.25;}
.reccard .rc-rows{display:flex;flex-direction:column;}
.reccard .rc-row{display:grid;grid-template-columns:104px minmax(0,1fr);gap:14px;padding:12px 0;border-top:1px solid #EEEAE2;align-items:baseline;}
.reccard .rc-row:first-child{border-top:0;}
.reccard .rc-lbl{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#616B75;font-weight:600;}
html[lang^="ko"] .reccard .rc-lbl{text-transform:none;font-size:13px;}
.reccard .rc-val{margin:0;font-weight:500;color:#141A1F;line-height:1.45;}
.reccard .rc-note{margin:2px 0 0;font-size:13px;color:#616B75;line-height:1.5;}
.reccard .rc-foot{margin:0;font-size:13px;color:#616B75;border-top:1px solid #EEEAE2;padding-top:12px;line-height:1.5;}
.hero-inner:has(.heroshelf){display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:72px;align-items:center;padding-top:96px !important;padding-bottom:88px;}
.hero .heroband{max-width:640px;}
.hero .sub{font-size:clamp(17px,1.35vw,20px);line-height:1.5;margin-top:24px;max-width:560px;}
html[lang^="ko"] .hero .sub{line-height:1.75;font-size:clamp(16px,1.25vw,18px);}
.heroprice{margin-top:18px;font-size:14px;color:#616B75;}
.heroprice b{font-weight:500;color:#616B75;}
.heroprice i{font-style:normal;}
.hero .ctas{margin-top:28px;}
.heroshelf{display:flex;justify-content:flex-end;}
@media (max-width:900px){
  .hero-inner:has(.heroshelf){grid-template-columns:1fr;gap:40px;padding-top:56px !important;padding-bottom:56px;}
  .heroshelf{justify-content:stretch;}
  .reccard{max-width:none;padding:18px 18px 14px;}
  .reccard .rc-row{grid-template-columns:76px minmax(0,1fr);gap:10px;}
  .hero .ctas{flex-direction:column;align-items:stretch;gap:14px;}
  .hero .ctas .btn{justify-content:center;}
}

/* ── Chrome that must not compete with the page ───────────────────── */
.totop{background:#FFFFFF;border:1px solid #E2DDD3;color:#141A1F;box-shadow:0 1px 2px rgba(20,26,31,.05),0 12px 24px -12px rgba(20,26,31,.25);backdrop-filter:none;}
.totop:hover{background:#F6F4EE;border-color:#141A1F;}
.stickycta{background:rgba(255,255,255,.96);border-top:1px solid #E2DDD3;box-shadow:0 -8px 24px -16px rgba(20,26,31,.25);backdrop-filter:none;}
.stickycta .stepnum{background:rgba(11,120,120,.10);border-color:transparent;color:#0B7878;}
.guiderail li .gr-dot{border-color:#CFC9BC;background:#FFFFFF;}
.guiderail li.is-now .gr-dot{background:#0B7878;border-color:#0B7878;color:#FFFFFF;}
.bigfooter{margin-top:96px;border-top:1px solid #E2DDD3;padding:56px 0 40px;color:#3B454D;}
.bigfooter .brand .logo{color:#141A1F;}
.bigfooter .hl3,.bigfooter .hl5,.bigfooter h3{color:#616B75;letter-spacing:.06em;font-size:12px;}
.bigfooter a{color:#3B454D;}
.bigfooter a:hover{color:#141A1F;}
.bigfooter .langsw{border-color:#E2DDD3;color:#3B454D;}
.bigfooter .ver,.ver-f{display:none !important;}
.capnote,.scenecap{color:#616B75;opacity:1;}
.srjs .reveal{transform:translateY(12px);}

/* ── Photos stay photos: beside text, never behind it ─────────────── */
.photosplit .media img,.scene-frame img,.midscene img{border-radius:14px;}
.photo-scrim::after{display:none;}
.scene-frame .caption{position:static;display:block;margin-top:10px;color:#616B75;font-size:14px;background:none;padding:0;}
.icard.photocard .kicker,.icard.photocard b,.icard.photocard p,.icard.photocard .rank{color:#FFFFFF;}

/* ── Leftovers the remap could not decide by context ─────────────── */
.nav .links .on,.nav .navtop.on{color:#141A1F;}
.np-tour:hover,.tradetour a:hover{color:#0B7878;}
.plan.dark{color:#141A1F;}
.by .avatar,.av-c{color:#FFFFFF;}

/* ── Fixes found on the first render ──────────────────────────────── */
.hero-inner:has(.heroshelf){display:grid !important;}
h1 span[style*="--teal"],h2 span[style*="--teal"],.h2 span[style*="--teal"],h1 span[style*="--accent"],h2 span[style*="--accent"],
h1 .teal,h2 .teal,.h2 .teal,h1 em,h2 em,.h2 em{color:inherit !important;font-style:normal;}
.bub{border-radius:14px;box-shadow:none;}
.bub.ai{background:#FFFFFF;color:#141A1F;border:1px solid #E2DDD3;}
.bub.user{background:rgba(11,120,120,.10);color:#141A1F;border:0;}
.nightline .t em,.nightline .t{color:#616B75;}
.secrule::before,.secrule::after,.secrule > i,.secrule > .rule,.secrule .line{display:none !important;}
.secrule{border:0 !important;}
.heroshelf{display:flex !important;justify-content:flex-end;grid-template-columns:none !important;}
.reccard{width:100%;max-width:520px;}
/* contrast fixes from the first live pass */
.baCol.before .hl4,.tag.hot,.hot{color:#A8453A;}
.chip.risk{color:#3B454D;}
.who .ini,.ini,.av,.avatar{background:#0B7878;color:#FFFFFF;}
.fstep span,.fstep{color:#616B75;}

.heroprice i{color:#616B75 !important;}

/* ── Last pass: text the 144-page contrast sweep still found on light ground ── */
html body .kolist b,
html body .pipe b,
html body .packblock h2,
html body .ifwrong b,
html body .trio b,
html body .statcol div.hl4,
html body .coblock h2,
html body .body b,
html body .scene-overlay b,
html body .scene-overlay span,
html body .cmp th,
html body .introw span.st.bridge,
html body .statcard span.sl,
html body .livecard b,
html body .body span.pr,
html body .agree b,
html body .br em,
html body .statcard b.sv,
html body .lead b,
html body .escsteps i,
html body .kover b,
html body .livecard span.lt,
html body .gsaside b,
html body .kcrow label,
html body .shot span.when,
html body .ratebox b,
html body .livenote b,
html body .sm-row b,
html body .kcline span,
html body .chan b,
html body .route span.want,
html body .kplan span.pr,
html body .kbuy b,
html body .proofnote b,
html body .livecard a.lnum,
html body .coform div,
html body .docbar span.docbar-l,
html body .sm-plan b,
html body .sm-total span,
html body .tel b,
html body .secintro b,
html body .lb-o div.hl4,
html body .hsub b,
html body .then b,
html body .routefoot b,
html body .gsaside h3,
html body .logline div.hl5,
html body .mlcard span.n,
html body .escband span.lbl,
html body .pipecolx div.pchip.hot,
html body .nav a.logo,
html body .navitem button.navtop,
html body .pricelede span.pricenum,
html body .herogrid h1,
html body .herogrid em,
html body .sumcard a.go,
html body .foundnote b,
html body .rh b,
html body .foundbox b,
html body .bh b,
html body .br span,
html body .esccard div.tt,
html body .wbody div.wb.bot{color:#141A1F !important;}
html body .nl span.t,
html body .t em,
html body .nightline .t,
html body .nightline .t em,
html body .fstep span{color:#616B75 !important;}
html body .qrow span.qs.never,
html body .qs.never,
html body .ft span.tag.hot,
html body .tag.hot{color:#A8453A !important;}
html body .pilltag.pt-dark{background:#141A1F !important;color:#FFFFFF !important;border-color:#141A1F !important;}
html body .tag.hot{background:rgba(192,57,43,.10);}
/* last dark containers the sweep found under ink text */
html body .kcbox,html body .thumb .shot,html body .sumcard,html body .gradborder,html body .widget.dk,html body .wpage.dkpage,html body .wbody{background:#FFFFFF !important;background-image:none !important;color:#141A1F;border-color:#E2DDD3;}
html body .scene-overlay{background:rgba(255,255,255,.94) !important;color:#141A1F !important;border:1px solid #E2DDD3;border-radius:8px;}
html body .scene-overlay b,html body .scene-overlay span,html body .scene-overlay .k{color:#141A1F !important;}
html body .cmp td b,html body table td b,html body th b,html body td b{color:#141A1F !important;}
/* the sweep's last three */
html body .sumcard .go,html body a.go{background:#0B7878 !important;color:#FFFFFF !important;border-radius:8px;}
html body .fr-x{background:#FFFFFF !important;color:#141A1F !important;border:1px solid #E2DDD3;}
html body .kcbox,html body .kcin,html body .kcout,html body .kcrow,html body .kcline{background:#FFFFFF !important;color:#141A1F;}
html body .kcout{background:#F6F4EE !important;}
html body .winput{color:#616B75;}
html body .kcline b,html body .kcout b{color:#141A1F !important;}
html body .widget .winput,html body .winput{color:#616B75 !important;}
html body .fld select option,html body select option{background:#FFFFFF !important;color:#141A1F !important;}
.reccard .pill{white-space:nowrap;}
.reccard .rc-top{flex-wrap:wrap;}
html body .avatar,html body .av,html body .av-b,html body .av-c{color:#FFFFFF !important;}

/* ── Photo heroes: the photo stands beside the copy, never behind it ── */
html body .hero.photohero{min-height:0 !important;padding:0 0 64px !important;position:relative;}
html body .hero.photohero:not(:has(.heroshelf,.hero-split,.herogrid,.herostage)) .bgimg{display:block !important;position:absolute;top:112px;bottom:64px;
  right:max(20px,calc((100% - 1240px)/2 + 56px));width:min(38%,440px);border-radius:14px;overflow:hidden;z-index:0;pointer-events:none;
  border:1px solid #E2DDD3;box-shadow:0 1px 2px rgba(20,26,31,.05),0 24px 48px -32px rgba(20,26,31,.22);}
html body .hero.photohero .bgimg img{width:100%;height:100%;object-fit:cover;animation:none !important;transform:none !important;filter:none !important;opacity:1 !important;}
html body .hero.photohero .heroinner,html body .hero.photohero .hero-inner{position:relative;z-index:1;}
html body .hero.photohero:not(:has(.heroshelf)) .heroinner{min-height:400px;}
html body .hero.photohero:not(:has(.heroshelf)) .heroinner .hero-panel,html body .hero.photohero:not(:has(.heroshelf)) .hero-inner .heroband{max-width:56%;}
@media (max-width:900px){
  html body .hero.photohero:not(:has(.heroshelf,.hero-split,.herogrid,.herostage)) .bgimg{position:static;width:auto;height:220px;margin:20px 20px 0;}
  html body .hero.photohero:not(:has(.heroshelf)) .heroinner{min-height:0;}
  html body .hero.photohero:not(:has(.heroshelf)) .heroinner .hero-panel,html body .hero.photohero:not(:has(.heroshelf)) .hero-inner .heroband{max-width:none;}
}
html body .hero.photohero:not(:has(.heroshelf,.hero-split,.herogrid,.herostage)) .bgimg{inset:auto !important;left:auto !important;top:112px !important;bottom:64px !important;
  right:max(20px,calc((100% - 1240px)/2 + 56px)) !important;width:min(38%,440px) !important;height:auto !important;transform:none !important;}
html body .hero.photohero .bgimg::before,html body .hero.photohero .bgimg::after{display:none !important;}
@media (max-width:900px){html body .hero.photohero:not(:has(.heroshelf,.hero-split,.herogrid,.herostage)) .bgimg{position:static !important;width:auto !important;height:220px !important;margin:20px 20px 0;}}
/* hero photo frame: fixed height, never the whole header */
html body .hero.photohero:not(:has(.heroshelf,.hero-split,.herogrid,.herostage)) .bgimg{bottom:auto !important;height:460px !important;}
html body .hero.photohero:not(:has(.heroshelf)) .heroinner{min-height:380px;}
html body .hero.photohero:not(:has(.heroshelf)) .heroinner .hero-panel,html body .hero.photohero:not(:has(.heroshelf)) .hero-inner .heroband{max-width:56% !important;width:auto !important;}
html body .hero.photohero .hero-panel h1,html body .hero.photohero .heroband h1{max-width:none !important;}
/* decorative glows that still took up room */
html body .aur,html body .glow,html body .hglow,html body .aurora,html body .spot,html body .orb{display:none !important;}
/* a hero that already carries its own visual (phone frame, stage, mock) keeps the photo out of the way */
html body .hero.photohero:has(.heroinner :is(img,canvas,svg,.phframe,.phoneframe,.stage,.stageimg,.mock,.appwin)) .bgimg,
html body .hero.photohero:has(.hero-inner :is(img,canvas,svg,.phframe,.phoneframe,.stage,.stageimg,.mock,.appwin)) .bgimg{display:none !important;}
html body .hero.photohero:has(.heroinner :is(img,canvas,svg,.phframe,.phoneframe,.stage,.stageimg,.mock,.appwin)) .heroinner .hero-panel{max-width:none !important;}
html body .hero.photohero:not(:has(.heroshelf)) .hero-inner .hero-panel{max-width:56% !important;width:auto !important;}
/* the two-column hero grid is for the home page only (copy + record card); other heroes flow */
html body .hero-inner:has(.heroshelf){display:grid !important;}
html body .hero-inner.hero-panel{display:block !important;}
html body .hero.photohero:not(:has(.heroshelf)) .hero-inner.hero-panel,
html body .hero.photohero:not(:has(.heroshelf)) .hero-inner .heroband,
html body .hero.photohero:not(:has(.heroshelf)) .heroinner .hero-panel{max-width:56% !important;width:auto !important;}
html body .hero.photohero:has(.heroinner :is(img,canvas,svg,.phframe,.phoneframe,.stage,.stageimg,.mock,.appwin)) .heroinner .hero-panel,
html body .hero.photohero:has(.hero-inner :is(img,canvas,svg,.phframe,.phoneframe,.stage,.stageimg,.mock,.appwin)) .hero-inner.hero-panel{max-width:none !important;}
/* industry & product heroes: a size that keeps the poster line-breaks to three or four lines */
html body .hero.photohero:not(:has(.heroshelf)) h1{font-size:clamp(34px,3.6vw,50px);}
html[lang^="ko"] body .hero.photohero:not(:has(.heroshelf)) h1{font-size:clamp(28px,3.2vw,44px);}
html body .hero.photohero:not(:has(.heroshelf)){padding-top:104px !important;}
html body .hero .sub,html body .hero .lead{color:#3B454D !important;opacity:1 !important;}
html body .hero.photohero:has(.hero-inner :is(.scene-frame,.mapwide,.stagegrid,.thumbstrip)) .bgimg,
html body .hero.photohero:has(.heroinner :is(.scene-frame,.mapwide,.stagegrid,.thumbstrip)) .bgimg{display:none !important;}
html body .hero.photohero:has(.hero-inner :is(.scene-frame,.mapwide,.stagegrid,.thumbstrip)) .hero-inner .hero-panel{max-width:none !important;}
/* one display face per language, whatever a page-local style once said */
html:not([lang^="ko"]) body :is(h1,h2,.h2){font-family:'Bricolage Grotesque','IBM Plex Sans',sans-serif !important;font-weight:600 !important;letter-spacing:-.02em !important;}
html[lang^="ko"] body :is(h1,h2,.h2){font-family:'IBM Plex Sans KR','Apple SD Gothic Neo','Malgun Gothic',sans-serif !important;font-weight:700 !important;letter-spacing:-.02em !important;}
/* one accent: industry pages that tinted themselves amber, purple or blue come back to the brand teal;
   the three channel colours (voice · chat · messaging) keep their meaning */
html body,html body[data-chan="voice"]{--accent:#0B7878 !important;--accent-deep:#0A5F5F !important;--accent-glass:rgba(11,120,120,.10) !important;}
html body[data-chan="chat"]{--accent:#2C63B8 !important;--accent-deep:#24518F !important;--accent-glass:rgba(44,99,184,.10) !important;}
html body[data-chan="msg"],html body[data-chan="messaging"]{--accent:#2F855A !important;--accent-deep:#1E9E63 !important;--accent-glass:rgba(47,133,90,.10) !important;}
html body .hero.photohero:has(.mapwide,.scene-frame,.stagegrid,.thumbstrip,.phframe,.phoneframe,.stage,.appwin) .bgimg{display:none !important;}
html body .hero.photohero:has(.mapwide,.scene-frame,.stagegrid,.thumbstrip,.phframe,.phoneframe,.stage,.appwin) :is(.hero-inner .hero-panel,.hero-inner.hero-panel,.heroinner .hero-panel,.hero-inner .heroband){max-width:none !important;}
/* phones: copy first; the hero photo frame folds away and the copy takes the full width */
@media (max-width:900px){
  html body .hero.photohero .bgimg{display:none !important;}
  html body .hero.photohero:not(:has(.heroshelf)) :is(.hero-inner.hero-panel,.hero-inner .heroband,.heroinner .hero-panel){max-width:none !important;}
  html body .hero.photohero:not(:has(.heroshelf)) .heroinner{min-height:0 !important;}
  html body .hero.photohero:not(:has(.heroshelf)){padding-top:72px !important;padding-bottom:40px !important;}
}
@media (max-width:900px){
  html body .hero.photohero .bgimg.bgimg.bgimg{display:none !important;}
  html body .hero.photohero .heroband.heroband.heroband,html body .hero.photohero .hero-panel.hero-panel.hero-panel{max-width:none !important;width:auto !important;}
  html body .hero.photohero h1{max-width:none !important;}
}
/* page gutter on phones and tablets (the 56px gutter is for desktop only) */
@media (max-width:900px){html body .wrap{padding-left:24px !important;padding-right:24px !important;}}
@media (max-width:620px){html body .wrap{padding-left:18px !important;padding-right:18px !important;}}
/* Korean headings keep their authored line breaks on phones; hiding <br> glued words together (“동안이렇게”) */
@media (max-width:620px){html[lang^="ko"] body :is(h1,h2,h3,.h2) br{display:inline !important;}}
/* the menu panel sits above everything on the page (it was painting under the hero copy) */
html body .navwrap{z-index:80 !important;}
html body .navpanel{z-index:90 !important;background:#FFFFFF !important;}
html body .hero-inner,html body .heroinner{z-index:1;}

/* ── The full demo (demofull.js) ─────────────────────────────────── */
.d60v2 .d60tabs{display:flex;gap:16px;margin:28px 0 20px;}
.d60v2 .d60tab{flex:1;display:flex;flex-direction:column;gap:2px;align-items:flex-start;text-align:left;padding:14px 16px 12px;border:0;border-top:3px solid #E2DDD3;background:none;cursor:pointer;font:inherit;color:#141A1F;border-radius:0;}
.d60v2 .d60tab b{font-size:15px;font-weight:700;}
.d60v2 .d60tab span{font-size:13px;color:#616B75;}
.d60v2 .d60tab.on{border-top-color:#0B7878;}
.d60v2 .d60tab:hover{border-top-color:#141A1F;}
.d60v2 .d60stage{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:28px;align-items:start;}
.d60v2 .d60call{background:#FFFFFF;border:1px solid #E2DDD3;border-radius:14px;box-shadow:0 1px 2px rgba(20,26,31,.05),0 24px 48px -32px rgba(20,26,31,.22);display:flex;flex-direction:column;overflow:hidden;}
.d60v2 .d60callhead{display:flex;align-items:center;gap:12px;padding:14px 20px;border-bottom:1px solid #E2DDD3;background:#F6F4EE;}
.d60v2 .d60avatar{width:36px;height:36px;border-radius:50%;background:#0B7878;color:#fff;display:inline-flex;align-items:center;justify-content:center;flex:none;}
.d60v2 .d60avatar svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.d60v2[data-state="ring"] .d60avatar{animation:d60ring .9s ease-in-out infinite;}
@keyframes d60ring{0%,100%{transform:rotate(0)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}
.d60v2 .d60callwho{display:flex;flex-direction:column;gap:2px;min-width:0;}
.d60v2 .d60callwho b{font-size:15px;font-weight:700;}
.d60v2 .d60callwho .mono{font-size:12px;color:#616B75;}
.d60v2 .d60tag{margin-left:auto;font-size:12px;font-weight:600;color:#8D642F;background:rgba(183,121,31,.12);padding:4px 10px;border-radius:999px;white-space:nowrap;}
.d60v2 .d60wavewrap{display:flex;align-items:center;gap:14px;padding:12px 20px 0;}
.d60v2 .d60wavewrap canvas{width:100%;height:52px;flex:1;min-width:0;}
.d60v2 .d60speaker{font-size:12px;color:#616B75;white-space:nowrap;min-width:110px;text-align:right;}
.d60v2 .d60convo{display:flex;flex-direction:column;gap:14px;padding:16px 20px 20px;min-height:360px;max-height:460px;overflow-y:auto;scroll-behavior:smooth;}
.d60v2 .d60sys{align-self:center;font-size:13px;color:#616B75;text-align:center;padding:6px 0;}
.d60v2 .d60msg{display:flex;flex-direction:column;gap:4px;max-width:82%;}
.d60v2 .d60msg.user{align-self:flex-end;align-items:flex-end;}
.d60v2 .d60who{display:flex;gap:8px;align-items:center;font-size:12px;color:#616B75;}
.d60v2 .d60who b{color:#141A1F;font-weight:600;}
.d60v2 .d60who .mono{font-size:12px;}
.d60v2 .d60chan{font-style:normal;font-size:11px;font-weight:600;color:#2F855A;background:rgba(47,133,90,.12);padding:1px 7px;border-radius:999px;}
.d60v2 .bub{padding:11px 15px;border-radius:14px;font-size:15px;line-height:1.6;}
.d60v2 .bub.ai{background:#FFFFFF;border:1px solid #E2DDD3;}
.d60v2 .bub.user{background:rgba(11,120,120,.10);}
.d60v2 .bub.person{border-color:#0B7878;}
.d60v2 .d60ctl{display:flex;align-items:center;gap:12px;padding:14px 20px;border-top:1px solid #E2DDD3;flex-wrap:wrap;}
.d60v2 .d60ctl .btn{min-height:44px;padding:0 16px;font-size:14px;}
.d60v2 .d60prog{margin-left:auto;display:flex;align-items:center;gap:10px;min-width:220px;flex:1;}
.d60v2 .d60prog .mono{font-size:12px;color:#616B75;}
.d60v2 .d60bar{flex:1;height:24px;padding:10px 0;box-sizing:border-box;background:linear-gradient(#E2DDD3,#E2DDD3) center/100% 4px no-repeat;border-radius:2px;position:relative;cursor:pointer;} /* 4px 선, 24px 누름 영역 */
.d60v2 .d60bar i{position:absolute;left:0;top:10px;height:4px;width:0;background:#0B7878;border-radius:2px;pointer-events:none;}
.d60v2 .d60col{display:flex;flex-direction:column;gap:16px;}
.d60v2 .d60card{padding:16px 20px;}
.d60v2 .d60card>.lbl{font-size:12px;letter-spacing:.06em;color:#616B75;font-weight:600;margin:0 0 6px;text-transform:none;}
.d60v2 .d60field{display:grid;grid-template-columns:88px minmax(0,1fr);gap:4px 12px;padding:10px 0;border-top:1px solid #EEEAE2;font-size:14px;}
.d60v2 .d60field:first-child{border-top:0;}
.d60v2 .d60field b{font-size:12px;color:#616B75;font-weight:600;grid-row:span 2;}
.d60v2 .d60field span{color:#141A1F;font-weight:600;}
.d60v2 .d60field i{font-style:normal;font-size:12px;color:#0B7878;font-weight:600;}
.d60v2 .d60field i.ok::before{content:"✓ ";}
.d60v2 .d60rec{opacity:.45;transition:opacity .4s;}
.d60v2 .d60rec.on{opacity:1;}
.d60v2 .d60rec .who{display:flex;align-items:center;gap:8px;font-size:15px;}
.d60v2 .d60rec .who i{font-style:normal;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;}
.d60v2 .d60ph{color:#0B7878;background:rgba(11,120,120,.10);}
.d60v2 .d60wa{color:#2F855A;background:rgba(47,133,90,.12);}
.d60v2 .d60match{font-size:13px;color:#0B7878;font-weight:600;margin:8px 0 0;}
.d60v2 .d60work{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;padding:10px 0;border-top:1px solid #EEEAE2;font-size:14px;}
.d60v2 .d60work i{font-style:normal;color:#0B7878;font-weight:700;text-align:center;}
.d60v2 .d60work b{display:block;font-weight:600;}
.d60v2 .d60work span{color:#616B75;font-size:13px;}
.d60v2 .d60hand{border-color:#B7791F !important;}
.d60v2 .d60hand ul{margin:0;padding-left:18px;font-size:14px;color:#3B454D;}
.d60v2 .d60hand li{margin:4px 0;}
.d60v2 .scenecap{margin-top:16px;font-size:13px;color:#616B75;}
.d60v2 .d60end{margin-top:22px;padding-top:20px;border-top:1px solid #E2DDD3;}
.d60v2 .d60summary{margin:0 0 14px;font-weight:600;color:#141A1F;}
.d60v2 .d60endrow{display:flex;flex-wrap:wrap;gap:14px;align-items:center;}
.d60v2 .telnote{font-size:13px;color:#616B75;}
@media (max-width:900px){
  .d60v2 .d60tabs{flex-direction:column;gap:6px;}
  .d60v2 .d60tab{border-top:0;border-left:3px solid #E2DDD3;padding:10px 12px;}
  .d60v2 .d60tab.on{border-left-color:#0B7878;}
  .d60v2 .d60stage{grid-template-columns:1fr;}
  .d60v2 .d60convo{min-height:260px;max-height:380px;}
  .d60v2 .d60ctl .btn{flex:1;}
  .d60v2 .d60prog{min-width:100%;}
}

/* ── Illustrations & photo grids (build/illus.py) ────────────────── */
.illus{display:block;width:100%;height:auto;max-width:640px;margin:0 auto;}
.illus text{font-family:inherit;}
.illfig{margin:0;background:#FFFFFF;border:1px solid #E2DDD3;border-radius:14px;padding:18px 18px 14px;box-shadow:0 1px 2px rgba(20,26,31,.05),0 24px 48px -32px rgba(20,26,31,.18);}
.illfig .illcap{font-size:13px;line-height:1.55;color:#616B75;margin:10px 4px 0;}
.illrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center;margin-top:30px;}
.illrow>.illfig{min-width:0;}
.illrow .kolist,.illrow .fieldgrid{margin-top:0;}
.illrow .fieldgrid{grid-template-columns:1fr;}
.illrow .sub{margin-top:0;}
.illwide{margin-top:34px;}
.illwide .illfig{max-width:760px;margin:0 auto;}
.photowall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:30px;}
.photowall a{position:relative;display:block;aspect-ratio:4/3;border-radius:14px;overflow:hidden;border:1px solid #E2DDD3;background:#E2DDD3;text-decoration:none;}
.photowall img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.32,.72,0,1);}
.photowall a:hover img{transform:scale(1.04);}
.photowall a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,26,31,0) 50%,rgba(20,26,31,.72));}
.photowall b{position:absolute;left:14px;right:14px;bottom:12px;z-index:1;color:#FFFFFF;font-size:15px;font-weight:700;letter-spacing:-.01em;text-shadow:0 1px 6px rgba(0,0,0,.4);}
.photowall a:focus-visible{outline:3px solid #0B7878;outline-offset:2px;}
.photowall + .otherwall,.photowall + .tradechips{margin-top:18px;}
.scenestrip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:34px 0 10px;}
.scenestrip figure{margin:0;border-radius:14px;overflow:hidden;border:1px solid #E2DDD3;background:#FFFFFF;}
.scenestrip img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;}
.scenestrip figcaption{padding:12px 14px 13px;font-size:13px;line-height:1.5;color:#616B75;}
.scenestrip figcaption b{display:block;color:#141A1F;font-size:14px;margin-bottom:2px;}
.packphoto{position:relative;border-radius:14px;overflow:hidden;border:1px solid #E2DDD3;margin-bottom:34px;background:#E2DDD3;}
.packphoto img{width:100%;height:auto;aspect-ratio:5/2;object-fit:cover;display:block;}
.packphoto span{position:absolute;left:18px;bottom:14px;right:18px;color:#FFFFFF;font-size:14px;font-weight:600;text-shadow:0 1px 8px rgba(0,0,0,.55);}
.packphoto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,26,31,0) 55%,rgba(20,26,31,.65));pointer-events:none;}
.packphoto span{z-index:1;}
@media (max-width:900px){
  .illrow{grid-template-columns:1fr;gap:22px;}
  .photowall{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .photowall b{font-size:14px;left:10px;bottom:9px;}
  .scenestrip{grid-template-columns:1fr 1fr;gap:10px;}
  .scenestrip figure:nth-child(3){grid-column:1 / -1;}
  .packphoto img{aspect-ratio:16/9;}
}
@media (max-width:520px){.illfig{padding:12px 12px 10px;} .scenestrip{grid-template-columns:1fr;} .scenestrip figure:nth-child(3){grid-column:auto;}}

/* ── Demo video dialog ─────────────────────────────────────────── */
.d60dlg{border:0;border-radius:18px;padding:0;width:min(96vw,1120px);max-width:none;background:#141A1F;color:#F6F4EE;box-shadow:0 40px 80px -30px rgba(0,0,0,.6);}
.d60dlg::backdrop{background:rgba(20,26,31,.72);backdrop-filter:blur(4px);}
.d60dlg.vert{width:min(96vw,520px);}
.d60dlghead{display:flex;align-items:center;gap:14px;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.12);flex-wrap:wrap;}
.d60dlghead b{font-size:15px;font-weight:700;}
.d60dlghead>span:not(.d60cuts){font-size:13px;color:#A9B1B8;}
.d60cuts{margin-left:auto;display:inline-flex;border:1px solid rgba(255,255,255,.18);border-radius:999px;overflow:hidden;}
.d60cuts button{background:none;border:0;color:#A9B1B8;font:inherit;font-size:13px;font-weight:600;padding:6px 14px;cursor:pointer;}
.d60cuts button.on{background:#0B7878;color:#fff;}
.d60x{background:none;border:0;color:#F6F4EE;font-size:26px;line-height:1;cursor:pointer;padding:0 4px;}
.d60dlg video{display:block;width:100%;height:auto;max-height:82vh;background:#000;}
@media (max-width:640px){.d60dlg{width:100vw;border-radius:0;} .d60dlghead{padding:12px 14px;}}

/* ── Demo v2: industry switcher, progressive captions, speed, caller line ── */
.d60pick{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 18px;font-size:14px;color:#3B454D;}
.d60pick>span{font-weight:700;color:#141A1F;}
.d60pick select{font:inherit;font-size:14px;padding:8px 36px 8px 12px;border:1px solid #E2DDD3;border-radius:8px;background:#FFFFFF;color:#141A1F;min-width:220px;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23616B75' stroke-width='1.6' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;}
.d60pick select:focus-visible{outline:3px solid #0B7878;outline-offset:2px;}
.d60pick small{font-size:12px;color:#616B75;}
.d60v2 .d60caller{display:none;font-size:12px;color:#616B75;}
.d60v2[data-state="ring"] .d60caller,.d60v2[data-state="live"] .d60caller{display:inline;}
.d60v2 .bub.typing::after{content:"";display:inline-block;width:2px;height:1em;background:#0B7878;margin-left:2px;vertical-align:-2px;animation:d60caret 1s steps(2) infinite;}
@keyframes d60caret{50%{opacity:0}}
.d60v2 .d60speed{min-width:58px;font-variant-numeric:tabular-nums;}
.d60v2.handoff .d60hand{animation:d60hand 1.6s ease-out 1;}
@keyframes d60hand{0%{box-shadow:0 0 0 0 rgba(183,121,31,.45)}100%{box-shadow:0 0 0 18px rgba(183,121,31,0)}}
@media (prefers-reduced-motion:reduce){.d60v2 .bub.typing::after{animation:none} .d60v2.handoff .d60hand{animation:none}}
.d60v2 .d60callwho .mono{display:block;}