@charset "UTF-8";

:root{
  --navy:#061b3d;
  --blue:#086df3;
  --light-blue:#f3f8ff;
  --line:rgba(6,27,61,.12);
  --serif:"Noto Serif JP","Yu Mincho",serif;
  --sans:"Noto Sans JP","Yu Gothic",sans-serif;
}

*{
  box-sizing:border-box;
}

body{
  margin:0;
  color:var(--navy);
  background:#fff;
  font-family:var(--sans);
}

img{
  display:block;
  max-width:100%;
}

.formx-page{
  width:100%;
  max-width:1620px;
  overflow:hidden;
}

.formx-inner{
  width:100%;
  padding-right:52px;
  padding-left:52px;
}

.section-space{
  padding-bottom:10px;
}

.formx-title{
  position:relative;
  margin:20px 0 20px;
  color:var(--navy);
  font-family:var(--serif);
  font-size:30px;
  font-weight:600;
  line-height:1.5;
  letter-spacing:.05em;
  text-align:center;
}

.formx-title::after{
  content:"";
  position:absolute;
  bottom:-13px;
  left:50%;
  width:46px;
  height:3px;
  border-radius:999px;
  background:var(--blue);
  transform:translateX(-50%);
}

.formx-hero{
  position:relative;
  width:100%;
  min-height:520px;
  overflow:hidden;
  background:transparent;
}
.formx-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:linear-gradient(
    90deg,
    rgba(255,255,255,1) 0%,
    rgba(255,255,255,.98) 34%,
    rgba(255,255,255,.65) 52%,
    rgba(255,255,255,0) 70%
  );
}

.formx-hero__inner{
  position:relative;
  z-index:1;
  width:100%;
  min-height:520px;
  padding-top:40px;
  padding-bottom:38px;
  display:flex;
  align-items:center;
}

.formx-hero__content{
  position:relative;
  z-index:3;
  width:49%;
  max-width:680px;
}
.formx-hero__visual{
  position:absolute;
  top:50%;
  right:40px;
  bottom:auto;
  z-index:1;
  width:min(54vw,850px);
  height:850px;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  overflow:visible;
  background:transparent;
  transform:translateY(-50%);
  pointer-events:none;
}

.formx-hero__visual img{
  width:100%;
  height:100%;
  max-width:none;
  max-height:480px;
  object-fit:contain;
  object-position:right center;
  background:transparent;
}

.formx-hero__visual::before{
  content:none;
}

.formx-kicker{
  margin:0 0 20px;
  color:#176ee9;
  font-size:15px;
  font-weight:700;
}

.formx-hero h1{
  margin:0;
  color:var(--navy);
  font-family:var(--serif);
  font-weight:500;
}

.formx-logo-text{
  display:block;
  margin-bottom:22px;
  font-size:86px;
  line-height:1;
  letter-spacing:-.04em;
}

.formx-logo-text span{
  color:#086df3;
}

.formx-hero h1 small{
  display:block;
  font-size:42px;
  line-height:1.55;
  font-weight:500;
}

.formx-hero__lead{
  max-width:620px;
  margin:24px 0 0;
  color:var(--navy);
  font-family:var(--serif);
  font-size:16px;
  line-height:2;
}

.problem-list{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.problem-item{
  min-width:0;
  padding:16px 30px 10px;
  display:flex;
  align-items:flex-start;
  gap:22px;
  border-right:1px solid var(--line);
}

.problem-item:last-child{
  border-right:none;
}

.problem-item img{
  width:74px;
  flex:0 0 74px;
}

.problem-item h3{
  margin:4px 0 12px;
  font-family:var(--serif);
  font-size:20px;
}

.problem-item p{
  margin:0;
  font-size:13px;
  line-height:1.9;
}

.comparison{
  display:grid;
  grid-template-columns:1fr 70px 1fr;
  align-items:center;
  gap:24px;
  max-width:1050px;
  margin:0 auto;
}

.comparison-card{
  padding:18px;
  border:1px solid rgba(6,27,61,.16);
  border-radius:18px;
}

.comparison-photo{
  position:relative;
  overflow:hidden;
  border-radius:14px;
}

.comparison-photo img{
  width:100%;
  aspect-ratio:1.55 / 1;
  object-fit:cover;
}

.comparison-label{
  position:absolute;
  top:12px;
  left:12px;
  z-index:1;
  padding:6px 15px;
  border-radius:999px;
  color:#fff;
  background:#26324a;
  font-size:15px;
  font-weight:700;
}

.after-card .comparison-label{
  background:#086df3;
}

.comparison-card ul{
  padding:0;
  margin:18px 0 0;
  list-style:none;
}

.comparison-card li{
  position:relative;
  margin-top:13px;
  padding-left:38px;
  font-size:17px;
  line-height:1.7;
}

.comparison-card li::before{
  content:"×";
  position:absolute;
  top:1px;
  left:0;
  width:26px;
  height:26px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:#fff;
  background:#526078;
  font-weight:700;
}

.after-card li::before{
  content:"✓";
  background:#086df3;
}

.comparison-arrow{
  color:#000000;
  font-size:64px;
  font-weight:700;
  text-align:center;
}

.formx-numbers{
  position:relative;
}

.formx-numbers__grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
  max-width:1220px;
  margin:38px auto 0;
}

.formx-number-card{
  min-width:0;
  padding:28px 28px 24px;
  border:1px solid rgba(6,27,61,.13);
  border-radius:18px;
  background:rgba(255,255,255,.82);
}

.formx-number-card__head{
  text-align:center;
}

.formx-number-card__eyebrow{
  display:block;
  margin-bottom:10px;
  color:var(--navy);
  font-size:14px;
  font-weight:700;
  letter-spacing:.03em;
}

.formx-number-card__value{
  display:block;
  color:var(--blue);
  font-family:var(--serif);
  font-size:54px;
  font-weight:600;
  line-height:1.1;
  letter-spacing:-.03em;
}

.formx-number-card__value small{
  margin-left:4px;
  color:var(--navy);
  font-family:var(--sans);
  font-size:18px;
  font-weight:700;
}

.formx-number-card p{
  margin:18px 0 0;
  color:var(--navy);
  font-size:13px;
  line-height:1.9;
  text-align:center;
}

.formx-number-bars{
  height:94px;
  margin:24px 10px 0;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:9px;
  border-bottom:1px solid rgba(6,27,61,.14);
}

.formx-number-bars span{
  width:24px;
  height:var(--bar);
  min-height:18px;
  border-radius:7px 7px 0 0;
  background:linear-gradient(180deg,#47a0ff 0%,#086df3 100%);
  box-shadow:0 8px 18px rgba(8,109,243,.12);
}


.formx-reply-compare{
  position:relative;
  min-height:118px;
  margin-top:14px;
  padding:18px 84px 18px 16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:14px;
  border:1px solid rgba(8,109,243,.14);
  border-radius:14px;
  background:linear-gradient(135deg,rgba(243,248,255,.98),rgba(255,255,255,.98));
}

.formx-reply-compare__row{
  display:grid;
  grid-template-columns:92px 1fr;
  align-items:center;
  gap:12px;
}

.formx-reply-compare__label{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.formx-reply-compare__label span{
  color:#526078;
  font-size:11px;
  font-weight:700;
}

.formx-reply-compare__label strong{
  color:var(--navy);
  font-family:var(--serif);
  font-size:18px;
  line-height:1.1;
}

.formx-reply-compare__row--formx .formx-reply-compare__label span,
.formx-reply-compare__row--formx .formx-reply-compare__label strong{
  color:var(--blue);
}

.formx-reply-compare__track{
  height:14px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(6,27,61,.08);
}

.formx-reply-compare__track span{
  display:block;
  width:var(--reply-width);
  height:100%;
  border-radius:inherit;
  background:#aeb9c8;
}

.formx-reply-compare__row--formx .formx-reply-compare__track span{
  background:linear-gradient(90deg,#49a5ff 0%,#086df3 100%);
  box-shadow:0 4px 12px rgba(8,109,243,.16);
}

.formx-reply-compare__badge{
  position:absolute;
  top:50%;
  right:14px;
  width:58px;
  height:58px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#123f91 0%,#0874ed 100%);
  transform:translateY(-50%);
  box-shadow:0 10px 22px rgba(8,109,243,.20);
}

.formx-reply-compare__badge strong{
  font-family:var(--serif);
  font-size:18px;
  line-height:1;
}

.formx-reply-compare__badge span{
  margin-top:3px;
  font-size:9px;
  font-weight:700;
}


.formx-number-flow{
  min-height:118px;
  margin-top:14px;
  padding:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
  border-radius:14px;
  background:linear-gradient(135deg,rgba(243,248,255,.96),rgba(255,255,255,.96));
}

.formx-number-flow span,
.formx-number-flow strong{
  color:var(--navy);
  font-family:var(--serif);
  font-size:20px;
  font-weight:600;
}

.formx-number-flow strong{
  color:var(--blue);
}

.formx-number-flow b{
  color:rgba(6,27,61,.45);
  font-size:18px;
}

.formx-numbers__note{
  max-width:1220px;
  margin:14px auto 0;
  color:#526078;
  font-size:11px;
  line-height:1.7;
  text-align:right;
}

.feature-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
}

.feature-item{
  padding:16px 20px 28px;
  border-right:1px solid var(--line);
  text-align:center;
}

.feature-item:last-child{
  border-right:none;
}

.feature-item img{
  width:76px;
  margin:0 auto 16px;
}

.feature-item h3{
  margin:0 0 10px;
  font-family:var(--serif);
  font-size:19px;
}

.feature-item p{
  margin:0;
  font-size:13px;
  line-height:1.8;
}

.step-grid{
  display:grid;
  grid-template-columns:
    minmax(0,1fr) 38px
    minmax(0,1fr) 38px
    minmax(0,1fr) 38px
    minmax(0,1fr);
  align-items:center;
}

.step-item{
  text-align:center;
}

.step-number{
  display:block;
  margin-bottom:10px;
  color:#086df3;
  font-family:var(--serif);
  font-size:28px;
  font-weight:600;
}

.step-item img{
  width:84px;
  margin:0 auto 14px;
}

.step-item h3{
  margin:0 0 10px;
  font-family:var(--serif);
  font-size:19px;
}

.step-item p{
  margin:0;
  font-size:13px;
  line-height:1.8;
}

.step-arrow{
  color:#000000;
  font-size:42px;
  text-align:center;
}

.formx-bottom__grid{
  display:grid;
  grid-template-columns:1.65fr 1fr;
  gap:48px;
}

.case-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}

.case-grid article img{
  width:100%;
  aspect-ratio:1.55 / 1;
  object-fit:cover;
  border-radius:12px;
}

.case-grid h3{
  margin:12px 0 6px;
  font-family:var(--serif);
  font-size:20px;
}

.case-grid p{
  margin:0;
  font-size:18px;
  line-height:1.8;
}

.formx-reasons{
  padding-left:44px;
  border-left:1px solid var(--line);
}

.formx-reasons ul{
  padding:10px;
  margin:0;
  list-style:none;
}

.formx-reasons li{
  position:relative;
  margin-bottom:22px;
  padding-left:48px;
  font-family:var(--serif);
  font-size:17px;
  line-height:1.8;
}

.formx-reasons li::before{
  content:"✓";
  position:absolute;
  top:0;
  left:0;
  width:32px;
  height:32px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:2px solid #086df3;
  border-radius:50%;
  color:#ffffff;
  background-color: #086df3;
  font-weight:700;
}

.formx-cta{
  padding:26px 0 38px;
  background:
    linear-gradient(
      180deg,
      rgba(246,250,255,.76),
      rgba(230,243,255,.94)
    );
}

.formx-cta p{
  margin:0 0 18px;
  font-family:var(--serif);
  font-size:28px;
  text-align:center;
}

.formx-cta a{
  width:min(100%,520px);
  min-height:64px;
  margin:0 auto;
  padding:0 28px;
  display:grid;
  grid-template-columns:40px 1fr 30px;
  align-items:center;
  border-radius:50px;
  color:#fff;
  background:linear-gradient(100deg, #123f91 0%, #0874ed 100%);
  text-decoration:none;
  box-shadow:0 12px 28px rgba(6,75,190,.22);
}

.formx-cta a strong{
  font-family:var(--serif);
  font-size:24px;
  font-weight:500;
  text-align:center;
}

.formx-cta a span:last-child{
  font-size:30px;
}

@media screen and (max-width:1036px){

  .formx-page{
    padding-top:72px;
  }

  .formx-inner{
    padding-right:18px;
    padding-left:18px;
  }

  .section-space{
    padding-top:10px;
    padding-bottom:42px;
  }

  .formx-title{
    margin-bottom:36px;
    font-size:24px;
  }

  .formx-hero{
    min-height:auto;
  }

  .formx-hero__inner{
    min-height:auto;
    padding-top:30px;
    padding-bottom:36px;
    display:flex;
    flex-direction:column;
  }

  .formx-hero__content{
    width:100%;
    max-width:700px;
  }

  .formx-kicker{
    font-size:12px;
  }

  .formx-logo-text{
    font-size:64px;
  }

  .formx-hero h1 small{
    font-size:31px;
    line-height:1.55;
  }

  .formx-hero__lead{
    margin-top:22px;
    font-size:14px;
    line-height:1.9;
  }

  .formx-hero__lead br{
    display:none;
  }

  .formx-hero__visual{
    width:100%;
    margin-top:24px;
  }

  .formx-hero__visual img{
    width:100%;
  }

  .problem-list{
    grid-template-columns:1fr;
  }

  .problem-item{
    padding:24px 4px;
    border-right:none;
    border-bottom:1px solid var(--line);
  }

  .problem-item:last-child{
    border-bottom:none;
  }

  .problem-item img{
    width:76px;
    flex-basis:76px;
  }

  .problem-item h3{
    font-size:18px;
  }

  .comparison{
    grid-template-columns:1fr;
    gap:20px;
  }

  .comparison-arrow{
    transform:rotate(90deg);
    font-size:48px;
  }

  .comparison-card li{
    font-size:15px;
  }

  .feature-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .feature-item{
    padding:22px 10px;
    border-right:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }

  .feature-item:nth-child(2n){
    border-right:none;
  }

  .feature-item:nth-last-child(-n+2){
    border-bottom:none;
  }

  .step-grid{
    border:1px solid var(--line);
    grid-template-columns:1fr;
  }

  .step-item{
    padding:5px 16px;
    border-radius:16px;
  }

  .step-arrow{
    transform:rotate(90deg);
    font-size:34px;
  }

  .formx-bottom__grid{
    grid-template-columns:1fr;
    gap:44px;
  }

  .case-grid{
    grid-template-columns:1fr;
  }

  .formx-reasons{
    padding-left:0;
    border-left:none;
  }


  .formx-numbers__grid{
    grid-template-columns:1fr;
    gap:18px;
    max-width:720px;
  }

  .formx-number-card{
    padding:24px 20px;
  }

  .formx-number-card__value{
    font-size:48px;
  }

  .formx-numbers__note{
    max-width:720px;
    text-align:left;
  }

  .formx-cta p{
    font-size:21px;
    line-height:1.7;
  }

  .formx-cta a{
    min-height:58px;
  }

  .formx-cta a strong{
    font-size:19px;
  }
}

@media screen and (min-width:768px) and (max-width:1036px){

  .formx-hero,
  .formx-hero__inner{
    min-height:520px;
  }

  .formx-hero__inner{
    padding-top:30px;
    padding-bottom:30px;
    display:flex;
    flex-direction:row;
    align-items:center;
  }

  .formx-hero__content{
    width:52%;
    max-width:560px;
  }

  .formx-hero__visual{
    display:flex;
    top:50%;
    right:-40px;
    width:57vw;
    height:440px;
    margin:0;
    overflow:visible;
    transform:translateY(-50%);
  }

  .formx-hero__visual img{
    width:100%;
    height:100%;
    max-width:none;
    max-height:440px;
    object-fit:contain;
    object-position:right center;
  }
}

@media screen and (max-width:767px){

  .formx-hero{
    min-height:clamp(42px,8vw,470px);
    background:
      radial-gradient(
        circle at 92% 43%,
        rgba(8,109,243,.13),
        transparent 35%
      ),
      linear-gradient(
        145deg,
        #fff 0%,
        #fff 58%,
        #edf5ff 100%
      );
  }
  .formx-hero::before{
    background:none;
  }

  .formx-hero__inner{
    position:relative;
    display:block;
    padding-top:24px;
    padding-bottom:10px;
  }
  .formx-hero__content{
    position:relative;
    z-index:2;
    width:100%;
    max-width:none;
  }

  .formx-kicker{
    margin-bottom:14px;
    font-size:clamp(10px,2.8vw,12px);
    line-height:1;
    white-space:nowrap;
  }

  .formx-logo-text{
    margin-bottom:20px;
    font-size:clamp(50px,15.5vw,64px);
  }

  .formx-hero h1 small{
    width:84%;
    font-size:clamp(19px,5.7vw,24px);
    line-height:1.62;
    letter-spacing:-.02em;
    white-space:nowrap;
  }

  .formx-hero__lead{
    width:76%;
    max-width:280px;
    margin-top:22px;
    font-size:clamp(10px,2.8vw,12px);
    line-height:1.85;
  }
  .formx-hero__lead br{
    display:block;
  }
  .formx-hero__visual{
    display:block;
    position:absolute;
    top:calc(
      24px +
      clamp(10px,2.8vw,12px) +
      14px
    );
    right:clamp(-105px,-22vw,-70px);
    bottom:auto;
    z-index:1;
    width:clamp(280px,88vw,380px);
    height:clamp(260px,78vw,340px);
    margin:0;
    overflow:hidden;
    background:transparent;
    transform:none;
    pointer-events:none;
  }

  .formx-hero__visual img{
    position:relative;
    z-index:1;
    width:100%;
    height:100%;
    max-width:none;
    max-height:none;
    object-fit:contain;
    object-position:74% center;
  }
  .formx-hero__visual::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    background:linear-gradient(
      90deg,
      #fff 0%,
      rgba(255,255,255,.92) 12%,
      rgba(255,255,255,.38) 28%,
      rgba(255,255,255,0) 48%
    );
    pointer-events:none;
  }
}
html{
  background:#f7fbff;
}

body{
  position:relative;
  isolation:isolate;
  min-height:100vh;
  background:transparent!important;
}

body::before,
body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
}

body::before{
  z-index:-2;
  background-image:url("../img/top/top-page-background-v1.png");
  background-image:image-set(
    url("../img/top/top-page-background-v1.webp") type("image/webp"),
    url("../img/top/top-page-background-v1.png") type("image/png")
  );
  background-position:center center;
  background-size:cover;
  background-repeat:no-repeat;
  opacity:.78;
}

body::after{
  z-index:-1;
  background:linear-gradient(
    180deg,
    rgba(255,255,255,.24) 0%,
    rgba(248,252,255,.34) 52%,
    rgba(255,255,255,.46) 100%
  );
}

@media(max-width:900px){
  body::before{
    background-position:72% center;
    opacity:.73;
  }

  body::after{
    background:linear-gradient(
      180deg,
      rgba(255,255,255,.32) 0%,
      rgba(248,252,255,.42) 52%,
      rgba(255,255,255,.54) 100%
    );
  }
}

@media(max-width:640px){
  body::before{
    background-position:84% center;
    opacity:.69;
  }
}


.formx-page,
.formx-problem,
.formx-before-after,
.formx-features,
.formx-steps,
.formx-bottom{
  background:transparent!important;
}
.problem-item,
.comparison-card,
.feature-item,
.step-item,
.case-grid article,
.formx-reasons{
  background-color:rgba(255,255,255,.76);
}
html,
body{
  min-height:100%;
}

body{
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

body > #header{
  flex:0 0 auto;
}

body > main{
  width:100%;
  flex:1 0 auto;
}

body > #footer{
  position:relative;
  z-index:10;
  width:100%;
  max-width:none!important;
  margin-top:auto;
  margin-right:0!important;
  margin-left:0!important;
  align-self:stretch;
  flex:0 0 auto;
  box-sizing:border-box;
}
body > #footer > *,
body > #footer > footer,
body > #footer > .footer{
  width:100%!important;
  max-width:none!important;
  margin-right:0!important;
  margin-left:0!important;
  box-sizing:border-box;
}
body > #footer .footer-inner,
body > #footer .footer__inner,
body > #footer .footer-container,
body > #footer .footer__container{
  margin-right:auto!important;
  margin-left:auto!important;
}
body > #footer,
body > #footer > *{
  min-width:0;
}
html,
body{
  width:100%;
  min-width:320px;
}

body{
  align-items:stretch;
}
.affiliate-page,
.article-page,
.formx-page,
.other-page,
.dr-growth-page,
.business-ai-page,
.strategy-page,
.page-image-wrap,
.page-image-cta-wrap{
  width:min(100%,1620px);
  max-width:1620px;
  margin-right:auto!important;
  margin-left:0!important;
}
.affiliate-inner,
.article-inner,
.formx-inner,
.formx-container,
.other-inner,
.dr-wide,
.business-ai-container,
.strategy-inner,
.privacy-inner{
  margin-right:auto!important;
  margin-left:0!important;
}
body > main{
  max-width:1620px;
  margin-right:auto;
  margin-left:0;
}
.diagnosis{
  margin-right:auto!important;
  margin-left:0!important;
}
body > #footer{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}

body > #footer .footer{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}

