/* 360space spheres: shared, scoped responsive layout. Brand: dark / white / silver. */
body.s360-sphere-page #main,
body.s360-sphere-page #main #content { background: #030736; }
body.s360-sphere-page #main { padding-top: 38px; padding-bottom: 80px; }
body.s360-sphere-page #main > .wf-wrap {
  width: 100%; max-width: 1320px; margin-inline: auto;
  padding-inline: clamp(18px, 4vw, 48px); box-sizing: border-box;
}
body.s360-sphere-page #main .wf-container-main {
  display: block; grid-template-columns: minmax(0, 1fr); gap: 0;
}
body.s360-sphere-page #main .wf-container-main::before,
body.s360-sphere-page #main .wf-container-main::after { display:none; }
body.s360-sphere-page #main #sidebar { display:none; }
body.s360-sphere-page #main #content {
  width: 100%; max-width: 100%; min-width: 0; float: none;
  margin: 0; padding: 0;
}
.sp-page {
  --sp-bg: #030736;
  --sp-text: #fff;
  --sp-muted: #c7c9d8;
  --sp-quiet: #afb2c6;
  --sp-line: rgba(255, 255, 255, .17);
  --sp-surface: rgba(255, 255, 255, .045);
  width: 100%; max-width: 1200px; min-width: 0; margin: 0 auto;
  color: var(--sp-text); font: 400 16px/1.65 "Inter", sans-serif;
  -webkit-text-size-adjust: 100%;
}
.sp-page *, .sp-page *::before, .sp-page *::after { box-sizing: border-box; }
.sp-page :where(h1, h2, h3, p, ul, ol, figure) { margin: 0; }
.sp-page :where(h1, h2, h3) {
  color: #fff; font-family: "Inter", sans-serif; font-weight: 550;
  letter-spacing: -.035em; overflow-wrap: anywhere; text-transform:none;
}
.sp-page h1 { font-size: clamp(34px, 4.3vw, 58px); line-height: 1.1; }
.sp-page h2 { font-size: clamp(28px, 3vw, 40px); line-height: 1.18; }
.sp-page h3 { font-size: 21px; line-height: 1.3; letter-spacing: -.025em; }
.sp-page p { color: var(--sp-muted); }
.sp-page :where(a, button, input, summary) { -webkit-tap-highlight-color: transparent; }
.sp-page a { color: inherit; text-decoration: none; }
.sp-page a:focus-visible,
.sp-page button:focus-visible,
.sp-page input:focus-visible,
.sp-page summary:focus-visible {
  outline: 2px solid #fff; outline-offset: 5px;
}
.sp-page a:where(:hover, :focus-visible) { color: #fff; }
.sp-page :where(section[id], div[id]) { scroll-margin-top: 110px; }
.sp-page img { max-width: 100%; height: auto; }
.sp-page .sp-kicker {
  display: block; margin-bottom: 15px; color: var(--sp-quiet);
  font-size: 12px; font-weight: 600; line-height: 1.5;
  letter-spacing: .13em; text-transform: uppercase;
}
.sp-page .sp-breadcrumb {
  display: flex; flex-wrap: wrap; align-items: center; gap: 5px 9px;
  margin-bottom: 34px; color: var(--sp-quiet); font-size: 13px; line-height: 1.5;
}
.sp-page .sp-breadcrumb a { text-decoration: underline; text-underline-offset: 4px; }
.sp-page .sp-breadcrumb :where(a, span) { min-width: 0; overflow-wrap: anywhere; }
.sp-page .sp-hero {
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  align-items: center; gap: clamp(32px, 5vw, 68px); padding-bottom: 38px;
}
.sp-page .sp-hero > *, .sp-page .sp-result > *,
.sp-page .sp-prepare > *, .sp-page .sp-contact > * { min-width: 0; }
.sp-page .sp-hero .sp-breadcrumb { margin-bottom: 26px; }
.sp-page .sp-lead {
  max-width: 580px; margin-top: 23px; color: var(--sp-muted);
  font-size: clamp(17px, 1.65vw, 19px); line-height: 1.65;
}
.sp-page .sp-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 29px; }
.sp-page .sp-btn, .sp-page .sp-btn-secondary {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 50px; max-width: 100%; padding: 13px 20px;
  border: 1px solid #fff; border-radius: 9px;
  background: #fff; color: #030736; font: 600 15px/1.45 "Inter", sans-serif;
  text-align: center; text-decoration: none; overflow-wrap: anywhere;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
.sp-page .sp-btn:hover, .sp-page .sp-btn:focus-visible { background: #e8e9ee; border-color: #e8e9ee; color: #030736; }
.sp-page .sp-btn-secondary { border-color: rgba(255, 255, 255, .32); background: transparent; color: #fff; }
.sp-page .sp-btn-secondary:hover { border-color: rgba(255, 255, 255, .65); background: rgba(255, 255, 255, .07); }
.sp-page .sp-note { margin-top: 15px; color: var(--sp-quiet); font-size: 13px; line-height: 1.6; }
.sp-page .sp-hero-media { align-self: center; }
.sp-page .sp-cover {
  position: relative; display: block; overflow: hidden; aspect-ratio: 4 / 3;
  border: 1px solid var(--sp-line); border-radius: 18px;
  background: #111538; isolation: isolate;
}
.sp-page .sp-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sp-page .sp-cover::after {
  content: "↗"; position: absolute; right: 16px; bottom: 16px;
  display: grid; place-items: center; width: 44px; height: 44px;
  border: 1px solid rgba(255, 255, 255, .65); border-radius: 50%;
  background: rgba(3, 7, 54, .75); color: #fff; font-size: 23px; line-height: 1;
  transition: background-color .18s ease;
}
.sp-page .sp-cover:hover::after { background: #030736; }
.sp-page .sp-cover-action { position:absolute; left:16px; bottom:16px; max-width:calc(100% - 92px); padding:8px 12px; border-radius:8px; color:#fff; background:rgba(3,7,54,.85); font-size:14px; line-height:1.4; }
.sp-page .sp-cover-action > span { display:none; }
.sp-page .sp-section-link { margin-top:24px; }
.sp-page .sp-section-link a { color:#e3e5ee; text-underline-offset:4px; }
.sp-page .sp-media-note { padding:32px; border:1px solid var(--sp-line); border-radius:18px; background:rgba(255,255,255,.04); }
.sp-page .sp-media-note h2 { margin:16px 0; }
.sp-page .sp-contact .s360-if__error { margin:12px 0; padding:10px 12px; border:1px solid #f4b5b5; border-radius:8px; color:#ffe2e2; font-size:14px; line-height:1.5; }
.sp-page [hidden] { display:none!important; }
.sp-page .sp-cover-caption { margin-top: 11px; color: var(--sp-quiet); font-size: 13px; line-height: 1.55; }
.sp-page .sp-cover-caption a { text-decoration: underline; text-underline-offset: 3px; }
.sp-page .sp-nav {
  display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 0 0 66px;
  padding: 18px 0; border-top: 1px solid var(--sp-line); border-bottom: 1px solid var(--sp-line);
}
.sp-page .sp-nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--sp-muted); font-size: 14px; line-height: 1.4; }
.sp-page .sp-nav a:hover { color: #fff; text-decoration: underline; text-underline-offset: 5px; }
.sp-page .sp-section { margin: 0 0 86px; }
.sp-page .sp-section:last-child { margin-bottom: 0; }
.sp-page .sp-section-head { max-width: 750px; margin-bottom: 30px; }
.sp-page .sp-section-head h2 + p { margin-top: 17px; }
.sp-page .sp-section-head p { max-width: 690px; font-size: 17px; }
.sp-page .sp-case-grid,
.sp-page .sp-scenario-grid,
.sp-page .sp-services,
.sp-page .sp-directory-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.sp-page .sp-case {
  display: flex; min-width: 0; flex-direction: column; overflow: hidden;
  border: 1px solid var(--sp-line); border-radius: 13px;
  background: var(--sp-surface); color: #fff;
  transition: background-color .18s ease, border-color .18s ease;
}
.sp-page .sp-case:hover { background: rgba(255, 255, 255, .075); border-color: rgba(255, 255, 255, .38); }
.sp-page .sp-case img { display: block; width: 100%; aspect-ratio: 16 / 10; height: auto; object-fit: cover; }
.sp-page .sp-case-body { display: flex; flex: 1; flex-direction: column; padding: 20px; }
.sp-page .sp-case-body h3 { font-size: 19px; line-height: 1.35; }
.sp-page .sp-case-body p { margin-top: 10px; font-size: 14px; line-height: 1.65; }
.sp-page .sp-case-body .sp-link { margin-top: auto; padding-top: 18px; }
.sp-page .sp-card { min-width: 0; padding: 24px 0 0; border-top: 1px solid rgba(255, 255, 255, .32); }
.sp-page .sp-step-index {
  display: block; margin-bottom: 18px; color: var(--sp-quiet);
  font-size: 13px; line-height: 1.4; letter-spacing: .08em;
}
.sp-page .sp-card p { margin-top: 13px; line-height: 1.65; }
.sp-page .sp-result {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr);
  align-items: start; gap: 50px; padding: clamp(26px, 4vw, 46px);
  border: 1px solid var(--sp-line); border-radius: 18px;
  background: linear-gradient(125deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .025));
}
.sp-page .sp-result-copy h2 + p { margin-top: 19px; }
.sp-page .sp-checklist { display: grid; gap: 19px; margin: 0; padding: 0; list-style: none; }
.sp-page .sp-checklist li { position: relative; min-width: 0; padding-left: 29px; color: var(--sp-muted); list-style: none; overflow-wrap: anywhere; }
.sp-page .sp-checklist li::before { content: "✓"; position: absolute; left: 0; top: 0; color: #fff; font-size: 16px; }
.sp-page .sp-checklist strong { color: #fff; font-weight: 600; }
.sp-page .sp-checklist li > strong,
.sp-page .sp-checklist li > span { display: block; }
.sp-page .sp-checklist li > strong { margin-bottom: 5px; }
.sp-page .sp-service {
  display: flex; min-width: 0; flex-direction: column; align-items: flex-start;
  padding: 25px; border: 1px solid var(--sp-line); border-radius: 12px;
  background: var(--sp-surface); transition: background-color .18s ease, border-color .18s ease;
}
.sp-page .sp-service:hover { border-color: rgba(255, 255, 255, .4); background: rgba(255, 255, 255, .075); }
.sp-page .sp-service h3 { font-size: 20px; }
.sp-page .sp-service p { flex: 1; margin-top: 13px; font-size: 15px; line-height: 1.65; }
.sp-page .sp-service-price { display: block; margin-top: 24px; color: #fff; font-size: 18px; font-weight: 600; line-height: 1.45; }
.sp-page .sp-link { display: inline-block; margin-top: 13px; color: #fff; font-size: 14px; line-height: 1.5; text-decoration: underline; text-underline-offset: 5px; text-decoration-color: rgba(255, 255, 255, .5); }
.sp-page .sp-process { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 27px; }
.sp-page .sp-process-step { min-width: 0; padding-top: 23px; border-top: 1px solid rgba(255, 255, 255, .32); }
.sp-page .sp-process-step h3 { font-size: 19px; line-height: 1.4; }
.sp-page .sp-process-step p { margin-top: 12px; font-size: 15px; line-height: 1.65; }
.sp-page .sp-prepare {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr);
  gap: 50px; padding-block: 34px; border-top: 1px solid var(--sp-line); border-bottom: 1px solid var(--sp-line);
}
.sp-page .sp-prepare h2 + p { margin-top: 17px; }
.sp-page .sp-faq { border-top: 1px solid var(--sp-line); }
.sp-page .sp-faq details { min-width: 0; margin: 0; padding: 0; border-bottom: 1px solid var(--sp-line); }
.sp-page .sp-faq summary {
  position: relative; display: block; min-height: 72px; padding: 22px 44px 22px 0;
  color: #fff; font-size: 18px; font-weight: 500; line-height: 1.5;
  list-style: none; cursor: pointer; overflow-wrap: anywhere;
}
.sp-page .sp-faq summary::-webkit-details-marker { display: none; }
.sp-page .sp-faq summary::after { content: "+"; position: absolute; right: 4px; top: 20px; color: var(--sp-muted); font-size: 26px; font-weight: 300; line-height: 1.1; }
.sp-page .sp-faq details[open] summary::after { content: "−"; }
.sp-page .sp-faq summary:hover { color: #e2e3ed; }
.sp-page .sp-faq .sp-answer { max-width: 830px; padding: 0 44px 24px 0; color: var(--sp-muted); }
.sp-page .sp-answer p + p { margin-top: 12px; }
.sp-page .sp-answer a { text-decoration: underline; text-underline-offset: 4px; }
.sp-page .sp-contact {
  display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1fr);
  align-items: start; gap: 55px; padding: clamp(26px, 4vw, 46px);
  border: 1px solid rgba(255, 255, 255, .23); border-radius: 18px;
  background: linear-gradient(135deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .035));
}
.sp-page .sp-contact-copy h2 + p { margin-top: 20px; }
.sp-page .sp-contact-copy .sp-note { margin-top: 20px; }
.sp-page .sp-contact-copy a:not(.sp-btn) { text-decoration: underline; text-underline-offset: 4px; }
.sp-page .sp-contact-form { width: 100%; }
/* Override the legacy form's footer CSS without changing its existing submission handler. */
.sp-page .sp-contact .s360-inline-form { width: 100%; max-width: none; margin: 0; }
.sp-page .sp-contact .s360-if__row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.sp-page .sp-contact .sp-field { display: block; width: 100%; min-width: 0; }
.sp-page .sp-contact .sp-field-label { display: block; margin-bottom: 7px; color: #fff; font-size: 14px; font-weight: 500; line-height: 1.5; }
.sp-page .sp-contact .s360-if__field {
  display: block; width: 100%; max-width: 100%; min-width: 0; min-height: 50px;
  margin: 0; padding: 13px 15px; border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 8px; background: rgba(3, 7, 54, .62) !important;
  box-shadow: none; color: #fff !important; -webkit-text-fill-color: #fff;
  font: 400 16px/1.5 "Inter", sans-serif; outline: none;
}
.sp-page .sp-contact .s360-if__field::placeholder { color: #afb2c6; opacity: 1; -webkit-text-fill-color: #afb2c6; }
.sp-page .sp-contact .s360-if__field:focus { border-color: #fff; background: rgba(3, 7, 54, .85) !important; outline: 2px solid #fff; outline-offset: 3px; }
.sp-page .sp-contact .s360-if__btn {
  display: block; width: 100%; min-width: 0; min-height: 50px;
  margin: 2px 0 0; padding: 14px 18px; border: 1px solid #fff;
  border-radius: 8px; background: #fff; box-shadow: none;
  color: #030736; font: 600 15px/1.5 "Inter", sans-serif; text-transform: none;
  white-space: normal; cursor: pointer; overflow-wrap: anywhere;
  transition: background-color .18s ease, border-color .18s ease;
}
.sp-page .sp-contact .s360-if__btn:hover { background: #e8e9ee; border-color: #e8e9ee; color: #030736; }
.sp-page .sp-contact .s360-if__btn[disabled] { opacity: .6; cursor: wait; }
.sp-page .sp-contact .s360-if__trust { margin: 13px 0 0; color: #b8bbcd; font: 400 12px/1.65 "Inter", sans-serif; }
.sp-page .sp-contact .s360-if__trust a { color: #e6e7ed; text-decoration: underline; text-underline-offset: 3px; }
.sp-page .sp-contact .s360-if__ok { margin-top: 16px; padding: 15px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 8px; background: rgba(255, 255, 255, .06); color: #fff; font: 400 15px/1.65 "Inter", sans-serif; }
.sp-page .sp-contact .s360-if__ok[hidden] { display: none; }
.sp-page .sp-indexhero { max-width: 850px; margin-bottom: 54px; }
.sp-page .sp-indexhero h1 { max-width: 780px; }
.sp-page .sp-indexhero .sp-lead { max-width: 720px; }
.sp-page .sp-directory-card {
  display: flex; min-width: 0; flex-direction: column; align-items: flex-start;
  padding: 28px; border: 1px solid var(--sp-line); border-radius: 13px;
  background: var(--sp-surface); transition: background-color .18s ease, border-color .18s ease;
}
.sp-page .sp-directory-card:hover { background: rgba(255, 255, 255, .075); border-color: rgba(255, 255, 255, .4); }
.sp-page .sp-directory-card .sp-kicker { margin-bottom: 19px; }
.sp-page .sp-directory-card h2 { font-size: 25px; line-height: 1.25; }
.sp-page .sp-directory-card p { flex: 1; margin-top: 14px; font-size: 15px; line-height: 1.65; }
.sp-page .sp-directory-card .sp-link { margin-top: 23px; }
@media (max-width: 1023px) {
  body.s360-sphere-page #main { padding-top: 28px; padding-bottom: 64px; }
  .sp-page .sp-hero { grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: 30px; }
  .sp-page h1 { font-size: clamp(33px, 4.8vw, 46px); }
  .sp-page .sp-hero .sp-actions { align-items: stretch; flex-direction: column; }
  .sp-page .sp-hero .sp-actions > a { align-self: flex-start; }
  .sp-page .sp-nav { gap: 8px 23px; margin-bottom: 54px; }
  .sp-page .sp-case-grid, .sp-page .sp-services, .sp-page .sp-directory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  .sp-page .sp-scenario-grid { gap: 22px; }
  .sp-page .sp-process { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
  .sp-page .sp-result, .sp-page .sp-prepare { gap: 32px; }
  .sp-page .sp-contact { gap: 32px; }
  .sp-page .sp-section { margin-bottom: 68px; }
}
@media (max-width: 767px) {
  .sp-page .sp-hero { grid-template-columns: minmax(0, 1fr); gap: 29px; }
  .sp-page h1 { max-width: 680px; font-size: clamp(34px, 6vw, 46px); }
  .sp-page .sp-hero .sp-actions { flex-direction: row; }
  .sp-page .sp-hero .sp-actions > a { align-self: stretch; }
  .sp-page .sp-hero-media { width: 100%; }
  .sp-page .sp-cover { aspect-ratio: 16 / 10; }
  .sp-page .sp-lead { margin-top: 19px; }
  .sp-page .sp-result, .sp-page .sp-prepare, .sp-page .sp-contact { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .sp-page .sp-result-copy { max-width: 570px; }
  .sp-page .sp-scenario-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 25px; }
  .sp-page .sp-contact-form { max-width: 580px; }
}
@media (max-width: 639px) {
  body.s360-sphere-page #main { padding-top: 21px; padding-bottom: 48px; }
  body.s360-sphere-page #main > .wf-wrap { padding-inline: 18px; }
  .sp-page h1 { font-size: clamp(32px, 8vw, 40px); line-height: 1.13; }
  .sp-page h2 { font-size: 29px; line-height: 1.2; }
  .sp-page h3 { font-size: 21px; }
  .sp-page .sp-breadcrumb { margin-bottom: 26px; font-size: 12px; }
  .sp-page .sp-hero .sp-breadcrumb { margin-bottom: 23px; }
  .sp-page .sp-kicker { margin-bottom: 12px; font-size: 11px; }
  .sp-page .sp-hero { padding-bottom: 27px; }
  .sp-page .sp-lead { font-size: 17px; }
  .sp-page .sp-actions { margin-top: 23px; gap: 10px; }
  .sp-page .sp-hero .sp-actions { flex-direction: column; }
  .sp-page .sp-hero .sp-actions > a { width: 100%; }
  .sp-page .sp-btn, .sp-page .sp-btn-secondary { min-height: 50px; padding-inline: 15px; }
  .sp-page .sp-note { font-size: 12px; }
  .sp-page .sp-cover { aspect-ratio: 4 / 3; border-radius: 12px; }
  .sp-page .sp-cover::after { right: 12px; bottom: 12px; width: 40px; height: 40px; }
  .sp-page .sp-cover-caption { font-size: 12px; }
  .sp-page .sp-nav { gap: 6px 21px; margin-bottom: 43px; padding-block: 12px; }
  .sp-page .sp-nav a { min-height: 44px; font-size: 13px; }
  .sp-page .sp-section { margin-bottom: 54px; }
  .sp-page .sp-section-head { margin-bottom: 24px; }
  .sp-page .sp-section-head p { font-size: 16px; }
  .sp-page .sp-case-grid, .sp-page .sp-scenario-grid, .sp-page .sp-services,
  .sp-page .sp-directory-grid, .sp-page .sp-process { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .sp-page .sp-case-body { padding: 20px; }
  .sp-page .sp-case-body h3 { font-size: 21px; }
  .sp-page .sp-case-body p { font-size: 15px; }
  .sp-page .sp-card { padding-top: 21px; padding-bottom: 7px; }
  .sp-page .sp-step-index { margin-bottom: 12px; }
  .sp-page .sp-card p { margin-top: 11px; }
  .sp-page .sp-result, .sp-page .sp-contact { padding: 24px 20px; gap: 25px; border-radius: 13px; }
  .sp-page .sp-checklist { gap: 17px; }
  .sp-page .sp-checklist li { padding-left: 26px; }
  .sp-page .sp-service { padding: 23px 21px; }
  .sp-page .sp-service h3 { font-size: 21px; }
  .sp-page .sp-service p { font-size: 16px; }
  .sp-page .sp-service-price { margin-top: 20px; }
  .sp-page .sp-process { gap: 23px; }
  .sp-page .sp-process-step { padding-top: 20px; }
  .sp-page .sp-process-step h3 { font-size: 21px; }
  .sp-page .sp-process-step p { font-size: 16px; }
  .sp-page .sp-prepare { padding-block: 27px; gap: 23px; }
  .sp-page .sp-faq summary { min-height: 66px; padding: 19px 33px 19px 0; font-size: 17px; }
  .sp-page .sp-faq summary::after { right: 1px; top: 18px; }
  .sp-page .sp-faq .sp-answer { padding: 0 22px 21px 0; font-size: 16px; }
  .sp-page .sp-indexhero { margin-bottom: 34px; }
  .sp-page .sp-directory-card { padding: 25px 22px; }
  .sp-page .sp-directory-card h2 { font-size: 26px; }
  .sp-page .sp-directory-card p { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .sp-page *, .sp-page *::before, .sp-page *::after { scroll-behavior: auto; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}