/* ROBOTION service experience · 2026-09 */
:root{--ink:#172523;--ink2:#50615d;--muted:#687773;--line:#dfe5df;--bg:#fafbf7;--bg2:#eff3ec;--bg3:#e9eee7;--maxw:1200px}
body{background:var(--bg)}.nav{background:#fafbf7ed}.nav .row{height:76px}.logo{letter-spacing:-.05em}.logo .d{border-radius:50%;transform:none;width:14px;height:14px}.nav .go,.btn,.submit{border-radius:100px}.nav .links a{font-size:14px}.hero{background:var(--bg);padding:82px 0 38px}.hero h1{font-size:clamp(36px,4.7vw,66px);line-height:1.14;letter-spacing:-.055em;word-break:keep-all}.hero h1 b{color:var(--ac);font-weight:800}.hero .lead{font-size:17px;line-height:1.85;max-width:36ch}.kicker{font-size:12px;letter-spacing:.04em}.hero .grid2{gap:48px}.sec{padding:78px 0}.sec.tight{padding:46px 0}.h2{letter-spacing:-.05em}.statband{background:#eaf0e7;color:var(--ink);border:1px solid #dce5d7;text-align:left;border-radius:20px;padding:26px 36px}.statband>div+div{border-left:1px solid #cdd9c9;padding-left:32px}.statband .n{font-size:27px}.statband .l{color:#5f725b}.cards{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.fcard{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px}.fcard .ic{background:var(--bg2);color:var(--ac);font-size:13px;border-radius:50%;width:34px;height:34px}.shot{box-shadow:none;border-radius:20px}.shot img{aspect-ratio:4/3;object-fit:cover}.mosaic{gap:12px}.mosaic figure{border-radius:12px}.ctaband{background:#172e29;text-align:left;border-radius:24px;padding:48px}.ctaband p{max-width:55ch}.ctaband .btn{color:#17382e}.formcard{border-radius:24px;padding:32px;box-shadow:0 16px 50px #21382b0b;background:#fff}input,textarea{background:#f8faf6;border-radius:12px;min-height:50px}.agree input{min-height:20px;width:20px;height:20px;accent-color:var(--ac);flex-shrink:0}.agree{color:#52615b;line-height:1.6}.submit{min-height:54px}.submit:disabled{opacity:.6;cursor:wait}.plan.hot:before{content:'추천 구성'}.reveal{opacity:1;transform:none}.reveal.in{animation:enter-view .55s ease both}.navtoggle{min-width:44px;min-height:44px}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--ac);outline-offset:4px}#quick-apply{scroll-margin-top:100px}.quick-intro p{color:var(--ink2);line-height:1.8;margin:18px 0}.contact-points{list-style:none;padding:0;margin:28px 0}.contact-points li{border-top:1px solid var(--line);padding:14px 0;font-size:15px}.contact-points b{display:inline-block;color:var(--ac);margin-right:16px}.flow-demo{background:#e4ebe0;border:1px solid #d1ddca;border-radius:28px;padding:25px;position:relative;min-width:0;box-shadow:0 24px 60px #263e2210}.demo-heading{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:800;letter-spacing:.12em;color:#40553e;margin-bottom:20px}.demo-heading span{border:1px solid #bcccb6;border-radius:100px;padding:5px 9px;letter-spacing:0;font-weight:600}.demo-window{background:#fff;border:1px solid #dce5d6;border-radius:16px;padding:22px;box-shadow:0 12px 30px #2743210b}.demo-top{display:flex;justify-content:space-between;color:#496444;font-size:11px;padding-bottom:18px;border-bottom:1px solid #eef2eb}.demo-top i{font-style:normal;color:#5e7555}.demo-title{font-size:23px;font-weight:800;letter-spacing:-.04em;margin:23px 0 5px}.demo-sub{font-size:12px;color:#6c7b67}.demo-rows{display:grid;gap:9px;margin-top:23px}.demo-row{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid #e6ebe3;border-radius:10px;font-size:13px;background:#fafcf8}.demo-row .num{color:var(--ac);font-size:11px;font-weight:800;background:#eaf0e4;padding:7px;border-radius:7px}.demo-row b{font-size:12px}.demo-row em{margin-left:auto;font-style:normal;font-size:10px;color:#57724d}.demo-bottom{display:flex;align-items:center;gap:10px;margin-top:17px;font-size:12px;color:#3c5734}.demo-dot{width:7px;height:7px;border-radius:50%;background:#649b4e;box-shadow:0 0 0 4px #dce9d4}.demo-caption{margin-top:16px;color:#5a6e51;font-size:11px;text-align:center}.demo-orbit{position:absolute;right:-12px;top:62px;width:54px;height:54px;border-radius:16px;background:var(--ac);color:white;display:grid;place-items:center;font-size:23px;box-shadow:0 8px 24px #172e2920;transform:rotate(8deg)}.service-network{border-top:1px solid var(--line)}.network-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px}.network-head p{font-size:14px;color:var(--ink2)}.network-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.network-card{padding:24px;border:1px solid var(--line);border-radius:16px;background:#fff;transition:transform .2s,border-color .2s;display:flex;flex-direction:column;gap:10px;min-width:0}.network-card:hover{border-color:var(--ac);transform:translateY(-3px)}.network-card small{font-size:10px;color:var(--ac);font-weight:800;letter-spacing:.12em}.network-card strong{font-size:17px;letter-spacing:-.035em}.network-card span{font-size:13px;color:var(--ink2);line-height:1.6}.network-card .arrow{margin-top:auto;padding-top:14px;color:var(--ac)}.repair-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;align-items:center;font-size:13px;color:var(--ink2)}.repair-links a{border-bottom:1px solid #98ac92;padding:5px}.mobile-cta{display:none}.form-status{color:#355330;font-size:14px;margin:12px 0;white-space:pre-line}.form-status.error{color:#a22f2f}.form-status:empty{display:none}footer{margin-bottom:0}.plan{box-shadow:none}.plan.hot{box-shadow:none}.plan ul{min-height:0}.shot img,.mosaic img{background:#e5e9e2}
@keyframes enter-view{from{opacity:.6;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:900px){.network-grid{grid-template-columns:repeat(2,1fr)}.hero .grid2{grid-template-columns:1fr}.flow-demo{max-width:620px;width:100%}.hero{padding:48px 0 26px}.hero .lead{max-width:45ch}.demo-orbit{right:12px}.nav .links.open{top:76px}.network-head{align-items:start;flex-direction:column}}
@media(max-width:600px){.wrap{padding:0 20px}.nav .row{height:66px}.logo{font-size:17px}.nav .go{font-size:12px;padding:10px 15px}.hero{padding-top:34px}.hero h1{font-size:38px}.hero .lead{font-size:15px}.hero .cta-row{gap:8px;margin-top:24px}.hero .btn-lg{padding:14px 20px;font-size:14px}.flow-demo{padding:17px;border-radius:20px}.demo-window{padding:18px}.demo-title{font-size:21px}.demo-row{padding:11px}.statband{grid-template-columns:repeat(3,1fr);gap:12px;padding:22px 16px;border-radius:16px}.statband>div+div{padding-left:10px}.statband .n{font-size:18px}.statband .l{font-size:11px}.sec{padding:46px 0}.sec.tight{padding:26px 0}.ctaband{padding:28px 24px}.formcard{padding:25px 20px}.network-grid{gap:10px}.network-card{padding:18px 14px}.network-card strong{font-size:15px}.network-card span{font-size:12px}.mobile-cta{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:60;padding:10px 18px calc(10px + env(safe-area-inset-bottom));background:#fafbf7f5;border-top:1px solid var(--line);align-items:center;gap:12px;backdrop-filter:blur(10px)}.mobile-cta span{font-size:11px;line-height:1.4;flex:1}.mobile-cta a{background:var(--ac);color:#fff;padding:12px 23px;border-radius:100px;font-size:14px;font-weight:700}body{padding-bottom:76px}.nav .links.open{top:66px}.hero .grid2{gap:32px}.frow.rev .shot{order:0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

#contact-form{scroll-margin-top:90px}

/* Consultation emphasis: no layout movement; pause while interacting. */
.nav .go, .hero .btn-pri, .ctaband .btn, .mobile-cta a, #leadForm .submit{position:relative;isolation:isolate;overflow:hidden;animation:consult-glow 4.8s ease-in-out infinite;--consult-glow:var(--ac,#387444)}
.nav .go::after, .hero .btn-pri::after, .ctaband .btn::after, .mobile-cta a::after, #leadForm .submit::after{content:"";position:absolute;inset:-40% auto -40% -60%;width:34%;background:linear-gradient(90deg,transparent,#ffffff55,transparent);transform:skewX(-20deg) translateX(-180%);animation:consult-shine 6.4s ease-in-out infinite;pointer-events:none}
.nav .go:is(:hover,:focus-visible), .hero .btn-pri:is(:hover,:focus-visible), .ctaband .btn:is(:hover,:focus-visible), .mobile-cta a:is(:hover,:focus-visible), #leadForm .submit:is(:hover,:focus-visible){animation-play-state:paused}
.nav .go:is(:hover,:focus-visible)::after, .hero .btn-pri:is(:hover,:focus-visible)::after, .ctaband .btn:is(:hover,:focus-visible)::after, .mobile-cta a:is(:hover,:focus-visible)::after, #leadForm .submit:is(:hover,:focus-visible)::after{animation-play-state:paused}
@keyframes consult-glow{0%,72%,100%{box-shadow:0 0 0 0 transparent}34%{box-shadow:0 0 0 5px color-mix(in srgb,var(--consult-glow) 18%,transparent),0 7px 23px color-mix(in srgb,var(--consult-glow) 23%,transparent)}52%{box-shadow:0 0 0 10px transparent}}
@keyframes consult-shine{0%,62%{left:-60%;opacity:0}66%{opacity:1}87%,100%{left:140%;opacity:0}}
button:disabled,button:disabled::after{animation:none!important}
#contact-form{scroll-margin-top:90px}
#contact-form:target{animation:consult-form-focus 1.5s ease-out 1}
@keyframes consult-form-focus{0%,45%{box-shadow:0 0 0 5px #85ac6250,0 16px 50px #284d2920}100%{box-shadow:0 0 0 0 transparent}}
@media(prefers-reduced-motion:reduce){.nav .go, .hero .btn-pri, .ctaband .btn, .mobile-cta a, #leadForm .submit,.nav .go::after, .hero .btn-pri::after, .ctaband .btn::after, .mobile-cta a::after, #leadForm .submit::after,#contact-form:target{animation:none!important}}
