:root {
  --color-bg: #f7fbff;
  --color-bg-soft: #eef6fc;
  --color-surface: #ffffff;
  --color-text: #15263d;
  --color-text-soft: #5f6f82;
  --color-primary: #2f90d0;
  --color-primary-dark: #1e6fa7;
  --color-accent: #ef8a77;
  --color-line: #dce8f1;
  --font-heading: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  --font-body: "Noto Sans JP", sans-serif;
  --container: 1180px;
  --radius-sm: 12px;
  --radius-md: 22px;
  --radius-lg: 34px;
  --shadow-soft: 0 22px 60px rgba(44, 85, 122, 0.12);
  --shadow-card: 0 14px 34px rgba(44, 85, 122, 0.09);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--color-text);
  background: var(--color-surface);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.9;
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
  text-decoration: none;
}

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

.container {
  width: min(calc(100% - 48px), var(--container));
  margin-inline: auto;
}

.eyebrow {
  margin: 0 0 18px;
  color: var(--color-primary);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.button {
  display: inline-flex;
  min-height: 58px;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 0 28px;
  border-radius: 999px;
  font-weight: 700;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.button:hover {
  transform: translateY(-2px);
}

.button--primary {
  color: #fff;
  background: var(--color-primary);
  box-shadow: 0 14px 28px rgba(47, 144, 208, 0.28);
}

.button--primary:hover {
  background: var(--color-primary-dark);
  box-shadow: 0 18px 34px rgba(47, 144, 208, 0.34);
}

/* HERO */

.hero__brand{
    position:absolute;
    top:24px;
    left:48px;
    z-index:20;
}

.hero__brand img{
    width:140px;
    height:auto;
}

.hero {
  position: relative;
  overflow: hidden;
  min-height: 760px;
  display: flex;
  align-items: center;
  background:
    radial-gradient(circle at 75% 18%, rgba(133, 205, 243, 0.24), transparent 26%),
    linear-gradient(135deg, #ffffff 0%, #f7fbff 47%, #edf7fd 100%);
}

.hero::before {
  position: absolute;
  inset: auto auto -160px -140px;
  width: 380px;
  height: 380px;
  border-radius: 50%;
  background: rgba(110, 190, 234, 0.08);
  content: "";
}

.hero__inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(420px, 0.92fr);
  gap: 70px;
  align-items: center;
  padding-top:96px;
  padding-bottom:96px;
}

.hero__content {
  position: relative;
  z-index: 2;
}

.hero__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: clamp(2.6rem, 4.7vw, 4.8rem);
  line-height: 1.3;
  letter-spacing: -0.045em;
}

.hero__title span {
  color: var(--color-primary);
}

.hero__lead {
  max-width: 680px;
  margin: 34px 0 0;
  font-size: clamp(1.05rem, 1.5vw, 1.25rem);
  line-height: 2;
}

.hero__lead strong {
  color: var(--color-primary-dark);
}

.hero__description {
  max-width: 650px;
  margin: 20px 0 0;
  color: var(--color-text-soft);
}

.hero__actions {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-top: 36px;
}

.hero__note {
  max-width: 250px;
  margin: 0;
  color: var(--color-text-soft);
  font-size: 0.84rem;
  line-height: 1.7;
}

.hero__visual {
  position: relative;
  z-index: 1;
  margin: 0;
}

.hero__image-frame {
  position: relative;
  overflow: hidden;
  aspect-ratio: 4 / 4.55;
  border: 1px solid rgba(121, 177, 213, 0.22);
  border-radius: var(--radius-lg);
  background: #fff;
  box-shadow: var(--shadow-soft);
}

.hero__image-frame::after {
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4);
  content: "";
}

.hero__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 56% center;
  transition: transform 0.5s ease;
}

.hero__image-frame:hover .hero__image {
  transform: scale(1.015);
}

.hero__image-caption {
  max-width: 470px;
  margin: 16px 8px 0;
  color: var(--color-text-soft);
  font-size: 0.78rem;
  line-height: 1.7;
}

@media (max-width: 980px) {
  .hero {
    min-height: auto;
  }

  .hero__inner {
    grid-template-columns: 1fr;
    gap: 56px;
    padding-top: 96px;
    padding-bottom: 78px;
  }

  .hero__content {
    max-width: 760px;
  }

  .hero__visual {
    width: min(100%, 720px);
  }

  .hero__image-frame {
    aspect-ratio: 16 / 10;
  }

  .hero__image {
    object-position: center 46%;
  }
}

@media (max-width: 680px) {
  .hero__brand {
    top: 20px;
    left: 20px;
  }

  .hero__brand img {
    width: 120px;
  }

  .hero__inner {
    gap: 42px;
    padding-top: 110px;
    padding-bottom: 66px;
  }

  .hero__title {
    font-size: clamp(2.15rem, 10vw, 3.3rem);
  }

  .hero__lead {
    margin-top: 26px;
    font-size: 1rem;
  }

  .hero__actions {
    align-items: flex-start;
    flex-direction: column;
    gap: 14px;
  }

  .hero__note {
    max-width: none;
  }

  .hero__image-frame {
    aspect-ratio: 4 / 3.65;
    border-radius: 24px;
  }

  .hero__image {
    object-position: 58% center;
  }

  .hero__image-caption {
    margin-inline: 2px;
  }
}

/* ACWD FEATURES */

