:root{
  --bg:#ffffff;
  --surface:#f7f9fc;
  --card:#ffffff;
  --text:#333;
  --muted:#5b6b88;
  --primary:#e68033;
  --secondary:#16a34a;
  --ring:rgba(37,99,235,.25);
  --shadow:0 10px 30px rgba(16,24,40,.08);
  --radius:14px;
  --radius-lg:18px;
  --container:1120px;
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans JP",
  "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
  --fs-body: 16px;
  --fs-body-lg: 18px;
  --lh-body: 1.78;
  --track-body: 0.012em;
  --track-eyebrow: 0.14em;
  --h1: clamp(40px, 8vw, 84px);
  --h2: clamp(25px, 4.6vw, 38px);
  --h3: clamp(20px, 3.2vw, 30px);
  --h4: 18px;
  --para-space: 0.9em;
  --list-space: 0.65em;
  --fx-blue-1:#dac56d;
  --fx-blue-2:#d8ae64;
  --fx-blue-3:#f2c36f;
  --fx-blue-4:#f2c36f;
  --fx-gold-1:#fff4c7;
  --fx-gold-2:#ffd76a;
  --fx-gold-3:#ffb83a;
  --fx-gold-4:#d58800;
  --fx-neon:#8fd3ff;

}
*{
 box-sizing:border-box
}
html{
 scroll-behavior:smooth;
 -webkit-text-size-adjust:100%;
 margin: 0 !important;
 padding: 0 !important;
}


body{
 margin: 0 !important;
 padding: 0 !important;
 color:var(--text);

 background:
 radial-gradient(1200px 600px at 10% -10%, rgba(37,99,235,.06), transparent 60%),
 radial-gradient(1000px 500px at 90% 0%, rgba(22,163,74,.06), transparent 60%),
 var(--bg);

 font: var(--fs-body)/var(--lh-body) var(--font-sans);

 letter-spacing: var(--track-body);

 -webkit-font-smoothing: antialiased;

 -moz-osx-font-smoothing: grayscale;

 text-rendering: optimizeLegibility;

 font-feature-settings: "palt" 1, "kern" 1;

 line-break: strict;

 overflow-wrap: anywhere;

}
@media (min-width: 1024px){
  body{
    font-size: var(--fs-body-lg);

  }
}
img{
 max-width:100%;

 display:block
}
a{
 color:var(--primary);

 text-decoration:none !important;

 text-underline-offset: 3px
}
a:hover{
 opacity:.9;

 text-decoration: underline
}
a:focus-visible{
 outline: 3px solid var(--ring);

 outline-offset: 2px;

 border-radius: 8px;

}
p{
 margin: 0 0 var(--para-space)
}
small{
 font-size: .9em;

 color: var(--muted)
}
strong,b{
 font-weight: 800
}
ul,ol{
 margin: 0 0 var(--para-space) 1.2em
}
li{
 margin: 0 0 .38em
}
code,kbd{
 font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace
}
h1,h2,h3,h4,h5,h6{
 margin: 0 0 .5em;

 color:#081222;

 line-height: 1.18;

 letter-spacing: .01em;

 font-weight:900
}
h1{
 font-size: var(--h1)
}
h2{
 font-size: var(--h2)
}
h3{
 font-size: var(--h3)
}
h4{
 font-size: var(--h4)
}


:root{
  --gfp-ink:#0a1220;
  --gfp-muted:#5b6b88;
  --gfp-line:#e6eef7;
  --gfp-brand:#0b2b6b;
  --gfp-brand-500:#1b5cff;
  --gfp-surface:#ffffff;
  --gfp-backdrop: rgba(6, 12, 24, .56);
  --gfp-shadow: 0 24px 70px rgba(6,12,24,.28);
  --gfp-radius: 16px;

}

.gfp{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans JP","Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
  color: var(--gfp-ink);

}

.gfp-footer{
  border-top:1px solid var(--gfp-line);
  background:#fff;
  margin-bottom: 100px;

}
.gfp-container{
  max-width: 1120px;
  margin: 0 auto;
  padding: 18px 16px;
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;

}
.gfp-links{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  align-items:center;

}
.gfp-link{
  color: var(--gfp-brand);
  font-weight: 800;
  text-decoration: none;
  border-radius: 10px;
  padding: 8px 10px;

}
.gfp-link:hover{
  text-decoration: underline;
  background:#f3f7ff;

}
.gfp-copy{
  color: var(--gfp-muted);
  font-size: 12px;
  margin-left:auto;

}

.gfp-modal-root{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;

}
.gfp-modal-root.gfp-open{display:flex}
.gfp-backdrop{
  position: absolute;
  inset: 0;
  background: var(--gfp-backdrop);
  backdrop-filter: blur(2px);
  opacity: 0;
  transition: opacity .22s ease;

}
.gfp-modal-root.gfp-visible .gfp-backdrop{opacity:1}

.gfp-dialog{
  position: relative;
  z-index: 1;
  width: min(920px, calc(100vw - 28px));
  max-height: min(84vh, 820px);
  background: var(--gfp-surface);
  border: 1px solid var(--gfp-line);
  border-radius: var(--gfp-radius);
  box-shadow: var(--gfp-shadow);
  transform: translateY(10px);
  opacity: 0;
  transition: transform .22s ease, opacity .22s ease;
  display:flex;
  flex-direction: column;
  overflow: hidden;

}
.gfp-modal-root.gfp-visible .gfp-dialog{
  transform: translateY(0);
  opacity: 1;

}