body > #footer .footer-info{
  margin-right:auto!important;
  margin-left:40px!important;
}
@media(max-width:1036px){
  .affiliate-page,
  .article-page,
  .formx-page,
  .other-page,
  .dr-growth-page,
  .business-ai-page,
  .strategy-page,
  .page-image-wrap,
  .page-image-cta-wrap,
  body > main{
    width:100%;
    max-width:none;
    margin-right:0!important;
    margin-left:0!important;
  }

  .affiliate-inner,
  .article-inner,
  .formx-inner,
  .formx-container,
  .other-inner,
  .dr-wide,
  .business-ai-container,
  .strategy-inner,
  .privacy-inner{
    margin-right:auto!important;
    margin-left:auto!important;
  }

  body > #footer .footer-info{
    margin-left:0!important;
  }
}
img[src$=".svg"]{
  image-rendering:auto;
}
@media screen and (max-width:767px){
  .formx-hero,.formx-hero__inner{min-height:clamp(300px,92vw,350px)}
  .formx-hero__inner{padding-bottom:0}
  .formx-problem.section-space{padding-top:0}
}
@media screen and (max-width:767px){
  .formx-kicker{font-size:12px;line-height:1.4;font-weight:600}
  .formx-logo-text{font-size:clamp(42px,12vw,52px);line-height:1.08;font-weight:500}
  .formx-hero h1 small{font-size:clamp(28px,7.5vw,36px);line-height:1.45;font-weight:500}
  .formx-hero__lead{font-size:13px;line-height:1.9;font-weight:500}
}
@media screen and (max-width:767px){
  .formx-numbers__grid{
    margin-top:30px;
  }

  .formx-number-card{
    padding:22px 16px 20px;
  }

  .formx-number-card__eyebrow{
    font-size:13px;
  }

  .formx-number-card__value{
    font-size:42px;
  }

  .formx-number-card__value small{
    font-size:15px;
  }

  .formx-number-card p{
    font-size:12px;
  }

  .formx-number-flow{
    min-height:auto;
    padding:18px 10px;
  }

  .formx-reply-compare{
    min-height:auto;
    padding:18px 14px 82px;
  }

  .formx-reply-compare__row{
    grid-template-columns:78px 1fr;
    gap:10px;
  }

  .formx-reply-compare__badge{
    top:auto;
    right:50%;
    bottom:12px;
    width:58px;
    height:58px;
    transform:translateX(50%);
  }


  .formx-number-flow span,
  .formx-number-flow strong{
    font-size:17px;
  }

  .formx-numbers__note{
    font-size:10px;
    line-height:1.6;
  }
}
@media screen and (min-width:1101px){
  .formx-page{
    width:100%!important;
    max-width:none!important;
  }

  .formx-hero{
    min-height:540px;
    isolation:isolate;
    background:
      radial-gradient(circle at 79% 48%,rgba(63,162,255,.15) 0%,rgba(63,162,255,.07) 22%,rgba(63,162,255,0) 43%),
      linear-gradient(90deg,#fff 0%,#fff 41%,rgba(248,252,255,.97) 58%,rgba(236,247,255,.85) 100%);
  }

  .formx-hero::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    background:
      repeating-linear-gradient(115deg,transparent 0 45px,rgba(8,109,243,.025) 45px 46px),
      linear-gradient(90deg,rgba(255,255,255,1) 0%,rgba(255,255,255,.98) 37%,rgba(255,255,255,.80) 48%,rgba(255,255,255,.12) 66%,rgba(255,255,255,0) 78%);
    -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 66%,transparent 100%);
    mask-image:linear-gradient(90deg,#000 0%,#000 66%,transparent 100%);
    pointer-events:none;
  }

  .formx-hero::after{
    content:"";
    position:absolute;
    top:50%;
    right:clamp(40px,5vw,100px);
    z-index:0;
    width:clamp(500px,38vw,680px);
    aspect-ratio:1;
    border:1px solid rgba(8,109,243,.10);
    border-radius:50%;
    transform:translateY(-50%) rotate(-7deg);
    pointer-events:none;
  }

  .formx-hero__inner{
    min-height:540px;
    padding:42px clamp(54px,4.2vw,80px) 38px;
    display:flex;
    align-items:center;
  }

  .formx-hero__content{
    width:47%;
    max-width:720px;
  }

  .formx-kicker{
    margin-bottom:24px;
    font-size:16px;
    letter-spacing:.03em;
  }

  .formx-logo-text{
    margin-bottom:24px;
    font-size:88px;
  }

  .formx-hero h1 small{
    font-size:40px;
    line-height:1.58;
    letter-spacing:.01em;
  }

  .formx-hero__lead{
    margin-top:24px;
    font-size:16px;
    line-height:1.95;
  }

  .formx-hero__visual{
    position:absolute;
    top:50%;
    right:-4%;
    bottom:auto;
    left:45%;
    z-index:1;
    width:auto;
    height:540px;
    margin:0;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:visible;
    transform:translateY(-50%);
    pointer-events:none;
  }

  .formx-hero__visual::before{
    content:"";
    position:absolute;
    top:50%;
    left:54%;
    z-index:0;
    width:clamp(390px,30vw,540px);
    aspect-ratio:1;
    border:1px solid rgba(8,109,243,.12);
    border-radius:50%;
    background:radial-gradient(circle,rgba(111,195,255,.18) 0%,rgba(111,195,255,.08) 38%,rgba(111,195,255,0) 70%);
    transform:translate(-50%,-50%) rotate(13deg);
    pointer-events:none;
  }

  .formx-hero__visual::after{
    content:"";
    position:absolute;
    top:50%;
    left:54%;
    z-index:0;
    width:clamp(300px,23vw,420px);
    aspect-ratio:1.18;
    border:1px solid rgba(8,109,243,.08);
    border-radius:50%;
    transform:translate(-50%,-50%) rotate(-18deg);
    pointer-events:none;
  }

  .formx-hero__visual img{
    position:relative;
    z-index:1;
    width:clamp(600px,36vw,680px);
    height:auto;
    max-width:none;
    max-height:none;
    object-fit:contain;
    object-position:center;
    background:transparent;
    filter:drop-shadow(0 24px 30px rgba(10,79,170,.10));
    transform:translateX(-2%);
  }
}

@media screen and (min-width:768px) and (max-width:1100px){
  .formx-hero,
  .formx-hero__inner{
    min-height:500px;
  }

  .formx-hero{
    background:
      radial-gradient(circle at 84% 48%,rgba(63,162,255,.14),transparent 39%),
      linear-gradient(90deg,#fff 0%,#fff 44%,#eef7ff 100%);
  }

  .formx-hero::before{
    background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.98) 40%,rgba(255,255,255,.64) 58%,rgba(255,255,255,0) 77%);
  }

  .formx-hero__inner{
    padding:34px 30px 32px;
    display:flex;
    flex-direction:row;
    align-items:center;
  }

  .formx-hero__content{
    width:51%;
    max-width:560px;
  }

  .formx-logo-text{
    font-size:68px;
  }

  .formx-hero h1 small{
    font-size:31px;
  }

  .formx-hero__visual{
    position:absolute;
    top:50%;
    right:-7%;
    left:46%;
    width:auto;
    height:500px;
    margin:0;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:visible;
    transform:translateY(-50%);
  }

  .formx-hero__visual::before{
    content:"";
    position:absolute;
    top:50%;
    left:54%;
    width:430px;
    aspect-ratio:1;
    border:1px solid rgba(8,109,243,.10);
    border-radius:50%;
    background:radial-gradient(circle,rgba(111,195,255,.15),transparent 68%);
    transform:translate(-50%,-50%);
  }

  .formx-hero__visual img{
    width:clamp(500px,58vw,600px);
    height:auto;
    max-width:none;
    max-height:none;
    object-fit:contain;
    object-position:center;
    filter:drop-shadow(0 20px 26px rgba(10,79,170,.09));
    transform:translateX(-2%);
  }

  .formx-hero__lead br{
    display:block;
  }
}

@media screen and (max-width:767px){
  .formx-hero,
  .formx-hero__inner{
    min-height:420px;
  }

  .formx-hero{
    background:
      radial-gradient(circle at 103% 48%,rgba(54,157,255,.18) 0%,rgba(54,157,255,.08) 28%,transparent 54%),
      linear-gradient(145deg,#fff 0%,#fff 59%,#edf6ff 100%);
  }

  .formx-hero::before{
    background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.98) 44%,rgba(255,255,255,.44) 67%,rgba(255,255,255,0) 100%);
    -webkit-mask-image:none;
    mask-image:none;
  }

  .formx-hero__inner{
    min-height:420px;
    padding:24px 18px 18px;
  }

  .formx-hero__content{
    width:100%;
    max-width:none;
  }

  .formx-kicker{
    margin-bottom:14px;
    font-size:12px;
    line-height:1.4;
  }

  .formx-logo-text{
    margin-bottom:17px;
    font-size:clamp(46px,13vw,54px);
  }

  .formx-hero h1 small{
    width:100%;
    font-size:clamp(22px,6.2vw,25px);
    line-height:1.55;
    letter-spacing:-.02em;
    white-space:nowrap;
  }

  .formx-hero__lead{
    position:relative;
    z-index:3;
    width:64%;
    max-width:248px;
    margin-top:18px;
    font-size:12px;
    line-height:1.85;
  }

  .formx-hero__lead br{
    display:block;
  }

  .formx-hero__visual{
    position:absolute;
    top:205px;
    right:clamp(-96px,-22vw,-74px);
    bottom:auto;
    left:auto;
    z-index:1;
    width:clamp(250px,71vw,285px);
    height:clamp(250px,71vw,285px);
    margin:0;
    display:block;
    overflow:visible;
    transform:none;
  }

  .formx-hero__visual::before{
    content:"";
    position:absolute;
    inset:9%;
    z-index:0;
    border:1px solid rgba(8,109,243,.10);
    border-radius:50%;
    background:radial-gradient(circle,rgba(111,195,255,.12),transparent 68%);
    pointer-events:none;
  }

  .formx-hero__visual::after{
    content:none;
  }

  .formx-hero__visual img{
    position:relative;
    z-index:1;
    width:100%;
    height:100%;
    max-width:none;
    max-height:none;
    object-fit:contain;
    object-position:center;
    filter:drop-shadow(0 16px 22px rgba(10,79,170,.08));
  }

  .formx-hero__visual::before{
    background:
      linear-gradient(90deg,#fff 0%,rgba(255,255,255,.98) 18%,rgba(255,255,255,.72) 38%,rgba(255,255,255,.14) 62%,rgba(255,255,255,0) 78%),
      radial-gradient(circle,rgba(111,195,255,.12),transparent 68%);
  }
}
@media screen and (max-width:767px){
  .formx-hero__content{
    position:relative;
    z-index:3;
  }

  .formx-hero__visual{
    top:54px;
    right:0;
    bottom:auto;
    left:auto;
    z-index:1;
    width:clamp(238px,74vw,296px);
    height:auto;
    aspect-ratio:1 / 1;
    overflow:visible;
    transform:none;
  }

  .formx-hero__visual::before,
  .formx-hero__visual::after{
    content:none;
    display:none;
  }

  .formx-hero__visual img{
    width:100%;
    height:100%;
    max-width:none;
    max-height:none;
    object-fit:contain;
    object-position:center;
    opacity:1;
    filter:drop-shadow(0 16px 22px rgba(10,79,170,.08));
    -webkit-mask-image:none;
    mask-image:none;
  }
}

@media screen and (max-width:360px){
  .formx-hero__visual{
    top:56px;
    right:0;
    width:clamp(226px,72vw,248px);
    height:auto;
  }
}
@media screen and (max-width:767px){
  .formx-hero,
  .formx-hero__inner{
    min-height:clamp(310px,90vw,360px);
  }

  .formx-hero__inner{
    padding-bottom:0;
  }

  .formx-problem.section-space{
    padding-top:0;
  }

  .formx-problem .formx-title{
    margin-top:8px;
  }
}

.formx-flow-compare{
  position:relative;
  padding-top:20px;
  padding-bottom:42px;
}

.formx-flow-compare__lead{
  margin:34px auto 26px;
  color:var(--navy);
  font-family:var(--serif);
  font-size:17px;
  line-height:1.8;
  text-align:center;
}

.formx-flow-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 165px;
  gap:26px;
  align-items:stretch;
  max-width:1500px;
  margin:0 auto;
}

.formx-flow-lanes{
  min-width:0;
  display:grid;
  gap:26px;
}

.formx-flow-lane{
  position:relative;
  min-width:0;
  padding:54px 14px 14px;
  border:1px solid rgba(6,27,61,.13);
  border-radius:18px;
  background:rgba(255,255,255,.80);
}

.formx-flow-lane--formx{
  border-color:rgba(8,109,243,.35);
  background:linear-gradient(100deg,rgba(245,250,255,.92),rgba(255,255,255,.86));
}

.formx-flow-lane__label{
  position:absolute;
  top:-1px;
  left:-1px;
  min-width:180px;
  padding:10px 20px;
  border-radius:10px 10px 10px 0;
  color:#fff;
  background:#505a68;
  font-size:17px;
  font-weight:700;
  letter-spacing:.02em;
  text-align:center;
}

.formx-flow-lane--formx .formx-flow-lane__label{
  background:linear-gradient(100deg,#123f91 0%,#0874ed 100%);
}

.formx-flow-lane__steps{
  display:flex;
  align-items:stretch;
  gap:8px;
}

.formx-flow-card{
  position:relative;
  min-width:0;
  min-height:220px;
  flex:1 1 0;
  padding:18px 10px 14px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  border:1px solid rgba(6,27,61,.18);
  border-radius:14px;
  background:rgba(255,255,255,.94);
  text-align:center;
}

.formx-flow-lane--formx .formx-flow-card{
  border-color:rgba(8,109,243,.38);
}

.formx-flow-card--human{
  flex:1.45 1 0;
  justify-content:center;
  background:rgba(245,247,250,.94);
}

.formx-flow-card__number{
  position:absolute;
  top:11px;
  left:11px;
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:#fff;
  background:#606a78;
  font-size:13px;
  font-weight:700;
}

.formx-flow-lane--formx .formx-flow-card__number{
  background:var(--blue);
}

.formx-flow-card img{
  width:66px;
  height:66px;
  margin:10px auto 11px;
  object-fit:contain;
}

.formx-flow-card h3{
  margin:0 0 8px;
  color:var(--navy);
  font-family:var(--serif);
  font-size:16px;
  line-height:1.45;
}

.formx-flow-card p{
  margin:0;
  color:#26324a;
  font-size:11px;
  line-height:1.7;
}

.formx-flow-card ul{
  padding:0;
  margin:6px 0 0;
  list-style:none;
  color:#26324a;
  font-size:11px;
  line-height:1.8;
  text-align:left;
}

.formx-flow-card ul li::before{
  content:"・";
}

.formx-flow-arrow{
  align-self:center;
  flex:0 0 24px;
  color:#7d8794;
  font-size:28px;
  font-weight:700;
  line-height:1;
  text-align:center;
}

.formx-flow-lane--formx .formx-flow-arrow{
  color:var(--blue);
}

.formx-flow-meeting{
  position:relative;
  min-width:0;
  padding:24px 14px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(6,27,61,.24);
  border-radius:18px;
  background:rgba(255,255,255,.90);
  text-align:center;
}

.formx-flow-meeting::before,
.formx-flow-meeting::after{
  content:"";
  position:absolute;
  left:-27px;
  width:27px;
  height:2px;
  background:rgba(6,27,61,.28);
}

.formx-flow-meeting::before{
  top:29%;
}

.formx-flow-meeting::after{
  top:71%;
  background:rgba(8,109,243,.55);
}

.formx-flow-meeting h3{
  margin:0 0 22px;
  color:var(--navy);
  font-family:var(--serif);
  font-size:25px;
}

.formx-flow-meeting img{
  width:82px;
  height:82px;
  margin-bottom:20px;
  object-fit:contain;
}

.formx-flow-meeting p{
  margin:0;
  color:var(--navy);
  font-size:13px;
  line-height:1.8;
  font-weight:700;
}

.formx-flow-compare__point{
  max-width:1500px;
  margin:24px auto 0;
  padding:14px 22px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  border:1px solid rgba(8,109,243,.28);
  border-radius:16px;
  color:var(--blue);
  background:rgba(255,255,255,.86);
  font-family:var(--serif);
  font-size:17px;
  line-height:1.8;
  text-align:center;
}

.formx-flow-compare__bulb{
  flex:0 0 auto;
  font-size:24px;
}

@media screen and (max-width:1280px){
  .formx-flow-layout{
    grid-template-columns:minmax(0,1fr) 140px;
    gap:20px;
  }

  .formx-flow-lane__steps{
    gap:5px;
  }

  .formx-flow-card{
    min-height:205px;
    padding-right:7px;
    padding-left:7px;
  }

  .formx-flow-card img{
    width:56px;
    height:56px;
  }

  .formx-flow-card h3{
    font-size:14px;
  }

  .formx-flow-card p,
  .formx-flow-card ul{
    font-size:10px;
  }

  .formx-flow-arrow{
    flex-basis:18px;
    font-size:23px;
  }
}

@media screen and (max-width:1036px){
  .formx-flow-compare{
    padding-top:10px;
    padding-bottom:42px;
  }

  .formx-flow-compare__lead{
    margin-top:28px;
    font-size:14px;
  }

  .formx-flow-layout{
    grid-template-columns:1fr;
    gap:18px;
    max-width:720px;
  }

  .formx-flow-lane{
    padding:54px 14px 16px;
  }

  .formx-flow-lane__steps{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
  }

  .formx-flow-card{
    min-height:auto;
    padding:17px 14px;
  }

  .formx-flow-card--human{
    min-height:auto;
  }

  .formx-flow-card img{
    width:60px;
    height:60px;
    margin-top:4px;
  }

  .formx-flow-card h3{
    font-size:16px;
  }

  .formx-flow-card p,
  .formx-flow-card ul{
    font-size:12px;
  }

  .formx-flow-arrow{
    width:100%;
    transform:rotate(90deg);
    font-size:24px;
  }

  .formx-flow-meeting{
    padding:22px 18px;
  }

  .formx-flow-meeting::before,
  .formx-flow-meeting::after{
    display:none;
  }

  .formx-flow-meeting img{
    width:70px;
    height:70px;
  }

  .formx-flow-compare__point{
    padding:13px 16px;
    font-size:14px;
  }
}

@media screen and (max-width:767px){
  .formx-flow-compare__lead{
    margin-bottom:20px;
    font-size:13px;
    text-align:left;
  }

  .formx-flow-lane__label{
    min-width:160px;
    font-size:14px;
  }

  .formx-flow-meeting h3{
    font-size:22px;
  }

  .formx-flow-meeting p{
    font-size:12px;
  }

  .formx-flow-compare__point{
    align-items:flex-start;
    font-size:13px;
    text-align:left;
  }
}

.formx-response{
  position:relative;
  padding-top:18px;
  padding-bottom:44px;
}

.formx-response__lead{
  margin:34px 0 26px;
  color:var(--navy);
  font-family:var(--serif);
  font-size:18px;
  line-height:1.8;
  text-align:center;
}

.formx-response__grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:30px;
  max-width:1450px;
  margin:0 auto;
  align-items:stretch;
}

.formx-response-chart{
  position:relative;
  min-width:0;
  padding:30px 32px 28px;
  border:1px solid rgba(6,27,61,.13);
  border-radius:20px;
  background:rgba(255,255,255,.88);
}

