/* =========================================================
   모두잇 v3 (공통 첫 화면 · 모두잇 홈페이지 · 모두잇 기획)
   v2 — 식스샵 메인 구성과 같은 배치·움직임, 대표색 오렌지
   모바일 기준으로 작성하고 751px(첫 화면) · 1251px(전체) 이상에서 넓힘
   ========================================================= */
@font-face{font-family:"Pretendard Variable";font-weight:45 920;font-style:normal;font-display:swap;src:url("fonts/PretendardVariable.woff2") format("woff2-variations")}
@property --ang{syntax:"<angle>";initial-value:0deg;inherits:false}

:root{
  --brand:#FF5C00;          /* 대표색 오렌지 */
  --brand-d:#E04E00;        /* 눌렀을 때 · 글자용 진한 오렌지 */
  --brand-l:#FFF0E5;        /* 연한 오렌지 배경 */
  --brand-m:#FF8A3D;        /* 어두운 배경 위 링크 */
  --gtext:linear-gradient(124deg,#FFB800 0%,#FF5C00 30%,#FF2E7E 70%,#FFB800 100%);
  --ink:#000;
  --muted:#85878E;
  --desc:#45474C;
  --line:#E3E4E9;
  --soft:#F0F1F5;
  --hd-h:65px;
  --pink:#FF2E7E;
  --yellow:#FFB800;
  --ink2:#191A1F;
  --ease:cubic-bezier(.25,.1,.25,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --font:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--font);color:var(--ink);background:#fff;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-x:hidden}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button,input,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
img,svg{display:block}
address{font-style:normal}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;background:#000;color:#fff;padding:8px 14px;border-radius:8px;z-index:2000}
.skip:focus{top:12px}
.d-only{display:none}
.dh-only{display:none}

/* ---------- 버튼 ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;text-align:center;white-space:nowrap;transition:all .2s cubic-bezier(.33,0,.2,1)}
.btn-sm{font-size:14px;font-weight:700;line-height:23.1px;padding:8px 12px;border-radius:10px}
.btn-md{font-size:16px;font-weight:600;line-height:25.6px;padding:10px 20px;border-radius:10px;min-width:160px}
.btn-lg{font-size:18px;font-weight:600;line-height:25.92px;padding:16px 32px;border-radius:12px}
.btn-text{background:#fff;color:var(--brand-d)}
.btn-text:hover{background:var(--brand-l)}
.btn-brand{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-brand:hover{background:var(--brand-d);border-color:var(--brand-d)}
.btn-line{background:#fff;border-color:var(--line);color:#000}
.btn-basic{background:#fff;border-color:rgba(0,0,0,.1);color:#000}
.btn-basic:hover{background:#F7F7F8}
.btn-black{background:#000;color:#fff}
.btn-black:hover{background:#222}

/* ---------- 섹션 공통 소제목 · 제목 ---------- */
.sub{font-size:18px;font-weight:600;line-height:25.2px;letter-spacing:-.36px;text-align:center;margin-bottom:8px}
.gtext{background:var(--gtext);-webkit-background-clip:text;background-clip:text;color:transparent}
.ttl{font-size:28px;font-weight:700;line-height:36.4px;letter-spacing:-.84px;text-align:center;color:#000;margin-bottom:16px}
.ttl--w{color:#fff}

/* =========================================================
   헤더
   ========================================================= */
.hd{position:fixed;top:0;left:0;right:0;z-index:1000;background:#fff;border-bottom:1px solid var(--line);transition:opacity .3s ease,transform .3s ease}
.hd.is-up{transform:translateY(-100%)}
.hd-bar{position:relative;height:65px;display:flex;align-items:center;justify-content:space-between;padding:12px 20px;max-width:1840px;margin:0 auto}
.logo{display:flex;align-items:center;gap:7px}
.logo__mark{position:relative;width:22px;height:22px}
.logo__mark i{position:absolute;border-radius:6px}
.logo__mark i:first-child{left:0;top:0;width:16px;height:16px;background:var(--brand)}
.logo__mark i:last-child{right:0;bottom:0;width:12px;height:12px;background:#1B1B1F;border:2px solid #fff}
.logo__word{font-size:22px;font-weight:800;letter-spacing:-.04em;color:#111}
.gnb,.hd-btns{display:none}
.hd-mcta{margin-left:auto;margin-right:16px;font-size:14px;font-weight:600;padding:4px 8px;border-radius:8px}
.hd-menu{position:relative;width:18px;height:20px}
.hd-menu span,.hd-menu::before,.hd-menu::after{content:"";position:absolute;left:0;right:0;height:2px;border-radius:2px;background:#111;transition:transform .3s var(--ease-out),opacity .2s}
.hd-menu::before{top:3px}.hd-menu span{top:9px}.hd-menu::after{top:15px}
.hd-menu[aria-expanded="true"]::before{transform:translateY(6px) rotate(45deg)}
.hd-menu[aria-expanded="true"] span{opacity:0}
.hd-menu[aria-expanded="true"]::after{transform:translateY(-6px) rotate(-45deg)}

/* 메가 메뉴 · 하위 메뉴 (데스크톱) */
.gnb ul{display:flex;gap:28px}
.gnb li{position:relative}
.gnb li > a{display:inline-block;font-size:16px;font-weight:500;line-height:24px;letter-spacing:-.5px;color:#000;transition:all .2s linear}
.gnb li > a:hover,.gnb li:hover > a{color:var(--brand-d)}
.gnb li::after{content:"";position:absolute;left:-14px;right:-14px;top:100%;height:24px}
.mega,.dd{position:absolute;top:calc(100% + 16px);background:#fff;border:1px solid rgba(0,0,0,.1);border-radius:16px;box-shadow:1px 0 20px rgba(0,0,0,.1);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .24s ease,transform .24s ease,visibility .24s ease;z-index:5}
.gnb li:hover > .mega,.gnb li:hover > .dd,.gnb li:focus-within > .mega,.gnb li:focus-within > .dd{opacity:1;visibility:visible;transform:none}
.mega{left:50%;margin-left:-380px;width:760px;padding:28px 24px;display:grid;grid-template-columns:240px 240px 1fr;gap:32px}
.mega__h{font-size:13px;font-weight:700;color:var(--muted);margin-bottom:12px}
.mega__col a{display:grid;gap:2px;padding:10px 12px;margin:0 -12px;border-radius:10px;transition:background .2s}
.mega__col a:hover{background:#F7F7F8}
.mega__col a b{font-size:15px;font-weight:600;color:#333}
.mega__col a span{font-size:13px;color:var(--muted)}
.mega__card{background:var(--brand-l)!important;margin:0!important;padding:18px!important;gap:6px!important}
.mega__card em{font-style:normal;font-size:14px;font-weight:700;color:var(--brand-d);margin-top:6px}
.dd{left:-24px;min-width:150px;padding:24px;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.dd a{font-size:15px;font-weight:600;line-height:22.5px;color:#333;padding:4px 0;white-space:nowrap;transition:color .3s ease-in-out}
.dd a:hover{color:var(--brand-d)}

/* 모바일 메뉴 */
.mnav{position:fixed;left:0;right:0;bottom:0;top:var(--hd-h);z-index:999;background:#fff;padding:8px 20px calc(24px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;justify-content:space-between;overflow-y:auto}
.mnav nav{display:flex;flex-direction:column}
.mnav nav a{padding:17px 0;border-bottom:1px solid var(--soft);font-size:18px;font-weight:700;letter-spacing:-.02em;display:flex;justify-content:space-between}
.mnav nav a::after{content:"›";color:#B0B3BB;font-weight:400}
.mnav__btns{display:grid;gap:8px;margin-top:24px}

/* =========================================================
   1. 첫 화면
   ========================================================= */
.hero{position:relative;z-index:0;margin-top:var(--hd-h);min-height:calc(100vh - var(--hd-h));min-height:calc(100svh - var(--hd-h));display:flex;flex-direction:column;justify-content:center;align-items:center;padding:40px 20px}
.hero-bg{position:absolute;left:0;right:0;top:-12px;height:1388px;overflow:hidden;pointer-events:none;z-index:0}
.hero-band{position:absolute;left:50%;top:260px;width:1744px;height:1388px;margin-left:-872px;will-change:transform,opacity;
  -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 14%,#000 58%,transparent 92%);mask-image:linear-gradient(180deg,transparent 0%,#000 14%,#000 58%,transparent 92%)}
.hero-band i{position:absolute;border-radius:50%;filter:blur(90px);will-change:transform}
.hero-band .b1{left:16%;top:10%;width:36%;height:40%;background:#FF9EC4;opacity:.85;animation:hb1 18s ease-in-out infinite alternate}
.hero-band .b2{left:33%;top:16%;width:34%;height:38%;background:#FFB38A;opacity:.9;animation:hb2 22s ease-in-out infinite alternate}
.hero-band .b3{left:52%;top:8%;width:34%;height:42%;background:#FF8A4C;opacity:.8;animation:hb3 20s ease-in-out infinite alternate}
.hero-band .b4{left:40%;top:30%;width:28%;height:32%;background:#FFD66B;opacity:.85;animation:hb4 16s ease-in-out infinite alternate}
@keyframes hb1{to{transform:translate3d(8%,6%,0) scale(1.12)}}
@keyframes hb2{to{transform:translate3d(-10%,-5%,0) scale(.9)}}
@keyframes hb3{to{transform:translate3d(-6%,8%,0) scale(1.1)}}
@keyframes hb4{to{transform:translate3d(12%,-8%,0) scale(1.18)}}
.hero-noise{position:absolute;inset:0;opacity:.3;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.hero-inner{position:relative;z-index:1;width:100%;max-width:720px}
.hero-heading{padding-bottom:32px}
.hero-title{font-size:36px;font-weight:700;line-height:46.8px;letter-spacing:-1.08px;text-align:center;color:#000}
.hero-title .w{display:inline-block;white-space:nowrap}
.hero-title .ch{display:inline-block}
.hero-desc{font-size:16px;font-weight:500;line-height:22.4px;letter-spacing:-.32px;color:var(--muted);text-align:center;padding-top:12px}

/* 첫 화면 등장: 글자 하나씩 흐릿 → 선명, 나머지는 아래에서 떠오름 */
.js .hero-title .ch{opacity:0;transform:translate3d(0,.2em,0);filter:blur(8px);transition:opacity .8s var(--ease) var(--dl),transform .9s var(--ease-out) var(--dl),filter .9s var(--ease-out) var(--dl)}
.js .rv-h{opacity:0;transform:translate3d(0,14px,0);filter:blur(6px);transition:opacity .8s var(--ease) var(--dl,0s),transform .9s var(--ease-out) var(--dl,0s),filter .9s var(--ease-out) var(--dl,0s)}
.js .rv-box{opacity:0;transform:translate3d(0,28px,0);transition:opacity .7s var(--ease) var(--dl,0s),transform 1s var(--ease-out) var(--dl,0s)}
.is-intro .hero-title .ch,.is-intro .rv-h,.is-intro .rv-box{opacity:1;transform:none;filter:none}

/* 상담 입력창 */
.ask-tabs{display:flex;align-items:center;justify-content:flex-start;width:fit-content;max-width:calc(100% - 45px);margin:0 auto 16px;background:var(--soft);border-radius:12px;padding:4px;overflow-x:auto;scrollbar-width:none}
.ask-tabs::-webkit-scrollbar{display:none}
.ask-tab{flex:none;display:flex;align-items:center;justify-content:center;gap:4px;padding:8px 12px;border-radius:8px;font-size:12px;font-weight:600;line-height:12px;color:var(--muted);white-space:nowrap;transition:background .2s,color .2s,box-shadow .2s}
.ask-tab svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;display:none}
.ask-tab.is-on{background:#fff;color:#333;box-shadow:1px 0 6px rgba(0,0,0,.1)}
.ask-div{flex:none;width:1px;height:20px;background:rgba(0,0,0,.1);margin:0 6px}
.ask-box{position:relative;z-index:1;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 10px 40px rgba(255,92,0,.08)}
.ask-box::before{content:"";position:absolute;inset:-1.5px;border-radius:21.5px;z-index:-1;background:conic-gradient(from var(--ang),#FF5C00,#FF2E7E 50%,#FF5C00);animation:spin-border 9s linear infinite}
@keyframes spin-border{to{--ang:360deg}}
.ask-panel{display:flex;flex-direction:column;gap:16px;background:#fff;border-radius:18.5px;padding:16px}
.ask-input{width:100%;height:85px;border:0;outline:0;resize:none;background:#fff;border-radius:8px;padding:8px 2px 8px 8px;font-size:15px;line-height:1.6;color:#111}
.ask-input--s{height:56px}
.ask-input::placeholder,.ask-url::placeholder{color:#B0B3BB}
.ask-url{width:100%;height:44px;border:1px solid var(--line);border-radius:8px;padding:0 12px;font-size:15px;outline:0}
.ask-url:focus{border-color:var(--brand)}
.ask-fn{display:flex;justify-content:space-between;align-items:center}
.ask-acts{display:flex;gap:8px;align-items:center}
.ask-ibtn{width:32px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:6px;padding:0 6px;border:1px solid transparent;transition:background .2s,border-color .2s}
.ask-ibtn svg{width:18px;height:18px;fill:none;stroke:#45474C;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ask-attach:hover{background:var(--soft)}
.ask-send{background:var(--soft);border-color:var(--soft)}
.ask-send svg{width:12px;height:14px;stroke:#B0B3BB;stroke-width:1.8}
.ask-send.is-ready{background:var(--brand);border-color:var(--brand)}
.ask-send.is-ready svg{stroke:#fff}
.ask-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:20px;border:1px dashed #CFD0D9;border-radius:8px;text-align:center}
.ask-drop__txt{display:flex;flex-direction:column;gap:4px;align-items:center}
.ask-drop__t{font-size:15px;line-height:22.5px;color:#333}
.ask-drop__d{font-size:12px;line-height:18px;color:var(--muted)}
.ask-abtn{display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 10px;border:1px solid var(--line);border-radius:6px;background:#fff;font-size:13px;font-weight:600;color:#333;cursor:pointer}
.ask-abtn svg{width:16px;height:16px;fill:none;stroke:#333;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ask-presets{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;padding-top:16px}
.ask-chip{height:30px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.9);font-size:13px;line-height:19.5px;color:#333;transition:border-color .2s,color .2s}
.ask-chip:hover{border-color:var(--brand);color:var(--brand-d)}
.ask-shuffle{width:32px;height:30px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:6px;background:#fff}
.ask-shuffle svg{width:18px;height:18px;fill:none;stroke:#333;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.9;transition:transform .4s var(--ease-out)}
.ask-shuffle:hover svg{transform:rotate(180deg)}

/* =========================================================
   2. 템플릿
   ========================================================= */
.tplsec{position:relative;padding:100px 20px 40px;overflow:hidden}
.sec-wrap{display:flex;flex-direction:column;align-items:center}
.tpl-box{position:relative;width:calc(100% + 40px);margin:40px -20px 0;overflow:hidden;touch-action:pan-y}
.tpl-track{display:flex;will-change:transform}
.tpl-track.is-anim{transition:transform .5s var(--ease)}
.tpl{flex:none;width:330px;padding:0 10px;container-type:inline-size;user-select:none;-webkit-user-select:none}
.tp{width:100%;aspect-ratio:323/437;border-radius:8px;overflow:hidden;border:1px solid rgba(0,0,0,.07);box-shadow:10px 10px 50px rgba(0,0,0,.06);background:var(--c2);color:var(--ink);font-size:2.5cqw;line-height:1.35;letter-spacing:-.02em;pointer-events:none}
.tpl-progress{position:relative;width:80px;height:4px;margin:36px auto 0;background:rgba(23,23,25,.07);border-radius:70px;overflow:hidden}
.tpl-progress i{display:block;height:100%;width:0;background:#000;border-radius:50px;transition:width .5s var(--ease)}

/* 포스터(코드로 그린 홈페이지 미리보기) — 가로 40em 기준 */
.tp-nav{display:flex;align-items:center;gap:1.3em;height:3.4em;padding:0 1.6em}
.tp-nav b{font-size:.95em;font-weight:800;color:var(--c1);margin-right:auto;white-space:nowrap}
.tp-nav span{font-size:.58em;opacity:.6;white-space:nowrap}
.tp-nav i{width:3.2em;height:1.3em;border-radius:99em;background:var(--c1)}
.tp-hero--a{position:relative;height:19em;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.tp-hero--a::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 60% at 75% 25%,rgba(255,255,255,.4),transparent 60%),radial-gradient(40% 50% at 20% 90%,rgba(0,0,0,.25),transparent 70%)}
.tp-hero--a div{position:relative;display:grid;gap:1em;justify-items:center}
.tp-hero--a strong{font-size:1.75em;line-height:1.28;color:#fff;text-shadow:0 .1em .8em rgba(0,0,0,.2)}
.tp-hero--a em{font-style:normal;font-size:.62em;font-weight:700;background:#fff;color:var(--c1);padding:.55em 1.3em;border-radius:99em}
.tp-hero--b{display:grid;grid-template-columns:1fr 1fr;gap:1.2em;align-items:center;padding:1.8em 1.6em}
.tp-hero__txt{display:grid;gap:.6em;justify-items:start}
.tp-hero__txt strong{font-size:1.45em;line-height:1.3;color:var(--ink)}
.tp-hero__txt .l{display:block;width:100%;height:.45em;border-radius:.2em;background:currentColor;opacity:.12}
.tp-hero__txt .l.s{width:70%}
.tp-btns{display:flex;gap:.4em;margin-top:.4em}
.tp-btns i{font-style:normal;font-size:.52em;font-weight:700;padding:.6em 1em;border-radius:99em;background:var(--c1);color:#fff}
.tp-btns i.o{background:transparent;color:var(--c1);box-shadow:inset 0 0 0 .12em var(--c1)}
.tp-hero__img{height:15em;border-radius:.8em}
.tp-hero--c{padding:1.2em 1.6em 0}
.tp-hero--c strong{display:block;font-size:6.2em;font-weight:900;letter-spacing:-.05em;line-height:.95;color:var(--c1)}
.tp-hero__row{display:grid;grid-template-columns:1.5fr 1fr;gap:.8em;margin-top:.9em}
.tp-hero__row i{height:10.5em;border-radius:.6em}
.tp-sec{padding:2.2em 1.6em 1.6em}
.tp-sec small{display:block;font-size:.5em;font-weight:800;letter-spacing:.2em;color:var(--c1)}
.tp-sec strong{display:block;font-size:1.1em;margin:.3em 0 1em}
.tp-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:.8em}
.tp-card{display:grid;gap:.4em}
.tp-card i{display:block;height:6.2em;border-radius:.5em}
.tp-card b{font-size:.6em}
.tp-card em{display:block;height:.38em;border-radius:.2em;background:currentColor;opacity:.12}
.tp-card em.s{width:60%}
.tp-band{display:grid;grid-template-columns:1.2fr 1fr;margin:0 1.6em;border-radius:.8em;overflow:hidden;background:var(--c1);color:#fff}
.tp-band > div{padding:1.4em}
.tp-band strong{font-size:.82em;line-height:1.45}
.tp-band em{display:block;width:60%;height:.4em;border-radius:.2em;background:#fff;opacity:.5;margin-top:.9em}
.tp-band i{min-height:8.6em}
.tp-list{padding:1.8em 1.6em 1.4em}
.tp-list p{height:.45em;border-radius:.2em;background:currentColor;opacity:.1;margin-bottom:.7em}
.tp-list p:nth-child(2){width:78%}.tp-list p:nth-child(3){width:56%}
.tp-foot{background:#141416;color:#fff;padding:1.4em 1.6em 3em}
.tp-foot b{display:block;font-size:.7em;margin-bottom:.7em}
.tp-foot em{display:block;height:.38em;width:70%;border-radius:.2em;background:#fff;opacity:.25;margin-bottom:.5em}
.tp-foot em.s{width:45%}
.tp--dark .tp-band{color:#141B2D}
.tp--dark .tp-card b{color:#F1ECE0}

/* =========================================================
   3. 서비스 (어두운 섹션)
   ========================================================= */
.adv{position:relative;z-index:100;display:flex;flex-direction:column;align-items:center;padding:100px 10px;color:#fff;
  background:linear-gradient(175deg,#000 0%,#7A1E0A 70%,#FF5C00 100%)}
.adv .ttl{margin-bottom:16px}
.adv-cards{position:relative;display:flex;flex-direction:column;gap:32px;width:calc(100% - 40px);margin:40px 20px 0}
.adv-card{--i:0;position:sticky;top:calc(140px + var(--i) * 20px);display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;height:442px;border-radius:24px;border:1px solid rgba(255,255,255,.1);overflow:hidden;
  background:linear-gradient(180deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,0) 100%),linear-gradient(0deg,rgba(24,24,24,.96),rgba(24,24,24,.96)),rgba(255,255,255,.04);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}
.adv-card:nth-child(2){--i:1}.adv-card:nth-child(3){--i:2}.adv-card:nth-child(4){--i:3}
.adv-txt{padding:32px 32px 0;width:100%}
.badge{display:inline-block;font-size:12px;font-weight:600;line-height:16.8px;letter-spacing:.2px;color:#000;background:rgba(0,0,0,.05);border:1px solid rgba(0,0,0,.05);border-radius:8px;padding:4px 6px;margin-bottom:16px}
.badge--d{color:#fff;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.07);border-radius:6px}
.adv-txt h4{font-size:22px;font-weight:700;line-height:28.6px;color:#fff;margin-bottom:16px}
.adv-txt p{font-size:14px;font-weight:500;line-height:21px;letter-spacing:-.4px;color:var(--muted)}
.adv-txt p br{display:none}
.adv-links{display:none}
.adv-vis{position:relative;width:100%;aspect-ratio:313/221;flex:none;container-type:inline-size}

/* 서비스 카드 그림 — 가로 40em × 세로 28.2em */
.av > *{position:absolute;font-size:2.5cqw;line-height:1.35;letter-spacing:-.02em}
.av-pill{left:6em;top:2.2em;width:24em;height:2.9em;display:flex;align-items:center;gap:.6em;padding:0 .45em 0 .9em;border-radius:99em;border:.1em solid transparent;
  background:linear-gradient(#fff,#fff) padding-box,linear-gradient(90deg,#FFB800,#FF5C00,#FF2E7E) border-box;box-shadow:0 .6em 1.8em rgba(0,0,0,.35)}
.av-pill span{flex:1;font-size:.6em;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.av-spark{width:1.05em;height:1.05em;background:linear-gradient(135deg,#FFB800,#FF5C00);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%)}
.av-pill b{position:relative;width:1.8em;height:1.8em;border-radius:50%;background:linear-gradient(135deg,#FF8A3D,#E04E00)}
.av-pill b::after{content:"";position:absolute;left:.62em;top:.62em;width:.45em;height:.45em;border:solid #fff;border-width:.12em .12em 0 0;transform:rotate(45deg)}
.av-ico{width:2.6em;height:2.6em;border-radius:.55em;background:linear-gradient(135deg,#FF8A3D,#E04E00);display:grid;place-items:center;box-shadow:0 .5em 1.4em rgba(255,92,0,.45);z-index:2}
.av-ico svg{width:1.35em;height:1.35em;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.av-ico--a{left:29.6em;top:6.6em}.av-ico--b{left:33.4em;top:4.6em}
.av-win{left:10.4em;top:8.1em;width:26.5em;height:17.6em;border-radius:.7em;padding:.9em;background:rgba(255,255,255,.06);border:.06em solid rgba(255,255,255,.14);box-shadow:0 1em 3em rgba(0,0,0,.4)}
.av-site{height:100%;border-radius:.45em;overflow:hidden;background:#FBF6EF;color:#2A1E14}
.av-site__nav{display:flex;align-items:center;gap:1em;height:2.2em;padding:0 1em}
.av-site__nav b{font-size:.62em;color:#6B4A2E;margin-right:auto}
.av-site__nav span{font-size:.42em;opacity:.6}
.av-site__hero{display:grid;grid-template-columns:1fr 1fr;gap:1em;padding:.6em 1em;align-items:center}
.av-site__hero div{display:grid;gap:.5em;justify-items:start}
.av-site__hero em{font-style:normal;font-size:.4em;font-weight:800;letter-spacing:.2em;color:#B07A4E}
.av-site__hero strong{font-size:1.05em;line-height:1.28}
.av-site__hero span{font-size:.42em;color:#7A6A5C;line-height:1.5}
.av-site__hero i{font-style:normal;font-size:.42em;font-weight:700;background:#6B4A2E;color:#fff;padding:.55em 1.1em;border-radius:99em}
.av-site__ph{height:10.4em;border-radius:.5em;background:radial-gradient(35% 30% at 50% 58%,#F8EFE3 0 58%,transparent 60%),radial-gradient(60% 50% at 70% 20%,rgba(255,255,255,.35),transparent 60%),linear-gradient(160deg,#E8C9A4 0%,#B07A4E 55%,#5E3C24 100%)}
.av-site__dots{display:flex;gap:.3em;justify-content:center;margin-top:.4em}
.av-site__dots i{width:.35em;height:.35em;border-radius:50%;background:#D9CBBB}
.av-site__dots i.on{background:#6B4A2E;width:1em;border-radius:99em}

.av-thumbs{left:2.6em;top:3.4em;width:19em;height:21em}
.av-th{position:absolute;top:2em;width:8.4em;height:12.6em;border-radius:.6em;overflow:hidden;background:#fff;box-shadow:0 .8em 2em rgba(0,0,0,.45);padding-bottom:.6em}
.av-th::before{content:"";display:block;height:7.4em;background:var(--ph)}
.av-th b{display:block;font-size:.5em;letter-spacing:.2em;color:#222;padding:.9em 1.2em .5em}
.av-th i{display:block;height:.35em;margin:.35em .6em 0;border-radius:.2em;background:#E6E6EA}
.av-th i.s{width:55%}
.av-th:nth-child(1){left:0;transform:rotate(-8deg);transform-origin:bottom right}
.av-th:nth-child(3){right:0;transform:rotate(8deg);transform-origin:bottom left}
.av-th--on{left:5.3em;top:0;z-index:2;box-shadow:0 0 0 .2em var(--brand),0 1em 2.4em rgba(0,0,0,.55)}
.av-panel{right:2.4em;top:3em;width:14.4em;background:#fff;color:#222;border-radius:.8em;padding:1.1em;box-shadow:0 1em 2.6em rgba(0,0,0,.45)}
.av-panel__h{font-size:.5em;font-weight:800;color:#8A8D96;margin-bottom:.8em}
.av-chips{display:flex;flex-wrap:wrap;gap:.35em;margin-bottom:1em}
.av-chips span{font-size:.5em;font-weight:700;padding:.4em .8em;border-radius:99em;background:#F2F2F5;color:#555}
.av-chips span.on{background:var(--brand);color:#fff}
.av-rows p{display:flex;align-items:center;gap:.5em;font-size:.52em;font-weight:600;padding:.45em 0;border-top:.1em solid #F1F1F4}
.av-rows p i{width:1em;height:1em;border-radius:50%;background:var(--brand-l);position:relative}
.av-rows p i::after{content:"";position:absolute;left:.34em;top:.2em;width:.28em;height:.5em;border:solid var(--brand-d);border-width:0 .13em .13em 0;transform:rotate(45deg)}
.av-apply{display:block;margin-top:.9em;text-align:center;font-size:.52em;font-weight:800;background:var(--brand);color:#fff;padding:.8em 0;border-radius:.5em}

.av-admin{left:3em;top:2.6em;width:28em;height:21.6em;border-radius:.7em;overflow:hidden;display:grid;grid-template-columns:7em 1fr;box-shadow:0 1em 3em rgba(0,0,0,.45)}
.av-admin__side{background:#16181D;color:#B9BECB;padding:1.1em .8em;display:flex;flex-direction:column;gap:.3em}
.av-admin__side b{color:#fff;font-size:.62em;margin-bottom:.8em;display:flex;align-items:center;gap:.4em}
.av-admin__side b::before{content:"";width:.9em;height:.9em;border-radius:.25em;background:var(--brand)}
.av-admin__side span{font-size:.48em;padding:.55em .7em;border-radius:.45em}
.av-admin__side span.on{background:rgba(255,92,0,.25);color:#fff;font-weight:700}
.av-admin__main{background:#F4F5F7;color:#1B1D22;padding:1em;display:grid;gap:.7em;align-content:start}
.av-admin__top{display:flex;justify-content:space-between;align-items:center}
.av-admin__top b{font-size:.7em}
.av-admin__top i{width:1.3em;height:1.3em;border-radius:50%;background:linear-gradient(135deg,#FFC39B,#E04E00)}
.av-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:.5em}
.av-kpis div{background:#fff;border-radius:.5em;padding:.6em .7em;display:grid}
.av-kpis small{font-size:.42em;color:#7A7F8C}
.av-kpis b{font-size:.85em}
.av-bars{height:5.4em;background:#fff;border-radius:.5em;padding:.7em;display:flex;align-items:flex-end;gap:.5em}
.av-bars i{flex:1;height:var(--h);border-radius:.25em .25em .1em .1em;background:linear-gradient(180deg,#FF9A5C,#FF5C00)}
.av-tbl{background:#fff;border-radius:.5em;padding:.2em .7em}
.av-tbl p{display:flex;justify-content:space-between;align-items:center;padding:.45em 0;border-bottom:.08em solid #EEF0F3;font-size:.46em}
.av-tbl p:last-child{border:0}
.av em.ok,.av em.wait{font-style:normal;font-weight:700;padding:.2em .6em;border-radius:99em;font-size:.95em}
.av em.ok{background:#E3F4EC;color:#0E7A4E}
.av em.wait{background:#FFF1DC;color:#A0600A}
.av-req{right:2.2em;bottom:2.2em;width:15em;background:#fff;color:#1B1D22;border-radius:.7em;padding:1em 1.1em;display:grid;gap:.4em;box-shadow:0 1em 2.6em rgba(0,0,0,.5);animation:float-y 5s ease-in-out infinite}
.av-req b{font-size:.62em}
.av-req span{font-size:.5em;color:#5B6070}
.av-req em{justify-self:start;font-style:normal;font-size:.46em;font-weight:700;color:var(--brand-d);background:var(--brand-l);padding:.3em .8em;border-radius:99em}
@keyframes float-y{50%{transform:translateY(-.5em)}}

.av-check{left:3.4em;top:3em;width:20em;background:#fff;color:#1B1D22;border-radius:.8em;padding:1.2em 1.3em;box-shadow:0 1em 3em rgba(0,0,0,.45)}
.av-check__h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.6em}
.av-check__h b{font-size:.72em}
.av-check__h span{font-size:.48em;font-weight:700;color:var(--brand-d)}
.av-check p{display:flex;align-items:center;gap:.6em;font-size:.56em;font-weight:600;padding:.75em 0;border-top:.08em solid #F0F1F4}
.av-check p i{width:1.3em;height:1.3em;border-radius:50%;background:var(--brand);position:relative;flex:none}
.av-check p i::after{content:"";position:absolute;left:.45em;top:.25em;width:.3em;height:.58em;border:solid #fff;border-width:0 .14em .14em 0;transform:rotate(45deg)}
.av-check p em{font-style:normal;margin-left:auto;font-size:.85em;color:#8A8D96;font-weight:500}
.av-domain{right:2.6em;top:6.4em;width:13.4em;background:#1F1F23;border:.06em solid rgba(255,255,255,.14);border-radius:.8em;padding:1.1em;display:grid;gap:.35em;box-shadow:0 1em 2.6em rgba(0,0,0,.5)}
.av-domain small{font-size:.45em;color:#9A9DA6}
.av-domain b{font-size:.72em;color:#fff}
.av-domain span{display:flex;align-items:center;gap:.4em;font-size:.46em;color:#C9CCD3}
.av-domain span i{width:.55em;height:.55em;border-radius:50%;background:#22C55E}
.av-toast{right:3.6em;bottom:3em;display:flex;align-items:center;gap:.5em;background:#fff;color:#1B1D22;font-size:.56em;font-weight:700;padding:.75em 1.2em;border-radius:99em;box-shadow:0 .8em 2em rgba(0,0,0,.45);animation:float-y 5s ease-in-out infinite}
.av-toast i{width:.7em;height:.7em;border-radius:50%;background:var(--brand)}

/* 어두운 섹션이 들어올 때 페이지 전체를 덮는 어둠막 */
.dim{position:fixed;inset:0;z-index:99;background:rgba(0,0,0,0);pointer-events:none}

/* =========================================================
   4. 누가 만드나요
   ========================================================= */
.feat{position:relative;display:flex;flex-direction:column;align-items:center;background:#fff;padding:100px 20px}
.feat-cards{display:flex;flex-direction:column;align-items:center;gap:32px;width:100%;margin-top:40px}
.feat-card{--i:0;--bgo:0;position:sticky;top:calc(100px + var(--i) * 20px);width:100%;height:524px;border-radius:24px;overflow:hidden;isolation:isolate}
.feat-card:nth-child(2){--i:1}.feat-card:nth-child(3){--i:2}.feat-card:nth-child(4){--i:3}
.feat-card::after{content:"";position:absolute;inset:0;background:#fff;opacity:var(--bgo);z-index:1;pointer-events:none}
.feat-txt{position:relative;z-index:2;padding:24px}
.feat-txt h4{font-size:22px;font-weight:700;line-height:28.6px;color:#000;margin-bottom:16px}
.feat-txt p{font-size:14px;font-weight:500;line-height:21px;letter-spacing:-.4px;color:var(--muted);margin-bottom:12px}
.feat-link{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.7);border-radius:8px;padding:4px 10px;font-size:13px;font-weight:600;line-height:20.8px;color:#E04E00}
.feat-link span{transition:transform .2s var(--ease-out)}
.feat-link:hover span{transform:translateX(3px)}
.feat-vis{position:absolute;inset:0;z-index:0;container-type:inline-size}

/* 연한 오렌지 그림 패널 — 패널 폭의 1/40 = 1em */
.fp{background:radial-gradient(60% 50% at 15% 10%,rgba(255,255,255,.85),transparent 70%),radial-gradient(55% 60% at 95% 100%,rgba(255,176,130,.45),transparent 70%),linear-gradient(150deg,#FFF4EC 0%,#FFE3D1 50%,#FFD0DE 100%)}
.fp > *{position:absolute;font-size:3.7cqw;line-height:1.4;letter-spacing:-.02em;color:#1B1B1F}
.fp-win{left:1.6em;width:32em;top:21.2em;height:24em;background:#fff;border-radius:1em;overflow:hidden;box-shadow:0 .2em .6em rgba(180,90,30,.06),0 1em 2.8em rgba(180,90,30,.16)}
.fp-bar{display:flex;align-items:center;gap:.6em;height:2.5em;padding:0 1.1em;border-bottom:.06em solid #F1EFEF}
.fp-bar b{font-size:.7em}
.fp-bar span{font-size:.54em;color:#8A8D96;margin-left:auto}
.fp-bar--url i{width:.45em;height:.45em;border-radius:50%;background:#E4E2E8}
.fp-bar--url span{margin-left:.6em;background:#F4F3F6;padding:.15em 1em;border-radius:99em}
.fp-body{position:relative;padding:1.1em 1.2em}
.fp-h{font-size:.6em;font-weight:800;margin-bottom:.5em;display:flex;justify-content:space-between}
.fp-h span{color:#8A8D96;font-weight:600}
.fp-req{display:grid;grid-template-columns:12.6em 1fr;gap:1.2em}
.fp-memo p:not(.fp-h){font-size:.56em;line-height:1.6;color:#3A4460;padding:.5em 0;border-top:.1em dashed #EDEAEA}
.fp-memo mark{background:linear-gradient(transparent 55%,#FFDDBF 55%);color:inherit;font-weight:700}
.fp-list p:not(.fp-h){display:grid;grid-template-columns:1.1em 3.9em 1fr auto;align-items:center;gap:.5em;padding:.5em 0;border-top:.1em solid #F2F1F4;font-size:.56em;white-space:nowrap}
.fp-list p i{width:1.1em;height:1.1em;border-radius:.3em;background:var(--brand);position:relative}
.fp-list p i::after{content:"";position:absolute;left:.38em;top:.18em;width:.3em;height:.55em;border:solid #fff;border-width:0 .14em .14em 0;transform:rotate(45deg)}
.fp-list p em{font-style:normal;font-weight:800;color:var(--brand-d)}
.fp-list p small{font-size:.9em;font-weight:700;padding:.12em .6em;border-radius:99em;background:#EEF0F4;color:#5B6070}
.fp-list p small.up{background:var(--brand-l);color:var(--brand-d)}
.fp-list p.fp-sum{display:flex;gap:.5em;font-weight:700;color:#3B3F4F}
.fp-list p.fp-sum i{width:.7em;height:.7em;border-radius:50%;background:#22C55E}
.fp-list p.fp-sum i::after{display:none}
.fp-erd{height:19em;padding:0}
.fp-lines{position:absolute;inset:0;width:100%;height:100%}
.fp-lines path{fill:none;stroke:var(--brand);stroke-width:.14;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-width:1.5}
.fp-tbl{position:absolute;width:9em;background:#fff;border-radius:.6em;overflow:hidden;box-shadow:0 .2em .5em rgba(40,20,10,.06),0 .8em 2em rgba(40,20,10,.12);border:.06em solid #F0ECEA}
.fp-tbl b{display:block;background:#23262D;color:#fff;font-size:.62em;padding:.5em .9em}
.fp-tbl--c b{background:var(--brand)}
.fp-tbl p{display:flex;justify-content:space-between;align-items:center;padding:.4em .9em;border-top:.1em solid #F2F1F4;font-size:.52em;color:#3A4460}
.fp-tbl em{font-style:normal;font-size:.85em;font-weight:800;color:#B7791F;background:#FFF4DB;padding:.05em .45em;border-radius:.3em}
.fp-tbl em.fk{color:var(--brand-d);background:var(--brand-l)}
.fp-tag{position:absolute;left:14.3em;top:3.05em;font-size:.54em;font-weight:800;color:var(--brand-d);background:#fff;border:.12em solid #FFD0AE;border-radius:99em;padding:.15em .8em}
.fp-float{background:#fff;border-radius:.8em;box-shadow:0 .2em .5em rgba(40,20,10,.06),0 1em 2.4em rgba(40,20,10,.16)}
.fp-perm{right:1em;bottom:1.2em;width:11em;padding:.9em 1em}
.fp-perm > b{display:block;font-size:.66em;margin-bottom:.5em}
.fp-perm__g{display:grid;grid-template-columns:3em repeat(3,1fr);gap:.45em .3em;align-items:center;justify-items:center}
.fp-perm__g span{justify-self:start;font-size:.56em;font-weight:700;color:#3A4460}
.fp-perm__g small{font-size:.5em;color:#8A8D96}
.fp-perm__g i{width:.75em;height:.75em;border-radius:50%;border:.12em solid #D8DAE2}
.fp-perm__g i.on{background:var(--brand);border-color:var(--brand)}
.fp-demo{display:grid;gap:.55em}
.fp-demo__t{font-size:.9em;margin-bottom:.1em}
.fp-field{display:grid;grid-template-columns:3.8em 1fr;align-items:center;border:.08em solid #E4E5EC;border-radius:.5em;padding:.55em .8em;font-size:.62em}
.fp-field small{color:#8A8D96}
.fp-field span{font-weight:700;color:#253050}
.fp-btnrow{display:flex;justify-content:flex-end;gap:.5em;margin-top:.3em}
.fp-ghost,.fp-btn{font-size:.62em;font-weight:800;padding:.7em 1.3em;border-radius:.55em}
.fp-ghost{background:#F1F2F6;color:#5B6070}
.fp-btn{background:var(--brand);color:#fff;animation:fp-press 4.2s var(--ease) 1s infinite}
.fp-cursor{position:absolute;right:3.2em;bottom:.2em;width:1.7em;height:1.7em;fill:#1B1B1F;stroke:#fff;stroke-width:1.6;stroke-linejoin:round;filter:drop-shadow(0 .15em .3em rgba(0,0,0,.25));animation:fp-cursor 4.2s var(--ease) 1s infinite;opacity:0}
@keyframes fp-cursor{0%{opacity:0;transform:translate(-7em,-6em)}12%{opacity:1}42%{transform:translate(0,0)}48%{transform:translate(0,0) scale(.82)}56%{transform:translate(0,0) scale(1)}85%{opacity:1}100%{opacity:0;transform:translate(0,0)}}
@keyframes fp-press{0%,44%{box-shadow:0 0 0 0 rgba(255,92,0,.5)}48%{transform:scale(.95)}56%{transform:none;box-shadow:0 0 0 .8em rgba(255,92,0,0)}100%{box-shadow:0 0 0 0 rgba(255,92,0,0)}}
.fp-note{right:1em;bottom:1.4em;width:12.4em;padding:.9em 1em;display:grid;gap:.45em;border:.1em solid #FFD9C2}
.fp-note__who{display:flex;align-items:center;gap:.45em}
.fp-note__who i{width:1.3em;height:1.3em;border-radius:50%;background:linear-gradient(135deg,#FFD3B0,#FF5C00)}
.fp-note__who b{font-size:.64em}
.fp-note__who span{font-size:.48em;color:#8A8D96;margin-left:auto}
.fp-note p{font-size:.68em;font-weight:600;color:#253050}
.fp-note em{justify-self:start;font-style:normal;font-size:.5em;font-weight:800;color:#0E7A4E;background:#E3F4EC;padding:.2em .7em;border-radius:99em}
.fp-prog p{display:grid;grid-template-columns:5em 1fr 2.4em;align-items:center;gap:.7em;padding:.5em 0;font-size:.62em}
.fp-prog span{color:#3A4460;font-weight:600}
.fp-prog i{height:.62em;border-radius:99em;background:#F2EEEA;overflow:hidden}
.fp-prog s{display:block;height:100%;width:var(--w);border-radius:inherit;background:linear-gradient(90deg,#FF8A3D,#FF5C00)}
.fp-prog em{font-style:normal;font-weight:800;color:var(--brand-d);text-align:right}
.fp-gantt{margin-top:.8em;padding-top:.8em;border-top:.08em solid #F2F1F4}
.fp-gantt__wk{display:grid;grid-template-columns:repeat(6,1fr);font-size:.52em;color:#8A8D96;text-align:center;margin-bottom:.5em}
.fp-gantt__rows{position:relative;display:grid;gap:.4em;background:repeating-linear-gradient(90deg,transparent 0 calc(100%/6 - .06em),#F2EEEA calc(100%/6 - .06em) calc(100%/6))}
.fp-gantt__rows i{display:block;height:.9em;border-radius:.3em;margin-left:calc(var(--a) / 6 * 100%);width:calc((var(--b) - var(--a)) / 6 * 100%);background:#FFD3B0}
.fp-gantt__rows i:nth-child(1){background:var(--brand)}
.fp-gantt__rows i:nth-child(2){background:#FF8A3D}
.fp-gantt__rows b{position:absolute;top:-.3em;bottom:-.3em;left:calc(var(--t) / 6 * 100%);width:.12em;background:#E5484D}
.fp-cr{right:1em;bottom:1.2em;width:14em;padding:.9em 1em}
.fp-cr__h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.3em}
.fp-cr__h b{font-size:.68em}
.fp-cr__h span{font-size:.48em;color:#8A8D96}
.fp-cr p{display:grid;grid-template-columns:3.2em 1fr auto;align-items:center;gap:.5em;padding:.5em 0;border-top:.1em solid #F2F1F4;font-size:.56em}
.fp-cr p em{font-style:normal;font-weight:800;color:var(--brand-d)}
.fp-cr p span{color:#3A4460}
.fp-cr p small{font-size:.9em;font-weight:700;padding:.15em .6em;border-radius:99em;background:#EEF0F4;color:#5B6070}
.fp-cr p small.ok{background:#E3F4EC;color:#0E7A4E}
.fp-cr p small.wait{background:#FFF1DC;color:#A0600A}

/* =========================================================
   5. 고객 사례 (빈자리)
   ========================================================= */
.brand{display:flex;flex-direction:column;align-items:center;background:#FBFBFB;padding:100px 0;overflow:hidden}
.brand .ttl{padding:0 20px}
.brand-link{margin:16px 0 40px}
.brand-link a{font-size:16px;font-weight:500;line-height:24px;letter-spacing:-.4px;color:var(--muted)}
.brand-link a:hover{color:#333}
.bs{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;gap:16px;overflow:hidden}
.bs-row{width:100%;height:100px;overflow:hidden}
.bs-track{display:flex;gap:16px;width:max-content;height:100%;animation:bs-left var(--dur,40s) linear infinite;will-change:transform}
.bs-row--r .bs-track{animation-name:bs-right}
@keyframes bs-left{from{transform:translateX(0)}to{transform:translateX(calc(var(--lw,1000px) * -1))}}
@keyframes bs-right{from{transform:translateX(calc(var(--lw,1000px) * -1))}to{transform:translateX(0)}}
.bs-item{flex:none;width:160px;height:100%;border-radius:8px;background:#EEEFF2;border:1px dashed #D3D5DB;display:grid;place-items:center}
.bs-item span{font-size:12px;font-weight:600;color:#A3A6AE}
.bs-fade{position:absolute;top:0;bottom:0;width:40px;z-index:2;pointer-events:none}
.bs-fade--l{left:0;background:linear-gradient(to right,#FBFBFB,rgba(251,251,251,0))}
.bs-fade--r{right:0;background:linear-gradient(to left,#FBFBFB,rgba(251,251,251,0))}

/* =========================================================
   6. 지원
   ========================================================= */
.support{display:flex;flex-direction:column;align-items:center;padding:100px 20px;overflow:hidden;
  background:radial-gradient(60% 70% at 0% 0%,#FFE7D6 0%,rgba(255,231,214,0) 60%),radial-gradient(60% 70% at 100% 100%,#FFE3EC 0%,rgba(255,227,236,0) 60%),#FFF8F3}
.sp-cards{display:flex;flex-direction:column;align-items:center;gap:24px;width:100%;margin-top:40px}
.sp-card{width:100%;display:flex;flex-direction:column;align-items:center;gap:16px;background:#fff;border:1px solid rgba(0,0,0,.05);border-radius:24px;padding:32px 24px;text-align:center}
.sp-ico svg{width:64px;height:64px}
.sp-t{font-size:18px;font-weight:600;line-height:25.2px;letter-spacing:-.44px;color:#000}
.sp-d{font-size:16px;font-weight:500;line-height:24px;letter-spacing:-.4px;color:var(--muted);margin-bottom:16px}

/* =========================================================
   7. 마지막 안내 띠
   ========================================================= */
.cta{position:relative;display:flex;flex-direction:column;align-items:center;padding:80px 20px 70px;overflow:hidden;text-align:center;
  background:radial-gradient(45% 120% at 80% 0%,rgba(255,214,107,.55),transparent 60%),radial-gradient(40% 100% at 10% 110%,rgba(255,46,126,.55),transparent 60%),linear-gradient(115deg,#FF2E7E 0%,#FF5C00 50%,#FFB800 100%)}
.cta::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.12) 48%,transparent 56%);pointer-events:none}
.cta > *{position:relative;z-index:1}
.cta-t{font-size:28px;font-weight:700;line-height:36.4px;letter-spacing:-.84px;color:#fff;margin-bottom:16px}
.cta-d{font-size:16px;font-weight:500;line-height:24px;letter-spacing:-.4px;color:rgba(255,255,255,.8);margin-bottom:32px}

/* 푸터는 아래 v3 추가분에 있음 */

/* 떠 있는 문의하기 */
.fab{position:fixed;right:16px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:998;display:inline-flex;align-items:center;gap:6px;height:48px;padding:0 18px 0 14px;border-radius:99px;background:linear-gradient(135deg,#FF8A3D,#E04E00);color:#fff;font-size:15px;font-weight:700;box-shadow:0 10px 24px rgba(224,78,0,.35);transition:transform .2s var(--ease-out)}
.fab:hover{transform:translateY(-2px)}
.fab__ico svg{width:22px;height:22px;fill:#fff}

/* =========================================================
   첫 화면 · 헤더: 751px 이상
   ========================================================= */
@media (min-width:751px){
  .mh-only{display:none}
  .dh-only{display:inline}
  .hero{padding:40px}
  .hero-bg{top:82px}
  .hero-band{width:1918px;height:1527px;margin-left:-959px;top:400px}
  .hero-heading{padding-bottom:48px}
  .hero-title{font-size:56px;line-height:72.8px;letter-spacing:-1.68px}
  .hero-desc{font-size:20px;line-height:28px;letter-spacing:-.4px;padding-top:16px}
  .ask-tabs{justify-content:center;max-width:100%;overflow:visible}
  .ask-tab{font-size:14px;line-height:14px}
  .ask-tab svg{display:block;width:18px;height:18px}
  .ask-div{margin:0 12px}
  .ask-presets{padding-top:32px}
}

/* =========================================================
   데스크톱: 1251px 이상
   ========================================================= */
@media (min-width:1251px){
  .m-only{display:none}
  .d-only{display:block}
  br.d-only,span.d-only{display:inline}
  .hd-bar{padding:0 40px}
  .logo__mark{width:26px;height:26px}
  .logo__mark i:first-child{width:19px;height:19px}
  .logo__mark i:last-child{width:14px;height:14px}
  .logo__word{font-size:27px}
  .gnb{display:block;position:absolute;left:50%;transform:translateX(-50%)}
  .hd-btns{display:flex;gap:8px}
  .hd-mcta,.hd-menu{display:none}
  .mnav{display:none!important}

  .sub{font-size:22px;line-height:30.8px;letter-spacing:-.44px;margin-bottom:12px}
  .ttl{font-size:40px;line-height:52px;letter-spacing:-1.2px;margin-bottom:24px}

  /* 템플릿: 끝없이 흐르는 띠 */
  .tplsec{padding:200px 0 240px}
  .tpl-box{width:100%;max-width:1440px;margin:60px auto 0;padding-bottom:120px}
  .tpl-track{width:max-content;animation:tpl-marquee 72s linear infinite}
  .tplsec.is-paused .tpl-track{animation-play-state:paused}
  @keyframes tpl-marquee{to{transform:translateX(-50%)}}
  .tpl{width:373px;padding:0 50px 0 0}
  .tp{transform:scale(.86);transition:transform .3s ease-out;pointer-events:auto}
  .tpl:hover .tp{transform:scale(.9)}
  .tpl-progress{display:none}

  /* 서비스: 양옆 여백이 줄며 화면 가득 펼쳐지는 어두운 섹션 */
  .adv{margin:0 80px;border-radius:60px;padding:230px 40px;
    background:radial-gradient(38% 900px at 92% 0%,rgba(255,92,0,.7),transparent 70%),radial-gradient(45% 700px at 75% 4%,rgba(255,46,126,.1),transparent 70%),
      radial-gradient(60% 900px at 100% 100%,rgba(255,92,0,.9),transparent 70%),radial-gradient(45% 700px at 18% 100%,rgba(255,46,126,.6),transparent 70%),#000}
  .adv .ttl{margin-bottom:24px}
  .adv-cards{width:100%;max-width:1360px;margin:100px 0 0}
  .adv-card{top:calc(194px + var(--i) * 34px);flex-direction:row;height:480px;padding:0 60px 0 80px}
  .adv-txt{flex:none;width:375px;padding:80px 0}
  .badge{font-size:14px;line-height:22px;padding:4px 8px;margin-bottom:24px}
  .badge--d{border-radius:8px;margin-bottom:20px}
  .adv-txt h4{font-size:28px;line-height:36.4px}
  .adv-txt p{font-size:16px;line-height:24px}
  .adv-txt p br{display:inline}
  .adv-links{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:40px}
  .adv-links a{font-size:16px;font-weight:600;line-height:25.6px;color:var(--brand-m);display:inline-flex;gap:8px}
  .adv-links a span{transition:transform .2s var(--ease-out)}
  .adv-links a:hover span{transform:translateX(3px)}
  .adv-vis{width:calc(100% - 375px);max-width:668px;aspect-ratio:668/471}

  /* 누가 만드나요: 그림과 글이 좌우로 번갈아 */
  .feat{padding:200px 0}
  .feat-cards{width:calc(100% - 46px);max-width:1380px;margin-top:100px;gap:100px}
  .feat-card{position:relative;top:auto;height:auto;border-radius:0;overflow:visible;isolation:auto;display:grid;grid-template-columns:760fr 620fr}
  .feat-card:nth-child(even){grid-template-columns:620fr 760fr}
  .feat-card::after{display:none}
  .feat-vis{position:relative;inset:auto;aspect-ratio:760/450;border-radius:24px;overflow:hidden}
  .feat-card:nth-child(odd) .feat-vis{order:-1}
  .feat-txt{padding:60px 80px;opacity:1!important}
  .feat-txt h4{font-size:28px;line-height:36.4px}
  .feat-txt p{font-size:16px;line-height:24px;color:var(--desc);margin-bottom:40px}
  .feat-link{background:none;padding:0;font-size:16px;line-height:25.6px;color:var(--brand-d)}
  .fp > *{font-size:2.5cqw}
  .fp-win{left:4em;top:3em;height:24em}
  .fp-perm,.fp-cr{right:1.8em;bottom:1.8em}
  .fp-note{right:1.6em;bottom:2em}

  /* 고객 사례 */
  .brand{padding:200px 0}
  .brand-link{margin:24px 0 80px}
  .brand-link a{font-size:20px;line-height:28px}
  .bs{gap:20px}
  .bs-row{height:190px}
  .bs-row--m{display:none}
  .bs-track{gap:18px}
  .bs-item{width:304px}
  .bs-item span{font-size:14px}
  .bs-fade{width:100px}

  /* 지원 */
  .support{padding:200px 0}
  .sp-cards{flex-direction:row;justify-content:center;margin-top:80px;width:auto}
  .sp-card{width:480px;padding:60px 24px}
  .sp-t{font-size:22px;line-height:30.8px}

  /* 마지막 띠 */
  .cta{padding:120px 100px 102px}
  .cta-t{font-size:40px;line-height:52px;letter-spacing:-1.2px;margin-bottom:24px}
  .cta-d{font-size:20px;line-height:28px;color:#fff}
  .cta .btn-lg{padding:13px 32px}

  /* 푸터 */
  .fab{right:40px;bottom:40px}
}

/* 움직임 줄이기 */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .hero-title .ch,.js .rv-h,.js .rv-box{opacity:1;transform:none;filter:none}
}

/* =========================================================
   v3 추가분 — 공통
   ========================================================= */
.hero-title br.m-br{display:inline}
.logo__svc{margin-left:6px;font-size:13px;font-weight:800;letter-spacing:-.2px;color:var(--brand-d);background:var(--brand-l);padding:3px 8px;border-radius:7px;white-space:nowrap}
.logo__svc--plan{color:#23252B;background:#F1F2F5;display:inline-flex;align-items:center;gap:5px}
.logo__svc--plan::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brand)}
.gnb li > a.is-cur{color:var(--brand-d);font-weight:700}
.sub--c{color:var(--brand-d)}
.btn-line-w{background:transparent;border-color:rgba(255,255,255,.35);color:#fff}
.btn-line-w:hover{background:rgba(255,255,255,.08)}
.btn-white{background:#fff;color:#111}
.btn-white:hover{background:#F4F4F6}

/* 공통 섹션 틀 */
.sec{position:relative;display:flex;flex-direction:column;align-items:center;padding:100px 20px}
.sec--soft{background:#F6F6F8}
.sec-desc{font-size:16px;font-weight:500;line-height:25px;letter-spacing:-.3px;color:var(--muted);text-align:center;max-width:640px;margin:0 auto}
.sec-cap{font-size:15px;font-weight:600;color:var(--desc);text-align:center;margin-top:20px}

/* 화면에 들어오면 아래에서 떠오름 */
.js .rv{opacity:0;transform:translate3d(0,28px,0);transition:opacity .8s var(--ease) var(--dl,0s),transform 1s var(--ease-out) var(--dl,0s)}
.js .rv.is-in{opacity:1;transform:none}

/* =========================================================
   푸터 — 두 쪽 배치 (왼쪽: 로고·사업자 정보 / 오른쪽: 링크 묶음)
   ========================================================= */
.foot{background:#fff;border-top:1px solid var(--line);padding:48px 0 40px}
.foot-in{max-width:1280px;margin:0 auto;padding:0 20px;display:flex;flex-direction:column;gap:40px}
.foot-l .logo{margin-bottom:18px}
.foot-info{font-size:13px;line-height:22px;letter-spacing:-.3px;color:#8B8B9E}
.foot-info span{display:block}
.foot-policy{display:flex;gap:16px;margin-top:18px;font-size:13px;font-weight:700;color:#333}
.foot-policy a:hover{color:var(--brand-d)}
.foot-copy{margin-top:8px;font-size:12px;color:#A3A5B1}
.foot-sns{display:flex;gap:10px;margin-top:22px}
.foot-sns a{width:36px;height:36px;border-radius:50%;background:#C3C4CE;display:grid;place-items:center;transition:background .2s}
.foot-sns a:hover{background:var(--brand)}
.foot-sns svg{width:20px;height:20px}
.foot-r{display:grid;grid-template-columns:1fr 1fr;gap:32px 20px}
.foot-col h3{font-size:14px;font-weight:800;color:#111;margin-bottom:12px}
.foot-col h3 a:hover{color:var(--brand-d)}
.foot-col li a,.foot-col li span{display:block;font-size:14px;line-height:30px;color:#6B6E78;transition:color .2s}
.foot-col li a:hover{color:#111}

/* =========================================================
   공통 첫 화면 (index)
   ========================================================= */
.gate{position:relative;margin-top:var(--hd-h);padding:44px 20px 56px;overflow:hidden}
.gate-bg{position:absolute;inset:0;pointer-events:none;z-index:0}
.gate-bg i{position:absolute;border-radius:50%;filter:blur(90px);opacity:.55}
.gate-bg i:nth-child(1){left:-10%;top:-10%;width:50%;height:50%;background:#FFB38A;animation:hb1 18s ease-in-out infinite alternate}
.gate-bg i:nth-child(2){right:-10%;top:0;width:45%;height:45%;background:#FFD66B;animation:hb2 20s ease-in-out infinite alternate}
.gate-bg i:nth-child(3){left:30%;bottom:-20%;width:40%;height:40%;background:#FF9EC4;opacity:.35;animation:hb3 22s ease-in-out infinite alternate}
.gate-h{position:relative;z-index:1;text-align:center;margin-bottom:28px}
.gate-h h1{font-size:30px;font-weight:800;line-height:40px;letter-spacing:-1px}
.gate-h p{font-size:16px;font-weight:500;line-height:24px;color:var(--muted);margin-top:10px}
.gate-cards{position:relative;z-index:1;display:grid;gap:16px;max-width:1280px;margin:0 auto}
.gcard{position:relative;display:flex;flex-direction:column;min-height:540px;border-radius:28px;overflow:hidden;padding:28px 24px 0;isolation:isolate;transition:transform .45s var(--ease-out),box-shadow .45s var(--ease-out)}
.gcard:hover{transform:translateY(-6px)}
.gcard--home{color:#1B0E05;background:radial-gradient(60% 50% at 95% 0%,rgba(255,184,0,.55),transparent 70%),radial-gradient(70% 60% at 0% 100%,rgba(255,46,126,.35),transparent 70%),linear-gradient(150deg,#FFF1E6 0%,#FFD9C2 100%);box-shadow:0 20px 60px rgba(255,92,0,.18)}
.gcard--home:hover{box-shadow:0 30px 70px rgba(255,92,0,.28)}
.gcard--plan{background:#fff;border:1px solid var(--line);box-shadow:0 20px 60px rgba(20,22,40,.06);
  background-image:radial-gradient(#E4E5EB 1.1px,transparent 1.1px);background-size:20px 20px}
.gcard--plan:hover{box-shadow:0 30px 70px rgba(20,22,40,.12)}
.gcard-svc{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:800;color:var(--brand-d)}
.gcard-svc i{width:8px;height:8px;border-radius:50%;background:var(--brand)}
.gcard h2{font-size:27px;font-weight:800;line-height:36px;letter-spacing:-.9px;margin:12px 0 18px}
.gcard-meta{display:grid;gap:8px}
.gcard-meta p{display:flex;gap:12px;font-size:14px;line-height:21px}
.gcard-meta b{flex:none;width:52px;font-weight:700;color:rgba(0,0,0,.45)}
.gcard-meta span{font-weight:600;color:#222}
.gcard .btn{align-self:flex-start;margin-top:22px;position:relative;z-index:2}
.gcard-vis{position:relative;margin-top:auto;height:230px;container-type:inline-size}
/* 홈페이지 카드: 샘플 3장 부채꼴 */
.gtp{position:absolute;top:44px;width:40%;container-type:inline-size;transition:transform .5s var(--ease-out)}
.gtp .tpl{width:100%!important;padding:0!important}
.gtp .tp{box-shadow:0 20px 50px rgba(120,40,0,.22);transform:none!important}
.gtp:nth-child(1){left:3%;transform:rotate(-8deg)}
.gtp:nth-child(2){left:30%;top:18px;z-index:2}
.gtp:nth-child(3){right:3%;transform:rotate(8deg)}
.gcard--home:hover .gtp:nth-child(1){transform:rotate(-11deg) translate(-8px,-4px)}
.gcard--home:hover .gtp:nth-child(2){transform:translateY(-8px)}
.gcard--home:hover .gtp:nth-child(3){transform:rotate(11deg) translate(8px,-4px)}
/* 기획 카드: 요구사항 정의서 + 동작 데모 */
.gvis > *{position:absolute;font-size:2.5cqw;line-height:1.4;letter-spacing:-.02em;color:#1B1B1F}
.gdoc{left:0;top:1em;width:27em;background:#fff;border-radius:1em;border:.08em solid #E6E7EC;box-shadow:0 1em 3em rgba(20,22,40,.1);overflow:hidden}
.gdoc .fp-bar{height:3em}
.gdoc-row{display:grid;grid-template-columns:5em 1fr 3em;gap:.8em;align-items:center;padding:.8em 1.2em;border-top:.08em solid #F1F2F5;font-size:.85em;white-space:nowrap}
.gdoc-row em{font-style:normal;font-weight:800;color:var(--brand-d)}
.gdoc-row small{font-size:.85em;font-weight:700;text-align:center;border-radius:99em;padding:.1em 0;background:#EEF0F4;color:#5B6070}
.gdoc-row small.up{background:var(--brand-l);color:var(--brand-d)}
.gdemo{right:0;top:7em;width:17em;background:#fff;border-radius:1em;padding:1.2em;border:.08em solid #E6E7EC;box-shadow:0 1.2em 3em rgba(20,22,40,.14);display:grid;gap:.6em;transition:transform .5s var(--ease-out)}
.gdemo b{font-size:1em}
.gdemo .fp-field{font-size:.8em}
.gdemo .fp-btnrow{margin-top:.2em}
.gdemo .fp-btn,.gdemo .fp-ghost{font-size:.8em}
.gcard--plan:hover .gdemo{transform:translateY(-.6em)}

.ghelp{padding:0 20px 64px}
.ghelp-in{max-width:1280px;margin:0 auto;background:#F6F6F8;border-radius:24px;padding:28px 24px;display:flex;flex-direction:column;gap:18px}
.ghelp-in p{font-size:17px;font-weight:600;line-height:27px;letter-spacing:-.4px;color:#222}
.ghelp-in p b{color:var(--brand-d)}
.ghelp-in small{display:block;font-size:14px;font-weight:500;color:var(--muted);margin-bottom:6px}
.ghelp .btn{align-self:flex-start}
.gabout{background:#FBFBFC;border-top:1px solid #F0F1F4;padding:80px 20px;text-align:center}
.gabout-roles{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:24px}
.gabout-roles span{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;color:#333;background:#fff;border:1px solid var(--line);border-radius:99px;padding:8px 14px}
.gabout-roles span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brand)}

/* =========================================================
   모두잇 홈페이지 — 어두운 섹션 카드 그림 (편집기 시연)
   ========================================================= */
/* 편집기 창: 블록이 하나씩 쌓이며 사이트가 완성됨 */
.av-ed{left:2.2em;top:2em;width:28em;height:24.2em;border-radius:.7em;overflow:hidden;background:#fff;color:#1B1D22;display:grid;grid-template-rows:2.1em 1fr;box-shadow:0 1em 3em rgba(0,0,0,.45)}
.av-ed__bar{display:flex;align-items:center;gap:.4em;padding:0 .8em;border-bottom:.06em solid #EEE;background:#FAFAFB}
.av-ed__bar i{width:.42em;height:.42em;border-radius:50%;background:#E0E0E5}
.av-ed__bar b{font-size:.5em;margin-left:.6em}
.av-ed__bar span{margin-left:auto;font-size:.44em;font-weight:700;padding:.3em .8em;border-radius:99em;background:var(--brand);color:#fff}
.av-ed__main{display:grid;grid-template-columns:8em 1fr;min-height:0}
.av-ed__side{border-right:.06em solid #EEE;padding:.7em .6em;display:flex;flex-direction:column;gap:.25em}
.av-ed__side small{font-size:.42em;font-weight:800;color:#999;margin-bottom:.4em}
.av-ed__side span{display:flex;align-items:center;gap:.4em;font-size:.48em;font-weight:600;padding:.5em .6em;border-radius:.5em;color:#444}
.av-ed__side span::before{content:"";width:.7em;height:.7em;border-radius:.2em;background:#E4E5EA}
.av-ed__side span.on{background:var(--brand-l);color:var(--brand-d);font-weight:800}
.av-ed__side span.on::before{background:var(--brand)}
.av-ed__side em{font-style:normal;margin-top:.3em;font-size:.46em;font-weight:700;color:#999;border:.12em dashed #DDD;border-radius:.5em;padding:.45em;text-align:center}
.av-ed__canvas{background:#F2F2F5;padding:.7em;overflow:hidden}
.av-ed__site{background:#FBF6EF;border-radius:.4em;overflow:hidden;color:#2A1E14}
.av-blk{animation:blk-in 7s var(--ease-out) infinite;animation-delay:calc(var(--k) * .55s)}
@keyframes blk-in{0%{opacity:0;transform:translateY(-1.2em)}8%,86%{opacity:1;transform:none}94%,100%{opacity:0;transform:none}}
.av-blk--nav{display:flex;align-items:center;gap:.8em;height:1.8em;padding:0 .8em}
.av-blk--nav b{font-size:.5em;color:#6B4A2E;margin-right:auto}
.av-blk--nav span{font-size:.36em;opacity:.6}
.av-blk--hero{height:6.4em;margin:0 .6em;border-radius:.4em;display:flex;align-items:center;padding:0 1em;background:linear-gradient(90deg,rgba(40,20,5,.55),transparent),linear-gradient(160deg,#E8C9A4 0%,#B07A4E 55%,#5E3C24 100%)}
.av-blk--hero strong{font-size:.72em;line-height:1.3;color:#fff}
.av-blk--about{display:grid;grid-template-columns:1fr 1fr;gap:.6em;padding:.8em}
.av-blk--about i{height:3.4em;border-radius:.3em;background:linear-gradient(150deg,#EAD2B6,#C9A07A)}
.av-blk--about p{display:grid;gap:.35em;align-content:center}
.av-blk--about p em{height:.32em;border-radius:.2em;background:#2A1E14;opacity:.14}
.av-blk--about p em:first-child{height:.5em;width:70%;opacity:.5}
.av-blk--menu{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:.4em;margin:0 .6em .6em;padding:.5em;border-radius:.4em;box-shadow:0 0 0 .14em var(--brand)}
.av-blk--menu i{height:2.4em;border-radius:.3em;background:#EAD2B6}
.av-blk--menu i:nth-child(2){background:#C9A07A}
.av-blk--menu i:nth-child(3){background:#F1E0C8}
.av-blk--menu b{position:absolute;right:.4em;top:-.9em;font-size:.38em;font-weight:800;background:var(--brand);color:#fff;padding:.25em .7em;border-radius:.4em}
.av-swap{right:1.6em;top:8.6em;width:11.4em;background:#fff;color:#1B1D22;border-radius:.8em;padding:.9em;box-shadow:0 1em 2.6em rgba(0,0,0,.5);animation:float-y 5s ease-in-out infinite}
.av-swap > b{display:block;font-size:.54em;margin-bottom:.7em}
.av-swap__g{display:grid;grid-template-columns:repeat(3,1fr);gap:.4em}
.av-swap__g i{height:3.4em;border-radius:.35em;background:#F2F2F5;border:.12em solid transparent;display:grid;gap:.2em;padding:.3em;align-content:end}
.av-swap__g i::before,.av-swap__g i::after{content:"";height:.5em;border-radius:.15em;background:#DCDDE3}
.av-swap__g i:nth-child(2){background:#FFF0E5;border-color:var(--brand)}
.av-swap__g i:nth-child(2)::before,.av-swap__g i:nth-child(2)::after{background:#FFC8A3}
.av-swap span{display:block;margin-top:.7em;font-size:.44em;color:#777}

/* AI 문구 */
.av-in{left:2.4em;top:2em;width:22.6em;background:rgba(255,255,255,.08);border:.06em solid rgba(255,255,255,.16);border-radius:.8em;padding:.8em 1em;display:grid;gap:.5em}
.av-in small{font-size:.44em;font-weight:700;color:#B8BAC2}
.av-in p{display:flex;flex-wrap:wrap;gap:.35em}
.av-in p span{font-size:.5em;font-weight:700;color:#fff;background:rgba(255,92,0,.28);border:.1em solid rgba(255,138,61,.5);padding:.3em .8em;border-radius:99em}
.av-copy{left:2.4em;top:7.8em;width:22.6em;height:17.8em;background:#FBF6EF;color:#2A1E14;border-radius:.8em;padding:1.4em 1.4em;box-shadow:0 1em 3em rgba(0,0,0,.45);display:grid;align-content:start;gap:.6em}
.av-copy small{font-size:.44em;font-weight:800;letter-spacing:.2em;color:#B07A4E}
.av-copy s{font-size:.52em;color:#A89A8D}
.av-copy strong{position:relative;font-size:1.05em;line-height:1.35;background:linear-gradient(transparent 62%,rgba(255,184,0,.45) 62%)}
.av-copy strong::after{content:"";display:inline-block;width:.08em;height:1em;margin-left:.1em;vertical-align:-.12em;background:var(--brand);animation:caret 1s steps(1) infinite}
@keyframes caret{50%{opacity:0}}
.av-copy em{display:block;height:.34em;border-radius:.2em;background:#2A1E14;opacity:.12}
.av-copy em.s{width:65%}
.av-copy i{justify-self:start;font-style:normal;margin-top:.4em;font-size:.44em;font-weight:800;color:var(--brand-d);background:var(--brand-l);padding:.35em .9em;border-radius:99em}
.av-aim{right:2em;top:6em;width:12.4em;background:#fff;color:#1B1D22;border-radius:.8em;padding:.9em;box-shadow:0 1em 2.6em rgba(0,0,0,.5);display:grid;gap:.3em}
.av-aim > b{display:flex;align-items:center;gap:.4em;font-size:.56em;margin-bottom:.4em}
.av-aim > b i{width:1em;height:1em;background:linear-gradient(135deg,#FFB800,#FF2E7E);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%)}
.av-aim span{font-size:.52em;font-weight:600;padding:.55em .7em;border-radius:.5em;color:#444}
.av-aim span.on{background:var(--brand-l);color:var(--brand-d);font-weight:800}
.av-aim em{font-style:normal;margin-top:.3em;text-align:center;font-size:.5em;font-weight:800;background:var(--brand);color:#fff;padding:.7em;border-radius:.5em}

/* 내 사진으로 교체 */
.av-img{left:2.4em;top:2.4em;width:20em;height:23em;border-radius:.8em;overflow:visible;box-shadow:0 1em 3em rgba(0,0,0,.45)}
.av-img__ph{position:absolute;inset:0;border-radius:.8em;overflow:hidden;background:radial-gradient(30% 25% at 30% 70%,rgba(255,255,255,.35),transparent 60%),linear-gradient(160deg,#FFD9A8 0%,#E8894E 50%,#7A3515 100%);animation:ph-swap 6s ease-in-out infinite}
@keyframes ph-swap{0%,40%{filter:none}50%,90%{filter:hue-rotate(-25deg) saturate(1.2)}}
.av-img__crop{position:absolute;left:10%;top:10%;right:10%;bottom:22%;border:.12em solid #fff;box-shadow:0 0 0 999em rgba(0,0,0,.28)}
.av-img__crop i{position:absolute;width:.8em;height:.8em;background:#fff;border-radius:.15em}
.av-img__crop i:nth-child(1){left:-.45em;top:-.45em}.av-img__crop i:nth-child(2){right:-.45em;top:-.45em}
.av-img__crop i:nth-child(3){left:-.45em;bottom:-.45em}.av-img__crop i:nth-child(4){right:-.45em;bottom:-.45em}
.av-img__bar{position:absolute;left:1em;right:1em;bottom:1em;display:flex;justify-content:space-between;align-items:center;background:rgba(20,20,24,.75);border-radius:.6em;padding:.55em .8em;color:#fff}
.av-img__bar b{font-size:.5em}
.av-img__bar span{font-size:.44em;font-weight:800;background:var(--brand);padding:.3em .8em;border-radius:99em}
.av-pick{right:2em;top:2.4em;width:14em;background:#fff;color:#1B1D22;border-radius:.8em;padding:.9em;box-shadow:0 1em 2.6em rgba(0,0,0,.5)}
.av-pick__tabs{display:flex;background:#F2F2F5;border-radius:.5em;padding:.2em;margin-bottom:.6em}
.av-pick__tabs span{flex:1;text-align:center;font-size:.46em;font-weight:700;padding:.5em 0;border-radius:.4em;color:#888}
.av-pick__tabs span.on{background:#fff;color:#222;box-shadow:0 .1em .4em rgba(0,0,0,.1)}
.av-pick__q{font-size:.46em;color:#999;border:.12em solid #EEE;border-radius:.5em;padding:.6em .8em;margin-bottom:.8em}
.av-pick__g{display:grid;grid-template-columns:repeat(3,1fr);gap:.35em}
.av-pick__g i{position:relative;aspect-ratio:1;border-radius:.35em;background:var(--g)}
.av-pick__g i.on{box-shadow:0 0 0 .16em var(--brand)}
.av-pick__g i.on::after{content:"";position:absolute;right:.25em;top:.25em;width:.9em;height:.9em;border-radius:50%;background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2.5 5.2l1.7 1.6 3.4-3.6' fill='none' stroke='%23fff' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") center/100% no-repeat}
.av-pick em{display:block;font-style:normal;margin-top:.8em;text-align:center;font-size:.5em;font-weight:800;background:var(--brand);color:#fff;padding:.7em;border-radius:.5em}

/* =========================================================
   모두잇 홈페이지 — 기능 카드 그림
   ========================================================= */
.feat-foot{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.feat-price{font-size:14px;font-weight:600;color:#333}
.feat-price b{color:var(--brand-d);font-weight:800}
.fp-cal{display:grid;grid-template-columns:1.35fr 1fr;gap:1.2em}
.fp-cal__g{display:grid;grid-template-columns:repeat(7,1fr);gap:.25em;text-align:center}
.fp-cal__g small{font-size:.48em;color:#9A9DA6;padding-bottom:.3em}
.fp-cal__g span{font-size:.54em;font-weight:600;padding:.45em 0;border-radius:.4em;color:#3A4460;position:relative}
.fp-cal__g span.off{color:#C9CBD3}
.fp-cal__g span.dot::after{content:"";position:absolute;left:50%;bottom:.1em;width:.35em;height:.35em;margin-left:-.175em;border-radius:50%;background:#FF8A3D}
.fp-cal__g span.on{background:var(--brand);color:#fff}
.fp-slots{display:grid;gap:.4em;align-content:start}
.fp-slots small{font-size:.5em;font-weight:800;color:#8A8D96}
.fp-slots span{font-size:.56em;font-weight:700;text-align:center;border:.12em solid #E6E7EC;border-radius:.5em;padding:.45em 0;color:#3A4460}
.fp-slots span.x{color:#C9CBD3;text-decoration:line-through}
.fp-slots span.on{border-color:var(--brand);background:var(--brand-l);color:var(--brand-d)}
.fp-slots em{font-style:normal;margin-top:.2em;text-align:center;font-size:.56em;font-weight:800;background:var(--brand);color:#fff;padding:.6em 0;border-radius:.5em}
.fp-alarm{right:1em;bottom:1.2em;width:12.4em;padding:.9em 1em;display:flex;gap:.7em;align-items:center}
.fp-alarm i{flex:none;width:2em;height:2em;border-radius:.6em;background:linear-gradient(135deg,#FFB800,#FF5C00);display:grid;place-items:center}
.fp-alarm i::before{content:"";width:.8em;height:.9em;border-radius:.4em .4em .15em .15em;background:#fff}
.fp-alarm b{display:block;font-size:.62em}
.fp-alarm span{display:block;font-size:.5em;color:#8A8D96}
.fp-shop{display:grid;gap:.1em}
.fp-shop p{display:grid;grid-template-columns:2.2em 1fr auto auto;gap:.7em;align-items:center;padding:.5em 0;border-bottom:.08em solid #F2F1F4}
.fp-shop p i{height:2.2em;border-radius:.4em;background:var(--g)}
.fp-shop p b{font-size:.58em}
.fp-shop p span{font-size:.56em;font-weight:700;color:#3A4460}
.fp-shop p small{font-size:.5em;font-weight:700;border:.12em solid #E6E7EC;border-radius:.4em;padding:.2em .6em;color:#555}
.fp-shop__pay{display:flex;align-items:center;gap:.4em;margin-top:.6em}
.fp-shop__pay span{font-size:.5em;font-weight:700;border:.12em solid #E6E7EC;border-radius:99em;padding:.3em .8em;color:#666}
.fp-shop__pay span.on{border-color:var(--brand);color:var(--brand-d);background:var(--brand-l)}
.fp-shop__pay em{margin-left:auto;font-style:normal;font-size:.58em;font-weight:800;background:var(--brand);color:#fff;padding:.6em 1.2em;border-radius:.5em}
.fp-rcpt{right:1em;bottom:1.2em;width:11.4em;padding:.9em 1em;display:grid;gap:.35em;border:.1em solid #FFD9C2}
.fp-rcpt b{font-size:.64em;display:flex;align-items:center;gap:.4em}
.fp-rcpt b::before{content:"";width:.8em;height:.8em;border-radius:50%;background:#22C55E}
.fp-rcpt span{font-size:.5em;color:#8A8D96;display:flex;justify-content:space-between}
.fp-rcpt span em{font-style:normal;color:#253050;font-weight:700}
.fp-board__tabs{display:flex;gap:.4em;margin-bottom:.5em}
.fp-board__tabs span{font-size:.54em;font-weight:700;padding:.35em .9em;border-radius:99em;background:#F2F2F5;color:#777}
.fp-board__tabs span.on{background:#1B1B1F;color:#fff}
.fp-board p{display:grid;grid-template-columns:2.6em 1fr auto;gap:.6em;align-items:center;padding:.55em 0;border-top:.08em solid #F2F1F4;font-size:.56em;white-space:nowrap}
.fp-board p em{font-style:normal;font-size:.85em;font-weight:800;text-align:center;border-radius:.3em;padding:.1em 0;background:var(--brand-l);color:var(--brand-d)}
.fp-board p em.g{background:#EEF0F4;color:#5B6070}
.fp-board p small{color:#9A9DA6}
.fp-board p .lock{display:inline-block;width:.8em;height:.7em;margin-left:.3em;border-radius:.15em;background:#C9CBD3;vertical-align:-.05em}
.fp-login{font-size:.52em!important;margin-left:auto;font-weight:700;color:var(--brand-d)!important;background:var(--brand-l);padding:.2em .8em;border-radius:99em}
.fp-grade{right:1em;bottom:1.2em;width:11em;padding:.9em 1em;display:grid;gap:.4em}
.fp-grade b{font-size:.62em}
.fp-grade span{display:flex;justify-content:space-between;font-size:.52em;color:#8A8D96}
.fp-grade span em{font-style:normal;font-weight:800;color:var(--brand-d)}
.fp-grade i{height:.5em;border-radius:99em;background:#F2EEEA;overflow:hidden}
.fp-grade i::before{content:"";display:block;width:70%;height:100%;background:linear-gradient(90deg,#FFB800,#FF5C00)}
.fp-map{position:relative;height:13.6em;border-radius:.6em;overflow:hidden;background:
  linear-gradient(0deg,transparent 46%,#fff 46%,#fff 54%,transparent 54%),linear-gradient(90deg,transparent 38%,#fff 38%,#fff 44%,transparent 44%),
  linear-gradient(35deg,transparent 60%,#FDFDFD 60%,#FDFDFD 64%,transparent 64%),
  radial-gradient(30% 40% at 80% 20%,#D9EFD6,transparent 70%),#EEF1F4}
.fp-map__pin{position:absolute;left:41%;top:50%;width:1.8em;height:1.8em;margin:-1.8em 0 0 -.9em;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--brand);box-shadow:0 .4em 1em rgba(255,92,0,.45);animation:pin 2.4s var(--ease-out) infinite}
.fp-map__pin::after{content:"";position:absolute;left:.55em;top:.55em;width:.7em;height:.7em;border-radius:50%;background:#fff}
@keyframes pin{0%,100%{translate:0 0}50%{translate:0 -.4em}}
.fp-map__lab{position:absolute;left:46%;top:18%;background:#fff;border-radius:.5em;padding:.5em .8em;box-shadow:0 .4em 1em rgba(0,0,0,.1);font-size:.54em;font-weight:800}
.fp-map__lab span{display:block;font-weight:600;color:#8A8D96;font-size:.9em}
.fp-map__btns{display:flex;gap:.5em;margin-top:.7em}
.fp-map__btns span{flex:1;text-align:center;font-size:.56em;font-weight:800;padding:.6em 0;border-radius:.5em;background:#F2F2F5;color:#333}
.fp-map__btns span.on{background:var(--brand);color:#fff}
.fp-kakao{right:1em;bottom:1.2em;width:12.6em;padding:.9em 1em;display:grid;gap:.5em}
.fp-kakao__h{display:flex;align-items:center;gap:.5em}
.fp-kakao__h i{width:1.6em;height:1.6em;border-radius:.5em;background:#FEE500;display:grid;place-items:center}
.fp-kakao__h i::before{content:"";width:.9em;height:.7em;border-radius:50%;background:#3A1D1D}
.fp-kakao__h b{font-size:.58em}
.fp-kakao p{font-size:.56em;line-height:1.5;background:#FEE500;color:#2B1B00;border-radius:.2em .9em .9em .9em;padding:.6em .8em;font-weight:600}

/* =========================================================
   두 가지 상품 비교 카드
   ========================================================= */
.pc-grid{display:grid;gap:16px;width:100%;max-width:1040px;margin:40px auto 0}
.pc{position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px 24px;display:flex;flex-direction:column;gap:18px}
.pc--hot{border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,var(--gtext) border-box}
.pc-tag{align-self:flex-start;font-size:13px;font-weight:800;padding:5px 10px;border-radius:99px;background:var(--brand-l);color:var(--brand-d)}
.pc-tag--g{background:#F1F2F5;color:#333}
.pc h4{font-size:24px;font-weight:800;letter-spacing:-.6px}
.pc-d{font-size:15px;line-height:24px;color:var(--desc);margin-top:-8px}
.pc-price{display:flex;align-items:baseline;gap:8px;padding:16px 0;border-top:1px solid var(--soft);border-bottom:1px solid var(--soft)}
.pc-price b{font-size:28px;font-weight:800;letter-spacing:-.8px}
.pc-price span{font-size:14px;color:var(--muted)}
.pc-list li{position:relative;padding-left:28px;font-size:15px;line-height:32px;color:#333}
.pc-list li::before{content:"";position:absolute;left:0;top:8px;width:16px;height:16px;border-radius:50%;background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.4 2.3 4.6-4.9' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.pc .btn{width:100%;margin-top:auto}

/* =========================================================
   이렇게 흘러가요 — 단계 줄
   ========================================================= */
.flow-rows{display:flex;flex-direction:column;gap:14px;width:100%;max-width:1200px;margin:40px auto 0}
.flow-row{background:#fff;border:1px solid var(--line);border-radius:24px;padding:24px 22px;display:flex;flex-direction:column;gap:22px}
.flow-name{display:inline-flex;align-items:center;gap:8px;font-size:20px;font-weight:800;letter-spacing:-.5px}
.flow-name i{width:10px;height:10px;border-radius:50%;background:var(--brand)}
.flow-d{font-size:15px;line-height:23px;color:var(--desc);margin:8px 0 12px}
.flow-go{display:inline-flex;gap:6px;font-size:14px;font-weight:700;color:var(--brand-d)}
.flow-track{position:relative}
.flow-steps{display:flex;flex-direction:column;gap:16px}
.flow-line{position:absolute;left:7px;top:8px;bottom:8px;width:2px;background:#ECEDF1;border-radius:2px;overflow:hidden}
.flow-line i{position:absolute;inset:0;background:linear-gradient(180deg,#FFB800,var(--brand));transform:scaleY(0);transform-origin:top;transition:transform 1.6s var(--ease-out) .1s}
.flow-row.is-in .flow-line i{transform:none}
.flow-steps li{position:relative;display:flex;align-items:center;gap:14px;font-size:15px;font-weight:600;color:#333}
.flow-steps li::before{content:"";position:relative;z-index:1;flex:none;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid #CFD1D8;box-sizing:border-box;transition:border-color .4s var(--ease) calc(var(--k) * .2s + .2s)}
.flow-steps li em{font-style:normal;font-size:12px;font-weight:800;color:#A3A6AE;min-width:18px}
.js .flow-steps li{opacity:0;transform:translate3d(0,8px,0);transition:opacity .5s var(--ease) calc(var(--k) * .2s + .2s),transform .6s var(--ease-out) calc(var(--k) * .2s + .2s)}
.flow-row.is-in .flow-steps li{opacity:1;transform:none}
.flow-row.is-in .flow-steps li::before{border-color:var(--brand)}
.flow-steps li:last-child{color:var(--brand-d);font-weight:800}
.flow-steps li:last-child::before{background:var(--brand);border-color:var(--brand);box-shadow:0 0 0 5px rgba(255,92,0,.16)}
.flow-steps li:last-child em{color:var(--brand)}

/* 하나로 모이는 그림 */
.hub{--core:34%;position:relative;width:100%;max-width:980px;aspect-ratio:1/1;margin:56px auto 0}
.hub-lines{position:absolute;inset:0;width:100%;height:100%}
.hub-lines path{fill:none;stroke:var(--brand);stroke-width:1.5;stroke-dasharray:4 6;vector-effect:non-scaling-stroke;opacity:.55;animation:hub-dash 1.4s linear infinite}
@keyframes hub-dash{to{stroke-dashoffset:-20}}
.hub-node{position:absolute;translate:-50% -50%;display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 11px;font-size:12px;font-weight:800;white-space:nowrap;box-shadow:0 8px 24px rgba(20,20,40,.07);animation:float-y 5s ease-in-out infinite;animation-delay:var(--d,0s)}
.hub-node i{width:7px;height:7px;border-radius:50%;background:var(--brand)}
.hub-core{position:absolute;left:50%;top:50%;translate:-50% -50%;width:var(--core);z-index:2}
.hub-phone{aspect-ratio:9/17;border-radius:18px;border:5px solid #16171B;background:#FBF6EF;overflow:hidden;box-shadow:0 20px 50px rgba(255,92,0,.25);container-type:inline-size}
.hub-phone > div{font-size:6cqw;color:#2A1E14}
.hub-phone .hp-nav{display:flex;justify-content:space-between;align-items:center;padding:.8em 1em}
.hub-phone .hp-nav b{font-size:.9em;color:#6B4A2E}
.hub-phone .hp-nav i{width:1.2em;height:.8em;border-top:.14em solid #6B4A2E;border-bottom:.14em solid #6B4A2E}
.hub-phone .hp-hero{height:9em;margin:0 .8em;border-radius:.6em;display:flex;align-items:flex-end;padding:.9em;background:linear-gradient(0deg,rgba(40,20,5,.5),transparent 70%),linear-gradient(160deg,#E8C9A4 0%,#B07A4E 55%,#5E3C24 100%)}
.hub-phone .hp-hero strong{font-size:1.05em;line-height:1.3;color:#fff}
.hub-phone .hp-cards{display:grid;grid-template-columns:1fr 1fr;gap:.5em;padding:.8em}
.hub-phone .hp-cards i{height:4.4em;border-radius:.5em;background:#EAD2B6}
.hub-phone .hp-cards i:nth-child(2){background:#C9A07A}
.hub-phone .hp-btn{margin:0 .8em;text-align:center;font-size:.8em;font-weight:800;background:#6B4A2E;color:#fff;padding:.7em 0;border-radius:99em}
.hub-doc{aspect-ratio:3/3.7;background:#fff;border-radius:14px;border:1px solid #E6E7EC;box-shadow:0 20px 50px rgba(20,22,40,.14);container-type:inline-size;overflow:hidden}
.hub-doc > div{font-size:6.2cqw;padding:1.2em 1.1em;display:grid;gap:.55em}
.hub-doc small{font-size:.7em;font-weight:800;color:var(--brand-d)}
.hub-doc strong{font-size:1.1em;line-height:1.3}
.hub-doc p{display:flex;align-items:center;gap:.5em;font-size:.72em;font-weight:600;color:#3A4460;padding-top:.5em;border-top:.08em solid #F0F1F4}
.hub-doc p i{flex:none;width:1em;height:1em;border-radius:.25em;background:var(--brand)}
.hub-doc em{display:block;height:.35em;border-radius:.2em;background:#EDEEF2}

/* 전후 비교표 */
.ba{width:100%;max-width:1040px;margin:64px auto 0}
.ba-t{font-size:22px;font-weight:800;letter-spacing:-.6px;text-align:center;margin-bottom:20px}
.ba-head{display:none}
.ba-row{display:grid;gap:10px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px 20px;margin-bottom:10px}
.ba-task{font-size:16px;font-weight:800}
.ba-old,.ba-new{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:22px}
.ba-old{color:var(--muted)}
.ba-new{color:#111;font-weight:700}
.ba-old::before,.ba-new::before{flex:none;font-size:11px;font-weight:800;line-height:20px;padding:0 7px;border-radius:6px}
.ba-old::before{content:"예전";background:#F1F2F5;color:#8A8D96}
.ba-new::before{content:"모두잇";background:var(--brand);color:#fff}

/* =========================================================
   자주 묻는 질문 — 펼침형
   ========================================================= */
.faq-list{width:100%;max-width:880px;margin:40px auto 0;border-top:2px solid #111}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:20px 4px;font-size:16px;font-weight:700;line-height:24px;letter-spacing:-.3px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-q{flex:none;font-weight:800;color:var(--brand)}
.faq-t{flex:1}
.faq-cat{display:none;flex:none;font-size:12px;font-weight:700;color:var(--muted);background:var(--soft);padding:3px 8px;border-radius:6px}
.faq-item summary::after{content:"";flex:none;width:9px;height:9px;margin:0 4px 4px;border:solid #9A9CA5;border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform .3s var(--ease-out),margin .3s}
.faq-item[open] summary::after{transform:rotate(-135deg);margin:4px 4px 0}
.faq-a{padding:0 4px 22px 30px;font-size:15px;line-height:25px;color:var(--desc)}
.faq-item[open] .faq-a{animation:faq-in .4s var(--ease-out)}
@keyframes faq-in{from{opacity:0;transform:translateY(-6px)}}
.faq-more{display:flex;justify-content:center;gap:8px;margin-top:32px}

/* =========================================================
   모두잇 기획
   ========================================================= */
.hero--plan .hero-bg{top:0;height:100%}
.hero-grid{position:absolute;inset:0;background-image:radial-gradient(#D5D8E0 1.2px,transparent 1.2px);background-size:22px 22px;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 45%,#000 20%,transparent 80%);mask-image:radial-gradient(70% 60% at 50% 45%,#000 20%,transparent 80%)}
.hero-lines{position:absolute;inset:0;width:100%;height:100%}
.hero-lines path{fill:none;stroke:var(--brand);stroke-width:1.2;stroke-dasharray:3 7;vector-effect:non-scaling-stroke;opacity:.45;animation:hub-dash 2s linear infinite}
.hero-tag{display:none}
.ask-box--calm{box-shadow:0 12px 40px rgba(20,22,40,.07);transition:border-color .2s,box-shadow .2s}
.ask-box--calm::before{display:none}
.ask-box--calm:focus-within{border-color:var(--brand);box-shadow:0 12px 40px rgba(255,92,0,.12)}
.ask-grid{display:grid;gap:8px}
.ask-field{width:100%;height:44px;border:1px solid var(--line);border-radius:8px;padding:0 12px;font-size:15px;outline:0;background:#fff}
.ask-field:focus{border-color:var(--brand)}
.ask-field::placeholder{color:#B0B3BB}
.ask-dl{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#555}
.ask-dl .ask-field{flex:1}
.ask-opts{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.ask-opts > small{font-size:13px;font-weight:700;color:#555;margin-right:4px}
.ask-opt input{position:absolute;opacity:0;pointer-events:none}
.ask-opt span{display:inline-block;font-size:13px;font-weight:600;padding:5px 10px;border:1px solid var(--line);border-radius:99px;color:#555;cursor:pointer;transition:all .2s}
.ask-opt input:checked + span{border-color:var(--brand);color:var(--brand-d);background:var(--brand-l)}
.ask-opt input:focus-visible + span{outline:2px solid var(--brand);outline-offset:2px}

.pain-grid{display:grid;gap:12px;width:100%;max-width:1200px;margin:40px auto 0}
.pain{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:14px}
.pain-ico{width:44px;height:44px;border-radius:12px;background:var(--brand-l);display:grid;place-items:center}
.pain-ico svg{width:22px;height:22px;fill:none;stroke:var(--brand);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pain-q{font-size:18px;font-weight:800;line-height:26px;letter-spacing:-.5px}
.pain-a{margin-top:auto;font-size:14px;line-height:22px;color:var(--desc);padding-top:14px;border-top:1px dashed var(--line)}
.pain-a b{color:var(--brand-d)}

/* 설계 산출물 7종 — 밝은 카드 쌓기 */
.dl-cards{position:relative;display:flex;flex-direction:column;gap:24px;width:100%;max-width:1200px;margin:40px auto 0}
.dl-card{--i:0;position:sticky;top:calc(84px + var(--i) * 12px);height:590px;display:flex;flex-direction:column;background:#fff;border:1px solid #E6E7EC;border-radius:24px;overflow:hidden;box-shadow:0 20px 50px rgba(20,22,40,.08);transform-origin:50% 0}
.dl-card:nth-child(2){--i:1}.dl-card:nth-child(3){--i:2}.dl-card:nth-child(4){--i:3}.dl-card:nth-child(5){--i:4}.dl-card:nth-child(6){--i:5}.dl-card:nth-child(7){--i:6}
.dl-txt{padding:24px 22px 18px}
.dl-no{font-size:13px;font-weight:800;letter-spacing:.04em;color:var(--brand-d)}
.dl-txt h4{font-size:22px;font-weight:800;letter-spacing:-.6px;margin:4px 0 14px}
.dl-rows{display:grid;gap:10px}
.dl-rows p{display:grid;gap:2px;font-size:14px;line-height:21px;color:#333}
.dl-rows b{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:800;color:var(--muted)}
.dl-rows b::before{content:"";width:5px;height:5px;border-radius:50%;background:#C3C5CD}
.dl-rows p.warn{background:#FFF5EE;border-radius:12px;padding:10px 12px;color:#1B1B1F;font-weight:600}
.dl-rows p.warn b{color:var(--brand-d)}
.dl-rows p.warn b::before{background:var(--brand)}
.dl-vis{position:relative;flex:1;min-height:0;container-type:inline-size;background:linear-gradient(180deg,#F7F8FA,#EDEFF3);border-top:1px solid #EDEEF2;overflow:hidden}
.dm{position:absolute;left:1.2em;top:1.2em;width:33em;font-size:3.6cqw;line-height:1.4;letter-spacing:-.02em;color:#1B1B1F}
.dm-win{background:#fff;border-radius:.9em;overflow:hidden;border:.06em solid #E8E9EE;box-shadow:0 .2em .6em rgba(20,22,40,.04),0 1em 2.6em rgba(20,22,40,.09)}
.dm .fp-float{position:absolute}
.dm-tbl p{display:grid;grid-template-columns:3.6em 1fr 2.8em 3.4em;gap:.6em;align-items:center;padding:.6em 1.1em;border-top:.08em solid #F1F2F5;font-size:.58em;white-space:nowrap}
.dm-tbl p.h{font-weight:800;color:#8A8D96;background:#FAFAFB;border-top:0}
.dm-tbl p em{font-style:normal;font-weight:800;color:var(--brand-d)}
.dm-tbl p small{font-size:.9em;font-weight:700;text-align:center;border-radius:99em;padding:.1em 0;background:#EEF0F4;color:#5B6070}
.dm-tbl p small.up{background:var(--brand-l);color:var(--brand-d)}
.dm-tbl p small.ok{background:#E3F4EC;color:#0E7A4E}
.dm-lane{position:relative;height:15em}
.dm-lane__r{position:absolute;left:0;right:0;height:33.34%;display:flex;align-items:center;border-top:.08em solid #F1F2F5}
.dm-lane__r:nth-child(1){top:0;border:0}.dm-lane__r:nth-child(2){top:33.33%}.dm-lane__r:nth-child(3){top:66.66%}
.dm-lane__r span{width:18%;height:100%;display:grid;place-items:center;font-size:.54em;font-weight:800;color:#5B6070;background:#FAFAFB;border-right:.08em solid #F1F2F5}
.dm-lane svg{position:absolute;inset:0;width:100%;height:100%}
.dm-lane svg path{fill:none;stroke:var(--brand);stroke-width:1.6;vector-effect:non-scaling-stroke}
.dm-box{position:absolute;translate:-50% -50%;font-size:.54em;font-weight:800;padding:.6em 1em;border-radius:.5em;background:#fff;border:.14em solid #D8DAE2;white-space:nowrap;z-index:1}
.dm-box.q{border-color:#FFB800;background:#FFF8E1}
.dm-box.end{border-color:var(--brand);background:var(--brand);color:#fff}
.dm-scr{display:grid;grid-template-columns:1.1fr 1fr;gap:1em;padding:1em}
.dm-wire{position:relative;display:grid;gap:.55em;background:#FAFAFB;border:.08em dashed #D8DAE2;border-radius:.6em;padding:.9em}
.dm-wire b{font-size:.6em}
.dm-wire i{position:relative;display:block;height:1.8em;border-radius:.4em;background:#fff;border:.08em solid #E4E5EC}
.dm-wire i.btn{height:1.8em;width:50%;justify-self:end;background:#1B1B1F;border:0}
.dm-wire em,.dm-desc em{font-style:normal;display:inline-grid;place-items:center;width:1.5em;height:1.5em;border-radius:50%;background:var(--brand);color:#fff;font-size:.5em;font-weight:800}
.dm-wire em{position:absolute;right:-.7em;top:-.7em;font-size:.5em;width:1.9em;height:1.9em}
.dm-desc{display:grid;gap:.6em;align-content:start}
.dm-desc p{display:grid;grid-template-columns:auto 1fr;gap:.4em .6em;align-items:start;font-size:.54em;color:#3A4460;line-height:1.5}
.dm-desc p b{color:#1B1B1F}
.dm-perm{padding:.4em 1.1em 1em}
.dm-perm p{display:grid;grid-template-columns:5.6em repeat(3,1fr);gap:.5em;align-items:center;padding:.55em 0;border-top:.08em solid #F1F2F5;font-size:.56em;text-align:center}
.dm-perm p:first-child{border:0;font-weight:800;color:#8A8D96}
.dm-perm p span:first-child{text-align:left;font-weight:700}
.dm-perm p i{justify-self:center;font-style:normal;font-size:.85em;font-weight:800;padding:.15em .6em;border-radius:99em;background:#F1F2F5;color:#A3A6AE}
.dm-perm p i.r{background:#EEF0F4;color:#5B6070}
.dm-perm p i.w{background:var(--brand-l);color:var(--brand-d)}
.dm-perm p i.a{background:var(--brand);color:#fff}
.dm-spec{display:grid;grid-template-columns:1fr 1.2fr;gap:1em;padding:1em}
.dm-spec ol{list-style:none;display:grid;gap:.4em;align-content:start}
.dm-spec ol li{font-size:.56em;font-weight:700;color:#3A4460;padding:.45em .7em;border-radius:.4em;background:#FAFAFB}
.dm-spec ol li.on{background:var(--brand-l);color:var(--brand-d)}
.dm-check{display:grid;gap:.1em;align-content:start}
.dm-check b{font-size:.6em;margin-bottom:.4em}
.dm-check p{display:flex;gap:.5em;align-items:center;font-size:.54em;color:#3A4460;padding:.45em 0;border-top:.08em solid #F1F2F5}
.dm-check p i{flex:none;width:1.2em;height:1.2em;border-radius:.3em;border:.14em solid #D8DAE2}
.dm-check p i.on{background:var(--brand);border-color:var(--brand)}

/* 패키지 */
.pkg-grid{display:grid;gap:16px;width:100%;max-width:1200px;margin:40px auto 0}
.pkg{position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px 24px;display:flex;flex-direction:column;gap:16px}
.pkg--rec{border:2px solid var(--brand)}
.pkg-rec{position:absolute;left:22px;top:-13px;font-size:12px;font-weight:800;color:#fff;background:var(--brand);padding:4px 10px;border-radius:99px}
.pkg h4{font-size:22px;font-weight:800;letter-spacing:-.5px}
.pkg-fit{font-size:14px;line-height:22px;color:var(--desc)}
.pkg-list li{display:flex;align-items:center;gap:10px;font-size:15px;line-height:22px;padding:7px 0;border-bottom:1px solid var(--soft);color:#222;font-weight:600}
.pkg-list li::before{content:"";flex:none;width:16px;height:16px;border-radius:50%;background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.4 2.3 4.6-4.9' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.pkg-list li.off{color:#B5B7BF;font-weight:500}
.pkg-list li.off::before{background:#EEF0F4 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M5 8h6' stroke='%23B5B7BF' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center/100% no-repeat}
.pkg-price{display:flex;align-items:baseline;gap:6px;margin-top:auto;padding-top:8px}
.pkg-price b{font-size:26px;font-weight:800;letter-spacing:-.6px}
.pkg-price span{font-size:14px;color:var(--muted)}
.pkg .btn{width:100%}
.pkg-note{font-size:14px;color:var(--muted);text-align:center;margin-top:20px}

/* 제안서 작성 지원 */
.prop-grid{display:grid;gap:12px;width:100%;max-width:1200px;margin:40px auto 0}
.prop-item{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:8px}
.prop-item--main{background:#16171B;border-color:#16171B;color:#fff}
.prop-item--main p{color:#B9BBC4!important}
.prop-item--main .prop-use{background:rgba(255,255,255,.1);color:#fff}
.prop-no{font-size:12px;font-weight:800;color:var(--brand-d)}
.prop-item--main .prop-no{color:var(--brand-m)}
.prop-item h4{font-size:18px;font-weight:800;letter-spacing:-.4px}
.prop-item p{font-size:14px;line-height:22px;color:var(--desc)}
.prop-use{margin-top:auto;align-self:flex-start;font-size:12px;font-weight:700;color:#555;background:var(--soft);padding:4px 9px;border-radius:6px}
.prop-next{width:100%;max-width:1200px;margin:16px auto 0;background:#fff;border:1px solid var(--line);border-radius:24px;padding:24px 22px;display:flex;flex-direction:column;gap:18px}
.prop-next h4{font-size:18px;font-weight:800}
.prop-next h4 small{display:block;font-size:14px;font-weight:500;color:var(--muted);margin-top:4px}
.prop-map{display:grid;gap:10px}
.prop-map p{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700}
.prop-map span{padding:8px 12px;border-radius:10px;background:#F6F6F8;white-space:nowrap}
.prop-map span.to{background:var(--brand-l);color:var(--brand-d)}
.prop-map i{flex:1;min-width:24px;height:2px;background:repeating-linear-gradient(90deg,var(--brand) 0 4px,transparent 4px 8px);position:relative}
.prop-map i::after{content:"";position:absolute;right:-1px;top:-4px;border:5px solid transparent;border-left:6px solid var(--brand);border-right:0}
.prop-next .btn{align-self:flex-start}

/* 수행 실적 */
.rec-lab{font-size:14px;font-weight:700;color:var(--muted);text-align:center;margin:40px 0 14px}
.rec-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;max-width:1200px;margin:0 auto}
.rec-tile{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 14px;font-size:15px;font-weight:700;letter-spacing:-.3px}
.rec-tile i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--brand)}
.rec-cards{display:grid;gap:16px;width:100%;max-width:1200px;margin:16px auto 0}
.rcard{background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;transition:transform .35s var(--ease-out),box-shadow .35s}
.rcard:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(20,22,40,.08)}
.rcard-vis{position:relative;height:220px;background:linear-gradient(150deg,#F6F7F9,#ECEEF3);container-type:inline-size;overflow:hidden}
.rm{position:absolute;left:8%;right:8%;top:1.4em;font-size:3.2cqw;line-height:1.4;color:#1B1B1F;background:#fff;border-radius:.9em;padding:1em 1.1em;box-shadow:0 1em 2.4em rgba(20,22,40,.1);display:grid;gap:.55em}
.rm-h{display:flex;justify-content:space-between;align-items:center}
.rm-h b{font-size:.8em}
.rm-h span{font-size:.62em;color:#8A8D96}
.rm-post{display:grid;grid-template-columns:2.2em 1fr;gap:.6em;align-items:center;padding-top:.5em;border-top:.08em solid #F1F2F5}
.rm-post i{height:2.2em;border-radius:.5em;background:var(--g)}
.rm-post b{display:block;font-size:.68em}
.rm-post span{display:block;font-size:.58em;color:#8A8D96}
.rm-sum{display:grid;grid-template-columns:1fr 1fr;gap:.5em}
.rm-sum div{background:#F7F8FA;border-radius:.5em;padding:.5em .7em}
.rm-sum small{display:block;font-size:.56em;color:#8A8D96}
.rm-sum b{font-size:.8em}
.rm-sum b.in{color:#0E7A4E}.rm-sum b.out{color:#C2410C}
.rm-line{display:flex;justify-content:space-between;font-size:.6em;padding-top:.45em;border-top:.08em solid #F1F2F5;color:#3A4460}
.rm-line em{font-style:normal;font-weight:800}
.rm-line em.in{color:#0E7A4E}.rm-line em.out{color:#C2410C}
.rm-step{display:flex;gap:.3em}
.rm-step i{flex:1;height:.35em;border-radius:99em;background:#EEF0F4}
.rm-step i.on{background:var(--brand)}
.rm-f{display:flex;justify-content:space-between;align-items:center;font-size:.64em;padding:.5em .7em;border:.1em solid #E6E7EC;border-radius:.5em}
.rm-f small{color:#8A8D96}
.rm-f b{font-weight:800}
.rm-btn{text-align:center;font-size:.64em;font-weight:800;background:#1B1B1F;color:#fff;padding:.6em;border-radius:.5em}
.rcard-txt{padding:20px 22px 22px}
.rcard-txt h4{font-size:18px;font-weight:800;letter-spacing:-.4px}
.rcard-txt p{font-size:14px;color:var(--muted);margin-top:4px}
.rcard-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.rcard-tags span{font-size:12px;font-weight:700;color:#555;background:var(--soft);padding:4px 8px;border-radius:6px}

/* 기획자 소개 */
.prof{width:100%;max-width:1040px;margin:40px auto 0;background:#fff;border:1px solid var(--line);border-radius:28px;padding:28px 24px;display:grid;gap:24px}
.prof-who{display:flex;align-items:center;gap:16px}
.prof-av{flex:none;width:68px;height:68px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#FFE2CC,#FFB38A 60%,#FF8A3D);display:grid;place-items:center;font-size:12px;font-weight:700;color:rgba(0,0,0,.45)}
.prof-who .prof-av{display:grid}
.prof-who b{display:block;font-size:19px;font-weight:800}
.prof-who span{display:block;font-size:14px;color:var(--muted);margin-top:2px}
.prof-intro{font-size:15px;line-height:25px;color:var(--desc);margin-top:16px}
.prof-roles{display:grid;gap:10px}
.prof-role{background:#F7F8FA;border-radius:16px;padding:18px 18px}
.prof-role h5{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:800}
.prof-role h5::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brand)}
.prof-role p{font-size:14px;line-height:22px;color:var(--desc);margin-top:6px}

/* 기획 마지막 띠: 차분한 어두운 톤 + 오렌지 점 강조 */
.cta--plan{background:radial-gradient(40% 90% at 100% 0%,rgba(255,92,0,.35),transparent 60%),#15161A}
.cta--plan::after{background:none;background-image:radial-gradient(rgba(255,255,255,.08) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 30%,#000 70%,transparent);mask-image:linear-gradient(90deg,transparent,#000 30%,#000 70%,transparent)}
.cta-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.fab--dark{background:#16171B;box-shadow:0 10px 24px rgba(0,0,0,.25)}
.fab--dark .fab__ico svg{fill:var(--brand-m)}

/* =========================================================
   v3 — 751px 이상
   ========================================================= */
@media (min-width:751px){
  .hero-title br.m-br{display:none}
  .foot-r{grid-template-columns:repeat(3,1fr)}
  .gate-h h1{font-size:40px;line-height:52px}
  .pain-grid{grid-template-columns:1fr 1fr}
  .prop-grid{grid-template-columns:1fr 1fr}
  .rec-fields{grid-template-columns:repeat(3,1fr)}
  .rec-cards{grid-template-columns:repeat(3,1fr)}
  .rcard-vis{height:200px}
  .pc-grid{grid-template-columns:1fr 1fr}
  .ghelp-in{flex-direction:row;align-items:center;justify-content:space-between;padding:32px 40px}
  .ghelp .btn{align-self:center}
}

/* =========================================================
   v3 — 데스크톱 1251px 이상
   ========================================================= */
@media (min-width:1251px){
  .sec{padding:180px 40px}
  .sec-desc{font-size:18px;line-height:28px}
  .sec-cap{font-size:17px}

  .foot{padding:80px 0 72px}
  .foot-in{flex-direction:row;justify-content:space-between;padding:0 40px}
  .foot-l{max-width:460px}
  .foot-info{font-size:14px;line-height:24px}
  .foot-r{grid-template-columns:repeat(3,170px);gap:48px}

  .gate{min-height:calc(100vh - var(--hd-h));padding:64px 40px 80px;display:flex;flex-direction:column;justify-content:center}
  .gate-h{margin-bottom:40px}
  .gate-h h1{font-size:48px;line-height:62px;letter-spacing:-1.4px}
  .gate-h p{font-size:19px}
  .gate-cards{grid-template-columns:1fr 1fr;gap:24px;width:100%}
  .gcard{min-height:600px;padding:48px 48px 0}
  .gcard h2{font-size:34px;line-height:44px}
  .gcard-meta p{font-size:16px;line-height:24px}
  .gcard-meta b{width:60px}
  .gcard-vis{height:270px}
  .gtp{width:30%;top:50px}
  .gtp:nth-child(1){left:8%}.gtp:nth-child(2){left:35%;top:22px}.gtp:nth-child(3){right:8%}
  .gdoc{width:24em}.gdemo{width:15em;top:6em;right:2em}
  .ghelp{padding:0 40px 100px}
  .gabout{padding:120px 40px}

  .feat-foot{gap:20px}
  .feat-price{font-size:16px}

  .pc{padding:40px}
  .pc h4{font-size:28px}
  .pc-price b{font-size:34px}

  .flow-rows{gap:16px;margin-top:64px}
  .flow-row{flex-direction:row;align-items:center;gap:48px;padding:36px 44px}
  .flow-head{flex:none;width:280px}
  .flow-name{font-size:22px}
  .flow-track{flex:1}
  .flow-steps{flex-direction:row;gap:0}
  .flow-steps li{flex:1;flex-direction:column;gap:12px;text-align:center;font-size:15px;line-height:21px}
  .flow-steps li em{order:2;min-width:0}
  .flow-line{left:calc(50% / var(--n));right:calc(50% / var(--n));top:7px;bottom:auto;width:auto;height:2px}
  .flow-line i{transform:scaleX(0);transform-origin:left}
  .flow-row.is-in .flow-line i{transform:none}

  .hub{--core:19%;aspect-ratio:980/540;margin-top:80px}
  .hub-node{font-size:15px;padding:12px 18px;gap:8px;border-radius:14px}
  .hub-node i{width:8px;height:8px}
  .ba{margin-top:100px}
  .ba-t{font-size:28px;margin-bottom:28px}
  .ba-tbl{background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden}
  .ba-head,.ba-row{display:grid;grid-template-columns:220px 1fr 1fr;align-items:center;gap:24px;padding:20px 32px;margin:0;border:0;border-radius:0;background:none}
  .ba-head{background:#FAFAFB;font-size:14px;font-weight:800;color:var(--muted)}
  .ba-head span:last-child{color:var(--brand-d)}
  .ba-row{border-top:1px solid var(--soft)}
  .ba-old,.ba-new{font-size:16px;line-height:24px}
  .ba-old::before,.ba-new::before{display:none}
  .ba-new{position:relative;padding-left:26px}
  .ba-new::after{content:"";position:absolute;left:0;top:4px;width:16px;height:16px;border-radius:50%;background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.4 2.3 4.6-4.9' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}

  .faq-list{margin-top:64px}
  .faq-item summary{font-size:18px;padding:26px 8px;gap:16px}
  .faq-cat{display:inline-block}
  .faq-a{padding:0 8px 28px 40px;font-size:16px;line-height:27px}

  .hero-tag{display:flex;position:absolute;z-index:1;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px;font-size:14px;font-weight:700;box-shadow:0 10px 30px rgba(20,22,40,.08);animation:float-y 6s ease-in-out infinite}
  .hero-tag i{width:8px;height:8px;border-radius:50%;background:var(--brand)}
  .hero-tag small{font-size:12px;font-weight:600;color:var(--muted)}
  .hero--plan .hero-heading{margin:0 -140px}
  .hero-tag--1{left:5%;top:44%}.hero-tag--2{right:5%;top:20%;animation-delay:-2s}.hero-tag--3{left:8%;bottom:12%;animation-delay:-4s}.hero-tag--4{right:6%;bottom:24%;animation-delay:-1s}

  .pain-grid{grid-template-columns:repeat(4,1fr);gap:16px;margin-top:64px}
  .pain{padding:28px}

  .dl-cards{margin-top:64px;gap:32px}
  .dl-card{flex-direction:row;height:480px;top:calc(110px + var(--i) * 14px)}
  .dl-txt{flex:none;width:470px;padding:52px 48px;display:flex;flex-direction:column}
  .dl-txt h4{font-size:30px;margin:6px 0 24px}
  .dl-rows{gap:14px}
  .dl-rows p{font-size:15px;line-height:23px}
  .dl-vis{border-top:0;border-left:1px solid #EDEEF2}
  .dm{font-size:2.15cqw;left:3em;top:3em;width:34em}

  .pkg-grid{grid-template-columns:repeat(3,1fr);gap:20px;margin-top:64px}
  .pkg{padding:36px 32px}

  .prop-grid{grid-template-columns:repeat(4,1fr);gap:16px;margin-top:64px}
  .prop-next{flex-direction:row;align-items:center;justify-content:space-between;padding:32px 40px;gap:32px}
  .prop-map{flex:1;max-width:560px}

  .rec-lab{margin-top:64px}
  .rec-fields{grid-template-columns:repeat(6,1fr)}
  .rec-tile{flex-direction:column;align-items:flex-start;padding:22px 18px;font-size:16px;min-height:96px;justify-content:space-between}
  .rec-cards{gap:20px;margin-top:20px}
  .rcard-vis{height:240px}

  .prof{grid-template-columns:380px 1fr;gap:48px;padding:48px}
  .prof-roles{gap:12px}

  .cta-btns{gap:12px}
}

/* =========================================================
   v4 추가분 — 모두잇 홈페이지 소개 페이지 개편 (의뢰 방식 탭 · 기본 기능 · 요금)
   ========================================================= */
.ask-hint{font-size:13px;color:#8A8E96}
.ask-tel{flex:1;min-width:0;height:40px;border:1px solid var(--line);border-radius:8px;padding:0 12px;font-size:15px;outline:0;margin-right:10px;max-width:260px}
.ask-tel:focus{border-color:var(--brand)}
.ask-done{padding:20px;display:flex;flex-direction:column;gap:12px}
.ask-done b{font-size:17px}.ask-done p{font-size:14px;color:var(--muted);line-height:1.6}
.ask-done textarea{width:100%;height:120px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:13.5px;line-height:1.6;resize:none;background:#FAFAFB;color:#333}
.ask-done__btns{display:flex;gap:8px;flex-wrap:wrap}
.ask-done__btns .btn{flex:1}
.ask.is-expert .ask-presets{visibility:hidden}

.inc-grid{list-style:none;margin:40px auto 0;padding:0;display:grid;grid-template-columns:1fr;gap:12px;width:100%;max-width:1040px}
.inc{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px 22px 20px;display:grid;grid-template-columns:48px 1fr;column-gap:16px;row-gap:4px;align-items:start}
.inc-ico{grid-row:span 3;width:48px;height:48px;border-radius:14px;background:#FFF1E8;color:var(--brand);display:grid;place-items:center}
.inc-ico svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.inc b{font-size:17px;letter-spacing:-.3px}.inc p{font-size:14.5px;color:#444;line-height:1.55}.inc small{font-size:12.5px;color:var(--muted);line-height:1.5;margin-top:4px}

.pc-note{font-size:13px;color:var(--muted);line-height:1.5;margin-top:-6px}
.pc-opts{width:100%;max-width:1040px;margin:16px auto 0;background:#fff;border:1px solid var(--line);border-radius:24px;padding:22px 24px}
.pc-opts__h{font-size:14px;font-weight:700;color:var(--muted);margin-bottom:12px}
.pc-opts dl{margin:0;display:grid;grid-template-columns:1fr;gap:12px}
.pc-opts dl>div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-top:12px;border-top:1px solid var(--line)}
.pc-opts dl>div:first-child{border-top:0;padding-top:0}
.pc-opts dt{font-size:16px;font-weight:700}
.pc-opts dd{margin:0;text-align:right;display:flex;flex-direction:column;gap:2px}.pc-opts dd b{font-size:17px}.pc-opts dd span{font-size:13px;color:var(--muted)}

@media (min-width:751px){
  .inc-grid{grid-template-columns:repeat(2,1fr);gap:16px}
  .pc-opts dl{grid-template-columns:repeat(3,1fr);gap:24px}
  .pc-opts dl>div{flex-direction:column;align-items:flex-start;gap:6px;border-top:0;padding-top:0;border-left:1px solid var(--line);padding-left:24px}
  .pc-opts dl>div:first-child{border-left:0;padding-left:0}
  .pc-opts dd{text-align:left}
}
@media (min-width:1251px){
  .inc-grid{grid-template-columns:repeat(3,1fr);margin-top:56px}
  .inc{padding:28px 26px}
  .pc-opts{padding:28px 40px}
}