.gfp-head{
  padding: 16px 18px;
  border-bottom: 1px solid var(--gfp-line);
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  background: linear-gradient(180deg,#fff,#fbfdff);

}
.gfp-title{
  margin:0;
  font-weight: 900;
  color: var(--gfp-brand);
  font-size: clamp(18px, 2.6vw, 22px);
  letter-spacing:.01em;

}
.gfp-close{
  appearance: none;
  border: 1px solid var(--gfp-line);
  background:#fff;
  border-radius: 10px;
  padding: 8px 10px;
  cursor: pointer;
  font-weight: 900;
  color: var(--gfp-ink);
  line-height:1;

}
.gfp-close:hover{
  background:#f3f7ff;
  color: var(--gfp-brand);

}

.gfp-body{
  padding: 18px;
  overflow: auto;

}

.gfp-body p{
  margin: 0 0 1em;
  line-height: 1.85;
  color: #1f2a44;
  font-weight: 700;
  letter-spacing: .01em;

}
.gfp-body h3{
  margin: 1.2em 0 .5em;
  font-size: 1.02rem;
  color: #0b2b6b;
  font-weight: 900;
  letter-spacing: .01em;

}
.gfp-body ul{
  margin: .6em 0 1em 1.25em;
  padding: 0;

}
.gfp-body li{
  margin: .35em 0;
  line-height: 1.8;
  color:#1f2a44;
  font-weight: 700;

}

/* dl版（会社概要などの定義リスト） */
.gfp-kv{
  display:grid;
  grid-template-columns: 140px 1fr;
  gap: 6px 16px;
  border:1px solid var(--gfp-line);
  border-radius: 12px;
  padding: 12px;
  background:#fff;

}
.gfp-kv dt{font-weight:900;
 color:#0b2b6b}
 .gfp-kv dd{margin:0;
  color:#334155;
  font-weight:700}

/* テーブル版（会社概要/特商法の表組み） */
.gfp-section .gfp-table{
  width:100% !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
  table-layout:auto !important;

}
.gfp-section .gfp-table thead{ display: table-header-group !important;
}
.gfp-section .gfp-table tbody{ display: table-row-group !important;
}
.gfp-section .gfp-table tr   { display: table-row !important;
}
.gfp-section .gfp-table th,
.gfp-section .gfp-table td   { display: table-cell !important;
 vertical-align: top;
}
.gfp-section .gfp-table tbody th{
  width: 240px !important;
  background: #f5f8ff;
  color:#0b2b6b;
  font-weight: 800;
  border-right: 1px solid #e6eef7;

}
.gfp-section .gfp-table th,
.gfp-section .gfp-table td{
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  writing-mode: horizontal-tb !important;
  letter-spacing: normal !important;
  line-height: 1.8 !important;

}
.gfp-section .gfp-table td a{word-break: break-all}
.gfp-section .gfp-table thead th{
  background: linear-gradient(180deg,#f3f7ff,#eaf1ff);
  border-bottom:2px solid #d4e1ff;
  padding:12px 14px;

}
.gfp-section .gfp-table tbody td{
  border-bottom:1px solid #edf2fa;
  padding:12px 14px;
  color:#1f2a44;

}

/* =============================
 gfp-section（会社概要Table専用）
 ============================= */

 .gfp-section table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #e6eef7;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  table-layout: auto;

}

.gfp-section th,
.gfp-section td {
  padding: 14px 16px;
  vertical-align: top;
  text-align: left;
  border-bottom: 1px solid #edf2fa;
  line-height: 1.8;
  word-break: normal;
  white-space: normal;
  overflow-wrap: break-word;
  font-weight: 700;
  color: #1f2a44;

}

.gfp-section th {
  width: 200px;
  background: linear-gradient(180deg, #f3f7ff, #eaf1ff);
  color: #0b2b6b;
  font-weight: 900;

}

.gfp-section tr:last-child th,
.gfp-section tr:last-child td {
  border-bottom: none;

}

/* ブロック構造の中の文章整形 */
.gfp-section .gfp-block {
  margin: 0 0 0.8em;

}
.gfp-section .gfp-block:last-child {
  margin-bottom: 0;

}

/* 小見出し・段落 */
.gfp-section .gfp-h3 {
  margin: 1.2em 0 0.5em;
  font-size: 18px;
  color: #0b2b6b;
  font-weight: 900;

}
.gfp-section .gfp-p {
  margin: 0 0 1.2em;
  line-height: 1.9;
  color: #1f2a44;
  font-weight: 700;

}

/* スマホ最適化 */
@media (max-width: 640px) {
  .gfp-section table,
  .gfp-section tbody,
  .gfp-section tr,
  .gfp-section th,
  .gfp-section td {
    display: block;

    width: 100%;

  }

  .gfp-section th {
    background: #f5f8ff;

    border-bottom: 1px solid #e9f0fb;

    border-right: none;

    border-top-left-radius: 12px;

    border-top-right-radius: 12px;

    padding: 12px 14px;

  }

  .gfp-section td {
    padding: 12px 14px 16px;

    border-bottom: 1px solid #edf2fa;

  }

  .gfp-section tr {
    border: 1px solid #edf2fa;

    border-radius: 12px;

    margin-bottom: 12px;

    background: #fff;

    box-shadow: 0 4px 14px rgba(10, 18, 32, 0.04);

  }
}

/* スマホ時はカード化 */
@media (max-width: 640px){
  .gfp-section .gfp-table,
  .gfp-section .gfp-table thead,
  .gfp-section .gfp-table tbody,
  .gfp-section .gfp-table tr{
    display:block !important;

    width:100% !important;

  }
  .gfp-section .gfp-table thead{ display:none !important;
  }
  .gfp-section .gfp-table tr{
    border:1px solid #edf2fa;

    border-radius:12px;

    margin-bottom:12px;

    background:#fff;

  }
  .gfp-section .gfp-table tbody th{
    width:auto !important;

    display:block !important;

    border-right:none;

    border-bottom:1px solid #e9f0fb;

    padding:12px 14px;

    border-top-left-radius:12px;

    border-top-right-radius:12px;

  }
  .gfp-section .gfp-table tbody td{
    display:block !important;

    padding:12px 14px;

  }
}

/* table版の別名（既存HTML差し替え不要な場合に使用しない） */
.gfp-kvtable{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  border:1px solid #e6eef7;
  border-radius:12px;
  overflow:hidden;
}
.gfp-kvtable th,.gfp-kvtable td{
  padding:14px 16px;
  border-bottom:1px solid #edf2fa;
  vertical-align:top;
}
.gfp-kvtable th{
  width:160px;
  background:linear-gradient(180deg,#f3f7ff,#eaf1ff);
  color:#0b2b6b;
  font-weight:900;
  text-align:left;
}
.gfp-kvtable tr:last-child th,.gfp-kvtable tr:last-child td{border-bottom:none}

.gfp-block{margin:.35em 0}
.gfp-h3{margin:1em 0 .4em;
  font-size:18px;
  color:#0b2b6b}
  .gfp-p{margin:0 0 1em}

  .gfp-doc h4{margin:1.2em 0 .4em;
    font-size:16px;
    color:#0e2f6d}
    .gfp-doc ul,.gfp-doc ol{margin:.2em 0 1em 1.2em}
    .gfp-doc li{margin:.25em 0}

    @media (max-width:640px){
      .gfp-dialog{width:94vw;
        max-height:90vh;
        padding:14px}
        .gfp-kv{grid-template-columns:1fr}
        .gfp-kvtable th{width:120px}
      }

/* スマホ最適化（高さ・タップ余白） */
@media (max-width: 640px){
  .gfp-dialog{
    width: calc(100vw - 16px);

    max-height: min(90vh, 820px);

    border-radius: 14px;

  }
  .gfp-head{padding: 14px}
  .gfp-body{padding: 14px}
  .gfp-kv{grid-template-columns: 110px 1fr}
  .gfp-link{padding:10px}
}
.hp-hero {
  position: relative;
  padding: 64px 0px 0px;
}
.hp-price-xl {
  font-size: clamp(40px, 6vw, 64px);
  line-height:1;
  margin: 8px 0 12px;
  font-weight:800;
}
.hp-price-xl small {
  font-size: .35em;
  font-weight:700;
}
.hp-subline {
  font-size: 16px;
  color:#fff;
  margin-top:6px;
  font-weight:bold;
}
.hp-badges {
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin:16px 0 20px;
  font-weight:bold;
}
.hp-badge {
  padding:6px 10px;
  border-radius:999px;
  border:1px solid #e5effa;
  background:#fff;
  font-size:12px;
}
.hp-note {
  font-size:13px;
  color:#fff;
  font-weight: bold;
  padding: 15px 0px 0px;
}
.hp-cta-stack {
  display:flex;
  gap:15px;
  flex-wrap:wrap;
  margin-top:18px;
}
.hp-grid-3 {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
@media (max-width:900px){
  .hp-grid-3 {
    grid-template-columns:1fr;

  } 
}
.hp-card {
  background:
  repeating-linear-gradient(
    -30deg, 
    rgba(255, 255, 255, 0.7) 0 80px,
    rgba(255, 255, 255, 0) 80px 160px
  ),
  #f7f7f7;
  border:10px solid #2857a7;
  border-radius:14px;
  padding:20px 25px;
  box-shadow: 0 4px 16px rgba(6,36,80,.04);
}
.hp-card h3 {
  margin:0 0 8px;
  font-size:18px;
}
.hp-card ul {
  list-style: none;
  padding-left: 0px;
}
.hp-list {
  margin:10px 0 0;
  padding-left:18px;
}
.hp-list li {
  margin:6px 0;
}
.hp-section_top {
  padding: 0px;
}
.hp-section {
  padding:56px 0;
}
.hp-section--soft {
  background:#fafcff;
}
.hp-section h2 {
  margin:0 0 16px;
}
.hp-spec {
  display:grid;
  grid-template-columns:180px 1fr;
  gap:12px;
  padding:14px 0;
  border-bottom:1px dashed #e5eaf1;
}
.hp-spec strong {
  color:#2a2f3a;
}
.hp-spec .hp-spec-key {
  color:#667085;
}
@media (max-width:720px){
  .hp-spec {
    grid-template-columns:1fr;

  } 
}
.hp-tick {
  color:#0ea35a;
  font-weight:700;
  margin-right:6px;
}
.hp-ng {
  color:#b40d2e;
  font-weight:700;
  margin-right:6px;
}
.hp-callout {
  background:#fff7e6;
  border:1px solid #ffe2b4;
  color:#7a4d00;
  padding:12px 14px;
  border-radius:12px;
}
.hp-mini {
  font-size:13px;
  color:#6b7280;
}
.hp-warm {
  background:#fffdf8;
  border:1px solid #f3efe5;
}
.hp-legal {
  font-size:11px;
  color:#6b7280;
}
.prose{
 max-width: 72ch
}
.prose p{
 margin-bottom: 1em
}
.prose h2{
 margin-top: 1.2em
}
.skip{
 position:absolute;

 left:-9999px;

 top:-9999px
}
.skip:focus{
 left:10px;

 top:10px;

 background:#000;

 color:#fff;

 padding:10px;

 z-index:9999
}
.container{
 max-width:var(--container);

 margin:0 auto;

 padding:0 20px
}
.row{
 display:flex;

 gap:16px
}
.center-v{
 align-items:center
}
.between{
 justify-content:space-between
}
.wrap{
 flex-wrap:wrap
}
.grid-2{
 display:grid;

 grid-template-columns:repeat(2,minmax(0,1fr));

 gap:28px
}
.grid-3{
 display:grid;

 grid-template-columns:repeat(3,minmax(0,1fr));

 gap:24px
}
.gap{
 gap:18px
}
.gap-lg{
 gap:36px
}
.site-header{
 position:sticky;
 margin-top: 0 !important;
 top:0;

 z-index:20;

 background:rgba(255,255,255,.85);

 backdrop-filter:blur(8px);

 border-bottom:1px solid #e6eef7;

 padding:12px 0;

}
.logo{
 position:relative;

 font-size:32px;

 font-weight:900;

 letter-spacing:.03em;

 color:var(--text);

 display:inline-flex;

 align-items:center;

 gap:10px;

 overflow:hidden;

 -webkit-background-clip:text;

 background-clip:text;

 color:#000;

}
.logo::after{
 content:"";

 position:absolute;

 top:0;

 left:-150%;

 width:80%;

 height:100%;

 background:linear-gradient(
  115deg,
  transparent 0%,
  rgba(255,255,255,0.3) 40%,
  rgba(255,255,255,0.9) 50%,
  rgba(255,255,255,0.3) 60%,
  transparent 100%
);

 transform:skewX(-25deg);

 animation:logoShine 4s ease-in-out infinite;

}
@keyframes logoShine {
  0% {
   left:-150%;

 }
 30% {
  left:120%;
}
100% {
 left:120%;

}
}
.logo:hover::after {
 animation: logoShineHover 1.6s ease-in-out;

}
@keyframes logoShineHover {
  0% {
   left:-150%;
   opacity:.6;

 }
 50% {
  left:120%;
  opacity:1;
}
100% {
 left:120%;
 opacity:0;

}
}
.logo span {
 background: linear-gradient(90deg, #000, #555);

 -webkit-background-clip: text;

 background-clip: text;

 color: #e68033;

 text-shadow:
 0 0 6px rgba(27,117,178,.1),
 0 0 18px rgba(27,117,178,.25);

}
.logo__dot{
 width:12px;

 height:12px;

 background:linear-gradient(135deg,var(--primary),var(--secondary));

 display:inline-block;

 border-radius:50%
}
.nav{
 display:flex;

 align-items:center;

 gap:12px;

 position:relative
}
.nav a{
 margin-left:16px;

 padding:12px 14px;

 border-radius:12px;

 color:var(--text);

 font-weight:700
}
.nav a:hover{
 background:#eef3fb
}
.nav__close{
 display:none
}
.burger{
 display:none;

 width:36px;

 height:32px;

 padding:6px;

 border:0;

 background:transparent;

 cursor:pointer;

 position:relative;

 z-index:1003;

}
.burger span,.burger span::before,.burger span::after{
 position:absolute;

 left:6px;

 right:6px;

 height:2px;

 background:var(--text);

 border-radius:2px;

 content:"";

 transition:transform .25s ease,opacity .25s ease,top .25s ease;

}
.burger span{
 top:50%;

 transform:translateY(-50%)
}
.burger span::before{
 top:calc(50% - 8px)
}
.burger span::after{
 top:calc(50% + 8px)
}
.burger.active span{
 opacity:0
}
.burger.active span::before{
 top:50%;

 transform:translateY(-50%) rotate(45deg)
}
.burger.active span::after{
 top:50%;

 transform:translateY(-50%) rotate(-45deg)
}
@media (max-width:900px){
  .site-header{
    background:#fff!important;
    backdrop-filter:none!important
  }
  .burger{
   display:inline-flex;
   align-items:center;
   justify-content:center
 }
 .nav{
   position:fixed;
   inset:0 0 0 auto;
   width:min(86vw,360px);
   transform:translateX(100%);
   transition:transform .3s ease;
   display:flex;
   flex-direction:column;
   gap:10px;
   padding:64px 20px 20px;
   background:transparent!important;
   opacity:1!important;
   isolation:isolate;
   z-index:1002;
   overflow-y:auto;
   border-left:1px solid #e6eef7;

 }
 .nav::before{
  content:"";
  position:absolute;
  inset:0;
  background:#fff;
  border-left:1px solid #e6eef7;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
  z-index:0;
}
.nav > *{
  position:relative;
  z-index:1
}
.nav.open{
  transform:translateX(0)
}
.nav__close{
  display:inline-block;
  position:absolute;
  top:12px;
  right:12px;
  border:1px solid #e6eef7;
  background:#fff;
  border-radius:10px;
  padding:6px 10px;
  font-size:14px;
  cursor:pointer;
}
.nav a{
  margin:0;
  padding:12px 10px;
  border-radius:10px;
  display:block;
  text-align:left
}
.nav-backdrop{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.35);
  backdrop-filter:blur(2px);
  z-index:1000;
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease,visibility .25s ease;
}
.nav-backdrop.show{
  opacity:1;
  visibility:visible
}
}
.hero{
 background-image:url("../assets/img/fv-bg.webp");

 background-size:cover;

 background-position:center right;

 background-repeat:no-repeat;

 background-attachment:scroll;

 position:relative;

 overflow:hidden;

}
.hero .container{
 max-width:1100px;

 margin:0 auto;

 box-sizing:border-box;

 padding:0 30px
}
.hero__flex{
 display:flex;

 align-items:center;

 justify-content:space-between;

 flex-wrap:nowrap
}
.hero__copy{
 flex:0 0 60%;

 min-width:260px
}
.hero__card{
 flex:0 0 40%;

 display:flex;

 justify-content:center;

 align-items:center;

 min-width:180px;

 padding-top: 130px;

}
.hero__card img{
 width:100%;

 height:auto;

 max-width:460px;

 object-fit:contain;

 display:block
}
.hp-cta-stack {
  text-align: center !important;
  margin: 0 auto;
}
.hp-cta-stack a {
  text-align: center !important;
}
.eyebrow{
 color:var(--muted);

 text-transform:uppercase;

 letter-spacing: var(--track-eyebrow);

 font-size:.86rem
}
.hero h1{
 font-size:var(--h1);

 line-height:1.08;

 margin:.2em 0 .25em;

 letter-spacing:.01em
}
.hero__sub{
 padding-top:10px;

 display:block;

 font-size:1rem;

 color:#334155;

 font-weight:800;

 letter-spacing:.06em
}
.lead{
 font-size:clamp(18px,2.4vw,20px);

 color:#0f1a33;

 margin-bottom:20px;

 letter-spacing:.01em
}
.cv-hero-bullets{
 margin:16px 0 6px;

 padding:0;

 list-style:none;

 display:grid;

 gap:10px
}
.cv-hero-bullets li{
 position:relative;

 padding-left:30px;

 line-height:1.7;

 color:#213255;

 font-weight:700
}
.cv-hero-bullets li::before{
 content:"";

 position:absolute;

 left:0;

 top:.35em;

 width:20px;

 height:20px;

 border-radius:50%;

 background:#e8f1fd url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23e68033' viewBox='0 0 16 16'%3E%3Cpath d='M6.173 12.927 1.2 8l1.4-1.4 3.573 3.6L13.4 3 14.8 4.4z'/%3E%3C/svg%3E") no-repeat center/12px;

 box-shadow:inset 0 0 0 1px #cfe0f5;

}
.cv-benefits{
 display:grid;

 grid-template-columns:repeat(3,minmax(0,1fr));

 gap:14px;

 margin-top:14px
}
.cv-benefits .cv-benefit{
 background:#fff;

 border:1px solid #e6eef7;

 border-radius:16px;

 padding:14px 16px;

 box-shadow:0 6px 18px rgba(16,24,40,.06)
}
.cv-benefit h4{
 margin:0 0 6px;

 font-size:1.06rem;

 color:#163253;

 font-weight:900
}
.cv-benefit p{
 margin:0;

 font-size:1rem;

 color:#3a4a68
}
.card{
 background:var(--card);

 border:1px solid #e6eef7;

 box-shadow:var(--shadow);

 border-radius:var(--radius-lg);

 padding:24px
}
.card h3{
 margin-top:0;

 font-size:var(--h3);

 letter-spacing:.01em;

 font-weight:900
}
.card ul {
  padding-left: 0px !important;
}
.feature{
 text-align:left
}
.list{
 margin:0;

 padding-left:18px
}
.list--check{
 list-style:none;

 padding-left:0px;
 margin-left: 0px;
}
.list--check li{
 position:relative;
 padding-left:20px;

 margin:10px 0;

 font-weight:800
}
.list--check li::before{
 content:"✔";

 position:absolute;

 left:0;

 top:0;

 color:var(--primary);

 font-weight:900
}
.list--dot{
 list-style:disc
}
.points{
 margin:0;

 padding-left:18px
}
.points li{
 margin:10px 0
}
.badges{
 list-style:none;

 padding:0;

 margin:16px 0 0;

 display:flex;

 flex-wrap:wrap;

 gap:10px
}
.badges li{
 background:#eef3fb;

 color:#0f1a33;

 padding:8px 12px;

 border-radius:999px;

 font-weight:900;

 font-size:1rem
}
.toc{
 display:flex;

 flex-wrap:nowrap;

 gap:12px;

 margin:10px!important;

 padding:10px 30px;

 overflow-x:auto;

 -webkit-overflow-scrolling:touch;

 scrollbar-width:none
}
.toc::-webkit-scrollbar{
 display:none
}
.toc a{
 background:#f2f6ff;

 color:#0b1220;

 padding:10px 14px;

 border-radius:999px;

 white-space:nowrap;

 border:2px solid #d7e6ff;

 flex-shrink:0;

 font-weight:900
}
.section{
 padding:36px 10px
}
.section--soft{
 background:#ebf2fb
}
.section--accent{
 background:#f8fbff
}
.muted{
 color:var(--muted)
}
.btn{
 display:inline-flex;

 align-items:center;

 justify-content:center;

 border-radius:46px!important;

 padding:14px 20px;

 font-weight:900;

 letter-spacing:.02em;

 transition:transform .1s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease;

 border:none;

 cursor:pointer
}
.btn--sm{
 padding:9px 32px !important;

 font-size:1rem
}
.btn--lg{
 padding:10px 22px;

 font-size:1.12rem
}
.btn--xl{
 padding:18px 26px;

 font-size:1.2rem
}

.btn--secondary{
 background:#eef3fb;

 color:#0b1220;

 border:2px solid #d7e6ff;

 font-weight:900
}
.btn--block{
 width:100%
}
.btn:hover{
 transform:translateY(-1px)
}
.form .field{
 display:grid;

 gap:8px
}
.form label{
 font-weight:900;

 color:#0b1220;

 letter-spacing:.01em
}
.form input[type="text"],.form input[type="email"],.form input[type="tel"],.form select,.form textarea{
 width:100%;

 border-radius:14px;

 padding:14px 16px;

 background:#fff;

 border:2px solid #d9e4f2;

 color:var(--text);

 box-shadow:inset 0 0 0 1px transparent;

 font-size:18px
}
.form input:focus,.form select:focus,.form textarea:focus{
 outline:4px solid var(--ring);

 outline-offset:0
}
.form .req{
 color:#d97706;

 font-weight:900;

 font-size:.9em;

 margin-left:4px
}
.form .error{
 color:#b42318;

 font-size:.95rem;

 min-height:1.2em
}
.form .hp{
 display:none!important
}
.form__note{
 margin-top:14px;

 color:var(--muted)
}
.steps{
 list-style:none;

 padding:0;

 display:grid;

 gap:18px;

 grid-template-columns:repeat(3,1fr)
}
.step{
 display:grid;

 grid-template-columns:56px 1fr;

 gap:14px;

 align-items:start
}
.step__num{
 width:56px;

 height:56px;

 border-radius:50%;

 display:grid;

 place-items:center;

 font-weight:900;

 background:var(--primary);

 color:#fff;

 font-size:1.1rem
}
.glossary{
 margin:0
}
.glossary dt{
 font-weight:900;

 margin-top:8px
}
.glossary dd{
 margin:0 0 8px 0;

 color:#2a3855
}
.site-footer{
 border-top:1px solid #e6eef7;

 padding:24px 0;

 background:#fff
}
.floating-cta{
 position:fixed;

 bottom:22px;

 left:0;

 right:0;

 display:flex;

 justify-content:center;

 z-index:999;

 opacity:0;

 transform:translateY(40px);

 transition:opacity .6s ease,transform .6s ease;

 pointer-events:none
}
.floating-cta a {
  margin: 0px 5px;
}
.floating-cta.show{
 opacity:1;

 transform:translateY(0);

 pointer-events:auto
}
.floating-cta .btn{
 max-width:360px;

 font-size:1.2rem;

 padding:16px 28px;

 border-radius:9999px;

 box-shadow:0 8px 24px rgba(0,0,0,.16)
}

.to-top{
 position:fixed;

 right:16px;

 bottom:20px;

 width:48px;

 height:48px;

 border-radius:50%;

 border:1px solid #e6eef7;

 background:#fff;

 color:var(--text);

 box-shadow:var(--shadow);

 cursor:pointer;

 display:grid;

 place-items:center
}
.cv-soft{
 background:#f8fbff
}
.cv-muted{
 color:var(--muted);

 font-size: 50%;

}
.cv-trustbar{
 display:flex;

 align-items:center;

 gap:6px;

 flex-wrap:wrap;

 padding:16px 10px;

 color:#203253;

 font-weight:900;

 font-size:1rem
}
@media (max-width: 520px){
  .cv-trustbar{
    display:flex;
    align-items:center;
    gap:5px;
    flex-wrap:wrap;
    padding:10px 5px;
    color:#203253;
    font-weight:900;
    font-size:12px;

  }
}
.cv-trustbar__item{
 display:flex;

 align-items:center;

 gap:8px;

 white-space:nowrap
}
.cv-dot{
 width:10px;

 height:10px;

 border-radius:50%;

 background:linear-gradient(135deg,var(--primary),#5fb4e1);

 box-shadow:0 0 0 3px rgba(27,117,178,.08)
}
.cv-compliance{
 background:#fff;

 border:2px solid #e6eef7;

 border-left:6px solid #e68033;

 border-radius:14px;

 padding:16px 18px;

 color:#223554;

 box-shadow:0 8px 22px rgba(16,24,40,.06);

 font-weight:900
}
.cv-compliance small{
 display:block;

 color:#5b6b88;

 margin-top:6px
}
.cv-flow-note{
 margin-top:12px;

 color:#203253;

 background:#f6f9ff;

 border:2px dashed #cfe0f5;

 border-radius:14px;

 padding:14px 16px;

 font-weight:900
}
.cv-voices{
 display:grid;

 gap:16px;

 grid-template-columns:repeat(3,minmax(0,1fr))
}
.cv-voice{
 background:#fff;

 border:1px solid #e6eef7;

 border-radius:16px;

 padding:16px;

 box-shadow:0 6px 18px rgba(16,24,40,.05)
}
.cv-voice p{
 margin:.4em 0;

 color:#203253;

 font-weight:800
}
.cv-voice .cv-meta{
 color:#6a7a96;

 font-size:1rem;

 font-weight:700
}
.faq-section{
 background:#f7f9fc;

 padding:88px 0;

 border-top:1px solid #e3e8ef
}
.cv-faq-callout{
 background:#e9f3ff;

 color:#1b3a6b;

 border-left:6px solid #3b82f6;

 padding:14px 22px;

 border-radius:10px;

 margin-bottom:36px;

 font-weight:900
}
.faq-title{
 text-align:center;

 font-size:clamp(28px,4.6vw,48px);

 color:#0d2a7a;

 margin-bottom:.5em;

 letter-spacing:.01em;

 font-weight:900
}
.faq-intro{
 text-align:center;

 color:#334155;

 max-width:720px;

 margin:0 auto 3em;

 line-height:1.9;

 font-weight:700
}
.faq-grid{
 display:grid;

 grid-template-columns:repeat(auto-fit,minmax(340px,1fr));

 gap:26px
}
.faq-card{
 background:#fff;

 border-radius:14px;

 padding:1.4em 1.6em;

 border:1px solid #dbe5ef;

 box-shadow:0 3px 10px rgba(0,0,0,.04);

 transition:all .3s ease
}
.faq-card:hover{
 transform:translateY(-4px);

 box-shadow:0 8px 20px rgba(0,0,0,.08)
}
.faq-q{
 font-weight:900;

 color:#0d2a7a;

 font-size:1.12rem;

 margin-bottom:.6em;

 position:relative;

 padding-left:28px;

 letter-spacing:.01em
}
.faq-q::before{
 content:"Q";

 position:absolute;

 left:0;

 top:0;

 color:#3b82f6;

 font-weight:900
}
.faq-a{
 color:#0f1a33;

 line-height:1.9;

 font-size:1.02rem;

 padding-left:28px;

 position:relative;

 font-weight:700
}
.faq-a::before{
 content:"A";

 position:absolute;

 left:0;

 top:0;

 color:#10b981;

 font-weight:900
}
[data-reveal]{
 opacity:0;

 transform:translateY(18px);

 transition:opacity .6s ease,transform .6s ease
}
[data-reveal].is-visible{
 opacity:1;

 transform:none
}
@media (max-width:960px){
  .grid-3{
    grid-template-columns:1fr 1fr
  }
  .steps{
   grid-template-columns:1fr
 }
 .cv-benefits{
   grid-template-columns:1fr
 }
 .cv-voices{
  grid-template-columns:1fr
}
}
@media (max-width:768px){
  .hero{
    padding:30px 0px 0px;

  }
  .hero__flex{
   flex-wrap:nowrap;
   gap:0rem;
   margin-bottom: 0px;

 }
 .hero__copy{
   flex:0 0 58%
 }
 .hero__card{
  flex:0 0 42%;
  padding-top: 0px;
}
.hero__card img{
  max-width:100%;
  width:auto;
  padding-top: 0px;
}
.hero__copy h1{
  font-size:clamp(32px,7.6vw,56px);
  line-height:1.08
}
.lead{
  font-size:1.06rem
}
.faq-section{
  padding:64px 16px
}
.faq-title{
  font-size:clamp(24px,6.6vw,36px)
}
.faq-grid{
  grid-template-columns:1fr
}
.floating-cta{
  bottom:16px
}
.floating-cta .btn{
  max-width:92%;
  font-size:1.08rem
}
}
@media (max-width:720px){
  .grid-2{
    grid-template-columns:1fr
  }
  .grid-3{
   grid-template-columns:1fr
 }
}
@media (max-width:480px){
  .hero__flex{
    flex-direction:column;
    text-align:center;

  }
  .hero__card img{
   max-width:300px;
   padding-top: 0px;

 }
}
:root{
  --primary:#0a4abf;
  --ring:rgba(10,74,191,.38);
}
:root{
  --primary-700:#083a97;
  --primary-800:#072f7a;
}
a{
  color: var(--primary);
  text-decoration: none;
  text-underline-offset: 3px;
}
a:hover{
  text-decoration: underline;
  opacity: 1;
}
.hp-price-burst{
 font-size:32px;

 line-height: 45px;

 font-weight:900;

 color: #fff;

}
.hp-price-burst span {
  color: #f4ed50;
  font-size: 120%;
  letter-spacing: .02em;
  -webkit-text-stroke:.7px rgba(8,16,48,.44);
  text-shadow: 0 2px 6px rgba(0,0,0,.18);
}
.hp-badge{
  border-color: rgba(10,74,191,.18);
}
.cv-benefit h4{
  color:#0e2f6d;
}
.step__num{
  background: linear-gradient(180deg, var(--primary) 0%, var(--primary-700) 100%);
}
.cv-dot{
  background: linear-gradient(135deg, var(--primary), #3e8aff);
  box-shadow: 0 0 0 3px rgba(10,74,191,.12);
}
.btn{
  letter-spacing:.02em;
  transition: transform .12s ease, box-shadow .22s ease, filter .22s ease, background .22s ease;
}
.btn--primary{
 background:#e68033 !important;

 background: linear-gradient(180deg, var(--primary) 0%, var(--primary-700) 100%);

 color:#fff !important;

 box-shadow: 0 14px 30px rgba(10,74,191,.34), inset 0 -2px 0 rgba(0,0,0,.08);

}
.btn--primary:hover{
 background:#ea9346!important;

 transform: translateY(-2px);

 filter: brightness(1.02);

 box-shadow: 0 18px 34px rgba(10,74,191,.38), inset 0 -2px 0 rgba(0,0,0,.1);

}
.btn--primary:active{
 background:#ea9346!important;

 transform: translateY(0);

 box-shadow: 0 10px 22px rgba(10,74,191,.30), inset 0 2px 0 rgba(255,255,255,.08);

}

.btn--default{
 background:#1d4892!important;

 background: linear-gradient(180deg, var(--primary) 0%, var(--primary-700) 100%);

 color:#fff !important;

 box-shadow: 0 14px 30px rgba(10,74,191,.34), inset 0 -2px 0 rgba(0,0,0,.08);

}
.btn--default:hover{
 background:#2857a7!important;

 filter: brightness(1.02);

 box-shadow: 0 18px 34px rgba(10,74,191,.38), inset 0 -2px 0 rgba(0,0,0,.1);

}
.btn--default:active{
 background:#2857a7!important;

 transform: translateY(0);

 box-shadow: 0 10px 22px rgba(10,74,191,.30), inset 0 2px 0 rgba(255,255,255,.08);

}

.btn--secondary{
  background:#eef3ff;
  color:#0a1120;
  border:2px solid rgba(10,74,191,.22);
}
.btn--secondary:hover{
  transform: translateY(-1px);
  background:#e5efff;
}
.btn--ghost{
  border:2px solid rgba(10,74,191,.26);
  color:#0a1120;
  background-color: #fff;
}
.btn--ghost:hover{
  transform: translateY(-1px);
  background: rgba(10,74,191,.06);
  background-color: #eee;
}
.floating-cta .btn{
  background: linear-gradient(180deg, var(--primary) 0%, var(--primary-700) 100%);
  box-shadow: 0 22px 44px rgba(10,74,191,.40);
}
.hero{
  position: relative;
}
.hero::after{
 content:"";

 position:absolute;

 inset:0;

 background:
 radial-gradient(1200px 600px at 15% -20%, rgba(10,74,191,.20), transparent 60%),
 radial-gradient(900px 420px at 100% 0%, rgba(7,47,122,.16), transparent 55%);

 pointer-events:none;

}
.faq-title{
  color: #0e2f6d;
}
.faq-q{
  color: #0e2f6d;
}
.faq-q::before{
  color: var(--primary);
}
.list--check li::before{
  color: var(--primary);
}
.cv-compliance{
  border-left-color: var(--primary);
}
@keyframes fxSheen {
  0% {
   background-position: 0% 50% 
 }
 50%{
  background-position: 100% 50% 
}
100%{
 background-position: 0% 50% 
}
}
.hero h1,
.hp-price-xl{
  color: #f4ed50;
  font-weight: 900;
  letter-spacing: .02em;
  -webkit-text-stroke:.7px rgba(8,16,48,.44);
  text-shadow: 0 2px 6px rgba(0,0,0,.18);
}
@media (max-width: 520px){
  .hero h1,.hp-price-xl{
    -webkit-text-stroke:.7px rgba(8,16,48,.44);
    text-shadow: 0 2px 6px rgba(0,0,0,.18);
    font-size: 42px;

  }
  .hp-subline {
   text-align: left;
   font-size: 18px;

 }
}
.hp-price-xl small{
  color: #fff;
}
.fx-banner{
 display:inline-block;

 padding:.18em .6em .22em;

 background:
 linear-gradient(90deg, rgba(255,255,255,.6), rgba(255,255,255,0) 40%),
 linear-gradient(135deg, #bcd6ff, #79a8ff 45%, #2a60ff 85%);

 color:#031033;

 border-radius:12px;

 box-shadow: 0 10px 26px rgba(20,40,80,.18);

 font-weight:1000;

 letter-spacing:.02em;

}
.fx-stamp{
 display:inline-block;

 padding:.18em .5em .16em;

 border:4px solid currentColor;

 color:#e11d48;

 border-radius:10px;

 font-weight:1000;

 transform: rotate(-3deg);

 box-shadow: 0 6px 0 rgba(0,0,0,.06), inset 0 0 0 3px rgba(255,255,255,.6);

 background: linear-gradient(180deg, rgba(255,255,255,.8), rgba(255,255,255,.4));

}
.fx-stamp.is-blue{
  color:#0a4abf;
  transform: rotate(2deg);
}
.fx-gold{
 background:
 linear-gradient(180deg, rgba(255,255,255,.6), rgba(255,255,255,0) 30%),
 linear-gradient(135deg, var(--fx-gold-1), var(--fx-gold-2) 35%, var(--fx-gold-3) 70%, var(--fx-gold-4));

 background-clip:text;

 -webkit-background-clip:text;

 color:transparent;

 -webkit-text-stroke:.9px rgba(120,72,0,.42);

 text-shadow: 0 1px 0 rgba(255,255,255,.35), 0 10px 18px rgba(170,110,0,.35);

 animation: fxSheen 10s linear infinite;

}
.fx-extrude{
 background: linear-gradient(180deg,#f2f6ff,#d9e6ff 40%, #a9c0ff 100%);

 background-clip:text;

 -webkit-background-clip:text;

 color:transparent;

 -webkit-text-stroke: 1.2px rgba(8,12,40,.6);

 text-shadow:
 0 1px 0 rgba(255,255,255,.8),
 0 2px 0 rgba(220,230,255,.95),
 0 3px 0 rgba(190,205,255,.95),
 0 18px 26px rgba(0,0,0,.28);

}
.fx-neon{
 color:#fff;

 text-shadow:
 0 0 6px var(--fx-neon),
 0 0 14px var(--fx-neon),
 0 0 28px rgba(90,170,255,.9),
 0 0 60px rgba(90,170,255,.8);

 -webkit-text-stroke:.7px rgba(255,255,255,.35);

 letter-spacing:.02em;

}
.fx-underline{
 position:relative;

 display:inline-block;

 padding-bottom:.06em;

}
.fx-underline::after{
 content:"";

 position:absolute;

 left:0;

 right:0;

 bottom:-.08em;

 height:.22em;

 border-radius:.22em;

 background: linear-gradient(90deg, #ffd76a, #ffb83a 40%, #ff7a45);

 box-shadow: 0 6px 14px rgba(255,120,40,.25);

}
.hp-price-xl{
  font-size: clamp(44px, 9vw, 96px);
  line-height: .98;
  letter-spacing:.01em;
}
.hp-price-xl.fx-extrude{
  letter-spacing:.005em;
}
.gf-ic{
  margin-right:.4em;
  vertical-align:-.12em
}
#wp-deep h2 i,
#compare h2 i{
  color:#0061ff
}
.gf-grid-3{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px
}
@media (max-width:960px){
  .gf-grid-3{
    grid-template-columns:1fr 1fr
  }
}
@media (max-width:640px){
  .gf-grid-3{
    grid-template-columns:1fr
  }
}
.gf-card{
  background:#fff;
  border:1px solid #e6eef7;
  border-radius:14px;
  padding:18px;
  box-shadow:0 8px 22px rgba(16,24,40,.06)
}
.gf-card h3{
  margin:0 0 .5em;
  color:#0b2b6b;
  font-size: 20px;
  display:flex;
  align-items:center;
  gap:.4em
}
.gf-card ul {
  padding-left: 0px;
}
.gf-list{
  margin:.4em 0 0 1.2em
}
.gf-list li{
  margin:.35em 0;
  color:#2a3855;
  line-height:1.7;
}
.gf-mini{
  margin-top:10px;
  color:#5b6b88;
  font-size:.94rem;
  text-align:center
}
.gf-table-wrap{
  overflow:auto;
  margin-top:10px
}
.gf-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width:760px
}
.gf-table thead th{
  background:#f0f6ff;
  border-bottom:2px solid #d8e5fb;
  padding:12px 14px;
  text-align:left;
  color:#0b2b6b;
  font-weight:800
}
.gf-table tbody td{
  border-bottom:1px solid #edf2fa;
  padding:12px 14px;
  color:#1f2a44
}
.gf-table tbody tr:hover{
  background:#fbfdff
}
.hp-badge .gf-ic{
  color:#0061ff
}
#features .hp-card h3 i{
  color:#0061ff;
  font-size: 20px;
}
#features .hp-card h3 {
  font-size: 20px;
}
.flow{
  padding:48px 0
}
.flow-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:14px
}
.flow-rail{
  position:relative
}
.flow-track{
  display:flex;
  gap:16px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  padding:6px 4px 6px 0;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none
}
.flow-track::-webkit-scrollbar{
  display:none
}
.flow-card{
  flex:0 0 320px;
  display:grid;
  align-items: flex-start !important;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  box-shadow:0 8px 22px rgba(16,24,40,.06);
  padding:16px 18px;
  display:grid;
  gap:8px
}
.flow-step{
  display:flex;
  align-items: flex-start !important;
  gap:10px;
  font-weight:900;
  color:#0b2b6b
}
.flow-step i{
  color:#1b5cff
}
.flow-desc{
  color:#223148;
  align-items: flex-start !important;
}
.flow-progress{
  display:flex;
  gap:8px;
  justify-content:center;
  margin-top:10px
}
.flow-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#d7e6ff
}
.flow-dot.is-active{
  background:#1b5cff
}
@media(min-width:961px){
  .flow-card{
    flex-basis:360px
  }
}
@media(max-width:520px){
  .hero__flex{
   flex-direction:column;

   text-align:center
 }
 .hero__card img{
  max-width:300px
}
}

.why-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
  margin-top:14px
}
@media(max-width:960px){
  .why-grid{
    grid-template-columns:1fr 1fr
  }
}
@media(max-width:640px){
  .why-grid{
    grid-template-columns:1fr
  }
}
.why-card h3{
  display:flex;
  align-items:center;
  gap:.5em;
  color:#0b2b6b
}
.why-card ul{
  padding-left: 0px;
  margin: 0px;
}
.badge-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px
}
.badge{
  background:#eef3fb;
  border:1px solid #d7e6ff;
  color:#103062;
  padding:8px 12px;
  border-radius:999px;
  font-weight:800;
  font-size: 13px;
  display:inline-flex;
  align-items:center;
  gap:.4em
}
.perf-grid .perf h3{
  color:#0b2b6b
}
.mini-metrics{
  display:flex;
  gap:5px;
  flex-wrap:wrap;
  padding:0;
  margin:.4em 0 0;
  list-style:none
}
.mini-metrics li{
  background:#f2f6ff;
  border:1px solid #d7e6ff;
  color:#234079;
  padding:6px 10px;
  border-radius:999px;
  font-weight:800;
  font-size: 13px;
}
.myth-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border:1px solid #e2e8f0;
  border-radius:14px
}
.myth-table thead th{
  background:linear-gradient(180deg,#f3f7ff,#eaf1ff);
  text-align:left;
  color:#0b2b6b;
  font-weight:900;
  padding:12px 14px;
  border-bottom:2px solid #d4e1ff
}
.myth-table tbody td{
  padding:14px;
  border-bottom:1px solid #edf2fa;
  color:#13223f
}
.myth-table tbody tr:last-child td{
  border-bottom:none
}
.myth-table td i{
  color:#1b5cff;
  margin-right:.4em;
  vertical-align:-.12em;
  font-size:1.05em
}
.roadmap{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-top:12px
}
@media(max-width:960px){
  .roadmap{
    grid-template-columns:1fr 1fr
  }
}
@media(max-width:560px){
  .roadmap{
    grid-template-columns:1fr
  }
}
.rm-item{
  background:#fff;
  border:1px solid #e6eef7;
  border-radius:16px;
  padding:16px;
  box-shadow:0 8px 22px rgba(16,24,40,.06)
}
.rm-head{
  display:flex;
  align-items:center;
  gap:.5em;
  font-weight:900;
  color:#0b2b6b;
  margin-bottom:.4em
}
.rm-head i{
  color:#1b5cff
}
#promise .card .list--check li{
  margin:.6em 0
}



#works-section {
  position: relative;
  overflow: hidden;
  background:#f8fbff;
}
#works-section h2 {
  text-align: center;
  padding-bottom: 15px;
}
#works-section .works-intro{
  margin:0 auto 40px;
  padding:50px 28px;
  border:1px solid #e3ebf5;
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 22px rgba(16,24,40,.06);
}
#works-section .works-intro p{
  color:#1e293b;
  line-height:1.9;
  font-weight:700;
}
#works-section .works-gallery{
  position:relative;
  overflow:hidden;
  border-radius:16px;
  background:linear-gradient(180deg,#f9fbff,#f0f4ff);
  width:100%;
  height:180px;
  padding-top: 30px;
}
#works-section .works-track{
  display:flex;
  align-items:center;
  gap:16px;
  white-space:nowrap;
  will-change: transform;
  animation: works-marquee var(--works-speed, 24s) linear infinite;
}
#works-section .works-track img{
  width:240px;
  height:135px;
  object-fit:cover;
  border-radius:12px;
  flex:0 0 auto;
  box-shadow:0 4px 16px rgba(0,0,0,.08);
  transition:transform .3s ease;
}
#works-section .works-track img:hover{
  transform:scale(1.04);
}
@keyframes works-marquee{
  from{
    transform: translateX(0);

  }
  to  {
    transform: translateX(calc(-1 * var(--loop-width, 100%)));

  }
}
@media (max-width:768px){
  #works-section .works-gallery{
    height:170px;

  }
  #works-section .works-track img{
    width:240px;

    height:135px;

  }
}