.formx-response-chart__label{
  display:inline-block;
  margin-bottom:26px;
  padding:9px 18px;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(100deg,#123f91 0%,#0874ed 100%);
  font-size:15px;
  font-weight:700;
}

.formx-response-chart__body{
  position:relative;
  padding-right:138px;
}

.formx-response-rate{
  display:grid;
  grid-template-columns:185px minmax(0,1fr);
  align-items:end;
  gap:20px;
  margin-bottom:30px;
}

.formx-response-rate__text span{
  display:block;
  margin-bottom:8px;
  color:#526078;
  font-size:17px;
  font-weight:700;
}

.formx-response-rate__text strong{
  display:block;
  color:#53606f;
  font-family:var(--serif);
  font-size:68px;
  font-weight:500;
  line-height:1;
  letter-spacing:-.04em;
}

.formx-response-rate--formx .formx-response-rate__text span,
.formx-response-rate--formx .formx-response-rate__text strong{
  color:var(--blue);
}

.formx-response-rate__text small{
  margin-left:4px;
  font-family:var(--sans);
  font-size:24px;
  font-weight:700;
}

.formx-response-rate__bar-wrap{
  padding-bottom:8px;
}

.formx-response-rate__bar{
  position:relative;
  height:34px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(6,27,61,.08);
}

.formx-response-rate__bar span{
  display:block;
  width:var(--rate-width);
  height:100%;
  min-width:18px;
  border-radius:inherit;
  background:#aeb9c8;
}

.formx-response-rate--formx .formx-response-rate__bar span{
  background:linear-gradient(90deg,#086df3 0%,#28a8ff 100%);
  box-shadow:0 6px 16px rgba(8,109,243,.16);
}

.formx-response-axis{
  margin-left:205px;
  display:grid;
  grid-template-columns:repeat(6,1fr);
  color:#526078;
  font-size:11px;
}

.formx-response-axis span{
  position:relative;
  text-align:center;
}

.formx-response-axis span::before{
  content:"";
  position:absolute;
  top:-170px;
  left:50%;
  width:1px;
  height:155px;
  background:rgba(6,27,61,.08);
}

.formx-response-multiplier{
  position:absolute;
  top:50%;
  right:4px;
  width:122px;
  height:122px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#123f91 0%,#0874ed 100%);
  transform:translateY(-50%);
  box-shadow:0 14px 30px rgba(8,109,243,.18);
  text-align:center;
}

.formx-response-multiplier small{
  font-size:11px;
  font-weight:700;
}

.formx-response-multiplier strong{
  margin:4px 0 2px;
  font-family:var(--serif);
  font-size:27px;
  line-height:1;
}

.formx-response-multiplier span{
  font-size:17px;
  font-weight:700;
}

.formx-response-strength{
  min-width:0;
  display:grid;
  gap:18px;
}

.formx-response-strength__copy{
  padding:20px 4px 8px;
}

.formx-response-strength__copy h3{
  margin:0 0 15px;
  color:var(--navy);
  font-family:var(--serif);
  font-size:25px;
  line-height:1.5;
}

.formx-response-strength__copy p{
  margin:0;
  color:var(--navy);
  font-size:15px;
  line-height:2;
}

.formx-response-strength__copy strong{
  color:var(--blue);
}

.formx-response-process{
  padding:22px 18px 20px;
  border:1px solid rgba(8,109,243,.18);
  border-radius:16px;
  background:rgba(247,251,255,.82);
}

.formx-response-process h3{
  margin:0 0 18px;
  color:var(--blue);
  font-size:15px;
  text-align:center;
}

.formx-response-process__steps{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
}

.formx-response-process__steps div{
  min-width:0;
  flex:1 1 0;
  text-align:center;
}

.formx-response-process__steps img{
  width:52px;
  height:52px;
  margin:0 auto 8px;
  object-fit:contain;
}

.formx-response-process__steps span{
  display:block;
  color:var(--navy);
  font-size:10px;
  line-height:1.55;
  font-weight:700;
}

.formx-response-process__steps b{
  flex:0 0 auto;
  color:var(--blue);
  font-size:18px;
}

.formx-response-quality{
  padding:16px 18px;
  display:flex;
  align-items:center;
  gap:16px;
  border:1px solid rgba(8,109,243,.18);
  border-radius:16px;
  background:rgba(255,255,255,.86);
}

.formx-response-quality__icon{
  width:54px;
  height:54px;
  flex:0 0 54px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#123f91 0%,#0874ed 100%);
  font-size:27px;
  font-weight:700;
}

.formx-response-quality p{
  margin:0;
  color:var(--navy);
  font-size:13px;
  line-height:1.8;
}

.formx-response-quality strong{
  color:var(--blue);
}

.formx-response-conclusion{
  max-width:1450px;
  margin:24px auto 0;
  padding:18px 26px;
  display:flex;
  align-items:center;
  gap:20px;
  border:1px solid rgba(8,109,243,.20);
  border-radius:17px;
  background:rgba(255,255,255,.86);
}

.formx-response-conclusion__icon{
  width:58px;
  height:58px;
  flex:0 0 58px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#123f91 0%,#0874ed 100%);
  font-size:24px;
}

.formx-response-conclusion p{
  margin:0;
  color:var(--navy);
  font-family:var(--serif);
  font-size:17px;
  line-height:1.85;
}

.formx-response-conclusion strong{
  color:var(--blue);
  font-size:21px;
}

@media screen and (max-width:1100px){
  .formx-response__grid{
    grid-template-columns:1fr;
    max-width:820px;
  }

  .formx-response-chart__body{
    padding-right:128px;
  }

  .formx-response-strength,
  .formx-response-conclusion{
    max-width:820px;
  }
}

@media screen and (max-width:767px){
  .formx-response{
    padding-top:8px;
    padding-bottom:42px;
  }

  .formx-response__lead{
    margin:28px 0 20px;
    font-size:14px;
    text-align:left;
  }

  .formx-response-chart{
    padding:22px 14px 20px;
  }

  .formx-response-chart__label{
    margin-bottom:22px;
    font-size:12px;
  }

  .formx-response-chart__body{
    padding-right:0;
  }

  .formx-response-rate{
    grid-template-columns:1fr;
    gap:10px;
    margin-bottom:24px;
  }

  .formx-response-rate__text span{
    font-size:14px;
  }

  .formx-response-rate__text strong{
    font-size:48px;
  }

  .formx-response-rate__text small{
    font-size:18px;
  }

  .formx-response-rate__bar{
    height:24px;
  }

  .formx-response-axis{
    margin-left:0;
    font-size:9px;
  }

  .formx-response-axis span::before{
    top:-125px;
    height:112px;
  }

  .formx-response-multiplier{
    position:relative;
    top:auto;
    right:auto;
    width:auto;
    height:auto;
    margin:22px 0 0;
    padding:12px 18px;
    flex-direction:row;
    gap:6px;
    border-radius:999px;
    transform:none;
  }

  .formx-response-multiplier strong{
    font-size:22px;
  }

  .formx-response-multiplier span{
    font-size:14px;
  }

  .formx-response-strength__copy{
    padding:4px 0;
  }

  .formx-response-strength__copy h3{
    font-size:20px;
  }

  .formx-response-strength__copy p{
    font-size:13px;
  }

  .formx-response-process{
    padding:18px 12px;
  }

  .formx-response-process__steps{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
  }

  .formx-response-process__steps b{
    transform:rotate(90deg);
  }

  .formx-response-process__steps img{
    width:56px;
    height:56px;
  }

  .formx-response-process__steps span{
    font-size:12px;
  }

  .formx-response-quality{
    align-items:flex-start;
  }

  .formx-response-quality p{
    font-size:12px;
  }

  .formx-response-conclusion{
    padding:16px;
    align-items:flex-start;
    gap:12px;
  }

  .formx-response-conclusion__icon{
    width:44px;
    height:44px;
    flex-basis:44px;
    font-size:18px;
  }

  .formx-response-conclusion p{
    font-size:13px;
  }

  .formx-response-conclusion strong{
    font-size:16px;
  }
}

.formx-capabilities{
  position:relative;
  padding-top:18px;
  padding-bottom:44px;
}

.formx-capabilities__lead{
  margin:34px auto 26px;
  color:var(--navy);
  font-family:var(--serif);
  font-size:18px;
  line-height:1.8;
  text-align:center;
}

.formx-capabilities__panel{
  max-width:1500px;
  margin:0 auto;
  padding:20px 18px 18px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px 18px;
  border:1px solid rgba(8,109,243,.14);
  border-radius:20px;
  background:rgba(255,255,255,.86);
}

.formx-capabilities__phase{
  padding:9px 16px;
  border-radius:10px;
  font-family:var(--serif);
  font-size:17px;
  font-weight:700;
  text-align:center;
}

.formx-capabilities__phase--prepare{
  color:#0b4fa7;
  background:linear-gradient(90deg,rgba(225,239,255,.95),rgba(239,247,255,.95));
}

.formx-capabilities__phase--sales{
  color:#fff;
  background:linear-gradient(100deg,#123f91 0%,#0874ed 100%);
}

.formx-capabilities__steps{
  grid-column:1 / -1;
  display:flex;
  align-items:stretch;
  gap:8px;
}

.formx-capability-card{
  position:relative;
  min-width:0;
  min-height:300px;
  flex:1 1 0;
  padding:18px 12px 16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  border:1px solid rgba(8,109,243,.18);
  border-radius:16px;
  background:rgba(255,255,255,.94);
  text-align:center;
}

.formx-capability-card--sales{
  border-color:rgba(8,109,243,.34);
}

.formx-capability-card__number{
  position:absolute;
  top:12px;
  left:12px;
  width:30px;
  height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:#fff;
  background:#176ee9;
  font-size:14px;
  font-weight:700;
}

.formx-capability-card img{
  width:74px;
  height:74px;
  margin:16px auto 14px;
  object-fit:contain;
}

.formx-capability-card h3{
  margin:0 0 14px;
  color:var(--navy);
  font-family:var(--serif);
  font-size:16px;
  line-height:1.45;
}

.formx-capability-card p{
  margin:auto 0 0;
  color:#26324a;
  font-size:11px;
  line-height:1.8;
}

.formx-capabilities__arrow{
  align-self:center;
  flex:0 0 20px;
  color:#176ee9;
  font-size:26px;
  font-weight:700;
  text-align:center;
}

.formx-capabilities__arrow--phase{
  color:#086df3;
}

.formx-capabilities__arrow--goal{
  color:#086df3;
}

.formx-capabilities__goal{
  position:relative;
  min-width:145px;
  flex:0 0 145px;
  padding:22px 12px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(8,109,243,.25);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(247,251,255,.96),rgba(255,255,255,.96));
  text-align:center;
}

.formx-capabilities__goal-check{
  position:absolute;
  top:16px;
  right:16px;
  width:36px;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:2px solid #086df3;
  border-radius:50%;
  color:#086df3;
  background:#fff;
  font-size:22px;
  font-weight:700;
}

.formx-capabilities__goal img{
  width:76px;
  height:76px;
  margin:10px auto 10px;
  object-fit:contain;
}

.formx-capabilities__goal strong{
  color:var(--blue);
  font-family:var(--serif);
  font-size:24px;
}

.formx-capabilities__goal p{
  margin:14px 0 0;
  color:var(--navy);
  font-size:11px;
  line-height:1.7;
  font-weight:700;
}

.formx-capabilities__message{
  max-width:1500px;
  margin:22px auto 0;
  padding:16px 22px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  border:1px solid rgba(8,109,243,.22);
  border-radius:16px;
  background:rgba(255,255,255,.88);
}

.formx-capabilities__message-icon{
  width:52px;
  height:52px;
  flex:0 0 52px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:linear-gradient(145deg,#123f91 0%,#0874ed 100%);
  font-size:24px;
}

.formx-capabilities__message p{
  margin:0;
  color:var(--navy);
  font-family:var(--serif);
  font-size:17px;
  line-height:1.8;
}

.formx-capabilities__message strong{
  color:var(--blue);
  font-size:21px;
}

@media screen and (max-width:1250px){
  .formx-capability-card{
    min-height:280px;
    padding-right:8px;
    padding-left:8px;
  }

  .formx-capability-card img{
    width:62px;
    height:62px;
  }

  .formx-capability-card h3{
    font-size:14px;
  }

  .formx-capability-card p{
    font-size:10px;
  }

  .formx-capabilities__arrow{
    flex-basis:14px;
    font-size:21px;
  }

  .formx-capabilities__goal{
    min-width:120px;
    flex-basis:120px;
  }
}

@media screen and (max-width:1036px){
  .formx-capabilities{
    padding-top:10px;
    padding-bottom:42px;
  }

  .formx-capabilities__lead{
    margin-top:28px;
    font-size:14px;
  }

  .formx-capabilities__panel{
    max-width:720px;
    grid-template-columns:1fr;
    gap:10px;
  }

  .formx-capabilities__phase{
    display:none;
  }

  .formx-capabilities__steps{
    grid-column:auto;
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
  }

  .formx-capability-card{
    min-height:auto;
    padding:18px 14px;
  }

  .formx-capability-card img{
    width:64px;
    height:64px;
    margin-top:8px;
  }

  .formx-capability-card h3{
    font-size:17px;
  }

  .formx-capability-card p{
    margin-top:0;
    font-size:12px;
  }

  .formx-capabilities__arrow{
    width:100%;
    transform:rotate(90deg);
    font-size:24px;
  }

  .formx-capabilities__goal{
    min-width:0;
    width:100%;
    min-height:auto;
    padding:22px 18px;
  }

  .formx-capabilities__goal img{
    width:68px;
    height:68px;
  }

  .formx-capabilities__message{
    max-width:720px;
  }
}

@media screen and (max-width:767px){
  .formx-capabilities__lead{
    margin-bottom:20px;
    font-size:13px;
    text-align:left;
  }

  .formx-capabilities__panel{
    padding:14px 12px;
  }

  .formx-capability-card h3{
    font-size:16px;
  }

  .formx-capability-card p{
    font-size:11px;
  }

  .formx-capabilities__message{
    align-items:flex-start;
    padding:14px;
    gap:12px;
  }

  .formx-capabilities__message-icon{
    width:44px;
    height:44px;
    flex-basis:44px;
    font-size:20px;
  }

  .formx-capabilities__message p{
    font-size:13px;
  }

  .formx-capabilities__message strong{
    font-size:16px;
  }
}

.formx-steps__lead{
  max-width:980px;
  margin:34px auto 26px;
  color:var(--navy);
  font-family:var(--serif);
  font-size:17px;
  line-height:1.8;
  text-align:center;
}

.formx-steps .step-grid{
  max-width:1320px;
  margin:0 auto;
  grid-template-columns:
    minmax(0,1fr) 42px
    minmax(0,1fr) 42px
    minmax(0,1fr) 42px
    minmax(0,1fr);
  gap:0;
  align-items:stretch;
}

.formx-steps .step-item{
  min-width:0;
  min-height:300px;
  padding:24px 18px 22px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  border:1px solid rgba(8,109,243,.18);
  border-radius:18px;
  background:rgba(255,255,255,.84);
}

.formx-steps .step-number{
  margin-bottom:14px;
  color:var(--blue);
  font-family:var(--sans);
  font-size:15px;
  font-weight:800;
  letter-spacing:.04em;
}

.formx-steps .step-item img{
  width:82px;
  height:82px;
  margin:0 auto 16px;
  object-fit:contain;
}

.formx-steps .step-item h3{
  margin:0 0 14px;
  color:var(--navy);
  font-family:var(--serif);
  font-size:20px;
  line-height:1.5;
}

.formx-steps .step-item p{
  margin:auto 0 0;
  color:#26324a;
  font-size:13px;
  line-height:1.85;
  text-align:center;
}

.formx-steps .step-arrow{
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--blue);
  font-size:36px;
  font-weight:700;
}

.formx-steps__point{
  max-width:1320px;
  margin:22px auto 0;
  padding:16px 20px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  border:1px solid rgba(8,109,243,.18);
  border-radius:14px;
  background:rgba(247,251,255,.86);
  text-align:center;
}

.formx-steps__point strong{
  color:var(--blue);
  font-family:var(--serif);
  font-size:18px;
  line-height:1.7;
}

.formx-steps__point span{
  color:var(--navy);
  font-size:13px;
  line-height:1.8;
}

@media screen and (max-width:1036px){
  .formx-steps__lead{
    margin-top:28px;
    font-size:14px;
  }

  .formx-steps .step-grid{
    max-width:720px;
    grid-template-columns:1fr;
    gap:10px;
    border:none;
  }

  .formx-steps .step-item{
    min-height:auto;
    padding:20px 16px;
  }

  .formx-steps .step-arrow{
    transform:rotate(90deg);
    font-size:28px;
  }

  .formx-steps .step-item p{
    margin-top:0;
    font-size:12px;
  }

  .formx-steps__point{
    max-width:720px;
  }
}

@media screen and (max-width:767px){
  .formx-steps__lead{
    margin-bottom:20px;
    font-size:13px;
    text-align:left;
  }

  .formx-steps .step-item h3{
    font-size:18px;
  }

  .formx-steps .step-item p{
    font-size:11px;
  }

  .formx-steps__point{
    align-items:flex-start;
    padding:14px;
    text-align:left;
  }

  .formx-steps__point strong{
    font-size:15px;
  }

  .formx-steps__point span{
    font-size:12px;
  }
}

.formx-reasons{
  padding-left:44px;
  border-left:1px solid var(--line);
}

.formx-reasons__list{
  padding:8px 0 0;
  margin:0;
  list-style:none;
}

.formx-reasons__item{
  position:relative;
  margin-bottom:28px;
  padding-left:58px;
}

.formx-reasons__item::before{
  content:"✓";
  position:absolute;
  top:2px;
  left:0;
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#123f91 0%,#0874ed 100%);
  font-size:21px;
  font-weight:700;
  box-shadow:0 8px 18px rgba(8,109,243,.14);
}

.formx-reasons__content h3{
  margin:0 0 8px;
  color:var(--blue);
  font-family:var(--serif);
  font-size:20px;
  line-height:1.55;
}

.formx-reasons__content p{
  margin:0;
  color:var(--navy);
  font-size:14px;
  line-height:1.9;
}

@media screen and (max-width:1036px){
  .formx-reasons{
    padding-left:0;
    border-left:none;
  }

  .formx-reasons__item{
    margin-bottom:24px;
    padding-left:54px;
  }

  .formx-reasons__item::before{
    width:40px;
    height:40px;
    font-size:20px;
  }

  .formx-reasons__content h3{
    font-size:18px;
  }

  .formx-reasons__content p{
    font-size:13px;
  }
}

@media screen and (max-width:767px){
  .formx-reasons__item{
    margin-bottom:22px;
    padding-left:50px;
  }

  .formx-reasons__item::before{
    width:36px;
    height:36px;
    font-size:18px;
  }

  .formx-reasons__content h3{
    font-size:16px;
  }

  .formx-reasons__content p{
    font-size:12px;
    line-height:1.8;
  }
}

.formx-cta--final{
  padding:52px 0 54px;
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.78) 0%,
      rgba(244,250,255,.88) 44%,
      rgba(229,242,255,.96) 100%
    );
}

.formx-cta--final .formx-cta__message{
  max-width:1050px;
  margin:0 auto 28px;
  text-align:center;
}

.formx-cta--final .formx-cta__message h2{
  position:relative;
  margin:0 0 34px;
  color:var(--navy);
  font-family:var(--serif);
  font-size:clamp(34px,3.2vw,54px);
  font-weight:500;
  line-height:1.45;
  letter-spacing:.04em;
}

.formx-cta--final .formx-cta__message h2::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-14px;
  width:72px;
  height:4px;
  border-radius:999px;
  background:var(--blue);
  transform:translateX(-50%);
}

.formx-cta--final .formx-cta__message p{
  margin:0;
  color:var(--navy);
  font-family:var(--serif);
  font-size:18px;
  line-height:2;
  text-align:center;
}

.formx-cta--final > .formx-inner > a{
  width:min(100%,650px);
  min-height:80px;
  margin:0 auto;
  padding:0 34px;
  display:grid;
  grid-template-columns:42px 1fr 36px;
  align-items:center;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(100deg,#123f91 0%,#0874ed 100%);
  text-decoration:none;
  box-shadow:0 14px 30px rgba(6,75,190,.22);
  transition:transform .2s ease, box-shadow .2s ease;
}

.formx-cta--final > .formx-inner > a:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 34px rgba(6,75,190,.28);
}

.formx-cta--final > .formx-inner > a strong{
  font-family:var(--serif);
  font-size:28px;
  font-weight:500;
  text-align:center;
}

.formx-cta--final > .formx-inner > a span:last-child{
  font-size:34px;
}

@media screen and (max-width:767px){
  .formx-cta--final{
    padding:38px 0 42px;
  }

  .formx-cta--final .formx-cta__message{
    margin-bottom:24px;
  }

  .formx-cta--final .formx-cta__message h2{
    margin-bottom:30px;
    font-size:clamp(27px,8vw,34px);
  }

  .formx-cta--final .formx-cta__message h2::after{
    width:54px;
    height:3px;
  }

  .formx-cta--final .formx-cta__message p{
    font-size:13px;
    line-height:1.9;
  }

  .formx-cta--final .formx-cta__message p br{
    display:none;
  }

  .formx-cta--final > .formx-inner > a{
    min-height:62px;
    padding:0 22px;
    grid-template-columns:28px 1fr 26px;
  }

  .formx-cta--final > .formx-inner > a strong{
    font-size:20px;
  }

  .formx-cta--final > .formx-inner > a span:last-child{
    font-size:28px;
  }
}

.comparison--sidecopy{
  max-width:1320px;
  grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr);
  align-items:center;
}

.comparison--sidecopy .comparison-card{
  padding:22px;
}

.comparison-card__head{
  margin-bottom:18px;
  display:flex;
  align-items:center;
  gap:18px;
}

.comparison-label--inline{
  position:static;
  flex:0 0 auto;
}

.comparison-card__head h3{
  margin:0;
  color:var(--navy);
  font-family:var(--serif);
  font-size:22px;
  line-height:1.45;
}

.after-card .comparison-card__head h3{
  color:var(--blue);
}

.comparison-card__body{
  display:grid;
  grid-template-columns:minmax(0, .92fr) minmax(0, 1.08fr);
  gap:24px;
  align-items:center;
}

.comparison-photo--side{
  border-radius:14px;
}

.comparison-photo--side img{
  width:100%;
  aspect-ratio:.95 / 1;
  object-fit:cover;
}

.comparison-card__copy{
  min-width:0;
}

.comparison-copy__lead{
  margin:0 0 14px;
  color:var(--navy);
  font-family:var(--serif);
  font-size:18px;
  font-weight:700;
  line-height:1.7;
}

.after-card .comparison-copy__lead{
  color:var(--blue);
}

.comparison--sidecopy .comparison-card ul{
  margin:0;
}

.comparison--sidecopy .comparison-card li{
  margin-top:12px;
  font-size:15px;
  line-height:1.7;
}

@media screen and (max-width:1100px){
  .comparison--sidecopy{
    max-width:920px;
  }

  .comparison-card__body{
    grid-template-columns:1fr;
    gap:18px;
  }

  .comparison-photo--side img{
    aspect-ratio:1.55 / 1;
  }
}

