/* 레코너스 원본 영역만 격리. 다른 A 섹션과 B 기획안에는 적용하지 않는다. */
@font-face{font-family:ReconersPretendard;src:url('assets/reconers/Pretendard-Medium.woff2') format('woff2');font-weight:500;font-display:swap;}
@font-face{font-family:ReconersPretendard;src:url('assets/reconers/Pretendard-Bold.woff2') format('woff2');font-weight:700;font-display:swap;}
body[data-view="frontend"] :is(#section-3,#section-6).reconers-reference{padding:0;border:0;min-height:0;background:#fff;font-family:ReconersPretendard,sans-serif;font-size:16px;font-weight:400;line-height:160%;word-break:keep-all;letter-spacing:normal;}
.reconers-reference > .frontend-inner{max-width:none;width:100%;margin:0;}
:where(.reconers-reference) section{min-height:0;border:0;padding:0;}
:where(.reconers-reference) :is(h2,p,strong,b){margin:0;padding:0;border:0;background:transparent;font-style:normal;}
:where(.reconers-reference) h2{display:block;}
:where(.reconers-reference) img{max-width:100%;vertical-align:middle;}
.reconers-process-intro{display:none;}
@media(min-width:768px){.reconers-process-intro{display:block;position:relative;height:100vh;height:100dvh;background-color:#06070b;background-image:radial-gradient(ellipse at 50% 120%,rgba(239,105,78,.1),transparent 65%),url("assets/ungrammerax/assets/design-system/cosmic/stars.svg");background-repeat:no-repeat,repeat;overflow:hidden;}}
:where(.reconers-reference) .css-yneqg4-AreaContainer-xxl{width:100%;padding:0 20px;margin:0 auto;}
@media  (min-width: 768px){:where(.reconers-reference) .css-yneqg4-AreaContainer-xxl{max-width:calc(1696px + (20px * 6));padding:0 calc(20px*3);}}
:where(.reconers-reference) .css-1ab35ld-SectionFrameworkContainer{position:relative;overflow:hidden;background-color:#ffffff;background-image:url("assets/reconers/sec_03_bg_img_01_m.jpg");background-repeat:no-repeat;-webkit-background-size:cover;background-size:cover;-webkit-background-position:center;background-position:center;padding:120px 0;}
@media  (min-width: 768px){:where(.reconers-reference) .css-1ab35ld-SectionFrameworkContainer{height:100vh;height:100dvh;padding:0;background-image:url("assets/reconers/sec_03_bg_img_01.jpg");perspective:1000px;perspective-origin:50% 50%;}}
:where(.reconers-reference) .css-14bwj8f-AreaContainer-xl-TitleArea{width:100%;padding:0 20px;margin:0 auto;}
@media  (min-width: 768px){:where(.reconers-reference) .css-14bwj8f-AreaContainer-xl-TitleArea{max-width:calc(1680px + (20px * 6));padding:0 calc(20px*3);}}
@media  (min-width: 768px){:where(.reconers-reference) .css-14bwj8f-AreaContainer-xl-TitleArea{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;height:100%;}}
:where(.reconers-reference) .css-12y526k-Title-splitTextChars{position:relative;font-size:28px;font-weight:700;line-height:140%;letter-spacing:-0.56px;color:#0d225d;font-kerning:none;}
:where(.reconers-reference) .css-12y526k-Title-splitTextChars .word{overflow:hidden;vertical-align:bottom;}
:where(.reconers-reference) .css-12y526k-Title-splitTextChars .char{will-change:transform;}
:where(.reconers-reference) .css-12y526k-Title-splitTextChars .inline{display:inline!important;}
:where(.reconers-reference) .css-12y526k-Title-splitTextChars b{font-weight:700;color:#105abd;}
@media  (min-width: 768px){:where(.reconers-reference) .css-12y526k-Title-splitTextChars{font-size:clamp(32px, 3.75vw, 72px);letter-spacing:-1.44px;text-align:center;}}
@media  (min-width: 768px){:where(.reconers-reference) .css-9h2004-SectionFramework{display:none;}}
:where(.reconers-reference) .css-n426sf-SectionFramework{display:none;}
@media  (min-width: 768px){:where(.reconers-reference) .css-n426sf-SectionFramework{display:block;}}
:where(.reconers-reference) .css-xz3fii-Row{display:grid;grid-template-columns:repeat(2, 1fr);gap:24px 8px;padding:48px 20px 0;}
@media  (min-width: 768px){:where(.reconers-reference) .css-xz3fii-Row{position:absolute;top:0;left:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:clamp(24px, 1.67vw, 32px);-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:-webkit-max-content;width:-moz-max-content;width:max-content;height:100%;padding:0 160px;transform-style:preserve-3d;will-change:transform;}}
:where(.reconers-reference) .css-e6t8iy-CardBox{display:block;will-change:transform;}
@media  (min-width: 768px){:where(.reconers-reference) .css-e6t8iy-CardBox{-webkit-flex:none;-ms-flex:none;flex:none;width:375px;}}
:where(.reconers-reference) .css-iphfmu-CardImage{display:block;width:100%;height:auto;}
:where(.reconers-reference) .css-6ruzog-Outro{display:none;}
@media  (min-width: 768px){:where(.reconers-reference) .css-6ruzog-Outro{display:block;position:absolute;inset:0;z-index:1;pointer-events:none;}}
:where(.reconers-reference) .css-ku85yl-BlueWipe{position:absolute;inset:0;background-color:#1557f3;-webkit-clip-path:ellipse(var(--wipe-x, 0%) var(--wipe-y, 50%) at 100% 50%);clip-path:ellipse(var(--wipe-x, 0%) var(--wipe-y, 50%) at 100% 50%);will-change:clip-path;pointer-events:auto;}
:where(.reconers-reference) .css-1vonzn2-InvertLayer{position:absolute;inset:0;background-color:#ffffff;opacity:0;}
:where(.reconers-reference) .css-5ukd5p-OutroInner{position:absolute;inset:0;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}
:where(.reconers-reference) .css-15nel3u-OutroTitle-splitTextChars{font-size:clamp(28px, 3.75vw, 72px);font-style:normal;font-weight:700;line-height:140%;letter-spacing:-1.44px;text-align:center;color:#ffffff;font-kerning:none;}
:where(.reconers-reference) .css-15nel3u-OutroTitle-splitTextChars .word{overflow:hidden;vertical-align:top;}
:where(.reconers-reference) .css-15nel3u-OutroTitle-splitTextChars .char{will-change:transform;}
:where(.reconers-reference) .css-15nel3u-OutroTitle-splitTextChars .inline{display:inline!important;}
@media  (min-width: 768px){:where(.reconers-reference) .css-1f363mt-STRUCTURE_TITLE_LINES{display:none;}}
:where(.reconers-reference) .css-14ztaww-SectionProcessCardsContainer{overflow:hidden;padding-bottom:120px;background-color:#ffffff;}
@media  (min-width: 768px){:where(.reconers-reference) .css-14ztaww-SectionProcessCardsContainer{padding-bottom:clamp(120px, 12.5vw, 240px);}}
:where(.reconers-reference) .css-1rto1v2-Inner{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:64px;}
@media  (min-width: 768px){:where(.reconers-reference) .css-1rto1v2-Inner{gap:0;}}
:where(.reconers-reference) .css-17tluki-SplitTextContainer-splitTextChars-MobileTitle{font-kerning:none;text-align:start;font-size:28px;font-weight:700;line-height:140%;letter-spacing:-0.56px;color:#0d225d;}
:where(.reconers-reference) .css-17tluki-SplitTextContainer-splitTextChars-MobileTitle .word{overflow:hidden;vertical-align:top;}
:where(.reconers-reference) .css-17tluki-SplitTextContainer-splitTextChars-MobileTitle .char{will-change:transform;}
:where(.reconers-reference) .css-17tluki-SplitTextContainer-splitTextChars-MobileTitle .inline{display:inline!important;}
:where(.reconers-reference) .css-17tluki-SplitTextContainer-splitTextChars-MobileTitle .splitTextTarget{display:block;}
:where(.reconers-reference) .css-1c5y92x-Stack{position:relative;}
@media  (min-width: 768px){:where(.reconers-reference) .css-1c5y92x-Stack{height:100vh;height:100dvh;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}}
:where(.reconers-reference) .css-1yp7iz5-CardList{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:24px;width:100%;}
@media  (min-width: 768px){:where(.reconers-reference) .css-1yp7iz5-CardList{position:relative;display:block;height:90%;perspective:1600px;}}
:where(.reconers-reference) .css-14usf1x-ProcessCardContainer{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:20px;padding:40px 20px;border-radius:20px;background-color:var(--card-color);}
@media  (min-width: 768px){:where(.reconers-reference) .css-14usf1x-ProcessCardContainer{position:absolute;left:0;right:0;top:calc(40px * var(--card-index));-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;padding:clamp(20px, 4.17vw, 80px);height:calc(100% - 40px * (var(--card-total) - 1));transform-origin:center top;will-change:transform;-webkit-backface-visibility:hidden;backface-visibility:hidden;}}
:where(.reconers-reference) .css-w8sxpw-ImageWrapper{display:block;}
@media  (min-width: 768px){:where(.reconers-reference) .css-w8sxpw-ImageWrapper{-webkit-flex:none;-ms-flex:none;flex:none;height:100%;width:40%;}}
:where(.reconers-reference) .css-1exq08q-StyledImage{display:block;width:auto;height:clamp(218px, 58.13vw, 654px);max-width:100%;object-fit:contain;}
@media  (min-width: 768px){:where(.reconers-reference) .css-1exq08q-StyledImage{height:100%;aspect-ratio:1/1;}}
:where(.reconers-reference) .css-1hvzbtl-TextContainer{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:20px;}
@media  (min-width: 768px){:where(.reconers-reference) .css-1hvzbtl-TextContainer{gap:clamp(20px, 2.5vw, 48px);-webkit-order:-1;-ms-flex-order:-1;order:-1;max-width:56%;}}
:where(.reconers-reference) .css-9fue1r-Title{font-size:24px;font-weight:700;line-height:130%;letter-spacing:-0.48px;color:#ffffff;}
@media  (min-width: 768px){:where(.reconers-reference) .css-9fue1r-Title{font-size:clamp(24px, 2.92vw, 56px);letter-spacing:-1.12px;}}
@media  (min-width: 768px){:where(.reconers-reference) .css-1giif3r-title{display:none;}}
:where(.reconers-reference) .css-c5fy1z-Description{font-size:15px;font-weight:500;line-height:150%;letter-spacing:-0.3px;color:#ffffff;}
@media  (min-width: 768px){:where(.reconers-reference) .css-c5fy1z-Description{font-size:clamp(15px, 1.25vw, 24px);line-height:180%;letter-spacing:-0.48px;}}
/* 모션 최소화 환경에서도 카드와 제목을 모두 읽을 수 있게 한다. */
.reconers-reduced-motion [class*=SectionFrameworkContainer]{height:auto;padding:120px 0;}
.reconers-reduced-motion [class*=Row]{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:auto;height:auto;padding:48px 20px 0;}
.reconers-reduced-motion [class*=CardBox]{width:auto;}
.reconers-reduced-motion [class*=Stack],.reconers-reduced-motion [class*=CardList]{display:flex;flex-direction:column;height:auto;gap:24px;}
.reconers-reduced-motion .processCard{position:relative;top:auto;left:auto;right:auto;height:auto;min-height:420px;}
.reconers-reduced-motion .reconers-process-intro{height:50vh;}
.reconers-reduced-motion [class*=BlueWipe],.reconers-reduced-motion [class*=InvertLayer]{display:none;}
.reconers-reduced-motion [class*=OutroTitle]{color:#1557f3;}
@media(min-width:768px){#section-6.reconers-reduced-motion .reconers-process-intro [class*=OutroTitle]{color:#fff;}}

/* 카드·제목의 배치를 보존하고 배경 레이어만 스크롤에 맞춰 섞는다. */
#section-3 [class*=SectionFrameworkContainer]::before {
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:#06070b url("assets/ungrammerax/assets/design-system/cosmic/stars.svg") repeat;
  opacity:var(--usp-dark-opacity,0);
}
#section-3 [class*=TitleArea] {position:relative;z-index:1;}
#section-3 [class*=Row] {z-index:1;}
@media(max-width:767px) {
  #section-3 [class*=Row] {position:relative;}
}