.features {
  position: relative;
  padding-block: 96px 104px;
  overflow: hidden;
  border-bottom: 1px solid rgba(220, 232, 241, 0.72);
  background: #fff;
}
.features::before {
  position: absolute;
  inset: -120px auto auto 50%;
  width: 720px;
  height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(47, 144, 208, 0.07), transparent 68%);
  content: "";
  transform: translateX(-50%);
  pointer-events: none;
}
.features__heading {
  position: relative;
  max-width: 720px;
  margin: 0 auto 62px;
  text-align: center;
}
.features__heading h2 {
  margin: 0;
  font-family: var(--font-heading);
  font-size: clamp(1.85rem, 3vw, 2.7rem);
  line-height: 1.45;
  letter-spacing: -0.035em;
}
.features__grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.feature-item {
  position: relative;
  min-width: 0;
  padding: 0 30px;
  text-align: center;
}
.feature-item + .feature-item { border-left: 1px solid var(--color-line); }
.feature-item__number {
  display: block;
  color: var(--color-primary-dark);
  font-size: 1.9rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
}
.feature-item__rule {
  display: block;
  width: 34px;
  height: 2px;
  margin: 15px auto 27px;
  border-radius: 999px;
  background: rgba(47, 144, 208, 0.65);
}
.feature-item__icon {
  width: min(100%, 210px);
  aspect-ratio: 1;
  margin: 0 auto 28px;
  overflow: hidden;
  border-radius: 50%;
}
.feature-item__icon img { width: 100%; height: 100%; object-fit: cover; }
.feature-item h3 {
  min-height: 3.2em;
  margin: 0 0 18px;
  font-family: var(--font-heading);
  font-size: clamp(1.03rem, 1.45vw, 1.22rem);
  line-height: 1.6;
  letter-spacing: -0.02em;
}
.feature-item p {
  margin: 0;
  color: var(--color-text-soft);
  font-size: 0.88rem;
  line-height: 1.95;
}
@media (max-width: 980px) {
  .features { padding-block: 84px 90px; }
  .features__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 54px; }
  .feature-item { padding-inline: 38px; }
  .feature-item:nth-child(3) { border-left: 0; }
  .feature-item:nth-child(n + 3) { padding-top: 6px; }
}
@media (max-width: 680px) {
  .features { padding-block: 72px 78px; }
  .features__heading { margin-bottom: 44px; }
  .features__heading h2 { font-size: 1.9rem; }
  .features__grid { grid-template-columns: 1fr; gap: 0; }
  .feature-item {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    grid-template-areas: "number content" "icon content";
    column-gap: 22px;
    align-items: start;
    padding: 30px 0;
    text-align: left;
  }
  .feature-item:first-child { padding-top: 0; }
  .feature-item:last-child { padding-bottom: 0; }
  .feature-item + .feature-item { border-top: 1px solid var(--color-line); border-left: 0; }
  .feature-item:nth-child(n + 3) { padding-top: 30px; }
  .feature-item__number { grid-area: number; align-self: end; font-size: 1.35rem; }
  .feature-item__rule { display: none; }
  .feature-item__icon { grid-area: icon; width: 96px; margin: 12px 0 0; }
  .feature-item h3, .feature-item p { grid-column: 2; }
  .feature-item h3 { grid-row: 1; align-self: end; min-height: 0; margin: 0 0 10px; font-size: 1.08rem; }
  .feature-item p { grid-row: 2; font-size: 0.86rem; line-height: 1.85; }
}

/* SECTION */
.section {
  padding-block: 112px;
}

.section-heading--center {
  max-width: 780px;
  margin-inline: auto;
  text-align: center;
}

.section-heading h2 {
  margin: 0;
  font-family: var(--font-heading);
  font-size: clamp(2rem, 3.8vw, 3.35rem);
  line-height: 1.45;
  letter-spacing: -0.035em;
}

/* BUSINESS CHALLENGE */

.section--challenge{
    position:relative;
    overflow:hidden;
    background:linear-gradient(
        to bottom,
        #eaf4fc 0%,
        #f4f9fd 35%,
        #fbfdff 70%,
        #ffffff 100%
    );
}

.section--challenge::before{
    position:absolute;
    top:-180px;
    right:-140px;
    width:500px;
    height:500px;
    border:1px solid rgba(47,144,208,.09);
    border-radius:50%;
    content:"";
    pointer-events:none;
}

.section--challenge::after{
    position:absolute;
    bottom:-220px;
    left:-180px;
    width:520px;
    height:520px;
    border-radius:50%;
    background:radial-gradient(
        circle,
        rgba(47,144,208,.07),
        transparent 68%
    );
    content:"";
    pointer-events:none;
}

.section--challenge .container{
    position:relative;
    z-index:1;
}

.section--challenge .section-heading{
    max-width:860px;
}

.section--challenge .section-heading::after{
    display:block;
    width:54px;
    height:3px;
    margin:28px auto 0;
    border-radius:999px;
    background:linear-gradient(
        90deg,
        var(--color-primary),
        #77c6ef
    );
    content:"";
}

.section--challenge .section-heading .eyebrow{
    color:var(--color-primary-dark);
}

.challenge-intro{
    max-width:820px;
    margin:38px auto 60px;
    text-align:center;
}

.challenge-intro p{
    margin:0;
    color:var(--color-text-soft);
    font-size:1.05rem;
    line-height:2;
}

.challenge-intro p + p{
    margin-top:8px;
}

.challenge-grid{
    display:grid;
    grid-template-columns:minmax(340px,.82fr) minmax(0,1.18fr);
    gap:52px;
    align-items:stretch;
}

.challenge-scene{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:42px 38px;
    border:1px solid rgba(47,144,208,.2);
    border-radius:28px;
    background:#fff;
    box-shadow:var(--shadow-soft);
}

.challenge-scene__label{
    margin:0 0 26px;
    color:var(--color-primary-dark);
    font-size:.7rem;
    font-weight:700;
    letter-spacing:.16em;
}