@media screen and (max-width:1036px){
  .comparison--sidecopy{
    grid-template-columns:1fr;
    gap:20px;
  }

  .comparison-card__head h3{
    font-size:20px;
  }

  .comparison-copy__lead{
    font-size:16px;
  }

  .comparison--sidecopy .comparison-card li{
    font-size:14px;
  }
}

@media screen and (max-width:767px){
  .comparison--sidecopy .comparison-card{
    padding:16px;
  }

  .comparison-card__head{
    gap:12px;
    margin-bottom:14px;
  }

  .comparison-card__head h3{
    font-size:17px;
  }

  .comparison-copy__lead{
    font-size:14px;
  }

  .comparison--sidecopy .comparison-card li{
    padding-left:34px;
    font-size:12px;
  }
}

@media screen and (min-width:1037px){

  .formx-flow-lane__steps{
    display:grid;
    grid-template-columns:
      minmax(0,1fr) 24px
      minmax(0,1fr) 24px
      minmax(0,1fr) 24px
      minmax(0,1fr) 24px
      minmax(0,1fr) 24px
      minmax(0,1fr);
    gap:0;
    align-items:stretch;
  }

  .formx-flow-lane--normal .formx-flow-lane__steps > :nth-child(1){ grid-column:1; }
  .formx-flow-lane--normal .formx-flow-lane__steps > :nth-child(2){ grid-column:2; }
  .formx-flow-lane--normal .formx-flow-lane__steps > :nth-child(3){ grid-column:3; }
  .formx-flow-lane--normal .formx-flow-lane__steps > :nth-child(4){ grid-column:4; }
  .formx-flow-lane--normal .formx-flow-lane__steps > :nth-child(5){ grid-column:5; }
  .formx-flow-lane--normal .formx-flow-lane__steps > :nth-child(6){ grid-column:6; }
  .formx-flow-lane--normal .formx-flow-lane__steps > :nth-child(7){ grid-column:7 / 12; }

  .formx-flow-lane--normal{
    padding-top:48px;
    padding-bottom:12px;
  }

  .formx-flow-lane--normal .formx-flow-card{
    min-height:178px;
    padding:14px 10px 12px;
    justify-content:center;
  }

  .formx-flow-lane--normal .formx-flow-card__number{
    top:10px;
    left:10px;
    width:27px;
    height:27px;
  }

  .formx-flow-lane--normal .formx-flow-card img{
    width:54px;
    height:54px;
    margin:0 auto 8px;
  }

  .formx-flow-lane--normal .formx-flow-card h3{
    margin-bottom:7px;
    font-size:15px;
  }

  .formx-flow-lane--normal .formx-flow-card p{
    font-size:10.5px;
    line-height:1.65;
  }

  .formx-flow-lane--normal .formx-flow-card--human{
    min-height:178px;
    padding:14px 18px 12px;
    justify-content:center;
  }

  .formx-flow-lane--normal .formx-flow-card--human img{
    width:52px;
    height:52px;
    margin:0 auto 8px;
  }

  .formx-flow-card__human-copy{
    margin:0;
    color:#26324a;
    font-size:11px;
    line-height:1.8;
    text-align:center;
  }

  .formx-flow-lane--normal .formx-flow-arrow{
    align-self:center;
    width:24px;
    font-size:24px;
  }
}

@media screen and (max-width:1036px){
  .formx-flow-card__human-copy{
    margin:0;
    color:#26324a;
    font-size:12px;
    line-height:1.8;
    text-align:center;
  }
}

.formx-flow-human-steps{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
}