/* ===== scope section (namespaced) ===== */
.gf-scope{
  --scope-ink:#0b1a33;
  --scope-brand:#0b2b6b;
  --scope-accent:#1b5cff;
  --scope-surface:#ffffff;
  --scope-soft:#f6f9ff;
  --scope-line:#e6eef7;
  --scope-shadow:0 12px 34px rgba(16,24,40,.08);
  background:linear-gradient(180deg,#fbfdff 0%, #f7faff 100%);
  padding:64px 0;
}
.gf-scope *{box-sizing:border-box}
.gf-scope__container{max-width:1120px;
  margin:0 auto;
  padding:0 20px}
  .gf-scope__head h2{
    display:flex;
    align-items:center;
    gap:.5em;
    font-size:clamp(24px,3.6vw,36px);
    color:var(--scope-brand);
    margin:0 0 .4em;
    letter-spacing:.01em;
    font-weight:900;

  }
  .gf-scope__head h2 i{color:var(--scope-accent)}
  .gf-scope__intro{color:#334155;
    line-height:1.9;
    margin:0 0 18px;
    font-weight:700}

/* 図解レイアウト */
.gf-scope__diagram{display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-top:12px}
  .gf-card{background:linear-gradient(180deg,#fff,#fbfdff);
    border:1px solid var(--scope-line);
    border-radius:16px;
    box-shadow:var(--scope-shadow);
    padding:18px}
    .gf-card h3{display:flex;
      align-items:center;
      gap:.5em;
      margin:0 0 .4em;
      font-size:1.2rem;
      color:var(--scope-brand);
      font-weight:900}
      .gf-card h3 i{color:var(--scope-accent)}
      .gf-list{margin:.4em 0 0 1.2em}
      .gf-list li{margin:.35em 0;
        line-height:1.8;
        color:#223555;
        font-weight:700}
        .gf-scope__chipset{display:flex;
          gap:8px;
          flex-wrap:wrap;
          margin-top:10px}
          .gf-chip{font-size: 13px;
           display:inline-flex;
           align-items:center;
           gap:.5em;
           border:1px solid #d8e5fb;
           border-radius:999px;
           padding:.4em .7em;
           background:#f2f6ff;
           color:#0b2b6b;
           font-weight:800}
           .gf-chip i{color:var(--scope-accent)}
           .is-free{border-left:6px solid #10b981}
           .is-paid{border-left:6px solid #f59e0b}
/* ===============================
項目別 早見表（スマホ横スクロール対応）
================================== */

/* ベース */
.gf-scope__table-wrap {
  margin-top: 24px;
  padding: 10px;
}
.gf-scope__sub {
  display: flex;
  align-items: center;
  gap: .5em;
  margin: 0 0 .6em;
  color: var(--scope-brand);
  font-size: 1.15rem;
  font-weight: 900;
}
.gf-scope__sub i {
  color: var(--scope-accent);
}
.gf-scope__table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border-radius: 14px;
  border: 1px solid var(--scope-line);
}
.gf-scope__table thead th {
  background: linear-gradient(180deg, #f3f7ff, #eaf1ff);
  color: #0b2b6b;
  font-weight: 900;
  padding: 12px 14px;
  text-align: left;
  border-bottom: 2px solid #d4e1ff;
  white-space: nowrap;
}
.gf-scope__table tbody td {
  padding: 12px 14px;
  border-bottom: 1px solid #edf2fa;
  color: #1f2a44;
  vertical-align: top;
  white-space: nowrap;
}
.gf-scope__table tbody tr:hover {
  background: #f8fbff;
}
.gf-scope__table td b {
  font-weight: 900;
}
.gf-scope__table td i {
  color: var(--scope-accent);
  margin-right: .35em;
  vertical-align: -.12em;
}
.gf-scope__note {
  color: #5b6b88;
  margin: .6em 0 0;
  font-size: .95rem;
}

/* ===============================
 スマホ（横スクロール化）
================================== */
@media (max-width: 960px) {
  .gf-scope__table-wrap {
    position: relative;

    overflow-x: auto;

    -webkit-overflow-scrolling: touch;

    border-radius: 14px;

    border: 1px solid var(--scope-line);

    background: #fff;

    padding-bottom: 8px;

  }

/* 横スクロール時に見切れ感を出さない */
.gf-scope__table {
  min-width: 720px;
}

/* スクロールバー調整 */
.gf-scope__table-wrap::-webkit-scrollbar {
  height: 8px;
}
.gf-scope__table-wrap::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--scope-accent), #0038c9);
  border-radius: 999px;
}
.gf-scope__table-wrap::-webkit-scrollbar-track {
  background: #eef3ff;
  border-radius: 999px;
}

/* 表ヘッダーを固定せず自然なスクロール */
.gf-scope__table thead th,
.gf-scope__table tbody td {
  white-space: nowrap;
}

/* フェード感を左右に追加（装飾） */
.gf-scope__table-wrap::before,
.gf-scope__table-wrap::after {
  content: "";
  position: sticky;
  top: 0;
  width: 24px;
  height: 100%;
  z-index: 3;
  pointer-events: none;
}
.gf-scope__table-wrap::before {
  left: 0;
  background: linear-gradient(90deg, #fff, rgba(255, 255, 255, 0));
}
.gf-scope__table-wrap::after {
  right: 0;
  background: linear-gradient(270deg, #fff, rgba(255, 255, 255, 0));
}
}
/* よくある追加パターン */
.gf-scope__addons{margin-top:26px}
.gf-scope__addon-grid{display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px}
  .gf-scope__addon-grid .gf-card h4{display:flex;
    align-items:center;
    gap:.5em;
    margin:.1em 0 .4em;
    color:var(--scope-brand);
    font-weight:900}
    .gf-scope__addon-grid .gf-card p{color:#223555;
      line-height:1.85;
      margin:.35em 0;
      font-weight:700}
      .gf-scope__tag{display:inline-flex;
        align-items:center;
        gap:.4em;
        padding:.32em .6em;
        border-radius:999px;
        background:#eef4ff;
        border:1px solid #d8e5fb;
        color:#0b2b6b;
        font-weight:800;
        font-size: 13px;
      }
      .gf-scope__tag i{color:var(--scope-accent)}

/* CTA */
.gf-scope__cta{display:flex;
  gap:12px;
  flex-wrap:wrap;
  justify-content:center;
  margin-top:20px}

/* Responsive */
@media (max-width:1024px){
  .gf-scope__diagram{grid-template-columns:1fr}
  .gf-scope__addon-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .gf-scope__addon-grid{grid-template-columns:1fr}
  .gf-scope{padding:52px 0}
}

/* デフォルトでは改行しない */
br.br-sp { display: none;
}

/* スマホ幅のときだけ改行（例：〜768px） */
@media (max-width: 768px) {
  br.br-sp { display: inline;
  }
}


/* =============================
 SEO/強化プラン（scoped）
 ============================= */
 .gf-seo { padding: 40px 0 12px;
 }
 .gf-seo__title{
  margin: 0 0 16px;
  font-weight: 900;
  color: #0b2b6b;
  letter-spacing: .01em;
  display: flex;
  align-items: center;
  gap: .5em;
}
.gf-seo__title i{ color:#0061ff }

.gf-seo__grid{
 display:grid;
 grid-template-columns:repeat(4, minmax(0,1fr));
 gap:16px;

}
@media (max-width: 1080px){ .gf-seo__grid{ grid-template-columns:repeat(2,1fr);
} }
@media (max-width: 640px){ .gf-seo__grid{ grid-template-columns:1fr;
} }

.gf-seo__card{
  position: relative;
  border:1px solid #e6eef7;
  border-radius:16px;
  background: linear-gradient(180deg,#fff,#fbfdff);
  padding:18px;
  box-shadow:0 10px 28px rgba(10,18,32,.06);
  transition: transform .18s ease, box-shadow .22s ease, border-color .22s ease;
}
.gf-seo__card:hover{
  transform: translateY(-3px);
  box-shadow:0 16px 36px rgba(10,18,32,.10);
  border-color:#d9e7ff;
}
.gf-seo__card--pick{
  outline: 2px solid rgba(10,74,191,.12);
  box-shadow:0 16px 38px rgba(27,92,255,.14);
}

.gf-seo__badge{
  position:absolute;
  top:-15px;
  right:5px;
  font-size:12px;
  font-weight:900;
  padding:6px 10px;
  border-radius:999px;
  color:#0a1120;
  background:#eef3ff;
  border:1px solid #d7e6ff;
}
.gf-seo__badge--primary{
  color:#fff;
  background:#1b5cff;
  border-color:#1b5cff;
}

.gf-seo__name{
  margin: 6px 0 6px;
  font-size: 18px;
  font-weight: 900;
  color:#0b2b6b;
  letter-spacing:.01em;
  min-height: 2.6em;
}

.gf-seo__price{
  margin: 2px 0 10px;
  line-height:1;
  font-weight: 900;
  color:#0a1120;
}
.gf-seo__total{
  font-size: clamp(22px, 3.2vw, 28px);
  background: linear-gradient(180deg,#1b5cff,#0038c9);
  -webkit-background-clip:text;
  background-clip:text;
  color:#ff0000;
}
.gf-seo__per{
  margin-left: 2px;
  font-size: 14px;
  color:#475569;
  font-weight: 800;
}

.gf-seo__meta{
  margin: 10px 0 14px;
  display: grid;
  gap: 8px;
}
.gf-seo__meta dt{
  font-weight:800;
  color:#0b2b6b;
  display:inline;
  font-size: 16px;
}
.gf-seo__meta dd{
  display:inline;
  margin:0;
  color:#333;
  font-weight:500;
  font-size: 16px;
  padding: 0px 5px;
}

.gf-seo__btn{
  width:100%;
  margin-top: 4px;
}

.gf-seo__note{
  margin: 12px 0 0;
  color:#5b6b88;
  font-size:.95rem;
}

/* ===== シンプル横スクロールヒント ===== */

/* 横スクロール領域のベース */
.scroll-x {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #d8e5fb transparent;
}
.scroll-x::-webkit-scrollbar {
  height: 6px;
}
.scroll-x::-webkit-scrollbar-thumb {
  background: #d8e5fb;
  border-radius: 999px;
}
.scroll-x::-webkit-scrollbar-track {
  background: transparent;
}

/* ヒントテキスト */
.scroll-hint {
  display: none; /* PCでは非表示 */
  font-size: 13px;
  color: #5b6b88;
  font-weight: 700;
  text-align: right;
  margin: 0 0 6px;
  padding-right: 6px;
  letter-spacing: .02em;
}

/* スマホのときだけ表示 */
@media (max-width: 960px) {
  .scroll-hint {
    display: block;
    animation: hintFade 1.2s ease-in-out infinite alternate;
  }
}

/* ほんのり点滅で“気づく”程度 */
@keyframes hintFade {
  from { opacity: .45; }
  to { opacity: 1; }
}




.keywordarea {
  margin-top: 30px !important;
  max-width: 800px;
  overflow-x: auto;
  margin: 0 auto;
  padding: 10px;
  box-sizing: border-box;
}

.keywordarea_box {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  justify-content: flex-start;
  align-items: center;
  overflow-x: auto;
  padding: 8px 0;
  white-space: nowrap;
  border: 1px solid #ccc;
  border-radius: 6px;
  scroll-behavior: smooth;
}

.keywordarea_box span {
  display: inline-block;
  font-size: 12px;
  background: #f7f7f7;
  padding: 6px 10px;
  border-radius: 20px;
  border: 1px solid #ddd;
  text-align: center;
}

.keywordarea_box span a {
  text-decoration: none;
  color: #333;
  display: inline-block;
  width: 100%;
}

.keywordarea_box::-webkit-scrollbar {
  height: 6px;
}
.keywordarea_box::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 3px;
}