.challenge-scene__voices{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.challenge-scene__voices p{
    position:relative;
    margin:0;
    padding:18px 20px;
    border:1px solid var(--color-line);
    border-radius:16px;
    background:#fff;
    color:var(--color-text);
    font-family:var(--font-heading);
    font-size:1.05rem;
    font-weight:700;
    box-shadow:0 8px 18px rgba(44,85,122,.05);
}

.challenge-scene__voices p::after{
    position:absolute;
    bottom:-7px;
    left:28px;
    width:13px;
    height:13px;
    border-right:1px solid var(--color-line);
    border-bottom:1px solid var(--color-line);
    background:#fff;
    content:"";
    transform:rotate(45deg);
}

.challenge-scene__caption{
    margin:32px 0 0;
    color:var(--color-text-soft);
    font-size:.92rem;
    line-height:1.9;
}

.challenge-problems{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}

.challenge-problem{
    display:flex;
    gap:18px;
    min-height:190px;
    padding:28px 24px;
    border:1px solid rgba(47,144,208,.15);
    border-radius:22px;
    background:#fff;
    box-shadow:var(--shadow-card);
}

.challenge-problem__number{
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    flex:0 0 auto;
    border-radius:50%;
    color:var(--color-primary-dark);
    background:var(--color-bg-soft);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.06em;
}

.challenge-problem h3{
    margin:2px 0 10px;
    font-family:var(--font-heading);
    font-size:1.05rem;
    line-height:1.65;
}

.challenge-problem p{
    margin:0;
    color:var(--color-text-soft);
    font-size:.86rem;
    line-height:1.85;
}

.challenge-conclusion{
    max-width:920px;
    margin:68px auto 0;
    padding:38px 44px;
    border:1px solid rgba(47,144,208,.16);
    border-radius:24px;
    background:rgba(255,255,255,.82);
    text-align:center;
}

.challenge-conclusion p{
    margin:0;
    color:var(--color-text-soft);
    line-height:2;
}

.challenge-conclusion p + p{
    margin-top:18px;
}

.challenge-conclusion strong{
    color:var(--color-primary-dark);
}

.challenge-conclusion__lead{
    color:var(--color-text) !important;
    font-family:var(--font-heading);
    font-size:clamp(1.12rem,1.6vw,1.3rem);
    font-weight:700;
}

.challenge-conclusion__message{
    margin-top:28px !important;
    padding:24px 28px;
    border-radius:18px;
    background:#fff;
    color:var(--color-text) !important;
    font-family:var(--font-heading);
    font-size:1.05rem;
    box-shadow:0 10px 24px rgba(44,85,122,.06);
}

@media(max-width:980px){
    .challenge-grid{
        grid-template-columns:1fr;
        gap:30px;
    }

    .challenge-scene{
        max-width:760px;
    }
}

@media(max-width:680px){
    .section--challenge::before{
        top:-220px;
        right:-260px;
    }

    .section--challenge::after{
        display:none;
    }

    .section--challenge .section-heading::after{
        margin-top:24px;
    }

    .challenge-intro{
        margin:32px auto 44px;
        text-align:left;
    }

    .challenge-intro p{
        font-size:1rem;
    }

    .challenge-scene{
        padding:28px 22px;
        border-radius:24px;
    }

    .challenge-scene__voices p{
        padding:16px 18px;
        font-size:.98rem;
    }

    .challenge-problems{
        grid-template-columns:1fr;
    }

    .challenge-problem{
        min-height:auto;
        padding:24px 20px;
    }

    .challenge-conclusion{
        margin-top:52px;
        padding:28px 22px;
        text-align:left;
    }

    .challenge-conclusion__message{
        padding:22px;
        text-align:left;
    }
}

/* WHY ACTION-CENTERED */
.section--intro {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(
      circle at 88% 18%,
      rgba(47, 144, 208, 0.08),
      transparent 25%
    ),
    var(--color-bg);
}

.section--intro::before {
  position: absolute;
  bottom: -180px;
  left: -140px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: rgba(47, 144, 208, 0.045);
  content: "";
  pointer-events: none;
}

.section--intro .container {
  position: relative;
  z-index: 1;
}

.intro-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(460px, 1.1fr);
  gap: 80px;
  align-items: center;
  margin-top: 72px;
}

/* 左側テキスト */
.intro-copy {
  max-width: 550px;
}

.intro-copy p {
  margin: 0 0 24px;
  color: var(--color-text-soft);
}

.intro-copy__opening {
  margin-bottom: 28px;
  padding-left: 24px;
  border-left: 3px solid var(--color-primary);
}

.intro-copy__opening p {
  margin: 0;
  color: var(--color-text);
  font-family: var(--font-heading);
  font-size: clamp(1.18rem, 1.7vw, 1.45rem);
  font-weight: 700;
  line-height: 1.75;
}

.intro-copy__message {
  margin-top: 38px;
  padding: 26px 30px;
  border: 1px solid rgba(47, 144, 208, 0.18);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.78);
}

.intro-copy__message p {
  margin: 0;
  color: var(--color-text);
  font-family: var(--font-heading);
  font-size: clamp(1.05rem, 1.5vw, 1.25rem);
  line-height: 1.9;
}

.intro-copy__message strong {
  color: var(--color-primary-dark);
}

/* 右側の図解 */
.learning-flow {
  position: relative;
  padding: 42px;
  border: 1px solid rgba(121, 177, 213, 0.24);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: var(--shadow-soft);
}

.learning-flow__stage {
  position: relative;
  padding: 25px 26px;
  border: 1px solid var(--color-line);
  border-radius: 18px;
  background: #fff;
}

.learning-flow__stage--passive {
  background: #f9fbfd;
}

.learning-flow__stage--active {
  border-color: rgba(47, 144, 208, 0.28);
  background: #f2f9fe;
}

.learning-flow__stage--action {
  border-color: rgba(239, 138, 119, 0.34);
  background: #fff8f5;
}

.learning-flow__label {
  position: absolute;
  top: 18px;
  right: 20px;
  color: var(--color-text-soft);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.16em;
}

.learning-flow__stage--active .learning-flow__label {
  color: var(--color-primary-dark);
}

.learning-flow__stage--action .learning-flow__label {
  color: var(--color-accent);
}

.learning-flow__stage-content {
  display: flex;
  gap: 18px;
  align-items: center;
  padding-right: 68px;
}

