/* 맥스웍스 contact refresh */
:root{
  --telegram:#229ed9;
  --telegram-dark:#1479ad;
  --kakao:#fee500;
  --kakao-text:#191919;
  --contact-panel:#0d1630;
  --contact-line:rgba(255,255,255,.13);
}

.header{gap:22px}
.header-actions{display:flex;align-items:center;gap:8px}
.header-channel{
  min-height:38px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  display:none;
  align-items:center;
  gap:7px;
  color:#fff;
  background:rgba(255,255,255,.045);
  font:inherit;
  font-size:12px;
  font-weight:850;
  cursor:pointer;
  transition:.2s ease;
}
.header-channel:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.32)}
.header-channel .channel-icon{width:18px;height:18px;display:grid;place-items:center;border-radius:50%}
.header-channel svg{width:13px;height:13px;fill:currentColor}
.telegram-mini .channel-icon{background:var(--telegram);color:#fff}
.kakao-mini{color:#201d00}
.kakao-mini .channel-icon{background:var(--kakao);color:var(--kakao-text)}
.kakao-mini{background:var(--kakao);border-color:var(--kakao)}

.hero-contact-refresh{min-height:680px}
.hero-actions-refresh{display:flex;align-items:stretch;flex-wrap:wrap}
.hero-actions-refresh .button{min-height:58px}
.browse-button{padding-inline:25px}

.channel-button{
  border:0;
  min-width:210px;
  gap:11px;
  justify-content:flex-start;
  padding:8px 16px;
  box-shadow:0 16px 34px rgba(0,0,0,.18);
}
.channel-button:hover{transform:translateY(-2px)}
.channel-button-icon{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.2);
}
.channel-button-icon svg{width:21px;height:21px;fill:currentColor}
.channel-button-copy{display:grid;text-align:left;line-height:1.2}
.channel-button-copy strong{font-size:14px}
.channel-button-copy small{font-size:10px;opacity:.78;margin-top:4px}
.telegram-button{background:linear-gradient(135deg,#2aabee,var(--telegram-dark));color:#fff}
.kakao-button{background:linear-gradient(135deg,#fff05c,var(--kakao));color:var(--kakao-text)}
.kakao-button .channel-button-icon{background:rgba(0,0,0,.08)}
.hero-contact-note{
  display:flex;
  align-items:center;
  gap:9px;
  width:max-content;
  max-width:100%;
  margin:13px 0 22px;
  color:#bfc8df;
  font-size:12px;
  font-weight:750;
}
.live-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#39dda8;
  box-shadow:0 0 0 6px rgba(57,221,168,.1);
}

/* Keep the hero illustration clean: one centered dashboard only. */
.contact-hero-visual .code-window{
  right:3%;
  top:36px;
  width:min(560px,94%);
  height:330px;
  transform:none;
}
.contact-hero-visual .float-card.sales,
.contact-hero-visual .float-card.deploy{display:none!important}
.contact-float{display:none!important;grid-template-columns:auto 1fr!important;align-items:center;gap:11px;width:190px}
.contact-float-icon{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  font-weight:950;
}
.telegram-float{left:-5%;bottom:15%;background:rgba(19,121,170,.96)!important}
.telegram-float .contact-float-icon{background:rgba(255,255,255,.18)}
.kakao-float{right:-1%;bottom:0;background:#fee500!important;color:#191919!important;border-color:#fee500!important}
.kakao-float .contact-float-icon{background:rgba(0,0,0,.08)}
.kakao-float small{color:rgba(0,0,0,.62)!important}

.contact-strip{
  min-height:76px;
  padding:12px max(24px,calc((100% - 1500px)/2));
  display:none;
  align-items:center;
  justify-content:center;
  gap:25px;
  background:#fff;
  border-bottom:1px solid #ececf3;
}
.contact-strip>div{display:flex;align-items:baseline;gap:8px;white-space:nowrap}
.contact-strip strong{font-size:13px;color:#171827}
.contact-strip span{font-size:11px;color:#777b8d}
.contact-strip i{width:1px;height:24px;background:#e3e4ec}

.support-refresh{
  padding:74px max(28px,calc((100% - 1500px)/2));
  display:grid;
  grid-template-columns:minmax(330px,.78fr) minmax(620px,1.22fr);
  align-items:center;
  gap:58px;
  background:
    radial-gradient(circle at 85% 20%,rgba(34,158,217,.22),transparent 28%),
    radial-gradient(circle at 66% 100%,rgba(254,229,0,.10),transparent 26%),
    linear-gradient(135deg,#080f21,#151a3d);
}
.support-copy h2{margin:13px 0 18px;font-size:clamp(40px,4.5vw,64px);line-height:1.1;letter-spacing:-2.6px}
.support-copy p{max-width:620px;color:#b8c1d8;font-size:16px}
.support-proof{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}
.support-proof span{
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:99px;
  color:#dbe1f1;
  font-size:11px;
  font-weight:750;
}

.support-channel-grid{display:grid;gap:13px}
.support-channel-card{
  width:100%;
  min-height:112px;
  padding:20px 22px;
  border:1px solid transparent;
  border-radius:21px;
  display:grid;
  grid-template-columns:58px 1fr auto;
  align-items:center;
  gap:16px;
  text-align:left;
  font:inherit;
  cursor:pointer;
  transition:.22s ease;
  box-shadow:0 18px 45px rgba(0,0,0,.2);
}
.support-channel-card:hover{transform:translateY(-3px)}
.support-card-icon{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:rgba(255,255,255,.18);
}
.support-card-icon svg{width:28px;height:28px;fill:currentColor}
.support-card-copy{display:grid}
.support-card-copy small{font-size:10px;font-weight:800;opacity:.72;letter-spacing:.3px}
.support-card-copy strong{font-size:24px;line-height:1.15;margin:4px 0}
.support-card-copy em{font-size:11px;font-style:normal;opacity:.72}
.support-card-arrow{font-size:24px;font-weight:900}
.telegram-card{background:linear-gradient(135deg,#2aabee,#147aae);color:#fff}
.kakao-card{background:linear-gradient(135deg,#fff36a,#fee500);color:#191919}
.kakao-card .support-card-icon{background:rgba(0,0,0,.08)}
.web-card{background:rgba(255,255,255,.075);color:#fff;border-color:rgba(255,255,255,.14)}
.web-card .web-icon{font-size:25px;font-weight:950;background:rgba(124,92,255,.28)}

.footer-refresh{grid-template-columns:1.8fr 1fr 1fr 1fr}
.footer-refresh button{
  width:max-content;
  border:0;
  padding:0;
  color:inherit;
  background:transparent;
  font:inherit;
  font-size:13px;
  cursor:pointer;
  text-align:left;
}
.footer-refresh button:hover{color:#fff}

.contact-dock{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:38;
  display:none;
  gap:9px;
}
.dock-button{
  min-width:126px;
  height:48px;
  padding:0 14px 0 8px;
  border:0;
  border-radius:16px;
  display:flex;
  align-items:center;
  gap:8px;
  font:inherit;
  font-size:11px;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 14px 35px rgba(8,12,30,.26);
  transition:.2s ease;
}
.dock-button:hover{transform:translateX(-3px)}
.dock-icon{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(255,255,255,.19);
}
.dock-icon svg{width:19px;height:19px;fill:currentColor}
.telegram-dock{background:var(--telegram);color:#fff}
.kakao-dock{background:var(--kakao);color:var(--kakao-text)}
.kakao-dock .dock-icon{background:rgba(0,0,0,.08)}

.inquiry-dialog{max-width:620px}
.inquiry-dialog form{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.inquiry-dialog form>label{margin:0}
.inquiry-dialog form>label:nth-of-type(4),
.inquiry-dialog form>label:nth-of-type(5),
.inquiry-dialog .channel-hint,
.inquiry-dialog .full,
.inquiry-dialog .form-status{grid-column:1/-1}
.channel-hint{
  margin-top:-6px;
  padding:10px 12px;
  border-radius:10px;
  background:#f0f6fb;
  color:#47708b;
  font-size:11px;
}
.contact-detail-actions{display:flex;flex-wrap:wrap;gap:10px}
.compact-channel{min-width:170px}
.detail-download{color:#333!important;border-color:#ddd!important}

.program-feature-section{margin:24px 0 18px;padding-top:20px;border-top:1px solid #eceef4}
.program-feature-section h3{margin:0 0 13px;font-size:16px;color:#24293b}
.program-feature-section ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:9px 12px}
.program-feature-section li{display:flex;align-items:flex-start;gap:8px;padding:10px 12px;border-radius:11px;background:#f6f7fb;color:#4d5568;font-size:12px;line-height:1.55}
.program-feature-section li>span:first-child{color:#6542e9;font-weight:950}
.program-delivery-note{display:grid;grid-template-columns:auto 1fr;align-items:start;gap:12px;margin:0 0 20px;padding:13px 15px;border:1px solid #ddd8ff;border-radius:12px;background:#f5f2ff}
.program-delivery-note strong{font-size:12px;color:#5238c7;white-space:nowrap}
.program-delivery-note span{font-size:11px;line-height:1.6;color:#656c7d}
.price-inquiry-button{min-width:150px}
.installer-download{min-width:190px}

.external-ready::after{
  content:"↗";
  margin-left:4px;
  font-size:.8em;
}

@media(max-width:1280px){
  .header-channel span:last-child{display:none}
  .header-channel{padding-inline:9px}
  .support-refresh{grid-template-columns:1fr;gap:34px}
  .support-copy p{max-width:900px}
}

@media(max-width:900px){
  .header-channel{display:none}
  .hero-actions-refresh{display:grid;grid-template-columns:1fr 1fr}
  .hero-actions-refresh .browse-button{grid-column:1/-1}
  .channel-button{min-width:0}
  .contact-strip{overflow-x:auto;justify-content:flex-start;padding-inline:20px}
  .support-refresh{padding:62px 22px}
  .footer-refresh{grid-template-columns:1fr 1fr}
  .contact-float{display:none!important}
}

@media(max-width:650px){
  body{padding-bottom:70px}
  .hero-contact-refresh{min-height:auto}
  .hero-actions-refresh{grid-template-columns:1fr}
  .hero-actions-refresh .browse-button{grid-column:auto}
  .channel-button{width:100%}
  .contact-hero-visual .code-window{right:0;top:20px;width:100%;height:245px}
  .support-copy h2{font-size:40px}
  .support-channel-card{grid-template-columns:50px 1fr auto;padding:17px;min-height:98px}
  .support-card-icon{width:50px;height:50px;border-radius:15px}
  .support-card-copy strong{font-size:20px}
  .footer-refresh{grid-template-columns:1fr}
  .contact-dock{
    left:10px;
    right:10px;
    bottom:10px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  .dock-button{width:100%;min-width:0;justify-content:center}
  .inquiry-dialog form{grid-template-columns:1fr}
  .inquiry-dialog form>label,
  .inquiry-dialog .channel-hint,
  .inquiry-dialog .full,
  .inquiry-dialog .form-status{grid-column:1}
  .program-feature-section ul{grid-template-columns:1fr}
  .program-delivery-note{grid-template-columns:1fr;gap:5px}
  .price-inquiry-button,.installer-download{width:100%}
}