
    body{
      margin:0;
      font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
      color:#1d1d1f;background:#ffffff;
      line-height:1.5;word-break:keep-all;overflow-wrap:break-word;
      -webkit-font-smoothing:antialiased;font-weight:400;
    }
    .surf *{box-sizing:border-box}
    .surf a{color:#1d1d1f;text-decoration:none}
    .surf a:hover{color:#0071e3}
    .surf h1,.surf h2,.surf h3,.surf p{margin:0}
    .num{font-variant-numeric:tabular-nums;font-weight:600;letter-spacing:-.03em}
    .wrap{max-width:1152px;margin:0 auto;padding:0 40px}
    .eyebrow{font-size:19px;font-weight:600;color:#0071e3;letter-spacing:-.01em}
    .head{font-size:56px;font-weight:600;letter-spacing:-.028em;line-height:1.1}
    .sub{font-size:21px;color:#6e6e73;line-height:1.5;letter-spacing:-.011em}
    .cta{transition:background .25s ease,transform .25s ease,box-shadow .25s ease}
    .cta:hover{background:#0077ed !important;transform:scale(1.03)}
    .cta.pulse{animation:pulse 1.1s ease 1}
    @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(0,113,227,.45)}70%{box-shadow:0 0 0 18px rgba(0,113,227,0)}100%{box-shadow:0 0 0 0 rgba(0,113,227,0)}}
    .caret{display:inline-block;width:2px;height:20px;background:#1d1d1f;margin-left:2px;vertical-align:-3px;animation:blink 1.1s step-end infinite}
    @keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
    @keyframes bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,8px)}}

    /* 히어로 로드 시퀀스: 블러 인 */
    .hl{opacity:0;transform:translateY(26px);filter:blur(12px);animation:hlin 1s cubic-bezier(.22,.61,.21,1) forwards}
    @keyframes hlin{to{opacity:1;transform:none;filter:blur(0)}}
    .d1{animation-delay:.08s}.d2{animation-delay:.22s}.d3{animation-delay:.4s}.d4{animation-delay:.56s}.d5{animation-delay:.72s}

    /* 스텝 텍스트 */
    .step{opacity:.24;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}
    .step.on{opacity:1;transform:none}

    /* 하단 섹션: 단어 단위 키네틱 리빌 */
    .w{display:inline-block;opacity:0;transform:translateY(22px);filter:blur(8px);transition:opacity .7s cubic-bezier(.22,.61,.21,1),transform .7s cubic-bezier(.22,.61,.21,1),filter .7s cubic-bezier(.22,.61,.21,1)}
    .inview .w{opacity:1;transform:none;filter:blur(0)}
    .w2{transition-delay:.1s}.w3{transition-delay:.2s}.w4{transition-delay:.3s}
    .rv .rvb{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.22,.61,.21,1) .25s,transform .8s cubic-bezier(.22,.61,.21,1) .25s}
    .rv.inview .rvb{opacity:1;transform:none}
    .bm-f{width:0;transition:width 1.1s cubic-bezier(.22,.61,.21,1) .3s}
    .inview .bm-f{width:var(--w)}

    /* 리포트 카드 — 연속 스크럽이라 전환은 JS 프레임 갱신 */
    #scard .scan-msg span{position:absolute;left:0;top:0;transition:opacity .4s ease;opacity:0;white-space:nowrap}
    #scard .scan-msg .m0{opacity:1}
    #scard[data-s1] .m0{opacity:0}
    #scard[data-s1] .m1{opacity:1}
    #scard[data-s2] .m1{opacity:0}
    #scard[data-s2] .m2{opacity:1}
    #glare{position:absolute;inset:0;border-radius:24px;pointer-events:none;opacity:0;background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.55),transparent 60%);transition:opacity .3s ease}

    html{scroll-behavior:smooth}
    .step-inner{display:flex;flex-direction:column;gap:14px}
    /* 사이트 고정 헤더(100px) 대응 오프셋 */
    #pbar{z-index:60 !important}
    #heroSec{height:100vh !important;min-height:640px;padding-top:64px}
    #stickyWrap{top:48px !important}

    @media (max-width: 960px){
      #heroSec{height:100svh !important;min-height:560px;padding:90px 0 70px !important}
      #heroSec h1{font-size:clamp(40px,9.5vw,64px) !important}
      .head{font-size:clamp(28px,6.5vw,44px)}
      .sub{font-size:16px}
      .wrap{padding:0 20px}
      [style*="width:560px"]{width:100% !important;max-width:560px}
      [style*="width:720px"]{width:100% !important;max-width:720px}

      /* 스크롤텔링: 컴팩트 카드 상단 고정 + 텍스트는 하단 밴드 통과 */
      #scrolly{padding:36px 0 30px !important}
      #scrollyGrid{grid-template-columns:1fr !important;gap:0 !important}
      #stickyWrap{top:16px !important;z-index:2}
      #scard{padding:14px 16px 16px !important;border-radius:18px !important;transform-origin:top center}
      #scard [style*="width:172px;height:172px"]{width:104px !important;height:104px !important}
      #scard svg[viewBox="0 0 212 212"]{width:104px !important;height:104px !important}
      #scoreNum{font-size:30px !important}
      #secScore{gap:14px !important;margin-top:10px !important}
      #grade span:first-child{font-size:15px !important}
      #grade span{font-size:12px;line-height:1.4}
      #secBars{margin-top:12px !important;padding-top:10px !important;gap:7px !important}
      #secBars > div{grid-template-columns:60px 1fr 26px !important;gap:10px !important}
      #secBars span{font-size:11.5px !important}
      #secBars .barn{font-size:12px !important}
      #secCk{margin-top:12px !important;padding-top:10px !important}
      #secCk .ckrow{padding:4px 0 !important;grid-template-columns:15px 1fr auto !important;gap:8px !important}
      #secCk .ckrow svg{width:15px;height:15px}
      #secCk span{font-size:11.5px !important}
      #gain{margin-top:10px !important;padding:9px 12px !important;border-radius:10px !important}
      #gain span{font-size:11.5px !important}

      .step{height:auto !important;min-height:56vh !important;justify-content:flex-end !important;padding:0 0 5vh !important;opacity:0;gap:0 !important;position:relative;z-index:3;transition:none !important}
      .step.on{opacity:1}
      .step-inner{gap:8px}
      .step .head{font-size:25px}
      .step .sub{font-size:14.5px;max-width:100% !important}
      .step span{font-size:12px !important}
    }