.learning-flow__icon {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 50%;
  color: var(--color-primary-dark);
  background: var(--color-bg-soft);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.learning-flow__stage--action .learning-flow__icon {
  color: #b75f50;
  background: #fdebe6;
}

.learning-flow__stage h3 {
  margin: 0;
  font-family: var(--font-heading);
  font-size: 1.08rem;
  line-height: 1.5;
}

.learning-flow__stage p {
  margin: 5px 0 0;
  color: var(--color-text-soft);
  font-size: 0.82rem;
  line-height: 1.65;
}

.learning-flow__activities {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 20px 0 0 66px;
  padding: 0;
  list-style: none;
}

.learning-flow__activities li {
  padding: 6px 12px;
  border-radius: 999px;
  color: var(--color-primary-dark);
  background: #fff;
  font-size: 0.72rem;
  font-weight: 600;
}

.learning-flow__connector {
  position: relative;
  height: 38px;
}

.learning-flow__connector::before {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 27px;
  background: #bdd2e1;
  content: "";
}

.learning-flow__connector span::before,
.learning-flow__connector span::after {
  position: absolute;
  bottom: 9px;
  left: 50%;
  width: 8px;
  height: 1px;
  background: #bdd2e1;
  content: "";
}

.learning-flow__connector span::before {
  transform: translateX(-7px) rotate(45deg);
}

.learning-flow__connector span::after {
  transform: translateX(-1px) rotate(-45deg);
}

.learning-flow__caption {
  margin: 28px 6px 0;
  color: var(--color-text-soft);
  font-size: 0.78rem;
  line-height: 1.8;
  text-align: center;
}

/* セクション下部の結論 */
.intro-conclusion {
  max-width: 930px;
  margin: 74px auto 0;
  padding: 32px 40px;
  border-top: 1px solid var(--color-line);
  border-bottom: 1px solid var(--color-line);
  text-align: center;
}

.intro-conclusion p {
  margin: 0;
  color: var(--color-text);
  font-size: clamp(1rem, 1.5vw, 1.14rem);
  line-height: 2;
}

.intro-conclusion strong {
  color: var(--color-primary-dark);
}

/* ACWD MINDSET */

.section--mindset{
    background:#fff;
}

.mindset-grid{
    display:grid;
    grid-template-columns:0.95fr 1.05fr;
    gap:72px;
    align-items:center;
    margin-top:72px;
}

.mindset-copy{
    max-width:560px;
}

.mindset-copy__lead{
    font-size:1.12rem;
    line-height:2;
    color:var(--color-text);
}

.mindset-copy strong{
    color:var(--color-primary-dark);
}

.mindset-copy__message{
    margin-top:40px;
    padding-left:20px;
    border-left:4px solid var(--color-primary);
    font-size:1.15rem;
    font-family:var(--font-heading);
}

/* Canvas */

.design-canvas{
    padding:36px;
    border-radius:28px;
    background:#fff;
    border:1px solid var(--color-line);
    box-shadow:var(--shadow-soft);
}

.canvas-goal,
.canvas-output{
    text-align:center;
}

.canvas-goal span,
.canvas-output span,
.canvas-design span{
    display:block;
    margin-bottom:8px;
    color:var(--color-primary-dark);
    font-size:.72rem;
    letter-spacing:.14em;
    font-weight:700;
    text-align:center;
}

.canvas-goal strong{
    display:block;
    padding:20px;
    border-radius:18px;
    background:linear-gradient(135deg,#2f90d0,#67bdf0);
    color:#fff;
    font-size:1.15rem;
}

.canvas-output{
    margin-top:18px;
}

.canvas-output strong{
    display:block;
    padding:18px;
    border-radius:18px;
    background:#eef8fe;
    color:var(--color-text);
}

.canvas-arrow{
    margin:12px 0;
    text-align:center;
    color:#8eb9d7;
    font-size:1.3rem;
}

.canvas-design{
    margin-top:18px;
}

.canvas-design__grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:12px;
}

.canvas-design__grid div{
    padding:14px 10px;
    border-radius:14px;
    background:#f7fbff;
    border:1px solid var(--color-line);
    text-align:center;
    font-size:.92rem;
}

@media(max-width:980px){

    .mindset-grid{
        grid-template-columns:1fr;
        gap:56px;
    }
}

@media(max-width:680px){

    .mindset-grid{
        margin-top:46px;
    }

    .design-canvas{
        padding:24px;
    }
}

/* COMPARISON */

.section--comparison{
    background:var(--color-bg);
}

.comparison-intro{
    max-width:760px;
    margin:36px auto 60px;
    text-align:center;
}

.comparison-intro p{
    margin:0;
    font-size:1.05rem;
    color:var(--color-text-soft);
}

.comparison-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:36px;
}

.comparison-card{
    border-radius:28px;
    background:#fff;
    border:1px solid var(--color-line);
    box-shadow:var(--shadow-soft);
    overflow:hidden;
}

.comparison-card--acwd{
    border-color:rgba(47,144,208,.28);
}

.comparison-card__header{
    padding:28px 32px;
    border-bottom:1px solid var(--color-line);
}

.comparison-card__header span{
    display:block;
    margin-bottom:8px;
    color:var(--color-primary-dark);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.14em;
}

.comparison-card__header h3{
    margin:0;
    font-family:var(--font-heading);
    font-size:1.4rem;
}

.comparison-item{
    padding:22px 32px;
    border-bottom:1px solid var(--color-line);
}

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

.comparison-item span{
    display:block;
    margin-bottom:6px;
    color:var(--color-text-soft);
    font-size:.78rem;
    letter-spacing:.08em;
}

.comparison-item strong{
    display:block;
    font-size:1rem;
    line-height:1.7;
}

.comparison-card--acwd .comparison-item strong{
    color:var(--color-primary-dark);
}

.comparison-closing{
    max-width:920px;
    margin:72px auto 0;
    text-align:center;
}

