:root{
  --motion-blue:#5797EB;
  --motion-coral:#F06050;
  --motion-ink:#071936;
}

.haco-footer{
  border-top:1px solid #e8eef5;
  background:#fff;
  color:#52677f;
  padding:28px 36px 32px;
  font-size:12px;
  line-height:1.8;
}

.haco-footer-inner{
  max-width:1180px;
  margin:0 auto;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
}

.haco-footer-copy{
  color:#1f334b;
  font-weight:650;
}

.haco-footer-statement{
  margin-top:4px;
  color:#52677f;
}

.haco-footer-address{
  color:#73859a;
  text-align:right;
}

html{
  scroll-behavior:smooth;
}

body{
  animation:page-in .42s ease-out both;
}

.page-progress{
  position:fixed;
  left:0;
  top:0;
  width:100%;
  height:3px;
  z-index:9999;
  transform-origin:left center;
  transform:scaleX(0);
  background:linear-gradient(90deg,var(--motion-blue),var(--motion-coral));
  pointer-events:none;
}

.motion-ready .reveal{
  opacity:0;
  transform:translateY(20px);
  transition:opacity .62s ease, transform .62s ease, box-shadow .28s ease, border-color .28s ease;
  transition-delay:var(--reveal-delay,0ms);
}

.motion-ready .reveal.in-view{
  opacity:1;
  transform:translateY(0);
}

.motion-ready .hero,
.motion-ready header,
.motion-ready .nav{
  animation:hero-soft-in .62s ease-out both;
}

.motion-ready .hero-card,
.motion-ready .slack-shell,
.motion-ready .tenant,
.motion-ready .diagram,
.motion-ready .dashboard,
.motion-ready .ops-board,
.motion-ready figure img{
  transform:translateZ(0);
  transition:transform .34s ease, box-shadow .34s ease;
}

.motion-ready .hero-card:hover,
.motion-ready .slack-shell:hover,
.motion-ready .tenant:hover,
.motion-ready .dashboard:hover,
.motion-ready .ops-board:hover,
.motion-ready figure:hover img{
  transform:translateY(-4px);
}

.motion-ready .card:hover,
.motion-ready .doc:hover,
.motion-ready .plan:hover,
.motion-ready .package:hover,
.motion-ready .guard:hover,
.motion-ready .real-card:hover,
.motion-ready .step:hover,
.motion-ready .scenario:hover,
.motion-ready .story-panel:hover,
.motion-ready .box:hover,
.motion-ready .metric:hover,
.motion-ready .kpi:hover{
  border-color:rgba(87,151,235,.45) !important;
  box-shadow:0 18px 36px rgba(18,43,73,.09) !important;
  transform:translateY(-3px);
}

.motion-ready .card,
.motion-ready .doc,
.motion-ready .plan,
.motion-ready .package,
.motion-ready .guard,
.motion-ready .real-card,
.motion-ready .step,
.motion-ready .scenario,
.motion-ready .story-panel,
.motion-ready .box,
.motion-ready .metric,
.motion-ready .kpi{
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.motion-ready .btn,
.motion-ready .main-btn,
.motion-ready button,
.motion-ready .actions a,
.motion-ready .detail,
.motion-ready .mini,
.motion-ready .small{
  position:relative;
  overflow:hidden;
  cursor:pointer;
  user-select:none;
  transform:translateY(0);
  box-shadow:0 8px 18px rgba(31,115,216,.1), 0 1px 0 rgba(255,255,255,.38) inset;
  transition:transform .18s ease, box-shadow .24s ease, filter .24s ease;
}

.motion-ready .detail{
  border-color:var(--motion-blue) !important;
  background:linear-gradient(135deg,#1976e8,#2f8cf0) !important;
  color:#fff !important;
}

.motion-ready a,
.motion-ready button,
.motion-ready [role="button"],
.motion-ready .card,
.motion-ready .doc,
.motion-ready .plan,
.motion-ready .package,
.motion-ready .guard,
.motion-ready .real-card,
.motion-ready .queue-card,
.motion-ready .feed-item,
.motion-ready .step,
.motion-ready .scenario,
.motion-ready .story-panel,
.motion-ready figure{
  -webkit-tap-highlight-color:rgba(87,151,235,.14);
}

.motion-ready .btn:before,
.motion-ready .main-btn:before,
.motion-ready button:before,
.motion-ready .actions a:before,
.motion-ready .detail:before,
.motion-ready .mini:before,
.motion-ready .small:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.28) 42%,transparent 58%);
  transform:translateX(-130%);
  transition:transform .58s ease;
  pointer-events:none;
}