.formx-flow-human-step{
  min-width:0;
  flex:1 1 0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.formx-flow-human-step img{
  width:48px!important;
  height:48px!important;
  margin:0 auto 7px!important;
  object-fit:contain;
}

.formx-flow-human-step span{
  color:var(--navy);
  font-size:11px;
  font-weight:700;
  line-height:1.55;
}

.formx-flow-human-arrow{
  flex:0 0 auto;
  color:#7d8794;
  font-size:20px;
  font-weight:700;
  line-height:1;
}

.formx-flow-card__human-note{
  margin:10px 0 0!important;
  color:#526078!important;
  font-size:10.5px!important;
  font-weight:700;
  line-height:1.6!important;
  text-align:center;
}

@media screen and (min-width:1037px){
  .formx-flow-lane--normal .formx-flow-card--human{
    gap:6px;
  }

  .formx-flow-lane--normal .formx-flow-card--human > h3{
    margin:0 0 8px;
  }
}

@media screen and (max-width:1036px){
  .formx-flow-human-steps{
    gap:8px;
  }

  .formx-flow-human-step img{
    width:52px!important;
    height:52px!important;
  }

  .formx-flow-human-step span{
    font-size:12px;
  }

  .formx-flow-human-arrow{
    font-size:18px;
  }

  .formx-flow-card__human-note{
    font-size:11px!important;
  }
}

@media screen and (max-width:560px){
  .formx-flow-human-steps{
    flex-direction:column;
    gap:8px;
  }

  .formx-flow-human-arrow{
    transform:rotate(90deg);
  }
}

.formx-response-process__steps span{
  font-family:var(--sans);
  font-weight:400!important;
}
@media screen and (max-width:767px){
  .formx-response-process__steps span{
    font-weight:400!important;
  }
}

@media screen and (min-width:1037px){
  .formx-capability-card h3{
    width:100%;
    min-height:72px;
    margin:0 0 14px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .formx-capability-card p{
    width:100%;
    margin:0!important;
  }
}
@media screen and (min-width:1037px) and (max-width:1250px){
  .formx-capability-card h3{
    min-height:66px;
    margin-bottom:12px;
  }
}

@media screen and (min-width:1037px){

  .formx-capabilities__goal{
    justify-content:flex-start;
    padding-top:22px;
  }

  .formx-capabilities__goal img{
    width:74px;
    height:74px;
    margin:16px auto 14px;
  }

  .formx-capabilities__goal strong{
    width:100%;
    min-height:72px;
    margin:0 0 14px;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .formx-capabilities__goal p{
    width:100%;
    margin:0!important;
    color:#26324a;
    font-size:11px;
    font-weight:400!important;
    line-height:1.8;
    text-align:center;
  }
}

@media screen and (min-width:1037px) and (max-width:1250px){

  .formx-capabilities__goal strong{
    min-height:66px;
    margin-bottom:12px;
  }

  .formx-capabilities__goal p{
    font-size:10px;
  }
}

@media screen and (min-width:1037px){

  .formx-capability-card__copy,
  .formx-capabilities__goal-copy{
    width:100%;
    margin:0!important;
    line-height:1.75;
    word-break:keep-all;
    overflow-wrap:normal;
    text-wrap:pretty;
  }

  .formx-capability-card__copy{
    font-size:10.5px;
  }

  .formx-capabilities__goal-copy{
    color:#26324a;
    font-size:10.5px;
    font-weight:400!important;
  }
}

@media screen and (min-width:1037px) and (max-width:1250px){

  .formx-capability-card__copy,
  .formx-capabilities__goal-copy{
    font-size:9.8px;
    line-height:1.72;
  }
}
@media screen and (max-width:1036px){

  .formx-capability-card__copy br,
  .formx-capabilities__goal-copy br{
    display:none;
  }

  .formx-capability-card__copy,
  .formx-capabilities__goal-copy{
    word-break:normal;
    overflow-wrap:anywhere;
  }
}

@media screen and (min-width:1037px){

  .formx-steps .step-item h3{
    width:100%;
    min-height:64px;
    margin:0 0 16px;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .formx-steps .step-item .formx-step-copy{
    width:100%;
    margin:0!important;
    font-size:13px;
    line-height:1.85;
    text-align:center;
    word-break:keep-all;
    overflow-wrap:normal;
  }
}

@media screen and (min-width:1037px) and (max-width:1250px){
  .formx-steps .step-item h3{
    min-height:58px;
    margin-bottom:14px;
  }

  .formx-steps .step-item .formx-step-copy{
    font-size:12px;
  }
}

@media screen and (max-width:1036px){
  .formx-steps .step-item .formx-step-copy br{
    display:none;
  }

  .formx-steps .step-item .formx-step-copy{
    margin-top:0!important;
    word-break:normal;
    overflow-wrap:anywhere;
  }
}

.case-grid p{
  font-size:14px;
  line-height:1.9;
  font-weight:400;
}

@media screen and (max-width:1036px){
  .case-grid p{
    font-size:13px;
    line-height:1.85;
  }
}

@media screen and (max-width:767px){
  .case-grid p{
    font-size:12px;
    line-height:1.8;
  }
}

@media screen and (max-width:767px){
  .formx-hero__visual{
    display:none!important;
  }
  .formx-hero,
  .formx-hero__inner{
    min-height:auto!important;
  }

  .formx-hero__inner{
    padding-top:24px;
    padding-bottom:28px!important;
  }
  .formx-hero__lead{
    width:100%;
    max-width:100%;
  }
  .formx-problem.section-space{
    padding-top:8px;
  }
}

@media screen and (max-width:767px){
  .formx-flow-layout{
    grid-template-columns:1fr;
    max-width:none;
    gap:14px;
  }

  .formx-flow-lanes{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:start;
  }

  .formx-flow-lane{
    min-width:0;
    padding:48px 6px 8px;
    border-radius:14px;
  }

  .formx-flow-lane__label{
    width:100%;
    min-width:0;
    padding:9px 6px;
    border-radius:10px 10px 0 0;
    font-size:11px;
    line-height:1.35;
    white-space:normal;
  }
  .formx-flow-lane__steps{
    grid-template-columns:1fr;
    gap:5px;
  }

  .formx-flow-card{
    min-height:126px;
    padding:12px 5px 10px;
    border-radius:11px;
  }

  .formx-flow-card__number{
    top:7px;
    left:7px;
    width:23px;
    height:23px;
    font-size:10px;
  }

  .formx-flow-card img{
    width:42px;
    height:42px;
    margin:3px auto 7px;
  }

  .formx-flow-card h3{
    margin-bottom:5px;
    font-size:12px;
    line-height:1.45;
  }

  .formx-flow-card p,
  .formx-flow-card ul{
    font-size:9px;
    line-height:1.65;
  }

  .formx-flow-arrow{
    width:100%;
    min-height:20px;
    flex-basis:auto;
    font-size:18px;
    transform:rotate(90deg);
  }
  .formx-flow-card--human{
    min-height:auto;
    padding:12px 5px 10px;
  }

  .formx-flow-human-steps{
    gap:5px;
  }

  .formx-flow-human-step img{
    width:38px!important;
    height:38px!important;
    margin-bottom:5px!important;
  }

  .formx-flow-human-step span{
    font-size:9px;
    line-height:1.45;
  }

  .formx-flow-human-arrow{
    font-size:15px;
  }

  .formx-flow-card__human-note{
    margin-top:7px!important;
    font-size:9px!important;
  }
  .formx-flow-meeting{
    width:100%;
    min-height:auto;
    padding:16px 12px;
  }

  .formx-flow-meeting h3{
    margin-bottom:10px;
    font-size:19px;
  }

  .formx-flow-meeting img{
    width:54px;
    height:54px;
    margin-bottom:10px;
  }

  .formx-flow-meeting p{
    font-size:11px;
  }
}

@media screen and (max-width:767px){
  .formx-flow-lanes{
    position:relative;
    padding-bottom:34px;
  }
  .formx-flow-lane--formx{
    position:relative;
  }

  .formx-flow-lane--formx::after{
    content:"↓";
    position:absolute;
    left:50%;
    bottom:-31px;
    z-index:3;
    color:var(--blue);
    font-size:24px;
    font-weight:700;
    line-height:1;
    transform:translateX(-50%);
  }
  .formx-flow-lane--normal{
    position:relative;
  }

  .formx-flow-lane--normal::after{
    content:"";
    position:absolute;
    left:50%;
    top:calc(100% - 8px);
    width:2px;
    height:42px;
    background:#7d8794;
    transform:translateX(-50%);
  }

  .formx-flow-lane--normal::before{
    content:"";
    position:absolute;
    left:50%;
    top:calc(100% + 27px);
    z-index:3;
    width:9px;
    height:9px;
    border-right:2px solid #7d8794;
    border-bottom:2px solid #7d8794;
    transform:translateX(-50%) rotate(45deg);
  }
  .formx-flow-meeting{
    margin-top:0;
  }
}

@media screen and (max-width:767px){
  .formx-flow-lanes{
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:stretch!important;
    padding-bottom:42px;
  }

  .formx-flow-lane{
    height:100%;
    display:flex;
    flex-direction:column;
  }

  .formx-flow-lane__steps{
    flex:1 1 auto;
  }
  .formx-flow-lane--normal .formx-flow-lane__steps{
    height:100%;
    display:grid;
    grid-template-columns:1fr;
    grid-template-rows:
      auto
      auto
      auto
      auto
      auto
      auto
      minmax(260px,1fr);
    gap:5px;
  }

  .formx-flow-lane--normal .formx-flow-card--human{
    min-height:260px;
    height:100%;
    padding:14px 6px 12px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  .formx-flow-lane--normal .formx-flow-human-steps{
    width:100%;
    flex:0 0 auto;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:7px;
  }

  .formx-flow-lane--normal .formx-flow-human-step{
    width:100%;
    flex:0 0 auto;
  }

  .formx-flow-lane--normal .formx-flow-human-step img{
    width:36px!important;
    height:36px!important;
    margin:0 auto 4px!important;
  }

  .formx-flow-lane--normal .formx-flow-human-step span{
    font-size:9px;
    line-height:1.4;
  }

  .formx-flow-lane--normal .formx-flow-human-arrow{
    font-size:15px;
    line-height:1;
    transform:rotate(90deg);
  }

  .formx-flow-lane--normal .formx-flow-card__human-note{
    margin-top:8px!important;
    font-size:8.5px!important;
    line-height:1.5!important;
  }
  .formx-flow-lane--normal::before,
  .formx-flow-lane--normal::after,
  .formx-flow-lane--formx::before,
  .formx-flow-lane--formx::after{
    content:"";
    position:absolute;
    left:50%;
    z-index:4;
    pointer-events:none;
  }
  .formx-flow-lane--normal::after{
    top:100%;
    width:2px;
    height:35px;
    background:#7d8794;
    transform:translateX(-50%);
  }
  .formx-flow-lane--normal::before{
    top:calc(100% + 27px);
    width:9px;
    height:9px;
    border-right:2px solid #7d8794;
    border-bottom:2px solid #7d8794;
    transform:translateX(-50%) rotate(45deg);
  }
  .formx-flow-lane--formx::after{
    top:100%;
    width:2px;
    height:35px;
    background:var(--blue);
    transform:translateX(-50%);
  }
  .formx-flow-lane--formx::before{
    top:calc(100% + 27px);
    width:9px;
    height:9px;
    border-right:2px solid var(--blue);
    border-bottom:2px solid var(--blue);
    transform:translateX(-50%) rotate(45deg);
  }
  .formx-flow-meeting{
    margin-top:0!important;
  }
}

@media screen and (max-width:767px){

  .formx-response-process{
    padding:20px 16px 22px;
    border-radius:16px;
  }

  .formx-response-process h3{
    margin:0 0 22px;
    font-size:15px;
    line-height:1.5;
    text-align:center;
  }

  .formx-response-process__steps{
    width:100%;
    display:flex!important;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:0;
  }

  .formx-response-process__steps > div{
    width:100%;
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
  }

  .formx-response-process__steps img{
    width:62px;
    height:62px;
    margin:0 auto 10px;
    object-fit:contain;
  }

  .formx-response-process__steps span{
    display:block;
    font-size:13px;
    line-height:1.6;
    font-weight:400!important;
    text-align:center;
  }

  .formx-response-process__steps > b{
    display:block;
    margin:10px 0 12px;
    color:var(--blue);
    font-size:28px;
    line-height:1;
    transform:rotate(90deg);
    transform-origin:center;
  }
}

.formx-cta__mobile-break{
  display:none;
}

@media screen and (max-width:767px){

  .formx-cta__mobile-break{
    display:block;
  }

  .formx-cta--final .formx-cta__message h2{
    font-size:clamp(24px,7.2vw,30px);
    line-height:1.55;
    letter-spacing:.02em;
    white-space:normal;
  }
}
.formx-response-mobile-factors,.formx-capabilities-mobile{display:none;}
@media screen and (max-width:767px){
  .formx-response-process{display:none!important;}
  .formx-response-mobile-factors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px;}
  .formx-response-mobile-factors article{min-width:0;min-height:148px;padding:16px 10px 14px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;border:1px solid rgba(8,109,243,.18);border-radius:14px;background:rgba(247,251,255,.90);text-align:center;}
  .formx-response-mobile-factors img{width:50px;height:50px;margin:0 auto 10px;object-fit:contain;}
  .formx-response-mobile-factors__mark{width:50px;height:50px;margin:0 auto 10px;display:flex;align-items:center;justify-content:center;border-radius:50%;color:#fff;background:linear-gradient(145deg,#123f91 0%,#0874ed 100%);font-size:25px;font-weight:700;}
  .formx-response-mobile-factors h3{margin:0 0 6px;color:var(--navy);font-family:var(--serif);font-size:13px;line-height:1.5;}
  .formx-response-mobile-factors p{margin:0;color:#526078;font-size:10px;line-height:1.6;}
  .formx-capabilities__panel{display:none!important;}
  .formx-capabilities-mobile{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:4px;}
  .formx-capabilities-mobile article{min-width:0;min-height:150px;padding:15px 9px 13px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;border:1px solid rgba(8,109,243,.20);border-radius:14px;background:rgba(255,255,255,.90);text-align:center;}
  .formx-capabilities-mobile img{width:50px;height:50px;margin:0 auto 9px;object-fit:contain;}
  .formx-capabilities-mobile h3{margin:0 0 6px;color:var(--navy);font-family:var(--serif);font-size:13px;line-height:1.45;}
  .formx-capabilities-mobile p{margin:0;color:#526078;font-size:10px;line-height:1.55;}
  .formx-capabilities-mobile__summary{grid-column:1 / -1;min-height:auto!important;padding:14px 12px!important;border:1px solid rgba(8,109,243,.22);border-radius:14px;color:var(--blue)!important;background:rgba(247,251,255,.92);font-family:var(--serif);font-size:13px!important;font-weight:700;line-height:1.7!important;text-align:center;}
  .formx-capabilities__message{margin-top:14px;}
  .formx-steps .formx-step-grid--responsive{max-width:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;border:none;}
  .formx-steps .formx-step-grid--responsive .step-arrow{display:none!important;}
  .formx-steps .formx-step-grid--responsive .step-item{min-width:0;min-height:220px;padding:16px 10px 14px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;border:1px solid rgba(8,109,243,.18);border-radius:14px;background:rgba(255,255,255,.88);}
  .formx-steps .formx-step-grid--responsive .step-number{margin-bottom:9px;font-size:11px;}
  .formx-steps .formx-step-grid--responsive .step-item img{width:54px;height:54px;margin:0 auto 10px;}
  .formx-steps .formx-step-grid--responsive .step-item h3{min-height:auto;margin:0 0 7px;font-size:14px;line-height:1.45;text-align:center;}
  .formx-steps .formx-step-grid--responsive .step-item .formx-step-copy{margin:0!important;font-size:9.5px;line-height:1.6;text-align:center;word-break:normal;overflow-wrap:anywhere;}
  .formx-steps .formx-step-grid--responsive .step-item .formx-step-copy br{display:none;}
  .formx-steps__point strong{display:none;}
  .formx-steps__point{margin-top:14px;align-items:center;text-align:center;}
}

.formx-section-cta{
  display:none;
}

@media screen and (max-width:767px){

  .formx-section-cta{
    width:min(100%,420px);
    min-height:58px;
    margin:24px auto 0;
    padding:0 20px;
    display:grid;
    grid-template-columns:30px 1fr 24px;
    align-items:center;
    border-radius:999px;
    color:#fff;
    background:linear-gradient(100deg,#123f91 0%,#0874ed 100%);
    text-decoration:none;
    box-shadow:0 10px 24px rgba(6,75,190,.20);
  }

  .formx-section-cta strong{
    font-family:var(--serif);
    font-size:18px;
    font-weight:500;
    text-align:center;
  }

  .formx-section-cta > span:last-child{
    font-size:26px;
    line-height:1;
    text-align:right;
  }

  .formx-section-cta .cta-document-icon{
    transform:scale(.82);
    transform-origin:center;
  }
  .formx-reasons .formx-section-cta{
    display:none!important;
  }
}

@media screen and (max-width:767px){
  .formx-before-after .comparison-arrow{
    display:none!important;
  }

  .formx-before-after .comparison--sidecopy{
    gap:14px;
  }
  .formx-flow-lane--normal .formx-flow-card--human > h3{
    margin:0 0 10px;
    font-size:12px!important;
    line-height:1.45;
  }

  .formx-flow-lane--normal .formx-flow-human-step span{
    font-size:10px!important;
    line-height:1.5;
    font-weight:600;
  }

  .formx-flow-lane--normal .formx-flow-card__human-note{
    margin-top:9px!important;
    font-size:9.5px!important;
    line-height:1.55!important;
  }
  .formx-flow-meeting p{
    font-size:11px;
    line-height:1.6;
    white-space:nowrap;
  }

  .formx-flow-meeting p br{
    display:none!important;
  }
  .formx-response-strength__copy p,
  .formx-response-quality p,
  .formx-response-conclusion p{
    font-size:12px!important;
    line-height:1.85!important;
  }

  .formx-response-strength__copy p strong,
  .formx-response-quality p strong,
  .formx-response-conclusion p strong{
    color:var(--blue);
    font-size:inherit!important;
    line-height:inherit;
    font-weight:700;
  }

  .formx-response-strength__copy h3{
    font-size:20px;
    line-height:1.5;
  }
}

@media screen and (max-width:767px){
  .formx-problem .problem-item h3{
    font-size:clamp(15px,4.2vw,17px);
    line-height:1.55;
    letter-spacing:-.01em;
    word-break:keep-all;
    overflow-wrap:normal;
  }
  .formx-flow-lane--normal .formx-flow-human-step span{
    font-size:11px!important;
    line-height:1.5!important;
    font-weight:600;
  }

  .formx-flow-lane--normal .formx-flow-card--human > h3{
    font-size:12px!important;
    line-height:1.5!important;
  }

  .formx-flow-lane--normal .formx-flow-card__human-note{
    font-size:10px!important;
    line-height:1.55!important;
  }
}

.formx-mobile-copy-break{
  display:none;
}

@media screen and (max-width:767px){
  .formx-mobile-copy-break{
    display:block;
  }
}

@media screen and (max-width:767px){
  .formx-steps .step-item .formx-step-copy br.formx-mobile-copy-break{
    display:block!important;
  }
}

@media screen and (max-width:767px){

  .formx-response-quality,
  .formx-response-conclusion{
    align-items:center!important;
  }

  .formx-response-quality__icon,
  .formx-response-conclusion__icon{
    width:54px!important;
    height:54px!important;
    flex:0 0 54px!important;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .formx-response-conclusion__icon{
    font-size:22px!important;
  }
}

@media screen and (max-width:767px){

  .formx-response-quality,
  .formx-response-conclusion{
    align-items:center!important;
    gap:12px!important;
  }

  .formx-response-quality__icon,
  .formx-response-conclusion__icon{
    width:44px!important;
    height:44px!important;
    flex:0 0 44px!important;
  }

  .formx-response-quality__icon{
    font-size:22px!important;
  }

  .formx-response-conclusion__icon{
    font-size:18px!important;
  }

  .formx-response-quality{
    padding-left:16px;
    padding-right:16px;
  }

  .formx-response-conclusion{
    padding-left:16px;
    padding-right:16px;
  }

  .formx-response-quality p,
  .formx-response-conclusion p{
    min-width:0;
    flex:1 1 auto;
  }
}

@media screen and (max-width:767px){

  .formx-response-conclusion{
    gap:10px!important;
  }

  .formx-response-conclusion__icon{
    width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
    font-size:16px!important;
  }
}

@media screen and (max-width:767px){

  .formx-response-quality__icon,
  .formx-response-conclusion__icon{
    width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
  }

  .formx-response-quality__icon{
    font-size:19px!important;
  }

  .formx-response-conclusion__icon{
    font-size:16px!important;
  }
}

@media screen and (max-width:767px){

  .formx-response-quality,
  .formx-response-conclusion{
    align-items:center!important;
    gap:9px!important;
  }

  .formx-response-quality__icon,
  .formx-response-conclusion__icon{
    width:34px!important;
    height:34px!important;
    flex:0 0 34px!important;
  }

  .formx-response-quality__icon{
    font-size:17px!important;
  }

  .formx-response-conclusion__icon{
    font-size:14px!important;
  }
}

@media screen and (max-width:767px){

  .formx-problem .problem-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .formx-problem .problem-item{
    position:relative;
    min-width:0;
    min-height:190px;
    padding:38px 10px 16px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:0;
    border:1px solid rgba(8,109,243,.22)!important;
    border-radius:16px;
    background:rgba(255,255,255,.88);
    text-align:center;
  }

  .formx-problem .problem-item::before{
    position:absolute;
    top:12px;
    left:12px;
    min-width:34px;
    height:28px;
    padding:0 7px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    color:var(--blue);
    background:rgba(8,109,243,.10);
    font-family:var(--sans);
    font-size:12px;
    font-weight:800;
    line-height:1;
  }

  .formx-problem .problem-item:nth-child(1)::before{ content:"01"; }
  .formx-problem .problem-item:nth-child(2)::before{ content:"02"; }
  .formx-problem .problem-item:nth-child(3)::before{ content:"03"; }
  .formx-problem .problem-item:nth-child(4)::before{ content:"04"; }

  .formx-problem .problem-item img{
    width:58px;
    height:58px;
    flex:0 0 58px;
    margin:8px auto 14px;
    object-fit:contain;
  }

  .formx-problem .problem-item > div{
    width:100%;
    min-width:0;
  }

  .formx-problem .problem-item h3{
    margin:0;
    color:var(--navy);
    font-family:var(--serif);
    font-size:13px;
    font-weight:700;
    line-height:1.65;
    letter-spacing:0;
    text-align:center;
    word-break:normal;
    overflow-wrap:anywhere;
    text-wrap:pretty;
  }

  .formx-problem .problem-item p{
    display:none;
  }
}

@media screen and (max-width:360px){
  .formx-problem .problem-list{
    gap:8px;
  }

  .formx-problem .problem-item{
    min-height:182px;
    padding-right:8px;
    padding-left:8px;
  }

  .formx-problem .problem-item img{
    width:54px;
    height:54px;
    flex-basis:54px;
  }

  .formx-problem .problem-item h3{
    font-size:12px;
    line-height:1.6;
  }
}

.formx-response-axis span::before{
  display:none!important;
}

.case-grid h3{
  margin-top:-11px;
}

.formx-logo-image{
  width:min(100%,620px);
  margin-bottom:22px;
  display:block;
  font-size:0;
  line-height:0;
}

.formx-logo-image img{
  width:100%;
  height:auto;
  max-width:none;
  display:block;
  object-fit:contain;
  object-position:left center;
}
@media screen and (min-width:1101px){
  .formx-logo-image{
    width:min(100%,620px);
    margin-bottom:24px;
  }
}
@media screen and (min-width:768px) and (max-width:1100px){
  .formx-logo-image{
    width:min(100%,500px);
    margin-bottom:20px;
  }
}
@media screen and (max-width:767px){
  .formx-logo-image{
    width:min(100%,350px);
    margin-bottom:18px;
  }

  .formx-logo-image img{
    width:100%;
  }
}

@media screen and (max-width:360px){
  .formx-logo-image{
    width:min(100%,315px);
  }
}
.formx-page{
  font-family:var(--sans);
}

.formx-title,
.formx-hero h1 small,
.comparison-card__head h3,
.comparison-copy__lead,
.formx-flow-card h3,
.formx-flow-meeting h3,
.formx-response-strength__copy h3,
.formx-capability-card h3,
.formx-capabilities__goal strong,
.formx-steps .step-item h3,
.case-grid h3,
.formx-reasons__content h3,
.formx-cta--final .formx-cta__message h2{
  font-family:var(--serif);
}

.formx-kicker,
.formx-hero__lead,
.comparison-card li,
.formx-flow-compare__lead,
.formx-flow-card p,
.formx-flow-card ul,
.formx-flow-human-step span,
.formx-flow-card__human-note,
.formx-flow-meeting p,
.formx-response__lead,
.formx-response-strength__copy p,
.formx-response-quality p,
.formx-response-conclusion p,
.formx-capabilities__lead,
.formx-capability-card p,
.formx-capabilities__goal p,
.formx-capabilities__message p,
.formx-steps__lead,
.formx-steps .step-item p,
.formx-steps__point span,
.case-grid p,
.formx-reasons__content p,
.formx-cta--final .formx-cta__message p{
  font-family:var(--sans);
}
.formx-title{
  font-size:30px;
  font-weight:600;
  line-height:1.5;
}

.formx-flow-compare__lead,
.formx-response__lead,
.formx-capabilities__lead,
.formx-steps__lead{
  font-size:16px;
  line-height:1.85;
}

.comparison-card__head h3,
.formx-response-strength__copy h3,
.formx-steps .step-item h3,
.case-grid h3,
.formx-reasons__content h3{
  font-size:18px;
  font-weight:600;
  line-height:1.55;
}
.comparison-card li,
.formx-response-strength__copy p,
.formx-response-quality p,
.formx-response-conclusion p,
.formx-capabilities__message p,
.formx-steps__point span,
.case-grid p,
.formx-reasons__content p{
  font-size:14px;
  font-weight:400;
  line-height:1.85;
}
.formx-flow-card p,
.formx-flow-card ul,
.formx-capability-card p,
.formx-capabilities__goal p,
.formx-steps .step-item p{
  font-family:var(--sans);
}
.case-grid h3{
  margin-top:6px;
  margin-bottom:6px;
  color:var(--navy);
  font-size:18px;
  font-weight:600;
  line-height:1.55;
  letter-spacing:0;
  word-break:normal;
  overflow-wrap:anywhere;
}

.case-grid p{
  margin:0;
  color:var(--navy);
  font-size:14px;
  font-weight:400;
  line-height:1.85;
  letter-spacing:0;
}
@media screen and (max-width:1036px){

  .formx-title{
    font-size:24px;
  }

  .formx-flow-compare__lead,
  .formx-response__lead,
  .formx-capabilities__lead,
  .formx-steps__lead{
    font-size:14px;
  }

  .comparison-card__head h3,
  .formx-response-strength__copy h3,
  .formx-steps .step-item h3,
  .case-grid h3,
  .formx-reasons__content h3{
    font-size:17px;
  }

  .comparison-card li,
  .formx-response-strength__copy p,
  .formx-response-quality p,
  .formx-response-conclusion p,
  .formx-capabilities__message p,
  .formx-steps__point span,
  .case-grid p,
  .formx-reasons__content p{
    font-size:13px;
  }
}
@media screen and (max-width:767px){

  .formx-title{
    font-size:22px;
    line-height:1.55;
  }

  .formx-flow-compare__lead,
  .formx-response__lead,
  .formx-capabilities__lead,
  .formx-steps__lead{
    font-size:13px;
    line-height:1.8;
  }

  .comparison-card__head h3,
  .formx-response-strength__copy h3,
  .case-grid h3,
  .formx-reasons__content h3{
    font-size:16px;
    line-height:1.55;
  }

  .formx-steps .step-item h3{
    font-size:14px;
    line-height:1.5;
  }

  .comparison-card li,
  .formx-response-strength__copy p,
  .formx-response-quality p,
  .formx-response-conclusion p,
  .formx-capabilities__message p,
  .formx-steps__point span,
  .case-grid p,
  .formx-reasons__content p{
    font-size:12px!important;
    line-height:1.8!important;
  }

  .case-grid h3{
    margin-top:6px;
    margin-bottom:5px;
  }
}

.case-grid p{
  font-size:13px!important;
  line-height:1.85!important;
}

@media screen and (max-width:1036px){
  .case-grid p{
    font-size:12px!important;
    line-height:1.8!important;
  }
}

@media screen and (max-width:767px){
  .case-grid p{
    font-size:12px!important;
    line-height:1.8!important;
  }
}
.problem-item,
.comparison-card,
.formx-flow-card,
.formx-flow-meeting,
.formx-response-chart,
.formx-response-strength,
.formx-response-quality,
.formx-response-conclusion,
.formx-capability-card,
.formx-capabilities__goal,
.formx-capabilities__message,
.formx-steps .step-item,
.formx-steps__point,
.case-grid article,
.formx-reasons__item,
.formx-response-mobile-factors article,
.formx-capabilities-mobile article{
  min-width:0;
  max-width:100%;
}
.problem-item h3,
.comparison-card h3,
.comparison-card p,
.comparison-card li,
.formx-flow-card h3,
.formx-flow-card p,
.formx-flow-card li,
.formx-flow-human-step span,
.formx-flow-card__human-note,
.formx-flow-meeting h3,
.formx-flow-meeting p,
.formx-response-strength__copy h3,
.formx-response-strength__copy p,
.formx-response-quality p,
.formx-response-conclusion p,
.formx-capability-card h3,
.formx-capability-card p,
.formx-capabilities__goal strong,
.formx-capabilities__goal p,
.formx-capabilities__message p,
.formx-steps .step-item h3,
.formx-steps .step-item p,
.formx-steps__point strong,
.formx-steps__point span,
.case-grid h3,
.case-grid p,
.formx-reasons__content h3,
.formx-reasons__content p{
  max-width:100%;
  min-width:0;
  word-break:normal!important;
  overflow-wrap:anywhere!important;
  white-space:normal!important;
}
.formx-hero h1 small,
.formx-hero__lead{
  max-width:100%;
  overflow-wrap:anywhere;
}
@media screen and (min-width:1037px){

  .formx-capability-card h3{
    min-height:72px;
    padding:0 2px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:clamp(12px,1.05vw,16px);
    line-height:1.45;
    text-align:center;
  }

  .formx-capability-card p,
  .formx-capabilities__goal p{
    font-size:clamp(9.5px,.78vw,11px);
    line-height:1.75;
  }

  .formx-capabilities__goal strong{
    min-height:72px;
    padding:0 2px;
    font-size:clamp(19px,1.5vw,24px);
    line-height:1.4;
  }
  .formx-flow-card h3{
    font-size:clamp(12px,1vw,16px);
  }

  .formx-flow-card p,
  .formx-flow-card ul{
    font-size:clamp(9px,.75vw,11px);
  }
}
@media screen and (min-width:768px) and (max-width:1036px){

  .formx-capability-card h3,
  .formx-steps .step-item h3,
  .case-grid h3{
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  .formx-capability-card h3{
    font-size:16px;
    line-height:1.5;
  }

  .formx-capability-card p{
    font-size:12px;
    line-height:1.75;
  }
}
@media screen and (max-width:767px){
  .formx-hero h1 small,
  .formx-flow-meeting p,
  .formx-problem .problem-item h3{
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:anywhere!important;
  }
  .formx-hero h1 small{
    width:100%!important;
    font-size:clamp(20px,6vw,25px);
    line-height:1.55;
  }

  .formx-hero__lead{
    width:100%!important;
    max-width:100%!important;
  }
  .formx-problem .problem-item h3{
    font-size:clamp(12px,3.6vw,14px)!important;
    line-height:1.55;
  }

  .formx-response-mobile-factors h3,
  .formx-capabilities-mobile h3,
  .formx-steps .formx-step-grid--responsive .step-item h3{
    max-width:100%;
    word-break:normal;
    overflow-wrap:anywhere;
  }

  .formx-capabilities-mobile h3{
    font-size:12px;
    line-height:1.5;
  }

  .formx-capabilities-mobile p,
  .formx-response-mobile-factors p,
  .formx-steps .formx-step-grid--responsive .step-item .formx-step-copy{
    max-width:100%;
    word-break:normal;
    overflow-wrap:anywhere;
  }
  .formx-flow-card h3{
    font-size:11px;
    line-height:1.45;
  }

  .formx-flow-card p,
  .formx-flow-card ul,
  .formx-flow-human-step span,
  .formx-flow-card__human-note{
    max-width:100%;
    overflow-wrap:anywhere!important;
  }

  .formx-flow-meeting p{
    font-size:11px;
    line-height:1.6;
  }
  .case-grid h3{
    font-size:16px;
    line-height:1.5;
  }

  .case-grid p{
    font-size:12px!important;
    line-height:1.8!important;
  }
}
@media screen and (max-width:360px){

  .formx-problem .problem-item{
    padding-left:7px;
    padding-right:7px;
  }

  .formx-problem .problem-item h3{
    font-size:11.5px!important;
  }

  .formx-response-mobile-factors article,
  .formx-capabilities-mobile article,
  .formx-steps .formx-step-grid--responsive .step-item{
    padding-left:7px;
    padding-right:7px;
  }

  .formx-response-mobile-factors h3,
  .formx-capabilities-mobile h3,
  .formx-steps .formx-step-grid--responsive .step-item h3{
    font-size:11.5px;
  }
}
@media screen and (min-width:1037px){
  .formx-flow-lane--normal .formx-flow-human-step img{
    width:64px!important;
    height:64px!important;
    margin:0 auto 8px!important;
  }
}
@media screen and (min-width:768px) and (max-width:1036px){
  .formx-flow-lane--normal .formx-flow-human-step img{
    width:58px!important;
    height:58px!important;
    margin:0 auto 7px!important;
  }
}
@media screen and (max-width:767px){
  .formx-flow-lane--normal .formx-flow-human-step img{
    width:48px!important;
    height:48px!important;
    margin:0 auto 5px!important;
  }
}
@media screen and (max-width:360px){
  .formx-flow-lane--normal .formx-flow-human-step img{
    width:44px!important;
    height:44px!important;
  }
}
@media screen and (min-width:1037px){
  .formx-capabilities__steps > .formx-capabilities__goal{
    padding:18px 12px 16px!important;
    justify-content:flex-start!important;
  }

  .formx-capabilities__steps > .formx-capabilities__goal .formx-capabilities__goal-copy{
    margin:0!important;
  }
}

@media screen and (min-width:1037px) and (max-width:1250px){
  .formx-capabilities__steps > .formx-capabilities__goal{
    padding-right:8px!important;
    padding-left:8px!important;
  }

  .formx-capabilities__steps > .formx-capabilities__goal img{
    width:62px!important;
    height:62px!important;
  }
}

.formx-logo-lockup{
  width:min(100%,760px)!important;
  max-width:none;
  margin-bottom:24px;
  display:flex!important;
  align-items:center;
  justify-content:flex-start;
  font-size:0!important;
  line-height:0!important;
}

.formx-logo-lockup__wordmark{
  display:block;
  width:auto!important;
  max-width:none!important;
  height:auto;
  flex:0 0 auto;
  object-fit:contain;
}

.formx-logo-lockup__wordmark{
  width:66%!important;
}
.formx-logo-image > img{
  width:auto;
}
@media screen and (min-width:768px) and (max-width:1100px){
  .formx-logo-lockup{
    width:min(100%,610px)!important;
    margin-bottom:20px;
  }

  .formx-logo-lockup__wordmark{
    width:66%!important;
  }
}
@media screen and (max-width:767px){
  .formx-logo-lockup{
    width:100%!important;
    max-width:430px;
    margin-bottom:18px;
    align-items:center;
  }

  .formx-logo-lockup__wordmark{
    width:66%!important;
  }
}
@media screen and (min-width:1101px){
  .formx-kicker{
    font-size:clamp(16px,1.45vw,22px);
  }

  .formx-logo-lockup{
    width:78%!important;
    max-width:420px;
  }

  .formx-logo-lockup__wordmark{
    width:100%!important;
  }

  .formx-hero h1 small{
    font-size:clamp(44px,4.1vw,62px);
  }

  .formx-hero__lead{
    font-size:clamp(15px,1.3vw,20px);
  }
}
@media screen and (min-width:768px) and (max-width:1100px){
  .formx-kicker{
    font-size:clamp(16px,2vw,22px);
  }

  .formx-logo-lockup{
    width:78%!important;
    max-width:420px;
  }

  .formx-logo-lockup__wordmark{
    width:100%!important;
  }

  .formx-hero h1 small{
    font-size:clamp(44px,5.65vw,62px);
  }

  .formx-hero__lead{
    font-size:clamp(15px,1.82vw,20px);
  }
}
@media screen and (max-width:767px){
  .formx-kicker{
    font-size:12px;
  }

  .formx-logo-lockup{
    width:82%!important;
    max-width:310px;
  }

  .formx-logo-lockup__wordmark{
    width:100%!important;
  }

  .formx-hero h1 small{
    font-size:clamp(31px,8vw,42px);
  }

  .formx-hero__lead{
    font-size:clamp(11.5px,3.1vw,13px);
  }
}
.formx-hero,
.formx-hero__inner{min-height:620px}
.formx-hero__inner{
  width:min(calc(100% - 104px),1420px);
  margin-inline:auto!important;
  padding:0;
  display:grid;
  grid-template-columns:minmax(0,56%) minmax(0,44%);
  gap:38px;
  align-items:center;
}
.formx-hero__content{width:100%;max-width:none;min-width:0}
.formx-kicker{margin:0 0 12px}
.formx-logo-lockup{width:min(420px,78%)!important;max-width:420px;margin:0 0 18px!important}
.formx-logo-lockup__wordmark{width:100%!important}
.formx-hero h1{margin:0}
.formx-hero h1 small{font-size:clamp(44px,4.1vw,62px);line-height:1.15;letter-spacing:.04em}
.formx-hero__lead{max-width:760px;margin-top:30px;font-size:clamp(15px,1.2vw,20px);line-height:2}
.formx-hero__visual{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;transform:none!important;display:flex;align-items:center;justify-content:center;overflow:visible}
.formx-hero__visual::before{display:none!important}
.formx-hero__visual img{width:100%;max-width:620px;max-height:480px;object-fit:contain;object-position:center}
.formx-hero__cta{width:min(100%,360px);min-height:58px;margin-top:24px;padding:12px 24px 12px 28px;display:flex;align-items:center;justify-content:space-between;gap:18px;border-radius:999px;color:#fff;background:linear-gradient(100deg,#075ac8 0%,#1782ff 100%);box-shadow:0 10px 22px rgba(8,109,243,.20);font-size:16px;font-weight:700;line-height:1.4;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.formx-hero__cta:hover,.formx-hero__cta:focus-visible{transform:translateY(-2px);box-shadow:0 14px 28px rgba(8,109,243,.27)}
.formx-hero__cta-arrow{flex:0 0 auto;font-size:22px;line-height:1}
@media screen and (max-width:1100px) and (min-width:768px){
  .formx-hero__inner{width:min(calc(100% - 60px),1020px);grid-template-columns:minmax(0,56%) minmax(0,44%);gap:28px}
}
@media screen and (max-width:767px){
  .formx-hero,.formx-hero__inner{min-height:0}
  .formx-hero__inner{width:100%;padding:24px 18px 28px;display:flex;flex-direction:column;gap:0}
  .formx-hero__content{width:100%}
  .formx-kicker{margin-bottom:10px}
  .formx-logo-lockup{width:min(310px,82vw)!important;margin:0 0 14px!important}
  .formx-hero h1 small{font-size:clamp(31px,8.6vw,42px);line-height:1.15}
  .formx-hero__lead{width:100%;margin-top:22px;font-size:13px;line-height:1.9}
  .formx-hero__cta{width:min(100%,330px);min-height:54px;margin-top:20px;padding:11px 20px 11px 24px;font-size:14px}
  .formx-hero__visual,.formx-hero__visual img{display:none!important}
}
@media screen and (min-width:768px){
  .formx-kicker{
    margin:0 0 12px!important;
    padding:0!important;
    border:0!important;
    font-family:var(--formx-serif)!important;
    font-size:clamp(16px,1.25vw,22px)!important;
    font-weight:400!important;
    line-height:normal!important;
    letter-spacing:.13em!important;
  }
  .formx-kicker::before,.formx-kicker::after{display:none!important;content:none!important;}
}
@media screen and (max-width:767px){
  .formx-kicker{
    margin:0 0 10px!important;
    padding:0!important;
    border:0!important;
    font-size:12px!important;
    font-weight:600!important;
    line-height:1.4!important;
    letter-spacing:.08em!important;
  }
  .formx-kicker::before,.formx-kicker::after{display:none!important;content:none!important;}
}
@media screen and (min-width:768px){
  .formx-hero__inner{align-items:center!important;}
  .formx-hero__content{align-self:auto!important;padding-top:0!important;}
  .formx-kicker{line-height:normal!important;}
  .formx-logo-lockup{height:auto!important;max-height:none!important;display:block!important;}
  .formx-logo-lockup__wordmark{height:auto!important;object-fit:contain!important;object-position:left center!important;}
  .formx-hero__visual{align-self:center!important;}
}
@media screen and (max-width:767px){
  .formx-hero__content{padding-top:0!important;}
  .formx-logo-lockup{height:auto!important;max-height:none!important;}
  .formx-logo-lockup__wordmark{height:auto!important;}
}
.formx-hero{
  --formx-hero-serif:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN",serif;
  --formx-hero-sans:"Noto Sans JP","Yu Gothic","Hiragino Kaku Gothic ProN",sans-serif;
}
.formx-hero .formx-kicker,
.formx-hero h1,
.formx-hero__lead,
.formx-hero__text{
  font-family:var(--formx-hero-serif)!important;
}
.formx-hero__cta{
  font-family:var(--formx-hero-sans)!important;
}
@media screen and (min-width:768px){
  .formx-logo-lockup{
    width:min(505px,93%)!important;
    max-width:505px!important;
  }
}
@media screen and (max-width:767px){
  .formx-logo-lockup{
    width:min(373px,calc(100vw - 36px))!important;
    max-width:none!important;
  }
}
.formx-brand-logo-frame{
  position:relative;
  width:min(505px,93%);
  aspect-ratio:505 / 105;
  margin:0 0 18px;
  display:block;
  overflow:visible;
  background:transparent;
}
.formx-brand-logo{
  position:absolute;
  top:0;
  left:0;
  width:100%!important;
  max-width:none!important;
  height:auto!important;
}
.formx-brand-tagline{
  position:absolute;
  top:80.95%;
  right:0;
  bottom:auto;
  width:61%;
  color:#081d70;
  font-family:var(--formx-hero-sans)!important;
  font-size:clamp(11px,1.12vw,16px);
  font-weight:500;
  line-height:1;
  letter-spacing:.22em;
  text-align:center;
  white-space:nowrap;
}
.formx-brand-tagline b{
  color:#168cff;
  font-size:1.12em;
  font-weight:700;
}
.formx-hero h1{
  font-size:clamp(44px,4.1vw,62px)!important;
  font-weight:500!important;
  line-height:1.15!important;
  letter-spacing:.04em!important;
  white-space:nowrap!important;
}
.formx-hero__lead{
  margin:34px 0 0!important;
  font-size:clamp(20px,1.65vw,27px)!important;
  line-height:1.65!important;
  letter-spacing:.04em!important;
  white-space:nowrap!important;
}
.formx-hero__text{
  max-width:760px;
  margin:30px 0 0;
  color:var(--navy);
  font-size:clamp(15px,1.2vw,20px);
  line-height:2;
  letter-spacing:.04em;
}
@media screen and (max-width:767px){
  .formx-brand-logo-frame{
    width:min(373px,calc(100vw - 36px));
    margin-bottom:14px;
  }
  .formx-brand-tagline{
    font-size:clamp(9px,2.8vw,12px);
    letter-spacing:.16em;
  }
  .formx-hero h1{
    font-size:clamp(31px,8.6vw,42px)!important;
    line-height:1.15!important;
    letter-spacing:.025em!important;
    white-space:normal!important;
  }
  .formx-hero__lead{
    width:100%;
    margin-top:24px!important;
    font-size:clamp(20px,5.6vw,26px)!important;
    line-height:1.7!important;
    white-space:normal!important;
  }
  .formx-hero__text{
    width:100%;
    margin-top:22px;
    font-size:clamp(12px,3.2vw,14px);
    line-height:1.95;
  }
}

/* =========================================================
   2026-08-31 | SERVICE HERO HEADING SIZE UNIFICATION
   ========================================================= */
.formx-hero h1{
  font-size:clamp(30px,5.6vw,40px)!important;
}


/* =========================================================
   2026-09-04 | MOBILE HERO VISUAL — TREMO REFERENCE
   ---------------------------------------------------------
   TREMOのスマホHEROと同じ表示ルールに統一。
   ・本文の通常フロー内、CTA直前に配置
   ・画像全体を切らずに contain 表示
   ・高さ / 中央配置 / 余白をTREMO基準へ
   ・PC / tablet の既存ビジュアルには影響なし
   ========================================================= */
@media screen and (max-width:767px){
  .formx-hero__visual-mobile.service-reveal-mobile-visual{
    position:relative!important;
    z-index:1!important;
    width:100%!important;
    height:clamp(180px,26svh,250px)!important;
    min-height:165px!important;
    margin:10px auto 6px!important;
    padding:0!important;
    display:flex!important;
    flex:0 1 auto!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:visible!important;
    pointer-events:none!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
  }

  .formx-hero__visual-mobile.service-reveal-mobile-visual::before{
    content:""!important;
    position:absolute!important;
    right:8%!important;
    bottom:8%!important;
    left:8%!important;
    height:42%!important;
    border-radius:50%!important;
    background:radial-gradient(ellipse at center,rgba(11,114,231,.12),rgba(11,114,231,0) 70%)!important;
    filter:blur(22px)!important;
    pointer-events:none!important;
  }

  .formx-hero__visual-mobile.service-reveal-mobile-visual img{
    position:relative!important;
    z-index:1!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:470px!important;
    max-height:none!important;
    margin:0!important;
    object-fit:contain!important;
    object-position:center!important;
    opacity:1!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    filter:drop-shadow(0 18px 22px rgba(6,27,61,.12))!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }
}

@media screen and (max-width:390px){
  .formx-hero__visual-mobile.service-reveal-mobile-visual{
    height:clamp(165px,24svh,215px)!important;
    min-height:155px!important;
    margin-top:8px!important;
  }
}

/* =========================================================
   2026-09-10 | FORMLINK HERO — GEOMETRIC BLUE BACKGROUND v1
   ---------------------------------------------------------
   集中線を廃止し、白→青のグラデーション＋薄い幾何学模様へ。
   文字エリアは白を残し、右側のビジュアル周辺のみ青を強める。
   画像背景は使用せず CSS のみで描画。
   ========================================================= */
.formx-hero{
  isolation:isolate!important;
  background:
    radial-gradient(ellipse at 82% 48%, rgba(34,151,255,.18) 0%, rgba(34,151,255,.10) 28%, rgba(34,151,255,.035) 48%, transparent 68%),
    radial-gradient(ellipse at 96% 18%, rgba(0,102,255,.09) 0%, transparent 44%),
    linear-gradient(100deg,
      #ffffff 0%,
      #ffffff 37%,
      rgba(249,252,255,.98) 48%,
      rgba(235,246,255,.95) 67%,
      rgba(211,235,255,.96) 100%)!important;
}

/* 文字側を保護しながら、右側にだけ設計図のような薄い幾何学模様 */
.formx-hero::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  display:block!important;
  pointer-events:none!important;
  background:
    /* diagonal fine lines */
    repeating-linear-gradient(135deg,
      transparent 0 72px,
      rgba(8,109,243,.045) 72px 73px,
      transparent 73px 144px),
    /* vertical grid */
    repeating-linear-gradient(90deg,
      transparent 0 92px,
      rgba(8,109,243,.035) 92px 93px),
    /* horizontal grid */
    repeating-linear-gradient(0deg,
      transparent 0 76px,
      rgba(8,109,243,.028) 76px 77px)!important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,transparent 42%,rgba(0,0,0,.20) 51%,#000 64%,#000 100%)!important;
  mask-image:linear-gradient(90deg,transparent 0%,transparent 42%,rgba(0,0,0,.20) 51%,#000 64%,#000 100%)!important;
  opacity:1!important;
}

/* 大きな輪郭を出し過ぎず、右側に半透明の多角形・円弧感 */
.formx-hero::after{
  content:""!important;
  position:absolute!important;
  top:50%!important;
  right:clamp(28px,4vw,84px)!important;
  width:clamp(500px,41vw,700px)!important;
  height:clamp(390px,32vw,560px)!important;
  z-index:0!important;
  display:block!important;
  border:0!important;
  border-radius:0!important;
  background:
    linear-gradient(30deg, transparent 47.8%, rgba(8,109,243,.11) 48%, rgba(8,109,243,.11) 48.25%, transparent 48.5%),
    linear-gradient(150deg, transparent 47.8%, rgba(8,109,243,.075) 48%, rgba(8,109,243,.075) 48.25%, transparent 48.5%),
    radial-gradient(circle at 58% 52%, transparent 0 34%, rgba(8,109,243,.08) 34.2% 34.45%, transparent 34.7% 47%, rgba(8,109,243,.055) 47.2% 47.4%, transparent 47.7%),
    conic-gradient(from 12deg at 58% 52%,
      transparent 0 10%, rgba(22,132,255,.065) 10.2% 10.5%, transparent 10.7% 25%,
      rgba(22,132,255,.05) 25.2% 25.45%, transparent 25.7% 48%,
      rgba(22,132,255,.06) 48.2% 48.5%, transparent 48.7% 72%,
      rgba(22,132,255,.05) 72.2% 72.5%, transparent 72.7% 100%)!important;
  transform:translateY(-50%) rotate(-5deg)!important;
  opacity:.9!important;
  pointer-events:none!important;
}

/* メールオブジェクト背面の発光。集中線は使用しない */
.formx-hero__visual::before{
  content:""!important;
  position:absolute!important;
  top:50%!important;
  left:52%!important;
  width:78%!important;
  aspect-ratio:1!important;
  display:block!important;
  border:1px solid rgba(39,151,255,.12)!important;
  border-radius:50%!important;
  background:
    radial-gradient(circle,
      rgba(98,190,255,.20) 0%,
      rgba(98,190,255,.11) 30%,
      rgba(98,190,255,.035) 54%,
      rgba(98,190,255,0) 72%)!important;
  box-shadow:inset 0 0 45px rgba(68,166,255,.04)!important;
  transform:translate(-50%,-50%)!important;
  opacity:1!important;
  pointer-events:none!important;
}

.formx-hero__visual::after{
  content:""!important;
  position:absolute!important;
  top:50%!important;
  left:52%!important;
  width:59%!important;
  aspect-ratio:1.22!important;
  display:block!important;
  border:1px solid rgba(8,109,243,.08)!important;
  border-radius:50%!important;
  background:transparent!important;
  transform:translate(-50%,-50%) rotate(23deg)!important;
  opacity:.9!important;
  pointer-events:none!important;
}

/* ビジュアルを背景から少し浮かせる */
.formx-hero__visual img{
  filter:drop-shadow(0 24px 30px rgba(8,83,176,.12))!important;
}

/* tablet */
@media screen and (min-width:768px) and (max-width:1100px){
  .formx-hero{
    background:
      radial-gradient(ellipse at 86% 50%, rgba(34,151,255,.17) 0%, rgba(34,151,255,.08) 34%, transparent 62%),
      linear-gradient(100deg,#fff 0%,#fff 40%,#f5faff 58%,#dceeff 100%)!important;
  }
  .formx-hero::before{
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,transparent 43%,rgba(0,0,0,.22) 53%,#000 68%,#000 100%)!important;
    mask-image:linear-gradient(90deg,transparent 0%,transparent 43%,rgba(0,0,0,.22) 53%,#000 68%,#000 100%)!important;
  }
  .formx-hero::after{
    right:-30px!important;
    width:560px!important;
    height:440px!important;
    opacity:.75!important;
  }
}

/* mobile：文字エリアの可読性を優先し、模様は下〜右側だけに薄く残す */
@media screen and (max-width:767px){
  .formx-hero{
    background:
      radial-gradient(ellipse at 92% 72%, rgba(40,154,255,.15) 0%, rgba(40,154,255,.065) 34%, transparent 60%),
      linear-gradient(155deg,#fff 0%,#fff 55%,#edf7ff 78%,#dceeff 100%)!important;
  }
  .formx-hero::before{
    background:
      repeating-linear-gradient(135deg,transparent 0 56px,rgba(8,109,243,.035) 56px 57px,transparent 57px 112px),
      repeating-linear-gradient(90deg,transparent 0 72px,rgba(8,109,243,.025) 72px 73px)!important;
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,transparent 44%,rgba(0,0,0,.35) 63%,#000 100%)!important;
    mask-image:linear-gradient(180deg,transparent 0%,transparent 44%,rgba(0,0,0,.35) 63%,#000 100%)!important;
  }
  .formx-hero::after{
    top:auto!important;
    right:-150px!important;
    bottom:-125px!important;
    width:430px!important;
    height:330px!important;
    transform:rotate(-8deg)!important;
    opacity:.50!important;
  }
  .formx-hero__visual-mobile.service-reveal-mobile-visual::before{
    background:radial-gradient(ellipse at center,rgba(22,139,255,.14),rgba(22,139,255,0) 72%)!important;
  }
}

/* =========================================================
   2026-09-10 | FORMLINK HERO — GEOMETRIC LINES STRONGER v2
   ---------------------------------------------------------
   v1の構成は維持したまま、幾何学線だけを一段濃く調整。
   左側の文字エリアには入れず、右側のビジュアル周辺で視認性を上げる。
   ========================================================= */
.formx-hero::before{
  background:
    repeating-linear-gradient(135deg,
      transparent 0 72px,
      rgba(7,92,214,.105) 72px 73.4px,
      transparent 73.4px 144px),
    repeating-linear-gradient(90deg,
      transparent 0 92px,
      rgba(7,92,214,.082) 92px 93.2px),
    repeating-linear-gradient(0deg,
      transparent 0 76px,
      rgba(7,92,214,.065) 76px 77.2px)!important;
  opacity:1!important;
}

.formx-hero::after{
  background:
    linear-gradient(30deg, transparent 47.6%, rgba(4,91,221,.22) 47.9%, rgba(4,91,221,.22) 48.3%, transparent 48.6%),
    linear-gradient(150deg, transparent 47.6%, rgba(12,111,239,.16) 47.9%, rgba(12,111,239,.16) 48.3%, transparent 48.6%),
    radial-gradient(circle at 58% 52%,
      transparent 0 34%,
      rgba(8,109,243,.17) 34.2% 34.55%,
      transparent 34.8% 47%,
      rgba(8,109,243,.125) 47.2% 47.55%,
      transparent 47.85%),
    conic-gradient(from 12deg at 58% 52%,
      transparent 0 10%, rgba(9,101,235,.135) 10.2% 10.65%, transparent 10.9% 25%,
      rgba(9,101,235,.105) 25.2% 25.65%, transparent 25.9% 48%,
      rgba(9,101,235,.12) 48.2% 48.65%, transparent 48.9% 72%,
      rgba(9,101,235,.10) 72.2% 72.65%, transparent 72.9% 100%)!important;
  opacity:1!important;
}

.formx-hero__visual::before{
  border-color:rgba(25,126,236,.19)!important;
}

.formx-hero__visual::after{
  border-color:rgba(8,109,243,.15)!important;
  opacity:1!important;
}

@media screen and (min-width:768px) and (max-width:1100px){
  .formx-hero::after{opacity:.92!important;}
}

@media screen and (max-width:767px){
  .formx-hero::before{
    background:
      repeating-linear-gradient(135deg,transparent 0 56px,rgba(7,92,214,.075) 56px 57.2px,transparent 57.2px 112px),
      repeating-linear-gradient(90deg,transparent 0 72px,rgba(7,92,214,.055) 72px 73.2px)!important;
  }
  .formx-hero::after{opacity:.68!important;}
}

/* =========================================================
   2026-09-10 | FORMLINK HERO — CYBER MESH ENERGY FIELD v3
   ---------------------------------------------------------
   参考：中央コアを網目状の幾何学線が包み、背景にも斜め格子が広がる。
   集中線は使わず、白〜青のグラデーション＋サイバーなエネルギーフィールドをCSSのみで描画。
   ========================================================= */
.formx-hero{
  background:
    radial-gradient(ellipse at 77% 49%, rgba(158,229,255,.30) 0%, rgba(64,169,255,.17) 28%, rgba(31,117,232,.075) 49%, transparent 68%),
    radial-gradient(ellipse at 94% 19%, rgba(0,185,255,.11) 0%, transparent 42%),
    linear-gradient(100deg,
      #ffffff 0%,
      #ffffff 35%,
      #fbfdff 45%,
      #eef8ff 61%,
      #d7edff 80%,
      #c7e5ff 100%)!important;
}

/* HERO全体に広がる斜め格子。文字側はマスクで薄く消す */
.formx-hero::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  display:block!important;
  pointer-events:none!important;
  background:
    repeating-linear-gradient(32deg,
      transparent 0 30px,
      rgba(0,122,224,.12) 30px 31.25px,
      transparent 31.25px 61px),
    repeating-linear-gradient(148deg,
      transparent 0 30px,
      rgba(0,177,234,.105) 30px 31.25px,
      transparent 31.25px 61px),
    linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.94) 35%,rgba(255,255,255,.52) 48%,rgba(255,255,255,0) 66%)!important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,transparent 35%,rgba(0,0,0,.12) 43%,rgba(0,0,0,.72) 57%,#000 69%,#000 100%)!important;
  mask-image:linear-gradient(90deg,transparent 0%,transparent 35%,rgba(0,0,0,.12) 43%,rgba(0,0,0,.72) 57%,#000 69%,#000 100%)!important;
  opacity:1!important;
}

/* 外側のエネルギーフィールド：大きな楕円リング＋薄い格子の反射 */
.formx-hero::after{
  content:""!important;
  position:absolute!important;
  top:50%!important;
  right:clamp(-80px,1vw,30px)!important;
  z-index:0!important;
  width:clamp(610px,48vw,840px)!important;
  height:clamp(470px,38vw,650px)!important;
  display:block!important;
  border:1px solid rgba(0,141,235,.18)!important;
  border-radius:50%!important;
  background:
    repeating-linear-gradient(30deg,transparent 0 35px,rgba(0,151,231,.065) 35px 36px,transparent 36px 70px),
    repeating-linear-gradient(150deg,transparent 0 35px,rgba(0,151,231,.055) 35px 36px,transparent 36px 70px),
    radial-gradient(ellipse at center,
      rgba(255,255,255,.28) 0%,
      rgba(116,213,255,.12) 34%,
      rgba(0,137,226,.055) 51%,
      rgba(0,137,226,0) 72%)!important;
  box-shadow:
    inset 0 0 70px rgba(23,151,235,.07),
    0 0 80px rgba(72,183,255,.07)!important;
  transform:translateY(-50%) rotate(-4deg)!important;
  opacity:.92!important;
  pointer-events:none!important;
}

/* メールオブジェクトを包む“球体メッシュ”。2方向の曲面格子を重ねる */
.formx-hero__visual::before{
  content:""!important;
  position:absolute!important;
  top:50%!important;
  left:51%!important;
  z-index:0!important;
  width:82%!important;
  aspect-ratio:1.03!important;
  display:block!important;
  border:1px solid rgba(0,136,230,.28)!important;
  border-radius:50%!important;
  background:
    repeating-linear-gradient(34deg,
      transparent 0 27px,
      rgba(0,145,229,.18) 27px 28.4px,
      transparent 28.4px 56px),
    repeating-linear-gradient(146deg,
      transparent 0 27px,
      rgba(0,198,226,.16) 27px 28.4px,
      transparent 28.4px 56px),
    radial-gradient(circle at 48% 47%,
      rgba(233,250,255,.82) 0%,
      rgba(154,229,255,.28) 23%,
      rgba(40,156,239,.14) 43%,
      rgba(0,111,212,.045) 61%,
      rgba(0,111,212,0) 73%)!important;
  box-shadow:
    inset 0 0 56px rgba(0,118,218,.10),
    0 0 44px rgba(32,166,241,.09)!important;
  -webkit-mask-image:radial-gradient(ellipse at center,#000 0 64%,rgba(0,0,0,.82) 71%,transparent 77%)!important;
  mask-image:radial-gradient(ellipse at center,#000 0 64%,rgba(0,0,0,.82) 71%,transparent 77%)!important;
  transform:translate(-50%,-50%) rotate(-3deg)!important;
  opacity:.92!important;
  pointer-events:none!important;
}

/* 内側のもう1層の楕円メッシュで“包まれている”奥行きを強調 */
.formx-hero__visual::after{
  content:""!important;
  position:absolute!important;
  top:50%!important;
  left:51%!important;
  z-index:0!important;
  width:62%!important;
  aspect-ratio:1.12!important;
  display:block!important;
  border:1px solid rgba(0,174,222,.22)!important;
  border-radius:50%!important;
  background:
    repeating-linear-gradient(24deg,transparent 0 31px,rgba(0,115,220,.13) 31px 32px,transparent 32px 63px),
    repeating-linear-gradient(156deg,transparent 0 31px,rgba(0,184,226,.11) 31px 32px,transparent 32px 63px),
    radial-gradient(ellipse at center,rgba(255,255,255,.10),rgba(25,162,241,.045) 55%,transparent 72%)!important;
  box-shadow:inset 0 0 36px rgba(0,127,218,.055)!important;
  transform:translate(-50%,-50%) rotate(16deg)!important;
  opacity:.78!important;
  pointer-events:none!important;
}

.formx-hero__visual img{
  position:relative!important;
  z-index:2!important;
  filter:
    drop-shadow(0 24px 30px rgba(5,83,170,.12))
    drop-shadow(0 0 12px rgba(38,166,255,.08))!important;
}

/* tablet */
@media screen and (min-width:768px) and (max-width:1100px){
  .formx-hero::before{
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,transparent 39%,rgba(0,0,0,.18) 49%,#000 66%,#000 100%)!important;
    mask-image:linear-gradient(90deg,transparent 0%,transparent 39%,rgba(0,0,0,.18) 49%,#000 66%,#000 100%)!important;
  }
  .formx-hero::after{
    right:-130px!important;
    width:650px!important;
    height:510px!important;
    opacity:.82!important;
  }
  .formx-hero__visual::before{width:88%!important;opacity:.82!important;}
  .formx-hero__visual::after{width:66%!important;opacity:.66!important;}
}

/* mobile：上部テキストを保護し、画像周辺〜下部だけ格子感を出す */
@media screen and (max-width:767px){
  .formx-hero{
    background:
      radial-gradient(ellipse at 87% 77%,rgba(68,184,255,.18) 0%,rgba(68,184,255,.075) 36%,transparent 60%),
      linear-gradient(155deg,#fff 0%,#fff 52%,#eef8ff 76%,#d8edff 100%)!important;
  }
  .formx-hero::before{
    background:
      repeating-linear-gradient(32deg,transparent 0 24px,rgba(0,132,220,.085) 24px 25px,transparent 25px 49px),
      repeating-linear-gradient(148deg,transparent 0 24px,rgba(0,182,224,.072) 24px 25px,transparent 25px 49px)!important;
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,transparent 48%,rgba(0,0,0,.24) 60%,#000 78%,#000 100%)!important;
    mask-image:linear-gradient(180deg,transparent 0%,transparent 48%,rgba(0,0,0,.24) 60%,#000 78%,#000 100%)!important;
  }
  .formx-hero::after{
    top:auto!important;
    right:-180px!important;
    bottom:-165px!important;
    width:500px!important;
    height:390px!important;
    transform:rotate(-6deg)!important;
    opacity:.52!important;
  }
  .formx-hero__visual-mobile.service-reveal-mobile-visual::before{
    background:
      repeating-linear-gradient(33deg,transparent 0 25px,rgba(0,138,221,.10) 25px 26px,transparent 26px 51px),
      repeating-linear-gradient(147deg,transparent 0 25px,rgba(0,189,224,.085) 25px 26px,transparent 26px 51px),
      radial-gradient(ellipse at center,rgba(55,177,255,.16),rgba(55,177,255,0) 72%)!important;
    -webkit-mask-image:radial-gradient(ellipse at center,#000 0 62%,transparent 78%)!important;
    mask-image:radial-gradient(ellipse at center,#000 0 62%,transparent 78%)!important;
    filter:none!important;
  }
}

/* GRAVITY FIELD v5 — final cascade lock (旧v4より後で適用) */
.formx-hero::before{
  background:
    repeating-linear-gradient(104deg,transparent 0 57px,rgba(8,91,183,.075) 57px 58px,transparent 58px 116px),
    repeating-linear-gradient(14deg,transparent 0 64px,rgba(40,156,211,.065) 64px 65px,transparent 65px 130px)!important;
}

.formx-hero::after{
  border-color:rgba(47,141,211,.08)!important;
  background:
    radial-gradient(ellipse at 57% 52%,rgba(255,255,255,.68) 0%,rgba(198,234,255,.22) 34%,rgba(77,167,223,.06) 57%,transparent 73%)!important;
  box-shadow:inset 0 0 90px rgba(66,165,225,.055)!important;
}

@media screen and (max-width:767px){
  .formx-hero::before{
    background:
      repeating-linear-gradient(106deg,transparent 0 39px,rgba(8,91,183,.065) 39px 40px,transparent 40px 80px),
      repeating-linear-gradient(14deg,transparent 0 44px,rgba(40,156,211,.055) 44px 45px,transparent 45px 90px)!important;
  }
}

/* =========================================================
   2026-09-10 | FORMLINK HERO — GRAVITY UNDERLAY v6
   ---------------------------------------------------------
   送付スクリーンショット基準。
   メールオブジェクトの周囲ではなく「真下」にだけ、
   立体格子・空間の沈み込み・ガラス層・奥行きを配置する。
   ========================================================= */
.formx-hero::before{
  inset:28% -11% -32% 51%!important;
  background:
    repeating-linear-gradient(100deg,transparent 0 58px,rgba(8,91,183,.070) 58px 59px,transparent 59px 118px),
    repeating-linear-gradient(10deg,transparent 0 66px,rgba(40,156,211,.060) 66px 67px,transparent 67px 134px)!important;
  -webkit-mask-image:radial-gradient(ellipse at 64% 48%,#000 0 42%,rgba(0,0,0,.64) 62%,transparent 82%)!important;
  mask-image:radial-gradient(ellipse at 64% 48%,#000 0 42%,rgba(0,0,0,.64) 62%,transparent 82%)!important;
  transform:perspective(1050px) rotateX(68deg) rotateZ(-4deg) scale(1.15)!important;
  transform-origin:66% 38%!important;
  opacity:.52!important;
}

.formx-hero::after{
  top:48%!important;
  right:-8%!important;
  width:min(65vw,950px)!important;
  height:min(48vw,700px)!important;
  border-color:rgba(47,141,211,.065)!important;
  background:
    radial-gradient(ellipse at 58% 53%,rgba(255,255,255,.52) 0%,rgba(190,231,255,.18) 38%,rgba(81,171,226,.045) 58%,transparent 74%)!important;
  box-shadow:inset 0 0 90px rgba(66,165,225,.04)!important;
  opacity:.64!important;
}

.formx-gravity-field{
  perspective:1050px;
}

/* メール本体は上側に保持し、下のCSSレイヤーを見せる。 */
.formx-hero__visual .formx-gravity-field__art,
.formx-hero__visual-mobile .formx-gravity-field__art{
  left:68%!important;
  top:39%!important;
  z-index:6!important;
  width:91%!important;
  height:66%!important;
  filter:
    drop-shadow(0 20px 22px rgba(5,53,108,.16))
    drop-shadow(0 0 11px rgba(66,180,238,.10))!important;
  transform:translate(-50%,-50%) scale(.94)!important;
}

/* 接地影。HERO画像の底面から重力場へ自然につなぐ。 */
.formx-gravity-field__haze{
  inset:auto auto 17% 18%;
  z-index:0;
  width:95%;
  height:34%;
  border-radius:50%;
  background:
    radial-gradient(ellipse at 53% 47%,rgba(8,53,105,.24) 0%,rgba(32,104,167,.17) 19%,rgba(111,199,239,.17) 37%,rgba(173,226,250,.09) 51%,transparent 70%);
  filter:blur(7px);
  opacity:.88;
}

/* 3枚の床面格子。すべてメールより下側に限定。 */
.formx-gravity-field__plane{
  border-color:rgba(22,117,201,.09);
  background:
    repeating-linear-gradient(90deg,transparent 0 45px,rgba(6,82,173,.16) 45px 46px,transparent 46px 92px),
    repeating-linear-gradient(0deg,transparent 0 34px,rgba(38,157,214,.14) 34px 35px,transparent 35px 70px);
  -webkit-mask-image:radial-gradient(ellipse at 68% 24%,#000 0 40%,rgba(0,0,0,.72) 62%,transparent 84%);
  mask-image:radial-gradient(ellipse at 68% 24%,#000 0 40%,rgba(0,0,0,.72) 62%,transparent 84%);
}

.formx-gravity-field__plane--far{
  inset:50% -15% -7% -8%;
  transform:perspective(950px) rotateX(64deg) rotateZ(-4deg) translate3d(0,0,-45px) scale(1.08);
  transform-origin:68% 18%;
  opacity:.57;
}

.formx-gravity-field__plane--upper{
  inset:54% 31% -2% -7%;
  clip-path:polygon(0 0,100% 5%,100% 53%,77% 39%,58% 31%,34% 36%,0 54%);
  transform:perspective(900px) rotateX(61deg) rotateZ(8deg) translate3d(2%,0,8px);
  transform-origin:100% 22%;
  opacity:.52;
}

.formx-gravity-field__plane--lower{
  inset:53% -14% -3% 43%;
  clip-path:polygon(0 7%,100% 0,100% 56%,66% 38%,38% 31%,0 49%);
  transform:perspective(900px) rotateX(62deg) rotateZ(-8deg) translate3d(-2%,0,10px);
  transform-origin:0 22%;
  opacity:.55;
}

/* 主役の重力ネット。床面がメール直下へ落ち込む楕円構造。 */
.formx-gravity-field__mesh{
  inset:auto;
  left:68%;
  top:70%;
  z-index:2;
  width:94%;
  height:61%;
  border:1px solid rgba(21,111,196,.12);
  border-radius:50%;
  background:
    repeating-radial-gradient(ellipse 50% 45% at 50% 47%,transparent 0 15px,rgba(5,85,179,.28) 15.5px 16.5px,transparent 17px 32px),
    repeating-conic-gradient(from 270deg at 50% 47%,transparent 0deg 7.65deg,rgba(34,158,214,.25) 7.78deg 8.08deg,transparent 8.22deg 15.4deg),
    radial-gradient(ellipse at 50% 47%,rgba(255,255,255,.03) 0 18%,rgba(99,195,237,.08) 46%,transparent 72%);
  -webkit-mask-image:radial-gradient(ellipse at 50% 47%,#000 0 56%,rgba(0,0,0,.78) 68%,transparent 86%);
  mask-image:radial-gradient(ellipse at 50% 47%,#000 0 56%,rgba(0,0,0,.78) 68%,transparent 86%);
  transform:translate(-50%,-50%) perspective(900px) rotateX(57deg) rotateZ(-4deg);
  transform-origin:50% 47%;
  filter:drop-shadow(0 15px 15px rgba(7,56,112,.10));
  opacity:.94;
}

/* 外周から中心へ段階的に沈むガラスのくぼみ。 */
.formx-gravity-field__well{
  left:68%;
  top:70%;
}

.formx-gravity-field__well--outer{
  z-index:3;
  width:53%;
  height:31%;
  border-color:rgba(24,119,199,.25);
  background:
    repeating-radial-gradient(ellipse at 50% 47%,transparent 0 10px,rgba(18,109,193,.23) 10.5px 11.5px,transparent 12px 22px),
    repeating-conic-gradient(from 2deg at 50% 47%,transparent 0deg 12deg,rgba(64,176,219,.20) 12.2deg 12.65deg,transparent 12.9deg 24deg),
    radial-gradient(ellipse at 50% 43%,rgba(242,252,255,.78) 0 8%,rgba(151,215,247,.46) 25%,rgba(46,125,190,.32) 48%,rgba(8,53,105,.37) 67%,rgba(89,183,229,.12) 76%,transparent 79%);
  box-shadow:
    inset 0 -14px 30px rgba(3,43,91,.18),
    inset 0 13px 22px rgba(255,255,255,.42),
    0 14px 26px rgba(21,88,151,.09);
  transform:translate(-50%,-50%) perspective(700px) rotateX(53deg) rotateZ(-4deg);
}

.formx-gravity-field__well--inner{
  left:68.4%;
  top:70%;
  z-index:4;
  width:27%;
  height:14%;
  border-color:rgba(202,239,255,.50);
  background:
    radial-gradient(ellipse at 50% 38%,rgba(217,244,255,.64) 0 10%,rgba(70,151,208,.42) 40%,rgba(7,49,99,.46) 75%,rgba(12,67,127,.32) 100%);
  box-shadow:
    inset 0 -9px 16px rgba(3,37,80,.23),
    inset 0 7px 12px rgba(255,255,255,.34),
    0 0 18px rgba(89,194,237,.14);
  transform:translate(-50%,-50%) perspective(650px) rotateX(52deg) rotateZ(-4deg);
}

/* 最上層の薄いガラス面。網の立体感を壊さない透明度に抑える。 */
.formx-gravity-field__glint{
  left:38%;
  top:57%;
  z-index:5;
  width:63%;
  height:25%;
  border:1px solid rgba(255,255,255,.38);
  border-top-color:rgba(255,255,255,.72);
  border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.17),rgba(139,215,248,.04));
  box-shadow:inset 0 8px 18px rgba(255,255,255,.10);
  transform:perspective(780px) rotateX(58deg) rotateZ(-5deg);
  filter:drop-shadow(0 0 5px rgba(255,255,255,.34));
  opacity:.62;
}

@keyframes formx-gravity-mesh-drift{
  0%,100%{
    background-position:0 0,0 0,0 0;
    transform:translate(-50%,-50%) perspective(900px) rotateX(57deg) rotateZ(-4deg);
  }
  50%{
    background-position:3px -2px,-2px 1px,0 0;
    transform:translate(-50%,-50%) perspective(900px) rotateX(59deg) rotateZ(-3.5deg);
  }
}

@media screen and (min-width:768px) and (max-width:1100px){
  .formx-hero__visual .formx-gravity-field__art{
    top:40%!important;
    width:94%!important;
  }
  .formx-gravity-field__mesh{width:101%;}
  .formx-gravity-field__well--outer{width:57%;}
}

@media screen and (max-width:767px){
  .formx-hero::before{
    inset:55% -34% -20% 18%!important;
    -webkit-mask-image:radial-gradient(ellipse at 58% 36%,#000 0 42%,rgba(0,0,0,.58) 64%,transparent 84%)!important;
    mask-image:radial-gradient(ellipse at 58% 36%,#000 0 42%,rgba(0,0,0,.58) 64%,transparent 84%)!important;
    opacity:.40!important;
  }

  .formx-hero::after{
    right:-40%!important;
    bottom:-5%!important;
    opacity:.40!important;
  }

  .formx-hero__visual-mobile .formx-gravity-field__art{
    left:66%!important;
    top:36%!important;
    width:94%!important;
    height:64%!important;
    transform:translate(-50%,-50%) scale(.92)!important;
  }

  .formx-gravity-field__haze{
    left:10%;
    bottom:15%;
    width:105%;
    height:34%;
  }

  .formx-gravity-field__plane--far{
    inset:49% -22% -9% -14%;
    opacity:.45;
  }

  .formx-gravity-field__plane--upper{
    inset:53% 27% -5% -13%;
    opacity:.43;
  }

  .formx-gravity-field__plane--lower{
    inset:52% -20% -5% 39%;
    opacity:.45;
  }

  .formx-gravity-field__mesh{
    left:66%;
    top:70%;
    width:108%;
    height:63%;
    opacity:.88;
  }

  .formx-gravity-field__well{
    left:66%;
    top:70%;
  }

  .formx-gravity-field__well--outer{
    width:58%;
    height:32%;
  }

  .formx-gravity-field__well--inner{
    left:66.3%;
    width:30%;
    height:15%;
  }

  .formx-gravity-field__glint{
    left:31%;
    top:56%;
    width:70%;
  }
}

/* =========================================================
   2026-09-10 | FORMLINK HERO — GRAVITY FIELD v5
   ---------------------------------------------------------
   ワームホール／重力の網を抽象化したCSSビジュアル。
   画像は使用せず、複数の格子面・光・奥行きのみで構成する。
   ========================================================= */
.formx-hero{
  --gravity-line:rgba(10,98,194,.28);
  --gravity-line-bright:rgba(33,166,226,.32);
  --gravity-navy:rgba(7,49,99,.46);
  --gravity-cyan:rgba(98,205,249,.28);
  isolation:isolate!important;
  background:
    radial-gradient(ellipse at 81% 50%,rgba(148,218,255,.30) 0%,rgba(90,183,238,.15) 28%,rgba(38,115,195,.055) 49%,transparent 69%),
    linear-gradient(101deg,#fff 0%,#fff 38%,#fbfdff 50%,#edf7ff 72%,#dceefe 100%)!important;
}

/* HERO背面の静かな設計格子。文字側では完全に消す。 */
.formx-hero::before{
  content:""!important;
  position:absolute!important;
  inset:-24% -12% -25% 32%!important;
  z-index:0!important;
  display:block!important;
  pointer-events:none!important;
  background:
    repeating-linear-gradient(104deg,transparent 0 57px,rgba(8,91,183,.075) 57px 58px,transparent 58px 116px),
    repeating-linear-gradient(14deg,transparent 0 64px,rgba(40,156,211,.065) 64px 65px,transparent 65px 130px)!important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.10) 18%,#000 48%,#000 100%)!important;
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.10) 18%,#000 48%,#000 100%)!important;
  transform:perspective(1000px) rotateX(62deg) rotateZ(-5deg) scale(1.16)!important;
  transform-origin:78% 50%!important;
  opacity:.78!important;
}

/* 右側だけに残す柔らかなガラスの層。 */
.formx-hero::after{
  content:""!important;
  position:absolute!important;
  top:49%!important;
  right:-9%!important;
  z-index:0!important;
  width:min(67vw,980px)!important;
  height:min(48vw,690px)!important;
  display:block!important;
  border:1px solid rgba(47,141,211,.08)!important;
  border-radius:52% 48% 46% 54% / 58% 44% 56% 42%!important;
  background:
    radial-gradient(ellipse at 57% 52%,rgba(255,255,255,.68) 0%,rgba(198,234,255,.22) 34%,rgba(77,167,223,.06) 57%,transparent 73%)!important;
  box-shadow:inset 0 0 90px rgba(66,165,225,.055)!important;
  transform:translateY(-50%) rotate(-5deg)!important;
  opacity:.92!important;
  pointer-events:none!important;
}

.formx-hero__visual{
  position:relative!important;
  z-index:2!important;
  width:112%!important;
  height:540px!important;
  min-width:0!important;
  margin-left:-8%!important;
  display:block!important;
  overflow:visible!important;
  transform:none!important;
  pointer-events:none!important;
}

.formx-hero__visual::before,
.formx-hero__visual::after,
.formx-hero__visual-mobile.service-reveal-mobile-visual::before{
  content:none!important;
  display:none!important;
}

.formx-hero__visual > img,
.formx-hero__visual-mobile > img{
  display:none!important;
}

.formx-gravity-field,
.formx-gravity-field *{
  box-sizing:border-box;
}

.formx-gravity-field{
  position:relative;
  width:100%;
  height:100%;
  min-height:420px;
  overflow:visible;
  isolation:isolate;
  perspective:1100px;
  transform-style:preserve-3d;
  filter:saturate(.96) contrast(1.02);
  animation:formx-gravity-breathe 9s ease-in-out infinite;
}

.formx-gravity-field > span{
  position:absolute;
  display:block;
  pointer-events:none;
}

.formx-gravity-field__haze{
  inset:8% -7% 5% 1%;
  z-index:0;
  border-radius:50%;
  background:
    radial-gradient(ellipse at 70% 55%,rgba(255,255,255,.98) 0 8%,rgba(172,226,255,.44) 23%,rgba(76,164,224,.18) 43%,rgba(20,91,170,.075) 58%,transparent 74%);
  filter:blur(8px);
  opacity:.96;
  animation:formx-gravity-haze 7s ease-in-out infinite;
}

/* 遠景の直線格子。中央へ向かう前の整った空間を表現。 */
.formx-gravity-field__plane{
  z-index:1;
  border:1px solid rgba(24,119,202,.10);
  background:
    repeating-linear-gradient(90deg,transparent 0 47px,rgba(7,84,173,.14) 47px 48px,transparent 48px 96px),
    repeating-linear-gradient(0deg,transparent 0 38px,rgba(43,162,215,.12) 38px 39px,transparent 39px 78px);
  -webkit-mask-image:radial-gradient(ellipse at 70% 54%,#000 0 48%,rgba(0,0,0,.75) 65%,transparent 84%);
  mask-image:radial-gradient(ellipse at 70% 54%,#000 0 48%,rgba(0,0,0,.75) 65%,transparent 84%);
}

.formx-gravity-field__plane--far{
  inset:3% -13% 0 -12%;
  transform:rotateX(66deg) rotateZ(-7deg) translate3d(-1%,16%,-96px) scale(1.12);
  transform-origin:70% 54%;
  opacity:.50;
}

.formx-gravity-field__plane--upper{
  inset:-4% -8% 22% -3%;
  clip-path:polygon(0 3%,100% 0,100% 75%,82% 77%,70% 67%,57% 51%,37% 38%,0 34%);
  transform:perspective(950px) rotateX(-45deg) rotateZ(3deg) translate3d(1%,2%,22px);
  transform-origin:70% 57%;
  opacity:.52;
}

.formx-gravity-field__plane--lower{
  inset:30% -12% -8% -5%;
  clip-path:polygon(0 19%,35% 15%,56% 25%,69% 41%,82% 52%,100% 51%,100% 100%,0 100%);
  transform:perspective(950px) rotateX(48deg) rotateZ(-3deg) translate3d(0,1%,12px);
  transform-origin:70% 38%;
  opacity:.58;
}

/* 楕円リング＋放射線で、直線格子が重力点の周囲だけ曲がる状態を作る。 */
.formx-gravity-field__mesh{
  inset:1% -8% -1% -4%;
  z-index:2;
  border-radius:48% 52% 47% 53% / 52% 45% 55% 48%;
  background:
    repeating-radial-gradient(ellipse 57% 51% at 70% 55%,transparent 0 19px,rgba(5,88,181,.24) 19.5px 20.5px,transparent 21px 40px),
    repeating-conic-gradient(from 267deg at 70% 55%,transparent 0deg 6.45deg,rgba(34,160,215,.24) 6.58deg 6.86deg,transparent 7deg 12.9deg);
  -webkit-mask-image:radial-gradient(ellipse 69% 61% at 70% 55%,rgba(0,0,0,.96) 0 52%,rgba(0,0,0,.80) 64%,transparent 83%);
  mask-image:radial-gradient(ellipse 69% 61% at 70% 55%,rgba(0,0,0,.96) 0 52%,rgba(0,0,0,.80) 64%,transparent 83%);
  transform:rotate(-4deg) scaleY(.91);
  transform-origin:70% 55%;
  opacity:.92;
  animation:formx-gravity-mesh-drift 14s ease-in-out infinite;
}

.formx-gravity-field__well{
  left:70%;
  top:55%;
  z-index:3;
  border-radius:50%;
  transform:translate(-50%,-50%) rotate(-5deg);
  transform-origin:center;
}

.formx-gravity-field__well--outer{
  width:51%;
  height:48%;
  border:1px solid rgba(16,98,185,.24);
  background:
    repeating-radial-gradient(ellipse at 50% 49%,transparent 0 11px,rgba(22,118,199,.19) 11.5px 12.5px,transparent 13px 24px),
    repeating-conic-gradient(from 4deg at 50% 49%,transparent 0deg 11deg,rgba(55,172,219,.20) 11.2deg 11.7deg,transparent 11.9deg 22deg),
    radial-gradient(ellipse at 50% 43%,rgba(250,254,255,.96) 0 7%,rgba(185,229,253,.62) 21%,rgba(85,158,214,.35) 44%,rgba(8,55,111,.38) 62%,rgba(78,169,226,.15) 70%,transparent 73%);
  box-shadow:
    inset 0 -24px 48px rgba(4,47,101,.17),
    inset 0 22px 34px rgba(255,255,255,.52),
    0 14px 38px rgba(28,106,176,.10);
  filter:drop-shadow(0 18px 22px rgba(14,74,137,.10));
}

.formx-gravity-field__well--inner{
  left:70.5%;
  top:53.5%;
  z-index:3;
  width:27%;
  height:23%;
  border:1px solid rgba(213,242,255,.56);
  background:
    radial-gradient(ellipse at 48% 38%,rgba(255,255,255,.86) 0 10%,rgba(161,217,247,.54) 34%,rgba(16,75,139,.45) 68%,rgba(7,48,98,.34) 100%);
  box-shadow:
    inset 0 -15px 26px rgba(4,38,82,.22),
    inset 0 11px 18px rgba(255,255,255,.44),
    0 0 24px rgba(93,198,243,.18);
  opacity:.90;
}

/* 既存のFORMLINKオブジェクトだけを前景に残す。
   背景・網・奥行きはすべてCSSで生成している。 */
.formx-hero__visual .formx-gravity-field__art,
.formx-hero__visual-mobile .formx-gravity-field__art{
  position:absolute!important;
  left:70%!important;
  top:54%!important;
  z-index:4!important;
  width:76%!important;
  max-width:none!important;
  height:72%!important;
  max-height:none!important;
  margin:0!important;
  display:block!important;
  object-fit:contain!important;
  object-position:center!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  filter:
    drop-shadow(0 24px 28px rgba(7,54,111,.18))
    drop-shadow(0 0 14px rgba(78,183,236,.12))!important;
  transform:translate(-50%,-50%) scale(.92)!important;
  transform-origin:center!important;
  opacity:1!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}

.formx-gravity-field__glint{
  left:45%;
  top:26%;
  z-index:5;
  width:48%;
  height:43%;
  border-top:2px solid rgba(255,255,255,.86);
  border-radius:50%;
  transform:rotate(-12deg);
  filter:drop-shadow(0 0 5px rgba(255,255,255,.68));
  opacity:.72;
}

@keyframes formx-gravity-breathe{
  0%,100%{filter:saturate(.94) contrast(1.01);}
  50%{filter:saturate(1.04) contrast(1.035);}
}

@keyframes formx-gravity-haze{
  0%,100%{opacity:.84;transform:scale(.985);}
  50%{opacity:1;transform:scale(1.018);}
}

@keyframes formx-gravity-mesh-drift{
  0%,100%{background-position:0 0,0 0;transform:rotate(-4deg) scaleY(.91);}
  50%{background-position:5px -3px,-2px 2px;transform:rotate(-3.35deg) scaleY(.925);}
}

@media screen and (min-width:768px) and (max-width:1100px){
  .formx-hero__visual{
    width:118%!important;
    height:470px!important;
    margin-left:-12%!important;
  }
  .formx-hero::after{
    right:-18%!important;
    width:760px!important;
    height:550px!important;
  }
  .formx-gravity-field__mesh{opacity:.84;}
}

@media screen and (max-width:767px){
  .formx-hero{
    background:
      radial-gradient(ellipse at 76% 75%,rgba(116,207,252,.25) 0%,rgba(66,154,218,.10) 35%,transparent 63%),
      linear-gradient(155deg,#fff 0%,#fff 52%,#f2f9ff 74%,#e1f1ff 100%)!important;
  }

  .formx-hero::before{
    inset:43% -36% -14% 10%!important;
    background:
      repeating-linear-gradient(106deg,transparent 0 39px,rgba(8,91,183,.065) 39px 40px,transparent 40px 80px),
      repeating-linear-gradient(14deg,transparent 0 44px,rgba(40,156,211,.055) 44px 45px,transparent 45px 90px)!important;
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.18) 19%,#000 48%,#000 100%)!important;
    mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.18) 19%,#000 48%,#000 100%)!important;
    transform:perspective(800px) rotateX(62deg) rotateZ(-5deg) scale(1.18)!important;
    opacity:.62!important;
  }

  .formx-hero::after{
    top:auto!important;
    right:-38%!important;
    bottom:-6%!important;
    width:118vw!important;
    height:68vw!important;
    transform:rotate(-5deg)!important;
    opacity:.60!important;
  }

  .formx-hero__visual-mobile.service-reveal-mobile-visual{
    position:relative!important;
    z-index:2!important;
    width:calc(100% + 18px)!important;
    height:clamp(210px,56vw,285px)!important;
    min-height:210px!important;
    margin:9px -9px 4px!important;
    padding:0!important;
    display:block!important;
    overflow:visible!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    pointer-events:none!important;
  }

  .formx-gravity-field{
    min-height:0;
    transform:scale(1.05);
    transform-origin:center;
  }

  .formx-gravity-field__plane--far{opacity:.34;}
  .formx-gravity-field__plane--upper{opacity:.43;}
  .formx-gravity-field__plane--lower{opacity:.47;}
  .formx-gravity-field__mesh{opacity:.82;}
  .formx-gravity-field__well--outer{width:49%;height:48%;}
  .formx-gravity-field__well--inner{width:26%;height:23%;}
  .formx-hero__visual-mobile .formx-gravity-field__art{
    width:78%!important;
    height:78%!important;
    transform:translate(-50%,-50%) scale(.90)!important;
  }
}

@media screen and (max-width:390px){
  .formx-hero__visual-mobile.service-reveal-mobile-visual{
    height:205px!important;
    min-height:205px!important;
    margin-top:6px!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .formx-gravity-field,
  .formx-gravity-field__haze,
  .formx-gravity-field__mesh{
    animation:none!important;
  }
}

/* =========================================================
   2026-09-10 | FORMLINK HERO — CYBER MESH LINE BOOST v4
   網目・斜め格子の線色だけを濃くし、背景グラデーションと可読性は維持。
   ========================================================= */
.formx-hero::before{
  background:
    repeating-linear-gradient(32deg,
      transparent 0 30px,
      rgba(0,96,214,.24) 30px 31.45px,
      transparent 31.45px 61px),
    repeating-linear-gradient(148deg,
      transparent 0 30px,
      rgba(0,166,220,.22) 30px 31.45px,
      transparent 31.45px 61px),
    linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.94) 35%,rgba(255,255,255,.52) 48%,rgba(255,255,255,0) 66%)!important;
}

.formx-hero::after{
  border-color:rgba(0,118,222,.34)!important;
  background:
    repeating-linear-gradient(30deg,
      transparent 0 35px,
      rgba(0,120,222,.16) 35px 36.2px,
      transparent 36.2px 70px),
    repeating-linear-gradient(150deg,
      transparent 0 35px,
      rgba(0,178,216,.14) 35px 36.2px,
      transparent 36.2px 70px),
    radial-gradient(ellipse at center,
      rgba(255,255,255,.28) 0%,
      rgba(116,213,255,.12) 34%,
      rgba(0,137,226,.055) 51%,
      rgba(0,137,226,0) 72%)!important;
  box-shadow:
    inset 0 0 70px rgba(0,106,214,.13),
    0 0 80px rgba(0,151,235,.12)!important;
}

.formx-hero__visual::before{
  border-color:rgba(0,101,222,.48)!important;
  background:
    repeating-linear-gradient(34deg,
      transparent 0 27px,
      rgba(0,104,222,.34) 27px 28.7px,
      transparent 28.7px 56px),
    repeating-linear-gradient(146deg,
      transparent 0 27px,
      rgba(0,184,220,.30) 27px 28.7px,
      transparent 28.7px 56px),
    radial-gradient(circle at 48% 47%,
      rgba(233,250,255,.82) 0%,
      rgba(154,229,255,.28) 23%,
      rgba(40,156,239,.14) 43%,
      rgba(0,111,212,.045) 61%,
      rgba(0,111,212,0) 73%)!important;
  box-shadow:
    inset 0 0 56px rgba(0,88,210,.16),
    0 0 48px rgba(0,157,235,.15)!important;
}

.formx-hero__visual::after{
  border-color:rgba(0,151,218,.40)!important;
  background:
    repeating-linear-gradient(24deg,
      transparent 0 31px,
      rgba(0,93,220,.25) 31px 32.3px,
      transparent 32.3px 63px),
    repeating-linear-gradient(156deg,
      transparent 0 31px,
      rgba(0,174,216,.22) 31px 32.3px,
      transparent 32.3px 63px),
    radial-gradient(ellipse at center,rgba(255,255,255,.10),rgba(25,162,241,.045) 55%,transparent 72%)!important;
}

@media screen and (max-width:767px){
  .formx-hero::before{
    background:
      repeating-linear-gradient(32deg,
        transparent 0 24px,
        rgba(0,102,216,.16) 24px 25.2px,
        transparent 25.2px 49px),
      repeating-linear-gradient(148deg,
        transparent 0 24px,
        rgba(0,170,216,.14) 24px 25.2px,
        transparent 25.2px 49px)!important;
  }
  .formx-hero__visual-mobile.service-reveal-mobile-visual::before{
    background:
      repeating-linear-gradient(33deg,
        transparent 0 25px,
        rgba(0,102,216,.20) 25px 26.2px,
        transparent 26.2px 51px),
      repeating-linear-gradient(147deg,
        transparent 0 25px,
        rgba(0,176,216,.17) 25px 26.2px,
        transparent 26.2px 51px),
      radial-gradient(ellipse at center,rgba(55,177,255,.16),rgba(55,177,255,0) 72%)!important;
  }
}

/* GRAVITY FIELD v5 — final cascade lock (旧v4より後で適用) */
.formx-hero::before{
  background:
    repeating-linear-gradient(104deg,transparent 0 57px,rgba(8,91,183,.075) 57px 58px,transparent 58px 116px),
    repeating-linear-gradient(14deg,transparent 0 64px,rgba(40,156,211,.065) 64px 65px,transparent 65px 130px)!important;
}

.formx-hero::after{
  border-color:rgba(47,141,211,.08)!important;
  background:
    radial-gradient(ellipse at 57% 52%,rgba(255,255,255,.68) 0%,rgba(198,234,255,.22) 34%,rgba(77,167,223,.06) 57%,transparent 73%)!important;
  box-shadow:inset 0 0 90px rgba(66,165,225,.055)!important;
}

@media screen and (max-width:767px){
  .formx-hero::before{
    background:
      repeating-linear-gradient(106deg,transparent 0 39px,rgba(8,91,183,.065) 39px 40px,transparent 40px 80px),
      repeating-linear-gradient(14deg,transparent 0 44px,rgba(40,156,211,.055) 44px 45px,transparent 45px 90px)!important;
  }
}

/* =========================================================
   2026-09-12 | FORMLINK SP HERO — PC BACKGROUND UNIFICATION FINAL
   PC版で採用している formLink HERO背景をSP版HERO全体にも使用。
   SP版のロゴ / コピー / HERO画像 / CTA / SCROLLレイアウトは維持。
   ========================================================= */
@media screen and (max-width:767px){
  .formx-hero{
    position:relative!important;
    isolation:isolate!important;
    background-color:#fff!important;
    background-image:url("../img/vector/formlink-hero-background.png")!important;
    background-repeat:no-repeat!important;
    background-size:cover!important;
    background-position:72% center!important;
  }

  /* SP専用で重ねていたCSS背景演出を停止し、PC採用背景をそのまま見せる */
  .formx-hero::before,
  .formx-hero::after,
  .formx-hero__visual-mobile.service-reveal-mobile-visual::before,
  .formx-hero__visual-mobile.service-reveal-mobile-visual::after{
    content:none!important;
    display:none!important;
    background:none!important;
    border:0!important;
    box-shadow:none!important;
    filter:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }

  /* 旧重力・メッシュ系の背景レイヤーはSPでは停止 */
  .formx-vortex-library,
  .formx-gravity-field,
  .formx-gravity-surface,
  .formx-hero__approved-vortex{
    display:none!important;
  }

  /* 現行SP HERO画像をそのまま前面に残す */
  .formx-hero__visual-mobile.service-reveal-mobile-visual{
    position:relative!important;
    z-index:2!important;
    background:transparent!important;
  }

  .formx-hero__visual-mobile.service-reveal-mobile-visual > img,
  .formx-hero__visual-mobile.service-reveal-mobile-visual .formx-hero__mobile-original{
    display:block!important;
    position:relative!important;
    z-index:2!important;
    opacity:1!important;
    visibility:visible!important;
    background:transparent!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }

  .formx-hero__content{
    position:relative!important;
    z-index:3!important;
  }

  .formx-kicker,
  .formx-brand-logo-frame,
  .formx-hero h1,
  .formx-hero__lead,
  .formx-hero__text,
  .formx-hero__visual-mobile,
  .formx-hero__cta,
  .service-reveal-scroll{
    position:relative!important;
    z-index:4!important;
  }
}

@media screen and (max-width:390px){
  .formx-hero{
    background-position:76% center!important;
  }
}

/* =========================================================
   2026-09-12 | FORMLINK SP HERO — SILVER × BLUE CSS BACKGROUND PREVIEW
   - 白〜銀〜青グラデーション
   - 右側に大きな円弧 / 同心円
   - 星 / 粒 / ノード / 追加装飾なし
   - 青い台座なし
   - 既存SPレイアウト / HERO画像 / CTA / SCROLLは維持
   ========================================================= */
@media screen and (max-width:767px){
  .formx-hero{
    position:relative!important;
    isolation:isolate!important;
    overflow:hidden!important;
    background-image:none!important;
    background:
      radial-gradient(
        ellipse 115% 92% at 18% 34%,
        rgba(255,255,255,1) 0%,
        rgba(255,255,255,.98) 32%,
        rgba(241,246,251,.94) 50%,
        rgba(220,234,246,.84) 66%,
        rgba(180,214,241,.64) 80%,
        rgba(117,183,232,.46) 100%
      ),
      linear-gradient(
        118deg,
        #ffffff 0%,
        #fbfdff 34%,
        #eef4f9 55%,
        #d7e8f6 72%,
        #acd3ef 87%,
        #78b9e7 100%
      )!important;
  }

  .formx-hero::before{
    content:""!important;
    position:absolute!important;
    z-index:0!important;
    width:148vw!important;
    height:148vw!important;
    right:-90vw!important;
    top:6%!important;
    display:block!important;
    border:2px solid rgba(255,255,255,.78)!important;
    border-radius:50%!important;
    background:transparent!important;
    box-shadow:
      0 0 0 18px rgba(255,255,255,.10),
      0 0 0 54px rgba(255,255,255,.055),
      0 0 0 96px rgba(126,189,235,.050)!important;
    transform:none!important;
    opacity:1!important;
    filter:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
    pointer-events:none!important;
  }

  .formx-hero::after{
    content:""!important;
    position:absolute!important;
    z-index:0!important;
    width:116vw!important;
    height:116vw!important;
    right:-64vw!important;
    top:23%!important;
    display:block!important;
    border:1.5px solid rgba(255,255,255,.72)!important;
    border-radius:50%!important;
    background:
      radial-gradient(
        ellipse at center,
        rgba(255,255,255,.08) 0%,
        rgba(255,255,255,.04) 49%,
        rgba(255,255,255,0) 69%
      )!important;
    box-shadow:
      0 0 0 1px rgba(128,190,235,.14),
      0 0 0 32px rgba(255,255,255,.045),
      0 0 0 66px rgba(255,255,255,.028)!important;
    transform:none!important;
    opacity:1!important;
    filter:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
    pointer-events:none!important;
  }

  .formx-vortex-library,
  .formx-gravity-field,
  .formx-gravity-surface,
  .formx-hero__approved-vortex{
    display:none!important;
  }

  .formx-hero__visual-mobile.service-reveal-mobile-visual::before,
  .formx-hero__visual-mobile.service-reveal-mobile-visual::after{
    content:none!important;
    display:none!important;
    background:none!important;
    border:0!important;
    box-shadow:none!important;
    filter:none!important;
  }

  .formx-hero__inner{
    position:relative!important;
    z-index:1!important;
    background:transparent!important;
  }

  .formx-hero__content{
    position:relative!important;
    z-index:2!important;
    background:transparent!important;
  }

  .formx-kicker,
  .formx-brand-logo-frame,
  .formx-hero h1,
  .formx-hero__lead,
  .formx-hero__text,
  .formx-hero__visual-mobile,
  .formx-hero__cta,
  .service-reveal-scroll{
    position:relative!important;
    z-index:3!important;
  }

  .formx-hero__visual-mobile.service-reveal-mobile-visual{
    background:transparent!important;
  }

  .formx-hero__visual-mobile.service-reveal-mobile-visual > img,
  .formx-hero__visual-mobile.service-reveal-mobile-visual .formx-hero__mobile-original{
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
    background:transparent!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }
}

@media screen and (max-width:390px){
  .formx-hero::before{right:-96vw!important;}
  .formx-hero::after{right:-70vw!important;}
}

/* =========================================================
   2026-09-12 | FORMLINK SP HERO — BACKGROUND IMAGE FINAL
   - 背景画像のみ差し替え
   - 現行SPの横幅 / 文言 / ロゴ / HERO画像 / CTA / SCROLL配置は変更しない
   - 星 / 粒 / ノード / 青い台座なし
   ========================================================= */
@media screen and (max-width:767px){
  .formx-hero{
    position:relative!important;
    isolation:isolate!important;
    overflow:hidden!important;
    background-color:#fff!important;
    background-image:url("../img/vector/formlink-sp-background-silver-blue.png")!important;
    background-repeat:no-repeat!important;
    background-size:cover!important;
    background-position:center center!important;
  }

  .formx-hero::before,
  .formx-hero::after,
  .formx-hero__visual-mobile.service-reveal-mobile-visual::before,
  .formx-hero__visual-mobile.service-reveal-mobile-visual::after{
    content:none!important;
    display:none!important;
    background:none!important;
    border:0!important;
    box-shadow:none!important;
    filter:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }

  .formx-vortex-library,
  .formx-gravity-field,
  .formx-gravity-surface,
  .formx-hero__approved-vortex{
    display:none!important;
  }

  .formx-hero__inner,
  .formx-hero__content,
  .formx-hero__visual-mobile.service-reveal-mobile-visual{
    background:transparent!important;
  }

  .formx-hero__visual-mobile.service-reveal-mobile-visual > img,
  .formx-hero__visual-mobile.service-reveal-mobile-visual .formx-hero__mobile-original{
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
    background:transparent!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }
}