.comparison-closing p{
    margin:0 0 10px;
    color:var(--color-text-soft);
}

.comparison-closing__message{
    max-width:760px;
    margin:34px auto 0;
    padding:28px;
    border-radius:24px;
    background:linear-gradient(135deg,#2f90d0,#5db8ef);
    color:#fff;
    font-size:1.2rem;
    line-height:1.8;
    text-align:center;
}

.comparison-closing__message strong{
    font-family:var(--font-heading);
}

.comparison-principles{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);
    gap:18px;
    align-items:center;
    margin:0 0 38px;
}

.principle-card{
    position:relative;
    min-height:140px;
    padding:24px 18px;
    border:1px solid var(--color-line);
    border-radius:22px;
    background:#fff;
    box-shadow:var(--shadow-card);
    text-align:center;
}

.principle-card::before{
    position:absolute;
    top:0;
    left:50%;
    width:46px;
    height:3px;
    border-radius:0 0 999px 999px;
    background:rgba(47,144,208,.45);
    content:"";
    transform:translateX(-50%);
}
.principle-card--accent{
    border-color:rgba(47,144,208,.3);
    background:#f5fbff;
}
.principle-card--accent::before{
    background:var(--color-primary);
}
.principle-card__label{
    margin-bottom:16px;
    color:var(--color-primary-dark);
    font-size:.68rem;
    font-weight:700;
    letter-spacing:.14em;
}
.principle-card strong{
    display:block;
    margin-bottom:8px;
    color:var(--color-text);
    font-family:var(--font-heading);
    font-size:1.25rem;
}
.principle-card p{
    margin:0;
    color:var(--color-text-soft);
    font-size:.9rem;
    line-height:1.7;
}
.principle-arrow{
    color:#9bbfd8;
    font-size:1.7rem;
    font-weight:300;
    line-height:1;
}

@media(max-width:980px){

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

@media(max-width:680px){

    .comparison-intro{
        margin:28px auto 44px;
    }

    .comparison-card__header,
    .comparison-item{
        padding:22px;
    }

    .comparison-closing{
        margin-top:56px;
    }

    .comparison-closing__message{
        margin-top:28px;
        padding:22px;
        font-size:1.05rem;
    }
        .comparison-principles{
        grid-template-columns:1fr;
        gap:12px;
    }
    .principle-card{
        min-height:auto;
        padding:24px 20px;
    }
    .principle-arrow{
        transform:rotate(90deg);
    }
}

/* WHAT WE DESIGN */

.section--services{
    background:#fff;
}

.services-intro{
    max-width:760px;
    margin:36px auto 64px;
    text-align:center;
}

.services-intro p{
    margin:0;
    color:var(--color-text-soft);
    font-size:1.05rem;
}

.services-flow{
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr;
    gap:22px;
    align-items:stretch;
}

.service-step{
    padding:34px 30px;
    border-radius:28px;
    background:#fff;
    border:1px solid var(--color-line);
    box-shadow:var(--shadow-soft);
}

.service-step--accent{
    border-color:rgba(47,144,208,.28);
    background:#f8fcff;
}

.service-step__number{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    margin-bottom:20px;
    border-radius:50%;
    background:var(--color-bg-soft);
    color:var(--color-primary-dark);
    font-size:.8rem;
    font-weight:700;
    letter-spacing:.08em;
}

.service-step h3{
    margin:0 0 12px;
    font-family:var(--font-heading);
    font-size:1.35rem;
}

.service-step__lead{
    margin:0 0 22px;
    color:var(--color-text-soft);
    line-height:1.8;
}

.service-step ul{
    margin:0;
    padding:0;
    list-style:none;
}

.service-step li{
    position:relative;
    padding:10px 0 10px 18px;
    border-top:1px solid var(--color-line);
}

.service-step li::before{
    content:"";
    position:absolute;
    left:0;
    top:19px;
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--color-primary);
}

.service-step__note{
    margin:24px 0 0;
    padding:16px 18px;
    border-radius:14px;
    background:var(--color-bg);
    color:var(--color-text-soft);
    font-size:.78rem;
    line-height:1.8;
}

.service-arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#9bbfd8;
    font-size:2rem;
    font-weight:300;
}

.services-closing{
    max-width:760px;
    margin:72px auto 0;
    text-align:center;
}

.services-closing p{
    margin:0 0 22px;
    color:var(--color-text-soft);
}

.services-closing__message{
    padding:32px;
    border-radius:24px;
    background:linear-gradient(135deg,#2f90d0,#5db8ef);
    color:#fff;
    font-size:1.18rem;
    line-height:1.8;
}

.services-closing__message strong{
    display:block;
    margin-bottom:6px;
    font-family:var(--font-heading);
    font-size:1.4rem;
}

@media(max-width:980px){

    .services-flow{
        grid-template-columns:1fr;
        gap:24px;
    }

    .service-arrow{
        display:none;
    }
}

@media(max-width:680px){

    .services-intro{
        margin:28px auto 48px;
    }

    .service-step{
        padding:26px 22px;
    }

    .services-closing{
        margin-top:56px;
    }

    .services-closing__message{
        padding:24px;
        font-size:1.05rem;
    }

    .services-closing__message strong{
        font-size:1.2rem;
    }
}

/* CASE STUDIES */

.section--cases{
    background:var(--color-bg);
}

.cases-intro{
    max-width:760px;
    margin:36px auto 60px;
    text-align:center;
}

.cases-intro p{
    margin:0;
    color:var(--color-text-soft);
    font-size:1.05rem;
}

.cases-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:36px;
}

.case-card{
    display:flex;
    flex-direction:column;
    border:1px solid var(--color-line);
    border-radius:28px;
    background:#fff;
    box-shadow:var(--shadow-soft);
    overflow:hidden;
}

.case-card__status{
    padding:18px 30px;
    border-bottom:1px solid var(--color-line);
    background:#f7fbff;
}