.motion-ready .btn:hover,
.motion-ready .main-btn:hover,
.motion-ready button:hover,
.motion-ready .actions a:hover,
.motion-ready .detail:hover,
.motion-ready .mini:hover,
.motion-ready .small:hover{
  transform:translateY(-3px);
  filter:saturate(1.04);
  box-shadow:0 16px 32px rgba(31,115,216,.22), 0 0 0 1px rgba(87,151,235,.16) inset, 0 1px 0 rgba(255,255,255,.44) inset;
}

.motion-ready .btn:hover:before,
.motion-ready .main-btn:hover:before,
.motion-ready button:hover:before,
.motion-ready .actions a:hover:before,
.motion-ready .detail:hover:before,
.motion-ready .mini:hover:before,
.motion-ready .small:hover:before{
  transform:translateX(130%);
}

.motion-ready .btn:active,
.motion-ready .main-btn:active,
.motion-ready button:active,
.motion-ready .actions a:active,
.motion-ready .detail:active,
.motion-ready .mini:active,
.motion-ready .small:active{
  transform:translateY(1px) scale(.99);
  box-shadow:0 5px 12px rgba(31,115,216,.14), 0 2px 6px rgba(7,25,54,.08) inset;
}

.motion-ready .btn:focus-visible,
.motion-ready .main-btn:focus-visible,
.motion-ready button:focus-visible,
.motion-ready .actions a:focus-visible,
.motion-ready .detail:focus-visible,
.motion-ready .mini:focus-visible,
.motion-ready .small:focus-visible{
  outline:3px solid rgba(87,151,235,.34);
  outline-offset:3px;
}

.motion-ready .btn:not(.sub):not(.small):not(.mini):not(.detail):after,
.motion-ready .main-btn:after,
.motion-ready .actions a.primary:after{
  content:"";
  display:inline-block;
  width:6px;
  height:6px;
  border-top:2px solid currentColor;
  border-right:2px solid currentColor;
  transform:rotate(45deg) translateY(-1px);
  margin-left:10px;
  opacity:.72;
  transition:transform .2s ease, opacity .2s ease;
}

.motion-ready .btn:not(.sub):not(.small):not(.mini):not(.detail):hover:after,
.motion-ready .main-btn:hover:after,
.motion-ready .actions a.primary:hover:after{
  transform:rotate(45deg) translate(2px,-3px);
  opacity:1;
}

.motion-ready .pulse-once{
  animation:pulse-once .78s ease-out both;
}

.motion-ready .feed-item,
.motion-ready .queue-card,
.motion-ready .alert-row,
.motion-ready .risk-row,
.motion-ready .source-list span,
.motion-ready .saas,
.motion-ready .out{
  animation:soft-slide .58s ease-out both;
}

.motion-ready .slack-side .ch,
.motion-ready .ops-side div{
  cursor:pointer;
}

.motion-ready .slack-side .ch{
  transition:background .18s ease, color .18s ease, transform .18s ease;
}

.motion-ready .slack-side .ch:hover{
  background:rgba(255,255,255,.08);
  color:#fff;
  transform:translateX(3px);
}

.motion-ready .slack-side .ch.active:hover{
  background:#2476dc;
}

.motion-ready .slack-shell.is-switching .slack-feed,
.motion-ready .slack-shell.is-switching .queue,
.motion-ready .ops-board.is-switching .ops-main,
.motion-ready .ops-board.is-switching .ops-metrics{
  animation:panel-swap .24s ease-out both;
}

.motion-ready .filter-menu{
  position:absolute;
  right:0;
  top:44px;
  z-index:6;
  min-width:160px;
  padding:8px;
  border:1px solid #dbe5f0;
  border-radius:8px;
  background:#fff;
  box-shadow:0 14px 30px rgba(7,25,54,.14);
}

