@charset "UTF-8";

/* Shared PlusNow CTA */
.plusnow-cta {
  --plusnow-cta-key: #0879d3;
  --plusnow-cta-key-shadow: rgba(8, 121, 211, 0.25);
  --plusnow-cta-background: url("../images/cta/plusnow-cta-bg.png");
  position: relative;
  overflow: hidden;
  padding: clamp(7.2rem, 7vw, 12rem) 1.6rem;
  color: #10233f;
  background: #f4faff var(--plusnow-cta-background) center/cover no-repeat;
}
.page-campaign-plus .plusnow-cta {
  --plusnow-cta-key: #f7bc28;
  --plusnow-cta-key-shadow: rgba(247, 188, 40, 0.28);
  --plusnow-cta-background: url("../images/cta/plusnow-cta-bg-campaign.png");
}
.page-iside-plus .plusnow-cta {
  --plusnow-cta-key: #4287ea;
  --plusnow-cta-key-shadow: rgba(66, 135, 234, 0.28);
  --plusnow-cta-background: url("../images/cta/plusnow-cta-bg-inside.png");
}
.page-sales-plus .plusnow-cta {
  --plusnow-cta-key: #e84b4b;
  --plusnow-cta-key-shadow: rgba(232, 75, 75, 0.28);
  --plusnow-cta-background: url("../images/cta/plusnow-cta-bg-sales.png");
}
.page-lbiz-plus .plusnow-cta {
  --plusnow-cta-key: #17e54c;
  --plusnow-cta-key-shadow: rgba(23, 229, 76, 0.28);
  --plusnow-cta-background: url("../images/cta/plusnow-cta-bg-leadbiz.png");
}

.plusnow-cta__inner {
  display: grid;
  grid-template-columns: minmax(36rem, 0.86fr) minmax(52rem, 1.14fr);
  align-items: center;
  gap: clamp(4rem, 5vw, 9.6rem);
  max-width: 132rem;
}
.plusnow-cta__eyebrow {
  display: flex;
  align-items: center;
  gap: 1.3rem;
  margin: 0 0 1.9rem;
  color: #0875c9;
  font-family: Manrope, sans-serif;
  font-size: 1.23rem;
  font-weight: 600;
  letter-spacing: 0.18em;
}
.plusnow-cta__eyebrow span { width: 4rem; height: 1px; background: #0875c9; }
.plusnow-cta h2 { margin: 0; font-size: clamp(2.9rem, 2.4vw, 4.25rem); font-weight: 700; letter-spacing: 0.02em; line-height: 1.35; }
.plusnow-cta__about-link { display: inline-block; margin-top: 1rem; color: #10233f; font-size: 1.4rem; font-weight: 600; text-decoration: underline; text-underline-offset: 0.35em; transition: color 0.2s ease; }
.plusnow-cta__about-link:hover { color: var(--plusnow-cta-key); }
.plusnow-cta__catch { margin: 3.2rem 0 2rem; color: #0879d3; font-size: clamp(1.85rem, 1.6vw, 2.5rem); font-weight: 700; }
.plusnow-cta__description { margin: 0; font-size: 1.52rem; line-height: 2; }
.plusnow-cta__brand { margin-top: 3.2rem; }
.plusnow-cta__logo { display: block; width: 16.8rem; max-width: 100%; height: auto; }
.plusnow-cta__brand-note { margin: 1.2rem 0 2.65rem; font-size: 1.36rem; font-weight: 700; }
.plusnow-cta__button { display: flex; align-items: center; justify-content: center; gap: 3.6rem; width: min(100%, 28rem); padding: 1.6rem 2rem; border-radius: 999px; color: #fff; background: #000; box-shadow: 0 9px 20px rgba(0, 0, 0, 0.2); font-size: 1.4rem; text-decoration: none; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.plusnow-cta__button:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 12px 25px rgba(0, 0, 0, 0.3); }
.plusnow-cta__button svg { width: 1.8rem; height: 1.8rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.plusnow-cta__visual { min-width: 0; padding-top: 4rem; }
.plusnow-cta__pc { display: block; width: 100%; height: auto; filter: drop-shadow(0 18px 16px rgba(18, 51, 78, 0.12)); }
.plusnow-cta__flow { display: grid; grid-template-columns: repeat(4, 1fr); margin: 1.6rem 2.4rem 0; padding: 0; list-style: none; }
.plusnow-cta__flow li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 1rem; color: #18324e; font-size: 1.25rem; font-weight: 600; line-height: 1.55; text-align: center; }
.plusnow-cta__flow li:not(:last-child)::after { content: "›"; position: absolute; top: 0.9rem; right: -0.2rem; color: #9eb5c7; font-size: 2.7rem; font-weight: 300; }
.plusnow-cta__flow-icon { display: grid; place-items: center; width: 4.8rem; height: 4.8rem; border: 1px solid rgba(20, 136, 220, 0.16); border-radius: 50%; color: var(--plusnow-cta-key); background: rgba(255, 255, 255, 0.72); box-shadow: 0 4px 12px rgba(22, 76, 113, 0.06); }
.plusnow-cta__flow-icon svg { width: 2.3rem; height: 2.3rem; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

@media (max-width: 991px) {
  .plusnow-cta__inner { grid-template-columns: 1fr; max-width: 72rem; }
  .plusnow-cta__copy { max-width: 61rem; }
  .plusnow-cta__visual { padding-top: 0; }
}
@media (max-width: 575px) {
  .plusnow-cta { padding: 6.4rem 1.6rem; background-position: center bottom; }
  .plusnow-cta__inner { display: block; }
  .plusnow-cta h2 { font-size: 2.65rem; }
  .plusnow-cta__catch { margin-top: 2.4rem; }
  .plusnow-cta__description br { display: none; }
  .plusnow-cta__visual { margin-top: 4.4rem; }
  .plusnow-cta__flow { margin: 1.6rem 0 0; gap: 0.4rem; }
  .plusnow-cta__flow li { font-size: 1.04rem; }
  .plusnow-cta__flow li:not(:last-child)::after { right: -0.55rem; }
  .plusnow-cta__flow-icon { width: 4rem; height: 4rem; }
  .plusnow-cta__flow-icon svg { width: 1.85rem; height: 1.85rem; }
}
