
.tabs{display:inline-flex;gap:4px;padding:5px;border-radius:999px;border:1.5px solid var(--border);background:#fff}
.tabs button{height:40px;padding:0 18px;border-radius:999px;border:none;background:transparent;cursor:pointer;font-size:14.5px;font-weight:700;color:var(--text2);white-space:nowrap;transition:background .2s,color .2s}
.tabs button:hover{color:var(--text)}
.tabs button.on{background:var(--ink);color:#fff}
.tabs.client button.on,.detail .tabs button:first-child.on{background:var(--blue)}
.panels>div{display:none}.panels>div.on{display:block;animation:rise .4s cubic-bezier(.2,.85,.25,1)}

.trust .grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:28px;margin-top:48px;align-items:stretch}
.pinbox{border-radius:26px;border:1.5px solid var(--border);padding:34px 32px;display:flex;flex-direction:column;justify-content:center}
.pinbox .eyebrow{color:var(--text3)}
.pinbox .digits{display:flex;gap:14px;margin-top:22px}
.pinbox .digits span{width:62px;height:76px;border-radius:16px;background:var(--card);display:flex;align-items:center;justify-content:center;font-size:40px;font-weight:800;color:var(--text);letter-spacing:-1px;font-variant-numeric:tabular-nums}
.pinbox h3{font-size:24px;font-weight:800;margin-top:24px;letter-spacing:-.5px;line-height:1.2}
.pinbox p{margin:10px 0 0;font-size:15.5px;color:var(--text2);font-weight:500;line-height:1.55}
.pinbox .who{display:flex;align-items:center;gap:10px;margin-top:22px;padding-top:20px;border-top:1px solid var(--border-soft);font-size:13.5px;font-weight:600;color:var(--text2)}
.pinbox .who i{width:8px;height:8px;border-radius:50%;background:var(--green);display:inline-block}
.tlist{list-style:none;margin:0;padding:0 8px;display:flex;flex-direction:column;justify-content:center}
.tlist li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:16px;align-items:start;padding:18px 0;border-top:1px solid var(--border-soft)}
.tlist li:first-child{border-top:none;padding-top:0}.tlist li:last-child{padding-bottom:0}
.tlist .ic{width:44px;height:44px;display:flex;align-items:center;justify-content:center}.tlist .ic svg{width:30px;height:30px}.tlist .ic svg *{stroke-width:2.6}.tlist .ic img{width:44px;height:44px;object-fit:contain;display:block}
.tlist b{display:block;font-size:16px;letter-spacing:-.2px}
.tlist span{display:block;margin-top:3px;font-size:14.5px;color:var(--text2);font-weight:500;line-height:1.5}