.motion-ready .filter-option{
  display:block;
  width:100%;
  min-height:34px;
  padding:7px 10px;
  border:0;
  border-radius:6px;
  background:#fff;
  color:#17314e;
  text-align:left;
  font-size:12px;
  font-weight:850;
}

.motion-ready .filter-option:hover{
  background:#edf5ff;
}

.motion-ready .feed-head{
  position:relative;
}

.motion-ready .feed-item.is-filtered{
  display:none;
}

.motion-ready .message-box.is-composer{
  min-height:92px;
  height:auto;
  color:#213954;
  background:linear-gradient(180deg,#fff,#f8fbff);
}

.motion-ready .composer-text{
  margin:2px 0 12px;
  font-size:13px;
  font-weight:800;
}

.motion-ready .composer-actions{
  display:flex;
  gap:8px;
  justify-content:flex-end;
}

.motion-ready .queue-card.is-approved,
.motion-ready .alert-row.is-approved{
  border-color:rgba(47,179,108,.42) !important;
  background:linear-gradient(90deg,#f0fbf5,#fff);
}

.motion-ready .queue-card.is-rejected,
.motion-ready .alert-row.is-rejected{
  opacity:.62;
  background:#f8fafc;
}

.motion-ready .queue-card.is-approved:after,
.motion-ready .alert-row.is-approved:after{
  content:"反映済み";
  color:#24aa66;
  font-size:11px;
  font-weight:950;
}

.motion-ready .ops-side div.is-previewing{
  background:#17395f;
  color:#fff;
}

.motion-ready .logo,
.motion-ready .links,
.motion-ready .nav a,
.motion-ready .btn,
.motion-ready .main-btn,
.motion-ready .detail,
.motion-ready .small,
.motion-ready .tab,
.motion-ready .side div{
  font-weight:760 !important;
}

.motion-ready h1{
  font-weight:650 !important;
  letter-spacing:0 !important;
}

.motion-ready h2,
.motion-ready h3{
  font-weight:680 !important;
  letter-spacing:0 !important;
}

.motion-ready .casebox{
  padding:18px 20px !important;
}

.motion-ready .casebox > b{
  display:block;
  margin-bottom:12px;
  font-weight:720 !important;
}

.motion-ready .casebox div{
  grid-template-columns:minmax(96px,auto) 1fr !important;
  align-items:center;
  gap:14px !important;
  margin:12px 0 !important;
}

.motion-ready .casebox .pref{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  padding:4px 12px;
  line-height:1.2;
  font-weight:760 !important;
}

.motion-ready .casebox span:last-child{
  color:#40546b;
  line-height:1.55;
  font-weight:620 !important;
}

.motion-ready .control-dashboard .side div{
  cursor:pointer;
  transition:background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.motion-ready .control-dashboard .side div:hover,
.motion-ready .control-dashboard .side div:focus-visible{
  background:#17395f;
  color:#fff;
  transform:translateX(3px);
  box-shadow:0 8px 18px rgba(0,0,0,.14);
  outline:none;
}

.motion-ready .control-dashboard.is-switching .main,
.motion-ready .control-dashboard.is-switching .panel{
  animation:panel-swap .24s ease-out both;
}

.motion-ready .control-dashboard .main{
  overflow-x:auto;
}

.motion-ready .control-dashboard .tabs{
  flex-wrap:wrap;
}

.motion-ready .control-dashboard .tab{
  min-height:28px;
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:5px 9px;
  color:#53677f;
  background:#f6f9fd;
}

.motion-ready .control-dashboard .tab.on{
  color:#fff !important;
  background:#1976e8;
}

.motion-ready .control-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin:4px 0 18px;
}

.motion-ready .control-card{
  border:1px solid #dfe8f3;
  border-radius:8px;
  background:linear-gradient(180deg,#fff,#f8fbff);
  padding:14px;
}

.motion-ready .control-card small{
  display:block;
  margin-bottom:6px;
  color:#52677f;
  font-size:11px;
  font-weight:700;
}

.motion-ready .control-card b{
  color:#071936;
  font-size:22px;
  line-height:1.2;
  font-weight:700 !important;
}

.motion-ready .control-dashboard th{
  white-space:nowrap;
  font-weight:720 !important;
}

.motion-ready .control-dashboard td{
  color:#253d56;
  font-weight:560 !important;
  line-height:1.55;
  vertical-align:middle;
}

.motion-ready .control-dashboard tr{
  transition:background .18s ease, opacity .18s ease;
}

.motion-ready .control-dashboard tr:hover td{
  background:#f9fcff;
}

.motion-ready .control-dashboard tr.is-approved td{
  background:#f0fbf5;
  color:#246545;
}

.motion-ready .control-dashboard tr.is-rejected td{
  background:#f8fafc;
  color:#7a8796;
  opacity:.74;
}

.motion-ready .control-dashboard .panel .box p{
  margin:10px 0 0;
  color:#425870;
  line-height:1.65;
  font-weight:600;
}

.motion-ready .control-dashboard .small.fill{
  background:#1976e8 !important;
  border-color:#1976e8 !important;
  color:#fff !important;
}

.motion-ready .tenant.is-updating,
.motion-ready .card.is-selected,
.motion-ready .pin.is-selected{
  animation:panel-swap .26s ease-out both;
}

.motion-ready .card.is-selected{
  border-color:rgba(25,118,232,.72) !important;
  box-shadow:0 22px 42px rgba(25,118,232,.17) !important;
}

.motion-ready .pin.is-selected{
  background:#1976e8;
  color:#fff;
}

.motion-ready .pin.is-selected:before{
  background:#fff;
  color:#1976e8;
}

.motion-ready .tenant .tabs span{
  cursor:pointer;
}

.motion-ready .tenant .tabs span:hover{
  color:#1976e8;
}

.motion-toast{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:10000;
  max-width:min(360px,calc(100vw - 44px));
  padding:13px 16px;
  border:1px solid rgba(87,151,235,.3);
  border-radius:10px;
  background:rgba(255,255,255,.96);
  color:#0d2542;
  box-shadow:0 18px 40px rgba(7,25,54,.16);
  font-size:13px;
  font-weight:850;
  opacity:0;
  transform:translateY(12px);
  pointer-events:none;
  transition:opacity .24s ease, transform .24s ease;
}

.motion-toast.is-visible{
  opacity:1;
  transform:translateY(0);
}

.lead-modal{
  position:fixed;
  inset:0;
  z-index:10001;
  display:none;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:rgba(7,25,54,.42);
  backdrop-filter:blur(10px);
}

.lead-modal.is-open{
  display:flex;
}

.lead-dialog{
  width:min(560px,100%);
  max-height:min(760px,calc(100vh - 44px));
  overflow:auto;
  border:1px solid #dbe5f0;
  border-radius:12px;
  background:#fff;
  box-shadow:0 24px 70px rgba(7,25,54,.24);
  animation:panel-swap .22s ease-out both;
}

.lead-head{
  display:flex;
  align-items:start;
  justify-content:space-between;
  gap:18px;
  padding:24px 26px 16px;
  border-bottom:1px solid #edf2f7;
}

.lead-head h2{
  margin:0;
  font-size:24px;
  line-height:1.35;
}

.lead-head p{
  margin:6px 0 0;
  color:#53677f;
  font-size:13px;
  font-weight:700;
}

.lead-close{
  width:36px;
  height:36px;
  border:1px solid #dbe5f0;
  border-radius:50%;
  background:#fff;
  color:#53677f;
  font-size:20px;
}

.lead-form{
  display:grid;
  gap:14px;
  padding:22px 26px 26px;
}

.lead-form label{
  display:grid;
  gap:6px;
  color:#20384f;
  font-size:13px;
  font-weight:850;
}

.lead-form input,
.lead-form textarea{
  width:100%;
  border:1px solid #dbe5f0;
  border-radius:8px;
  background:#fbfdff;
  color:#071936;
  font:inherit;
  font-size:15px;
  padding:12px 13px;
  outline:none;
}

.lead-form textarea{
  min-height:104px;
  resize:vertical;
}

.lead-form input:focus,
.lead-form textarea:focus{
  border-color:#5797eb;
  box-shadow:0 0 0 3px rgba(87,151,235,.16);
  background:#fff;
}

.lead-form .hidden-field{
  display:none;
}

.lead-note{
  margin:0;
  color:#647991;
  font-size:12px;
  line-height:1.6;
}

.lead-actions{
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
  align-items:center;
  margin-top:4px;
}

.lead-submit{
  min-width:190px;
  height:50px;
  border:0;
  border-radius:7px;
  background:linear-gradient(135deg,#1976e8,#2f8cf0);
  color:#fff;
  font-weight:900;
}

@media(max-width:640px){
  .haco-footer{
    padding:24px 18px 28px;
  }
  .haco-footer-inner{
    align-items:flex-start;
    flex-direction:column;
  }
  .haco-footer-address{
    text-align:left;
  }
  .lead-head,
  .lead-form{padding-left:18px;padding-right:18px}
  .lead-actions{grid-template-columns:1fr}
  .lead-submit{width:100%}
  .motion-ready .control-grid{grid-template-columns:1fr 1fr}
  .motion-ready .casebox div{grid-template-columns:1fr !important}
  .motion-ready .casebox .pref{justify-content:flex-start;width:max-content;max-width:100%}
}

.motion-ready .feed-item:nth-child(2),
.motion-ready .queue-card:nth-child(2),
.motion-ready .alert-row:nth-child(2),
.motion-ready .risk-row:nth-child(2),
.motion-ready .saas:nth-child(2),
.motion-ready .out:nth-child(2){animation-delay:80ms}

.motion-ready .feed-item:nth-child(3),
.motion-ready .queue-card:nth-child(3),
.motion-ready .alert-row:nth-child(3),
.motion-ready .risk-row:nth-child(3),
.motion-ready .saas:nth-child(3),
.motion-ready .out:nth-child(3){animation-delay:150ms}

.motion-ready .feed-item:nth-child(4),
.motion-ready .queue-card:nth-child(4),
.motion-ready .alert-row:nth-child(4),
.motion-ready .risk-row:nth-child(4),
.motion-ready .saas:nth-child(4),
.motion-ready .out:nth-child(4){animation-delay:220ms}

.motion-ready .bar i,
.motion-ready .progress i{
  transform-origin:left center;
  animation:bar-grow .9s ease-out both;
}

.motion-ready .pin{
  animation:pin-pop .72s cubic-bezier(.2,1.4,.35,1) both;
}

.motion-ready .pin:nth-of-type(2){animation-delay:90ms}
.motion-ready .pin:nth-of-type(3){animation-delay:160ms}
.motion-ready .pin:nth-of-type(4){animation-delay:230ms}
.motion-ready .pin:nth-of-type(5){animation-delay:300ms}

.motion-ready .metric-row b,
.motion-ready .price,
.motion-ready .kpi b,
.motion-ready .metric b{
  transition:color .28s ease;
}

.motion-ready .metric-row div:hover b,
.motion-ready .kpi:hover b,
.motion-ready .metric:hover b{
  color:var(--motion-coral) !important;
}

.motion-ready .feed-item:hover,
.motion-ready .queue-card:hover,
.motion-ready .alert-row:hover,
.motion-ready .source-list span:hover,
.motion-ready .saas:hover,
.motion-ready .out:hover,
.motion-ready .ch:hover{
  transform:translateX(3px);
  border-color:rgba(87,151,235,.38) !important;
}

@keyframes page-in{
  from{opacity:.001}
  to{opacity:1}
}

@keyframes hero-soft-in{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes soft-slide{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes panel-swap{
  from{opacity:.28;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes pulse-once{
  0%{box-shadow:0 0 0 0 rgba(87,151,235,.28)}
  100%{box-shadow:0 0 0 18px rgba(87,151,235,0)}
}

@keyframes bar-grow{
  from{transform:scaleX(.08)}
  to{transform:scaleX(1)}
}

@keyframes pin-pop{
  from{opacity:0;transform:translateY(8px) scale(.92)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  body,
  .motion-ready *,
  .motion-ready *:before,
  .motion-ready *:after{
    animation:none !important;
    transition:none !important;
    transform:none !important;
  }
  .motion-ready .reveal{opacity:1 !important}
}