.case-card__status span{
    color:var(--color-primary-dark);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.14em;
}

.case-card__content{
    flex:1;
    padding:32px 30px;
}

.case-card__content h3{
    margin:0 0 18px;
    font-family:var(--font-heading);
    font-size:1.35rem;
    line-height:1.5;
}

.case-card__content p{
    margin:0 0 26px;
    color:var(--color-text-soft);
    line-height:1.9;
}

.case-card__content ul{
    margin:0;
    padding:0;
    list-style:none;
}

.case-card__content li{
    position:relative;
    padding:10px 0 10px 18px;
    border-top:1px solid var(--color-line);
}

.case-card__content li::before{
    content:"";
    position:absolute;
    left:0;
    top:19px;
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--color-primary);
}

.case-card__footer{
    padding:18px 30px;
    border-top:1px solid var(--color-line);
    background:#fafcfd;
    color:var(--color-text-soft);
    font-size:.9rem;
    text-align:center;
}

@media(max-width:980px){

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

}

@media(max-width:680px){

    .cases-intro{
        margin:28px auto 48px;
    }

    .case-card__content{
        padding:24px 22px;
    }

    .case-card__status,
    .case-card__footer{
        padding:16px 22px;
    }
}

/* FAQ */

.section--faq{
    background:#fff;
}

.faq-list{
    max-width:900px;
    margin:56px auto 0;
}

.faq-item{
    border-top:1px solid var(--color-line);
}

.faq-item:last-child{
    border-bottom:1px solid var(--color-line);
}

.faq-item summary{
    position:relative;
    display:flex;
    align-items:center;
    padding:28px 54px 28px 0;
    cursor:pointer;
    list-style:none;
    font-family:var(--font-heading);
    font-size:1.08rem;
    line-height:1.7;
}

.faq-item summary::-webkit-details-marker{
    display:none;
}

.faq-item summary::after{
    content:"+";
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
    color:var(--color-primary-dark);
    font-size:1.8rem;
    font-weight:300;
    transition:.25s;
}

.faq-item[open] summary::after{
    transform:translateY(-50%) rotate(45deg);
}

.faq-answer{
    padding:0 54px 30px 0;
}

.faq-answer p{
    margin:0;
    color:var(--color-text-soft);
    line-height:2;
}

@media(max-width:680px){

    .faq-list{
        margin-top:42px;
    }

    .faq-item summary{
        padding:22px 42px 22px 0;
        font-size:1rem;
    }

    .faq-answer{
        padding:0 42px 24px 0;
    }
}

/* PRICE */

.section--price{
    background:#fff;
}

.price-intro{
    max-width:760px;
    margin:36px auto 56px;
    text-align:center;
}

.price-intro p{
    margin:0;
    color:var(--color-text-soft);
    font-size:1.05rem;
    line-height:1.9;
}

.price-card{
    position:relative;
    overflow:hidden;
    max-width:720px;
    margin:0 auto;
    padding:52px 48px 48px;
    border:1px solid rgba(47,144,208,.22);
    border-radius:32px;
    background:
        radial-gradient(
            circle at 92% 8%,
            rgba(47,144,208,.08),
            transparent 25%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfdff 100%
        );
    box-shadow:
        0 24px 60px rgba(20,42,74,.08),
        inset 0 1px 0 rgba(255,255,255,.8);
    text-align:center;
}

.price-card::before{
    position:absolute;
    top:0;
    left:50%;
    width:120px;
    height:4px;
    border-radius:0 0 999px 999px;
    background:linear-gradient(
        90deg,
        var(--color-primary),
        #72c4ef
    );
    content:"";
    transform:translateX(-50%);
}

.price-card::after{
    position:absolute;
    right:-90px;
    bottom:-110px;
    width:260px;
    height:260px;
    border:1px solid rgba(47,144,208,.08);
    border-radius:50%;
    content:"";
    pointer-events:none;
}

.price-card__label{
    position:relative;
    z-index:1;
    display:inline-flex;
    min-height:36px;
    align-items:center;
    justify-content:center;
    padding:0 18px;
    margin-bottom:26px;
    border:1px solid rgba(47,144,208,.15);
    border-radius:999px;
    background:linear-gradient(
        180deg,
        #f4faff,
        #eaf6fd
    );
    color:var(--color-primary-dark);
    box-shadow:0 6px 16px rgba(47,144,208,.08);
    font-size:.7rem;
    font-weight:700;
    letter-spacing:.16em;
}

.price-card h3{
    position:relative;
    z-index:1;
    margin:0;
    font-family:var(--font-heading);
    font-size:1.6rem;
}

.price-card__price{
    position:relative;
    z-index:1;
    display:flex;
    align-items:baseline;
    justify-content:center;
    gap:10px;
    max-width:520px;
    margin:30px auto 22px;
    padding:28px 24px;
    border:1px solid rgba(47,144,208,.14);
    border-radius:22px;
    background:rgba(255,255,255,.9);
    box-shadow:
        0 14px 30px rgba(44,85,122,.06),
        inset 0 0 0 1px rgba(255,255,255,.7);
}

.price-card__value{
    font-family:var(--font-heading);
    font-size:3.2rem;
    font-weight:700;
    color:var(--color-primary-dark);
    line-height:1;
    letter-spacing:-.035em;
}

.price-card__tax{
    margin-left:0;
    color:var(--color-text-soft);
    font-size:.92rem;
    white-space:nowrap;
}

.price-card__lead{
    position:relative;
    z-index:1;
    max-width:520px;
    margin:0 auto 34px;
    color:var(--color-text-soft);
    line-height:1.9;
}

.price-card__list{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    margin:0;
    padding:0;
    list-style:none;
}

.price-card__list li{
    position:relative;
    display:flex;
    min-height:54px;
    align-items:center;
    padding:14px 18px 14px 46px;
    border:1px solid var(--color-line);
    border-radius:15px;
    background:#fff;
    color:var(--color-text);
    font-size:.94rem;
    text-align:left;
    box-shadow:0 8px 20px rgba(44,85,122,.04);
}