.detail{padding-top:0}
.detail .box,.modes .box{border-radius:26px;background:var(--card);padding:36px 40px}
.detail .top,.modes .top{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.detail .top h3,.modes .top h3{font-size:22px;font-weight:800;letter-spacing:-.4px}
.detail .top p,.modes .top p{margin:4px 0 0;font-size:14.5px;color:var(--text2);font-weight:500}
.walk{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.walk li{background:#fff;border-radius:20px;padding:22px 20px 24px;border:1.5px solid var(--border)}
.walk.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.detail .panels>div:first-child .walk .n,.modes .walk .n{background:var(--blue)}
.walk .n{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--ink);color:#fff;font-size:13px;font-weight:800;font-variant-numeric:tabular-nums}
.walk h4{margin:16px 0 0;font-size:16.5px;font-weight:800;letter-spacing:-.3px}
.walk p{margin:6px 0 0;font-size:14px;color:var(--text2);font-weight:500;line-height:1.5}

.ck{position:fixed;right:20px;bottom:20px;z-index:80;width:min(440px,calc(100% - 40px));padding:24px 24px 20px;border-radius:20px;background:#fff;box-shadow:0 20px 60px rgba(15,23,42,.18);border:1px solid var(--border-soft);animation:rise .45s cubic-bezier(.2,.85,.25,1)}
.ck[hidden]{display:none}
.ck b{display:block;font-size:20px;font-weight:800;letter-spacing:-.4px}
.ck p{margin:8px 0 0;font-size:14.5px;color:var(--text2);font-weight:500;line-height:1.55}
.ck p a{font-weight:700}
.ck-b{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
.ck .btn{height:44px;padding:0 18px;font-size:14px;border-radius:12px}

.rules{background:var(--blue-soft)}
.rules .eyebrow{color:var(--blue)}
.rules .cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;margin-top:44px}
.rules h3{font-size:20px;font-weight:800;letter-spacing:-.3px}
.rules p{margin:12px 0 0;font-size:16.5px;line-height:1.65;color:var(--text);font-weight:500}
.rules p+p{margin-top:14px}
.rules p b{font-weight:800}
.rules .fine{display:flex;align-items:center;gap:10px;margin-top:40px;padding-top:22px;border-top:1px solid rgba(37,99,235,.18);font-size:14.5px;color:var(--text2);font-weight:600}.rules .fine svg{flex-shrink:0}

.pros .three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:48px}
.pros .card{border-radius:24px;border:1.5px solid var(--border);padding:28px 26px;background:#fff}
.pros .card .ilu{display:block;width:72px;height:72px;object-fit:contain;margin:0 0 18px}
.pros .big{font-size:44px;font-weight:800;letter-spacing:-.04em;line-height:1;color:var(--text);font-variant-numeric:tabular-nums}
.pros .big small{font-size:18px;font-weight:700;color:var(--text2);letter-spacing:-.2px;margin-left:6px}
.pros h3{font-size:18px;font-weight:800;margin-top:18px;letter-spacing:-.3px}
.pros p{margin:8px 0 0;font-size:14.5px;color:var(--text2);font-weight:500;line-height:1.55}
.pros .more{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:32px;font-size:15px;font-weight:600;color:var(--text2)}
.pros .more a{display:inline-flex;align-items:center;gap:6px;font-weight:700}

.conq{background:#fff;border-top:1px solid var(--border-soft)}
.conq-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:56px;align-items:center}
.conq-txt .eyebrow{color:var(--blue)}
.conq-txt h2{font-size:clamp(28px,3.6vw,42px);font-weight:800;line-height:1.08;margin-top:12px;letter-spacing:-.8px}
.conq-txt>p{margin:14px 0 0;font-size:17px;color:var(--text2);font-weight:500;max-width:520px}
.conq-count{display:flex;align-items:baseline;gap:10px;margin-top:34px}
.conq-count b{font-size:56px;font-weight:800;letter-spacing:-.04em;line-height:1;color:var(--blue);font-variant-numeric:tabular-nums}
.conq-count span{font-size:16px;font-weight:600;color:var(--text2);white-space:nowrap}.conq-count em{font-style:normal;font-weight:800;color:var(--text)}
.conq-bar{height:6px;border-radius:999px;background:var(--card);margin-top:14px;max-width:420px;overflow:hidden}
.conq-bar i{display:block;height:100%;width:0;border-radius:999px;background:var(--blue);transition:width 1.2s cubic-bezier(.2,.85,.25,1) .6s}
.conq-leg{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13.5px;font-weight:600;color:var(--text2)}
.conq-leg li{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;white-space:nowrap}.conq-leg li[hidden]{display:none}
.conq-leg i{width:12px;height:12px;border-radius:4px;box-sizing:border-box}
.conq-leg .a{background:var(--blue)}.conq-leg .b{background:#BFDBFE}.conq-leg .c{background:#fff;border:1.5px solid var(--border)}
.conq-read{margin-top:26px;padding:16px 18px;border-radius:16px;border:1.5px solid var(--border);max-width:420px;min-height:76px;box-sizing:border-box;transition:border-color .2s,background .2s}
.conq-read b{display:block;font-size:16px;font-weight:800;letter-spacing:-.3px}
.conq-read span{display:block;margin-top:3px;font-size:13.5px;color:var(--text2);font-weight:500}
.conq-read.on{border-color:var(--blue);background:var(--blue-soft)}
.conq-cta{display:inline-flex;align-items:center;gap:6px;margin-top:22px;font-size:15px;font-weight:700;color:var(--blue)}
.conq-map{position:relative}
.conq-map svg{display:block;width:100%;height:auto;max-height:640px;margin:0 auto}
.conq-map path{fill:#fff;stroke:#9CA3AF;stroke-width:1.6;stroke-linejoin:round;vector-effect:non-scaling-stroke;opacity:0;transform:translateY(8px);transition:fill .25s,opacity .55s,transform .55s;cursor:pointer}
.conq-map.paint path{opacity:1;transform:none}
.conq-map path:hover{fill:var(--card)}
.conq-map path.a{fill:var(--blue);stroke:#fff}.conq-map path.a:hover{fill:#1D4ED8}
.conq-map path.b{fill:#BFDBFE}.conq-map path.b:hover{fill:#93C5FD}
.conq-map .lbl{font-size:15px;font-weight:800;fill:var(--text);paint-order:stroke;stroke:#fff;stroke-width:4px;stroke-linejoin:round;pointer-events:none;opacity:0;transition:opacity .5s 1.7s}
.conq-map.paint .lbl{opacity:1}
.conq-map .ring{fill:none;stroke:var(--blue);stroke-width:2;opacity:0;transform-box:fill-box;transform-origin:center}
.conq-map.paint .ring{animation:conqRing 1.6s ease-out 1.5s 2}
@keyframes conqRing{0%{transform:scale(.3);opacity:.9}100%{transform:scale(2.8);opacity:0}}
.conq-tip{position:absolute;pointer-events:none;padding:7px 11px;border-radius:999px;background:var(--ink);color:#fff;font-size:12.5px;font-weight:700;white-space:nowrap;transform:translate(-50%,-150%);z-index:2}
.conq-tip[hidden]{display:none}
.conq-err{display:none;padding:40px 24px;text-align:center;border-radius:22px;background:var(--card);color:var(--text2);font-weight:600;font-size:14.5px}
.conq-map.err svg,.conq-map.err .conq-src{display:none}.conq-map.err .conq-err{display:block}
.conq-src{display:none}

.dev{background:#1F2937;border-radius:14.5%/6.7%;padding:3.2%;box-shadow:0 24px 50px rgba(15,23,42,.14)}
.dev img{display:block;width:100%;height:auto;aspect-ratio:780/1688;border-radius:12.5%/5.8%}
.dev.raw,.step .dev.raw{display:block;height:auto;aspect-ratio:716/1407;background:none;padding:0;border-radius:0;box-shadow:none!important;filter:drop-shadow(0 24px 40px rgba(15,23,42,.16))}
.step{display:flex;flex-direction:column}
.step p{margin-bottom:32px}
.step .dev{margin-top:auto;width:min(100%,230px)}
.modes .panels>div.on{display:grid;grid-template-columns:200px minmax(0,1fr);gap:44px;align-items:center;margin-top:28px}
.modes .mdev{width:200px}
.modes .peek{display:contents}.modes .tag{display:none}
.modes .walk.three{grid-template-columns:1fr;gap:12px;margin:0}
.modes .walk li{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:14px;row-gap:5px;padding:18px 20px;align-content:start}
.modes .walk li .n{grid-row:1/3}
.modes .walk h4{margin:5px 0 0}
.modes .walk p{grid-column:2;margin:0}

@media (max-width:1100px){.walk{grid-template-columns:repeat(3,minmax(0,1fr))}.walk li:nth-child(4),.walk li:nth-child(5){grid-column:span 1}}
@media (max-width:900px){
  .trust .grid{grid-template-columns:1fr;gap:20px;margin-top:36px}
  .pinbox{padding:28px 24px}.pinbox .digits span{width:54px;height:66px;font-size:34px}
  .tlist{padding:8px 4px 0}
  .detail .box,.modes .box{padding:28px 22px}
  .walk.three{grid-template-columns:1fr 1fr}
  .walk{grid-template-columns:1fr 1fr;gap:12px}
  .rules .cols{grid-template-columns:1fr;gap:28px}
  .pros .three{grid-template-columns:1fr;gap:12px}
  .conq-grid{grid-template-columns:1fr;gap:28px}.conq-map svg{max-height:560px}
  .modes .panels>div.on{grid-template-columns:1fr;gap:20px;margin-top:22px}.modes .mdev{width:170px}
}

.modes .panels>div.on{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:40px;align-items:stretch}
.modes .peek{display:block;position:relative;min-height:440px;border-radius:22px;overflow:hidden;background:var(--card)}
.modes .peek .scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:30% center;display:block}.modes .peek .scene.casa{object-position:8% center}
.modes .tag{display:block;position:absolute;left:18px;bottom:18px;top:auto;z-index:1;background:#fff;border-radius:16px;padding:14px 16px;max-width:230px;box-shadow:0 10px 30px rgba(15,23,42,.12)}
.modes .tag small{display:block;font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--blue)}
.modes .tag b{display:block;margin-top:6px;font-size:18px;font-weight:800;letter-spacing:-.4px;line-height:1.2;color:var(--text);text-wrap:pretty}
.modes .mdev{position:absolute;right:18px;top:18px;bottom:auto;width:150px;transform:none;box-shadow:0 24px 50px rgba(15,23,42,.28)}
@media (max-width:900px){.modes .panels>div.on{grid-template-columns:1fr;gap:20px}.modes .peek{min-height:340px}}
.modes .mdev.raw{display:block;height:auto;width:148px;box-shadow:none;filter:drop-shadow(0 22px 34px rgba(15,23,42,.32))}
@media (max-width:900px){.modes .mdev.raw{width:140px}}

.step .ilu{display:block;width:88px;height:88px;object-fit:contain;margin:0 0 16px}
.modes .tag .ilu{display:block;width:56px;height:56px;object-fit:contain;margin:0 0 10px}
.modes .peek{min-height:540px}
@media (max-width:900px){.modes .peek{min-height:360px}}