.price-card__list li::before{
    position:absolute;
    top:50%;
    left:18px;
    display:grid;
    width:20px;
    height:20px;
    place-items:center;
    border-radius:50%;
    background:var(--color-bg-soft);
    color:var(--color-primary-dark);
    content:"✓";
    font-size:.72rem;
    font-weight:700;
    transform:translateY(-50%);
}

.price-note{
    max-width:720px;
    margin:32px auto 0;
    text-align:center;
}

.price-note p{
    margin:0;
    color:var(--color-text-soft);
    line-height:1.9;
}

@media(max-width:680px){
    .price-intro{
        margin:28px auto 44px;
    }

    .price-card{
        padding:40px 22px 32px;
        border-radius:26px;
    }

    .price-card__price{
        flex-direction:column;
        align-items:center;
        gap:10px;
        margin-top:26px;
        padding:24px 18px;
    }

    .price-card__value{
        font-size:2.55rem;
    }

    .price-card__tax{
        font-size:.88rem;
    }

    .price-card__list{
        grid-template-columns:1fr;
    }

    .price-card__list li{
        min-height:52px;
    }
}

/* CONTACT CTA */

.contact-cta{
    position:relative;
    overflow:hidden;
    padding-block:104px;
    color:#fff;
    background:
        radial-gradient(circle at 88% 12%,rgba(93,184,239,.22),transparent 28%),
        linear-gradient(135deg,#12263d 0%,#173a5c 58%,#1e6fa7 100%);
}
.contact-cta::before{
    position:absolute;
    right:-140px;
    bottom:-190px;
    width:480px;
    height:480px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:50%;
    content:"";
}
.contact-cta__inner{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
    gap:80px;
    align-items:center;
}
.contact-cta__eyebrow{
    margin:0 0 18px;
    color:#8ed0f5;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.16em;
}
.contact-cta__content h2{
    margin:0;
    font-family:var(--font-heading);
    font-size:clamp(2rem,3.5vw,3.25rem);
    line-height:1.5;
    letter-spacing:-.035em;
}
.contact-cta__copy{
    margin-top:34px;
    padding-left:22px;
    border-left:3px solid rgba(142,208,245,.75);
}
.contact-cta__copy p{
    margin:0 0 10px;
    color:rgba(255,255,255,.88);
}
.contact-cta__copy p:last-child{
    margin-bottom:0;
}
.contact-cta__description{
    max-width:620px;
    margin:30px 0 0;
    color:rgba(255,255,255,.72);
    line-height:2;
}
.contact-cta__actions{
    padding:40px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:28px;
    background:rgba(255,255,255,.08);
    box-shadow:0 24px 60px rgba(0,0,0,.14);
    backdrop-filter:blur(8px);
}
.contact-cta__action-label{
    margin:0 0 20px;
    font-family:var(--font-heading);
    font-size:1.2rem;
    font-weight:700;
    text-align:center;
}
.contact-button{
    display:flex;
    min-height:60px;
    align-items:center;
    justify-content:center;
    gap:18px;
    padding:0 26px;
    border-radius:999px;
    font-weight:700;
    transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease;
}
.contact-button:hover{
    transform:translateY(-2px);
}
.contact-button--line{
    color:#15324c;
    background:#fff;
    box-shadow:0 14px 30px rgba(0,0,0,.16);
}
.contact-button--line:hover{
    background:#f2f9fe;
}
.contact-button--secondary{
    border:1px solid rgba(255,255,255,.42);
    color:#fff;
    background:transparent;
}
.contact-button--secondary:hover{
    background:rgba(255,255,255,.08);
}
.contact-cta__divider{
    display:flex;
    align-items:center;
    gap:14px;
    margin:24px 0;
    color:rgba(255,255,255,.58);
    font-size:.78rem;
}
.contact-cta__divider::before,
.contact-cta__divider::after{
    height:1px;
    flex:1;
    background:rgba(255,255,255,.18);
    content:"";
}
.contact-cta__form-note{
    margin:0 0 20px;
    color:rgba(255,255,255,.7);
    font-size:.86rem;
    line-height:1.8;
    text-align:center;
}
@media(max-width:980px){
    .contact-cta__inner{
        grid-template-columns:1fr;
        gap:52px;
    }
    .contact-cta__actions{
        max-width:620px;
    }
}
@media(max-width:680px){
    .contact-cta{
        padding-block:78px;
    }
    .contact-cta__content h2{
        font-size:2rem;
    }
    .contact-cta__copy{
        margin-top:28px;
        padding-left:18px;
    }
    .contact-cta__actions{
        padding:28px 22px;
        border-radius:24px;
    }
}

/* FOOTER */

.footer{
    margin-top:0;
    color:rgba(255,255,255,.82);
    background:
        linear-gradient(
            180deg,
            #173a5c 0%,
            #12263d 100%
        );
}

.footer__inner{
    display:grid;
    grid-template-columns:1.1fr 1fr;
    gap:80px;
    padding:72px 0 56px;
    align-items:start;
}

.footer__brand{
    max-width:200px;
}

.footer__brand img{
    display:block;
    width:200px;
    height:auto;
}

.footer__message{
    margin-top:22px;
    width:200px;
    text-align:center;
    color:rgba(255,255,255,.72);
    line-height:1.8;
    font-size:.7rem;
}

.footer__message strong{
    display:block;
    margin-bottom:6px;
    color:#fff;
    font-weight:600;
    letter-spacing:.08em;
}

.footer__menu{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:56px;
}

.footer__column h3{
    margin:0 0 22px;
    color:#fff;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.16em;
}

.footer__column ul{
    margin:0;
    padding:0;
    list-style:none;
}

.footer__column li+li{
    margin-top:14px;
}

.footer__column a{
    color:rgba(255,255,255,.72);
    font-size:.93rem;
    line-height:1.8;
    transition:.25s;
}

.footer__column a:hover{
    color:#fff;
}

.footer__bottom{
    border-top:1px solid rgba(255,255,255,.08);
}

.footer__bottom .container{
    padding:24px 0;
    text-align:center;
}

.footer__bottom small{
    color:rgba(255,255,255,.52);
    font-size:.78rem;
}

@media(max-width:980px){

    .footer__inner{
        grid-template-columns:1fr;
        gap:56px;
    }

}

@media(max-width:680px){

    .footer__inner{
        padding:56px 0 40px;
        gap:46px;
    }

    .footer__brand{
        width:200px;
        max-width:100%;
        margin:0 auto;
        text-align:center;
    }

    .footer__brand img{
        width:160px;
        margin:0 auto;
    }

    .footer__message{
        width:100%;
    }

    .footer__menu{
        grid-template-columns:1fr;
        gap:38px;
        text-align:center;
    }

}

.sp-only {
  display: none;
}

@media (max-width: 980px) {
.intro-grid {
    grid-template-columns: 1fr;
    gap: 52px;
  }

  .intro-copy {
    max-width: 720px;
  }

  .learning-flow {
    max-width: 720px;
  }

  .intro-conclusion {
    margin-top: 62px;
  }
}

@media (max-width: 680px) {
  .container {
    width: min(calc(100% - 32px), var(--container));
  }

  .button {
    width: 100%;
  }
.section {
    padding-block: 78px;
  }

  .section-heading h2 {
    font-size: 2rem;
  }

  .section--intro .section-heading h2 {
    font-size: 1.9rem;
  }

  .intro-grid {
    gap: 40px;
    margin-top: 46px;
  }

  .intro-copy__opening {
    padding-left: 18px;
  }

  .intro-copy__message {
    margin-top: 30px;
    padding: 22px;
  }

  .learning-flow {
    padding: 22px 18px;
    border-radius: 24px;
  }

  .learning-flow__stage {
    padding: 22px 18px;
  }

  .learning-flow__label {
    position: static;
    display: block;
    margin-bottom: 12px;
  }

  .learning-flow__stage-content {
    gap: 14px;
    padding-right: 0;
  }

  .learning-flow__icon {
    width: 42px;
    height: 42px;
  }

  .learning-flow__activities {
    margin: 18px 0 0;
  }

  .intro-conclusion {
    margin-top: 50px;
    padding: 26px 0;
    text-align: left;
  }

  .footer__inner {
    grid-template-columns: 1fr;
    gap: 26px;
    align-items: start;
  }

  .footer__nav {
    flex-direction: column;
    gap: 8px;
  }

  .sp-only {
    display: inline;
  }
}

/* =========================================================
   TYPOGRAPHY & SPACING HARMONIZATION
   セクション見出し・余白の最終統一
========================================================= */

/* PC：通常セクションの基本余白 */
.section,
.features{
  padding-block:104px;
}

/* PC：通常セクション見出しを統一 */
.section-heading h2,
.features__heading h2{
  font-size:clamp(1.9rem,3.1vw,2.9rem);
  line-height:1.42;
  letter-spacing:-0.035em;
}

/* CTAは通常見出しよりわずかに控えめにしつつ、白抜きで存在感を確保 */
.contact-cta__content h2{
  font-size:clamp(1.95rem,3vw,2.8rem);
  line-height:1.45;
}

/* 見出しから本文・主要コンテンツまでの間隔を整理 */
.features__heading{
  margin-bottom:56px;
}

.intro-grid,
.mindset-grid{
  margin-top:64px;
}

.comparison-intro,
.services-intro,
.cases-intro,
.price-intro{
  margin-top:32px;
  margin-bottom:56px;
}

.faq-list{
  margin-top:52px;
}

.comparison-closing,
.services-closing{
  margin-top:64px;
}

/* タブレット */
@media(max-width:980px){
  .section,
  .features{
    padding-block:88px;
  }

  .section-heading h2,
  .features__heading h2{
    font-size:clamp(1.85rem,4.4vw,2.55rem);
  }

  .contact-cta__content h2{
    font-size:clamp(1.9rem,4.2vw,2.5rem);
  }

  .intro-grid,
  .mindset-grid{
    margin-top:56px;
  }
}

/* スマートフォン */
@media(max-width:680px){
  .section,
  .features{
    padding-block:76px;
  }

  .section-heading h2,
  .features__heading h2,
  .section--intro .section-heading h2{
    font-size:1.8rem;
    line-height:1.5;
  }

  .contact-cta__content h2{
    font-size:1.85rem;
    line-height:1.5;
  }

  .features__heading{
    margin-bottom:44px;
  }

  .intro-grid,
  .mindset-grid{
    margin-top:44px;
  }

  .comparison-intro,
  .services-intro,
  .cases-intro,
  .price-intro{
    margin-top:26px;
    margin-bottom:44px;
  }

  .faq-list{
    margin-top:42px;
  }

  .comparison-closing,
  .services-closing{
    margin-top:54px;
  }
}

/* Back to Top */

.back-to-top{
    position:fixed;
    right:28px;
    bottom:28px;
    z-index:999;

    display:flex;
    align-items:center;
    justify-content:center;

    width:54px;
    height:54px;

    border-radius:50%;

    background:rgba(47,144,208,.92);
    color:#fff;

    font-size:1.35rem;
    font-weight:700;

    box-shadow:0 10px 24px rgba(0,0,0,.18);

    transition:
        transform .25s,
        background .25s,
        opacity .25s;

    opacity:.85;
}

.back-to-top:hover{
    transform:translateY(-4px);
    background:var(--color-primary-dark);
    opacity:1;
}

.back-to-top:active{
    transform:translateY(-1px);
}

@media(max-width:680px){

    .back-to-top{
        width:48px;
        height:48px;
        right:18px;
        bottom:18px;
        font-size:1.2rem;
    }

}
