body.s3d-page {
  --s3d-panel: linear-gradient(180deg, rgba(24, 28, 37, .78), rgba(20, 23, 31, .78));
  --s3d-solid: #161920;
  --s3d-faint: rgba(255, 255, 255, .025);
  --s3d-faint-2: rgba(255, 255, 255, .05);
  --s3d-grid: rgba(255, 255, 255, .035);
  --s3d-float: rgba(20, 23, 31, .86);
  --s3d-pill: rgba(24, 28, 37, .82);
  --s3d-stage: linear-gradient(180deg, rgba(24, 28, 37, .9), rgba(14, 16, 22, .2));
  --s3d-green: #4ade80;
  --s3d-blue: #4aa8ff;
}
html:not([data-theme="dark"]) body.s3d-page {
  --s3d-panel: linear-gradient(180deg, #ffffff, #fbfaf9);
  --s3d-solid: #ffffff;
  --s3d-faint: rgba(0, 0, 0, .02);
  --s3d-faint-2: rgba(0, 0, 0, .04);
  --s3d-grid: rgba(0, 0, 0, .045);
  --s3d-float: rgba(255, 255, 255, .94);
  --s3d-pill: rgba(255, 255, 255, .9);
  --s3d-stage: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, .2));
  --s3d-green: #15803d;
  --s3d-blue: #1d6fd6;
}


html body.s3d-page.v2-page {
  max-width: none !important; margin: 0 !important;
  background:
    radial-gradient(1200px 640px at 50% -6%, rgba(255, 46, 108, .16), transparent 62%),
    radial-gradient(800px 600px at 100% 22%, rgba(255, 170, 61, .06), transparent 60%),
    radial-gradient(700px 600px at 0% 48%, rgba(30, 144, 255, .05), transparent 60%),
    var(--s3-bg) !important;
  color: var(--s3-text) !important;
}
html:not([data-theme="dark"]) body.s3d-page.v2-page {
  background: radial-gradient(1200px 640px at 50% -6%, rgba(255, 46, 108, .1), transparent 62%), var(--s3-bg) !important;
}

html body.s3d-page main.s3d-main,
html body.s3d-page .s3d-main :is(section, aside, article:not(.s3-card), nav, header, footer, figure) { background-color: transparent !important; }
html body.s3d-page main.s3d-main { color: var(--s3-text) !important; }

.s3d-main {
  display: block; position: relative; padding: var(--s3-top-h, 68px) 0 96px; overflow-x: clip;
  font-family: 'Poppins', system-ui, -apple-system, sans-serif; font-size: 15px; line-height: 1.55;
  color: var(--s3-text); text-align: left; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
.s3d-main *, .s3d-main *::before, .s3d-main *::after { box-sizing: border-box; }
:where(.s3d-main) :where(h1, h2, h3, h4, p, ul, ol, li, figure, details, summary) { margin: 0; padding: 0; font-family: inherit; }
:where(.s3d-main) :where(ul, ol) { list-style: none; }
:where(.s3d-main) a { color: inherit; text-decoration: none; }
:where(.s3d-main) a:hover { text-decoration: none; }
:where(.s3d-main) img { display: block; max-width: 100%; border: 0; }
.s3d-main li i { position: static; }
.s3d-main :focus-visible { outline: 2px solid var(--s3-pink); outline-offset: 2px; }
.s3d-main ::selection { background: rgba(255, 46, 108, .35); }

.s3d-wrap { max-width: var(--s3-wrap, 1320px); margin: 0 auto; padding: 0 var(--s3-gut, 32px); }
.s3d-grad { background: var(--s3-grad); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; padding-right: .04em; }


.s3d-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  height: 50px; padding: 0 24px; border-radius: 14px; border: 1px solid transparent;
  font-size: 15px; font-weight: 600; letter-spacing: -.005em; white-space: nowrap; line-height: 1;
  transition: transform .2s var(--s3-ease), box-shadow .2s, background .2s, border-color .2s, color .2s;
}
.s3d-btn i { font-size: 13px; }
.s3d-btn span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.s3d-btn--grad { color: #fff !important; background: var(--s3-grad-btn); box-shadow: 0 14px 34px -12px rgba(255, 46, 108, .8), inset 0 1px 0 rgba(255, 255, 255, .24); }
.s3d-btn--grad:hover { transform: translateY(-2px); box-shadow: 0 20px 40px -14px rgba(255, 46, 108, .95), inset 0 1px 0 rgba(255, 255, 255, .26); }
.s3d-btn--ghost { color: var(--s3-text) !important; background: var(--s3d-faint-2); border-color: var(--s3-line); }
.s3d-btn--ghost:hover { border-color: rgba(255, 46, 108, .5); background: rgba(255, 46, 108, .08); transform: translateY(-2px); }
.s3d-btn--white { color: #17181d !important; background: #fff; box-shadow: 0 16px 34px -14px rgba(0, 0, 0, .6); }
.s3d-btn--white:hover { transform: translateY(-2px); }

.s3d-ico { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; font-size: 17px; flex: 0 0 auto; }
.s3d-ico--pink { background: rgba(255, 46, 108, .14); color: var(--s3-pink); }
.s3d-ico--gold { background: rgba(252, 200, 78, .14); color: var(--s3-gold); }
.s3d-ico--blue { background: rgba(30, 144, 255, .14); color: var(--s3d-blue); }
.s3d-ico--green { background: rgba(34, 197, 94, .13); color: var(--s3d-green); }
.s3d-ico--purple { background: rgba(167, 139, 250, .15); color: var(--s3-purple); }
.s3d-ico--orange { background: rgba(255, 170, 61, .14); color: var(--s3-orange); }
html:not([data-theme="dark"]) .s3d-ico--gold { color: #b07d0c; }

.s3d-sec { padding-top: 72px; }
.s3d-sec__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 22px; }
.s3d-sec__title { display: flex; align-items: center; gap: 14px; min-width: 0; }
.s3d-sec__title h2 { font-size: 24px; line-height: 1.2; font-weight: 600; letter-spacing: -.022em; color: var(--s3-text); }
.s3d-sec__title p { font-size: 14px; color: var(--s3-muted); margin-top: 2px; line-height: 1.4; }
.s3d-more { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--s3-muted) !important; white-space: nowrap; transition: color .15s, gap .2s var(--s3-ease); }
.s3d-more:hover { color: var(--s3-text) !important; gap: 11px; }
.s3d-more i { font-size: 12px; }


.s3d-hero { position: relative; padding-top: 34px; }
.s3d-hero::before {
  content: ''; position: absolute; inset: -40px 0 0; pointer-events: none;
  background-image: linear-gradient(var(--s3d-grid) 1px, transparent 1px), linear-gradient(90deg, var(--s3d-grid) 1px, transparent 1px);
  background-size: 56px 56px; background-position: center -1px;
  -webkit-mask-image: radial-gradient(ellipse 55% 60% at 50% 30%, #000 20%, transparent 72%);
  mask-image: radial-gradient(ellipse 55% 60% at 50% 30%, #000 20%, transparent 72%);
}
.s3d-hero__copy { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; }
.s3d-crumbs { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 4px 8px; font-size: 12.5px; color: var(--s3-soft); }
.s3d-crumbs a { color: var(--s3-soft) !important; transition: color .15s; }
.s3d-crumbs a:hover { color: var(--s3-text) !important; }
.s3d-crumbs i { font-size: 8px; opacity: .7; }
.s3d-crumbs b { color: var(--s3-muted); font-weight: 500; }
.s3d-pills { display: flex; gap: 8px; margin-top: 26px; flex-wrap: wrap; justify-content: center; }
html body.s3d-page .s3d-main li.s3d-pill {
  display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 14px !important; border-radius: 999px;
  background: var(--s3d-pill); border: 1px solid var(--s3-line) !important; font-size: 13px; font-weight: 500; color: var(--s3-muted);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
}
.s3d-pill i { font-size: 11px; color: var(--s3-pink); }
.s3d-main h1.seo-h1 {
  margin: 22px 0 0; font-size: 76px; line-height: 1; font-weight: 700; letter-spacing: -.045em;
  color: var(--s3-text); max-width: 1180px; text-align: center; text-wrap: balance;
}
.s3d-lead { margin-top: 24px !important; font-size: 18px; line-height: 1.65; color: var(--s3-muted); max-width: 700px; text-wrap: pretty; }
.s3d-actions { display: flex; gap: 12px; margin-top: 34px; flex-wrap: wrap; justify-content: center; }
.s3d-trust { display: flex; gap: 10px 26px; margin-top: 24px; flex-wrap: wrap; justify-content: center; }
.s3d-trust li { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--s3-soft); font-weight: 500; }
.s3d-trust i { width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; font-size: 9px; background: rgba(34, 197, 94, .14); color: var(--s3d-green); flex: 0 0 auto; }


.s3d-stage {
  position: relative; margin-top: 56px; border-radius: 30px; padding: 54px 40px 0; height: 520px; overflow: hidden; isolation: isolate;
  background: var(--s3d-stage);
  border: 1px solid var(--s3-line);
  box-shadow: 0 60px 120px -60px rgba(255, 46, 108, .45), inset 0 1px 0 rgba(255, 255, 255, .05);
}
.s3d-stage::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 120px; background: linear-gradient(180deg, transparent, var(--s3-bg)); z-index: 3; pointer-events: none; }
.s3d-stage__glow { position: absolute; left: 50%; top: 40px; width: 760px; max-width: 100%; height: 420px; transform: translateX(-50%); background: radial-gradient(closest-side, rgba(255, 46, 108, .26), rgba(255, 170, 61, .08) 55%, transparent); filter: blur(10px); z-index: -1; pointer-events: none; }
.s3d-fan { position: relative; display: flex; justify-content: center; align-items: flex-start; height: 100%; }
.s3d-fan > * { width: 268px; flex: 0 0 auto; }
.s3d-fan > :nth-child(1) { transform: translate(34px, 46px) rotate(-7deg); z-index: 1; }
.s3d-fan > :nth-child(2) { transform: scale(1.06); z-index: 2; box-shadow: 0 50px 90px -40px rgba(0, 0, 0, .9); }
.s3d-fan > :nth-child(3) { transform: translate(-34px, 46px) rotate(7deg); z-index: 1; }
.s3d-fan > :nth-child(n+4) { display: none; }
.s3d-fan > .s3-card:hover { transform: none; }
.s3d-fan > :nth-child(1).s3-card:hover { transform: translate(34px, 38px) rotate(-7deg); }
.s3d-fan > :nth-child(2).s3-card:hover { transform: scale(1.06) translateY(-4px); }
.s3d-fan > :nth-child(3).s3-card:hover { transform: translate(-34px, 38px) rotate(7deg); }
.s3d-callout {
  position: absolute; z-index: 4; display: inline-flex; align-items: center; gap: 10px; height: 48px; padding: 0 18px 0 8px; border-radius: 14px;
  background: var(--s3d-float); border: 1px solid rgba(255, 255, 255, .1); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  box-shadow: 0 24px 50px -20px rgba(0, 0, 0, .8); font-size: 14px; color: var(--s3-text); white-space: nowrap; pointer-events: none;
  animation: s3d-float 6s ease-in-out infinite;
}
html:not([data-theme="dark"]) .s3d-callout { border-color: var(--s3-line); box-shadow: 0 24px 50px -24px rgba(20, 20, 30, .35); }
.s3d-callout b { font-weight: 600; }
.s3d-callout__ico { width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; font-size: 13px; }
.s3d-callout--1 { left: 13%; top: 92px; }
.s3d-callout--2 { left: 8%; top: 262px; animation-delay: -2s; }
.s3d-callout--3 { right: 11%; top: 120px; animation-delay: -4s; }
.s3d-callout--4 { right: 7%; top: 292px; animation-delay: -1s; }
@keyframes s3d-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@media (prefers-reduced-motion: reduce) { .s3d-callout { animation: none; } }


.s3d-stage--city { height: auto; padding: 30px 30px 34px; }
.s3d-stage--city::after { display: none; }
.s3d-stage__head { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; margin-bottom: 22px; flex-wrap: wrap; }
.s3d-stage__head h2 { font-size: 22px; font-weight: 600; letter-spacing: -.02em; line-height: 1.25; }
.s3d-stage__count { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 6px 14px; border-radius: 999px; background: var(--s3d-faint-2); border: 1px solid var(--s3-line); font-size: 13px; line-height: 1.3; color: var(--s3-muted); }
.s3d-stage__count b { color: var(--s3-text); }
.s3d-stage__count i { width: 8px; height: 8px; border-radius: 50%; background: var(--s3-green, #22c55e); box-shadow: 0 0 0 3px rgba(34, 197, 94, .2); flex: 0 0 auto; }
.s3d-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.s3d-row--n1, .s3d-row--n2, .s3d-row--n3 { grid-template-columns: repeat(4, minmax(0, 1fr)); justify-content: center; }
.s3d-row--n1 > :first-child { grid-column: 2 / span 2; max-width: 300px; justify-self: center; width: 100%; }
.s3d-row--n2 > :first-child { grid-column: 2; }
.s3d-row--n3 { grid-template-columns: repeat(3, minmax(0, 300px)); }


.s3d-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
html body.s3d-page .s3d-main li.s3d-benefit {
  position: relative; padding: 28px 28px 30px !important; border-radius: 20px; background: var(--s3d-panel); border: 1px solid var(--s3-line) !important; overflow: hidden;
  transition: border-color .25s, transform .25s var(--s3-ease), box-shadow .25s;
}
.s3d-benefit::before { content: ''; position: absolute; right: -60px; top: -60px; width: 180px; height: 180px; border-radius: 50%; background: radial-gradient(closest-side, rgba(255, 46, 108, .1), transparent); opacity: .6; pointer-events: none; }
html body.s3d-page .s3d-main li.s3d-benefit:hover { border-color: rgba(255, 46, 108, .4) !important; transform: translateY(-3px); box-shadow: 0 30px 60px -36px rgba(255, 46, 108, .5); }
.s3d-benefit h3 { margin-top: 20px !important; font-size: 18px; font-weight: 600; letter-spacing: -.015em; }
.s3d-benefit p { margin-top: 8px !important; font-size: 14px; line-height: 1.65; color: var(--s3-muted); }


.s3d-supply { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 40px; align-items: center; padding: 34px 40px; border-radius: 24px; background: var(--s3d-panel); border: 1px solid var(--s3-line); }
.s3d-supply__num { min-width: 120px; }
.s3d-supply__num b { display: block; font-size: 64px; line-height: 1; font-weight: 700; letter-spacing: -.04em; background: var(--s3-grad); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.s3d-supply__lbl { display: block; margin-top: 6px; font-size: 13px; color: var(--s3-soft); font-weight: 500; max-width: 180px; line-height: 1.4; }
.s3d-supply__flag { width: 64px; height: 64px; border-radius: 18px; display: grid; place-items: center; font-size: 24px; color: #fff; background: var(--s3-grad-btn); box-shadow: 0 14px 30px -12px rgba(255, 46, 108, .8); flex: 0 0 auto; }
.s3d-supply__num--first .s3d-supply__lbl { margin-top: 12px; }
.s3d-supply p { font-size: 16px; line-height: 1.7; color: var(--s3-muted); }


.s3d-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
html body.s3d-page .s3d-main li.s3d-step { position: relative; padding: 26px 24px 28px !important; border-radius: 20px; background: var(--s3d-panel); border: 1px solid var(--s3-line) !important; }
.s3d-step__n { position: relative; z-index: 1; width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-size: 18px; font-weight: 700; color: #fff; background: var(--s3-grad-btn); box-shadow: 0 12px 26px -10px rgba(255, 46, 108, .8); }
.s3d-step__bar { position: absolute; left: 70px; right: -18px; top: 48px; height: 2px; background: linear-gradient(90deg, rgba(255, 46, 108, .55), rgba(255, 46, 108, .05)); }
.s3d-step:last-child .s3d-step__bar { display: none; }
.s3d-step p { margin-top: 20px !important; font-size: 14.5px; line-height: 1.65; color: var(--s3-muted); }
.s3d-steps__end { margin-top: 18px; display: flex; align-items: center; justify-content: space-between; gap: 14px 20px; padding: 16px 16px 16px 26px; border-radius: 18px; background: var(--s3d-faint); border: 1px dashed var(--s3-line); }
.s3d-steps__end > span { display: inline-flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 500; color: var(--s3-muted); }
.s3d-steps__end > span i { color: var(--s3-pink); }
.s3d-steps__end .s3d-btn { height: 46px; }


.s3d-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.s3d-duo__box { padding: 28px 30px 30px; border-radius: 20px; background: var(--s3d-panel); border: 1px solid var(--s3-line); }
.s3d-duo__box p { margin-top: 16px !important; font-size: 15px; line-height: 1.75; color: var(--s3-muted); }
.s3d-duo__tag { display: inline-flex; align-items: center; gap: 8px; height: 30px; padding: 0 12px; border-radius: 9px; font-size: 12px; font-weight: 600; letter-spacing: .02em; background: var(--s3d-faint-2); color: var(--s3-muted); }
.s3d-duo__box--yes .s3d-duo__tag { background: rgba(34, 197, 94, .12); color: var(--s3d-green); }
.s3d-duo__box--no .s3d-duo__tag { background: rgba(255, 46, 108, .12); color: var(--s3-pink-2, var(--s3-pink)); }
.s3d-duo__box--yes { border-top: 2px solid rgba(34, 197, 94, .5); }
.s3d-duo__box--no { border-top: 2px solid rgba(255, 46, 108, .5); }


.s3d-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.s3d-tile {
  display: flex; align-items: center; gap: 14px; height: 74px; padding: 0 18px 0 14px; border-radius: 16px;
  background: var(--s3d-panel); border: 1px solid var(--s3-line); transition: border-color .2s, transform .2s var(--s3-ease), background .2s;
}
.s3d-tile:hover { border-color: rgba(255, 46, 108, .5); transform: translateY(-2px); background: linear-gradient(180deg, rgba(255, 46, 108, .08), rgba(255, 46, 108, .02)); }
.s3d-tile__pin { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--s3d-faint-2); color: var(--s3-soft); font-size: 14px; flex: 0 0 auto; transition: background .2s, color .2s; }
.s3d-tile:hover .s3d-tile__pin { background: var(--s3-grad-btn); color: #fff; }
.s3d-tile__txt { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.s3d-tile__txt b { font-size: 15px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.s3d-tile__txt small { font-size: 12.5px; color: var(--s3-soft); margin-top: 1px; }
.s3d-tile__txt small.is-low { color: var(--s3d-green); }
.s3d-tile__go { font-size: 12px; color: var(--s3-soft); flex: 0 0 auto; transition: transform .2s var(--s3-ease), color .2s; }
.s3d-tile:hover .s3d-tile__go { transform: translateX(3px); color: var(--s3-pink); }

.s3d-dir { padding: 26px 30px; border-radius: 22px; background: var(--s3d-panel); border: 1px solid var(--s3-line); }
.s3d-dir__list { columns: 5; column-gap: 30px; }
.s3d-dir__list li { break-inside: avoid; }
.s3d-dir__list a { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 7px 10px; margin: 0 -10px; border-radius: 9px; font-size: 14px; color: var(--s3-muted) !important; transition: background .15s, color .15s; }
.s3d-dir__list a span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.s3d-dir__list a em { font-style: normal; font-size: 12px; color: var(--s3-soft); font-variant-numeric: tabular-nums; flex: 0 0 auto; }
.s3d-dir__list a:hover { background: rgba(255, 46, 108, .08); color: var(--s3-text) !important; }
.s3d-dir__list a:hover em { color: var(--s3-pink); }

.s3d-dir { position: relative; }
.s3d-dir__tgl { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; margin: 0; }
.s3d-dir__more { display: none; }


.s3d-guides { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.s3d-guide { display: flex; flex-direction: column; height: 100%; border-radius: 20px; overflow: hidden; background: var(--s3d-panel); border: 1px solid var(--s3-line); transition: border-color .25s, transform .25s var(--s3-ease), box-shadow .25s; }
.s3d-guide:hover { border-color: rgba(255, 46, 108, .45); transform: translateY(-3px); box-shadow: 0 30px 60px -34px rgba(255, 46, 108, .5); }
.s3d-guide__img { position: relative; display: block; aspect-ratio: 16 / 8; overflow: hidden; background: radial-gradient(120% 90% at 50% 10%, rgba(var(--tc), .22), transparent 70%), var(--s3-s1); }
.s3d-guide__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--s3-ease); }
.s3d-guide:hover .s3d-guide__img img { transform: scale(1.05); }
.s3d-guide__fb { position: absolute; inset: 0; display: grid; place-items: center; font-size: 40px; color: rgb(var(--tc)); }
html:not([data-theme="dark"]) .s3d-guide__fb { color: rgb(var(--tcl)); }
.s3d-guide__tag { position: absolute; left: 14px; top: 14px; display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 8px; font-size: 11.5px; font-weight: 600; color: #fff; background: rgba(11, 13, 18, .6); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, .12); }
.s3d-guide__tag i { color: rgb(var(--tc)); font-size: 10px; }
.s3d-guide__body { display: flex; flex-direction: column; flex: 1 1 auto; padding: 20px 22px 20px; }
.s3d-guide__body h3 { font-size: 17px; font-weight: 600; line-height: 1.35; letter-spacing: -.012em; }
.s3d-guide__body p { margin-top: 8px !important; font-size: 13.5px; line-height: 1.6; color: var(--s3-muted); flex: 1 1 auto; }
.s3d-guide__read { margin-top: 16px; display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: var(--s3-pink); }
.s3d-guide__read i { font-size: 11px; transition: transform .2s var(--s3-ease); }
.s3d-guide:hover .s3d-guide__read i { transform: translateX(3px); }


.s3d-faq { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 48px; align-items: start; }
.s3d-faq__side { position: sticky; top: calc(var(--s3-chrome-h, 120px) + 24px); padding: 30px; border-radius: 22px; background: var(--s3d-panel); border: 1px solid var(--s3-line); }
.s3d-faq__side h2 { margin-top: 20px !important; font-size: 28px; font-weight: 700; letter-spacing: -.03em; line-height: 1.15; }
.s3d-faq__side p { margin-top: 8px !important; font-size: 14px; color: var(--s3-soft); }
.s3d-faq__side .s3d-btn { margin-top: 24px; width: 100%; height: auto; min-height: 50px; padding: 12px 20px; white-space: normal; text-align: center; line-height: 1.3; }
.s3d-faq__side .s3d-btn span { overflow: visible; }
.s3d-faq__list { display: flex; flex-direction: column; gap: 10px; }
.s3d-faq__list details { border-radius: 16px; background: var(--s3d-panel); border: 1px solid var(--s3-line); transition: border-color .2s, background .2s; }
.s3d-faq__list details[open] { border-color: rgba(255, 46, 108, .35); background: linear-gradient(180deg, rgba(255, 46, 108, .06), rgba(255, 46, 108, 0) 60%), var(--s3d-solid); }
.s3d-faq__list summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 22px; cursor: pointer; font-size: 16px; font-weight: 600; letter-spacing: -.01em; line-height: 1.4; }
.s3d-faq__list summary::-webkit-details-marker { display: none; }
.s3d-faq__list summary i { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; flex: 0 0 auto; font-size: 11px; background: var(--s3d-faint-2); color: var(--s3-muted); transition: transform .25s var(--s3-ease), background .2s, color .2s; }
.s3d-faq__list details[open] summary i { background: var(--s3-grad-btn); color: #fff; }
.s3d-faq__list details[open] summary i::before { content: '\f068'; }
.s3d-faq__list details > div { padding: 0 22px 22px; font-size: 14.5px; line-height: 1.75; color: var(--s3-muted); max-width: 760px; }


.s3d-band {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 44px 48px; border-radius: 28px; overflow: hidden; isolation: isolate;
  background: linear-gradient(120deg, #ff2e6c 0%, #ff4f7e 40%, #ff8f5a 100%); color: #fff;
  box-shadow: 0 50px 100px -50px rgba(255, 46, 108, .8);
}
.s3d-band::before { content: ''; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255, 255, 255, .08) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .08) 1px, transparent 1px); background-size: 44px 44px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 70%); mask-image: linear-gradient(90deg, transparent, #000 70%); }
.s3d-band h2 { font-size: 40px; font-weight: 700; letter-spacing: -.035em; line-height: 1.05; color: #fff !important; }
.s3d-band ul { display: flex; gap: 8px 22px; margin-top: 16px !important; flex-wrap: wrap; }
.s3d-band li { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; color: rgba(255, 255, 255, .92); }
.s3d-band li i { font-size: 12px; }
.s3d-band__act { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; flex: 0 0 auto; }
.s3d-band__login { font-size: 13px; color: rgba(255, 255, 255, .85) !important; }
.s3d-band__login b { color: #fff; text-decoration: underline; text-underline-offset: 3px; }


@media (max-width: 1240px) {
  .s3d-main h1.seo-h1 { font-size: 64px; }
  .s3d-callout--1 { left: 5%; } .s3d-callout--2 { left: 3%; }
  .s3d-callout--3 { right: 4%; } .s3d-callout--4 { right: 2%; }
  .s3d-dir__list { columns: 4; }
}
@media (max-width: 1100px) {
  .s3d-main h1.seo-h1 { font-size: 54px; }
  .s3d-benefits, .s3d-guides { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .s3d-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .s3d-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .s3d-step__bar { display: none; }
  .s3d-dir__list { columns: 3; }
  .s3d-callout { display: none; }
  .s3d-stage:not(.s3d-stage--city) { height: 480px; }
  .s3d-row, .s3d-row--n3 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
  .s3d-faq { grid-template-columns: 1fr; gap: 18px; }
  .s3d-faq__side { position: static; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 4px 18px; padding: 22px 24px; }
  .s3d-faq__side .s3d-ico { grid-row: span 2; }
  .s3d-faq__side h2 { margin-top: 0 !important; font-size: 24px; }
  .s3d-faq__side p { margin-top: 0 !important; grid-column: 2; }
  .s3d-faq__side .s3d-btn { grid-column: 3; grid-row: 1 / span 2; margin-top: 0; width: auto; }
  .s3d-supply { grid-template-columns: auto minmax(0, 1fr); gap: 24px 32px; padding: 30px 32px; }
  .s3d-supply .s3d-btn { grid-column: 1 / -1; justify-self: start; }
  .s3d-band h2 { font-size: 34px; }
}
@media (max-width: 900px) {
  .s3d-row, .s3d-row--n3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .s3d-row--n1 > :first-child, .s3d-row--n2 > :first-child { grid-column: auto; }
  .s3d-row--n1 { grid-template-columns: minmax(0, 300px); justify-content: center; }
  .s3d-row--n1 > :first-child { max-width: none; }
  .s3d-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .s3d-band { flex-direction: column; align-items: flex-start; padding: 36px 32px; }
  .s3d-band__act { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 12px 18px; }
}
@media (max-width: 767px) {
  .s3d-main { padding-bottom: 72px; }
  .s3d-btn { height: auto; min-height: 50px; padding: 12px 20px; white-space: normal; text-align: center; line-height: 1.3; }
  .s3d-btn span { overflow: visible; }
  .s3d-steps__end .s3d-btn { height: auto; min-height: 46px; }
  .s3d-hero { padding-top: 22px; }
  .s3d-main h1.seo-h1 { font-size: 42px; letter-spacing: -.04em; line-height: 1.04; }
  .s3d-lead { margin-top: 18px !important; font-size: 16px; line-height: 1.6; }
  .s3d-pills { margin-top: 18px; gap: 6px; }
  html body.s3d-page .s3d-main li.s3d-pill { height: 30px; padding: 0 11px !important; font-size: 12px; }
  .s3d-actions { margin-top: 26px; width: 100%; max-width: 440px; flex-direction: column; align-items: stretch; gap: 10px; }
  .s3d-actions .s3d-btn { width: 100%; }
  .s3d-trust { margin-top: 20px; gap: 8px 16px; }
  .s3d-trust li { font-size: 12.5px; }
  .s3d-sec { padding-top: 52px; }
  .s3d-sec__head { margin-bottom: 18px; align-items: center; flex-wrap: wrap; gap: 10px 16px; }
  .s3d-sec__title { flex: 1 1 250px; }
  .s3d-sec__head > .s3d-more { margin-left: 52px; }
  .s3d-sec__title { gap: 12px; }
  .s3d-sec__title h2 { font-size: 21px; }
  .s3d-sec__title p { font-size: 13px; }
  .s3d-ico { width: 40px; height: 40px; border-radius: 12px; font-size: 15px; }

  
  .s3d-stage:not(.s3d-stage--city) { margin-top: 40px; height: 420px; padding: 30px 0 0; border-radius: 24px; }
  .s3d-stage::after { height: 90px; }
  .s3d-fan > * { width: 214px; }
  .s3d-fan > :nth-child(1) { transform: translate(118px, 34px) rotate(-8deg) scale(.9); }
  .s3d-fan > :nth-child(2) { transform: none; }
  .s3d-fan > :nth-child(3) { transform: translate(-118px, 34px) rotate(8deg) scale(.9); }
  .s3d-fan > :nth-child(1).s3-card:hover { transform: translate(118px, 34px) rotate(-8deg) scale(.9); }
  .s3d-fan > :nth-child(2).s3-card:hover { transform: none; }
  .s3d-fan > :nth-child(3).s3-card:hover { transform: translate(-118px, 34px) rotate(8deg) scale(.9); }

  .s3d-stage--city { margin-top: 36px; padding: 18px 12px 14px; border-radius: 22px; }
  .s3d-stage__head { padding: 0 4px; }
  .s3d-stage__head { margin-bottom: 16px; }
  .s3d-stage__head h2 { font-size: 19px; }
  .s3d-row, .s3d-row--n3 { gap: 10px; }
  .s3d-row .s3-card__info h3 { font-size: 15px; }
  .s3d-row .s3-card__foot { padding: 10px 12px; min-height: 48px; }
  .s3d-row .s3-tag + .s3-tag { display: none; }

  
  .s3d-benefits { grid-template-columns: 1fr; gap: 10px; }
  html body.s3d-page .s3d-main li.s3d-benefit { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; padding: 18px 18px 20px !important; border-radius: 18px; }
  .s3d-benefit .s3d-ico { grid-row: span 2; }
  .s3d-benefit h3 { margin-top: 0 !important; font-size: 16px; align-self: center; }
  .s3d-benefit p { margin-top: 4px !important; font-size: 13.5px; line-height: 1.6; }

  
  .s3d-steps { grid-template-columns: 1fr; gap: 10px; }
  html body.s3d-page .s3d-main li.s3d-step { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 16px; align-items: center; padding: 16px 18px !important; border-radius: 18px; }
  .s3d-step__n { width: 40px; height: 40px; border-radius: 12px; font-size: 16px; }
  .s3d-step__bar { display: block; left: 37px; right: auto; top: calc(100% - 12px); width: 2px; height: 34px; background: linear-gradient(180deg, rgba(255, 46, 108, .55), rgba(255, 46, 108, .05)); z-index: 2; }
  .s3d-step p { margin-top: 0 !important; font-size: 14px; line-height: 1.6; }
  .s3d-steps__end { flex-direction: column; align-items: stretch; padding: 16px; text-align: center; }
  .s3d-steps__end > span { justify-content: center; font-size: 14px; }
  .s3d-steps__end .s3d-btn { width: 100%; }

  .s3d-supply { grid-template-columns: 1fr; gap: 16px; padding: 24px 20px; border-radius: 20px; }
  .s3d-supply__num { display: flex; align-items: center; gap: 14px; }
  .s3d-supply__num b { font-size: 52px; }
  .s3d-supply__lbl, .s3d-supply__num--first .s3d-supply__lbl { margin-top: 0; max-width: none; }
  .s3d-supply__flag { width: 52px; height: 52px; font-size: 20px; border-radius: 15px; }
  .s3d-supply p { font-size: 15px; line-height: 1.65; }
  .s3d-supply .s3d-btn { width: 100%; }

  .s3d-duo { grid-template-columns: 1fr; gap: 10px; }
  .s3d-duo__box { padding: 20px 20px 22px; border-radius: 18px; }
  .s3d-duo__box p { margin-top: 12px !important; font-size: 14.5px; line-height: 1.7; }

  .s3d-tiles { gap: 8px; }
  .s3d-tile { height: 62px; gap: 10px; padding: 0 12px 0 10px; border-radius: 14px; }
  .s3d-tile__pin { width: 34px; height: 34px; border-radius: 10px; font-size: 12px; }
  .s3d-tile__txt b { font-size: 14px; }
  .s3d-tile__txt small { font-size: 12px; }
  .s3d-tile__go { display: none; }

  .s3d-dir { padding: 16px 18px; border-radius: 18px; }
  .s3d-dir__list { columns: 2; column-gap: 18px; }
  .s3d-dir__list a { padding: 8px 8px; margin: 0 -8px; font-size: 13.5px; }
  .s3d-dir__tgl:not(:checked) ~ .s3d-dir__list li:nth-child(n+21) { display: none; }
  .s3d-dir__more { display: flex; align-items: center; justify-content: center; gap: 8px; height: 44px; margin-top: 10px; border-radius: 12px; background: var(--s3d-faint-2); border: 1px solid var(--s3-line); font-size: 13.5px; font-weight: 600; color: var(--s3-text); cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .s3d-dir__more i { font-size: 11px; color: var(--s3-pink); }
  .s3d-dir__tgl:checked ~ .s3d-dir__more { display: none; }
  .s3d-dir__tgl:focus-visible ~ .s3d-dir__more { outline: 2px solid var(--s3-pink); outline-offset: 2px; }

  
  .s3d-sec__head .s3d-more { font-size: 13px; }
  .s3d-guides { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 calc(-1 * var(--s3-gut, 16px)); padding: 0 var(--s3-gut, 16px) 6px; scroll-padding: 0 var(--s3-gut, 16px); scrollbar-width: none; overscroll-behavior-x: contain; }
  .s3d-guides::-webkit-scrollbar { display: none; }
  .s3d-guides > li { flex: 0 0 78%; max-width: 320px; scroll-snap-align: start; }
  .s3d-guide:hover { transform: none; }
  .s3d-guide__body { padding: 16px 18px 18px; }
  .s3d-guide__body h3 { font-size: 16px; }

  .s3d-faq__side { grid-template-columns: auto minmax(0, 1fr); padding: 20px; gap: 4px 14px; border-radius: 20px; }
  .s3d-faq__side h2 { font-size: 22px; }
  .s3d-faq__side .s3d-btn { grid-column: 1 / -1; grid-row: auto; width: 100%; margin-top: 14px; }
  .s3d-faq__list summary { padding: 16px 16px 16px 18px; font-size: 15px; gap: 12px; }
  .s3d-faq__list details > div { padding: 0 18px 18px; font-size: 14px; line-height: 1.7; }

  .s3d-band { padding: 30px 22px; border-radius: 22px; gap: 22px; }
  .s3d-band h2 { font-size: 30px; }
  .s3d-band li { font-size: 13px; }
  .s3d-band__act { width: 100%; flex-direction: column; align-items: stretch; text-align: center; }
  .s3d-band__act .s3d-btn { width: 100%; }
}
@media (max-width: 420px) {
  .s3d-main h1.seo-h1 { font-size: 36px; }
  .s3d-fan > * { width: 196px; }
  .s3d-fan > :nth-child(1), .s3d-fan > :nth-child(1).s3-card:hover { transform: translate(104px, 32px) rotate(-8deg) scale(.88); }
  .s3d-fan > :nth-child(3), .s3d-fan > :nth-child(3).s3-card:hover { transform: translate(-104px, 32px) rotate(8deg) scale(.88); }
  .s3d-stage:not(.s3d-stage--city) { height: 396px; }
  .s3d-tile__pin { display: none; }
  .s3d-tile { padding: 0 12px; }
}
@media (max-width: 370px) {
  .s3d-main h1.seo-h1 { font-size: 33px; }
  .s3d-trust li { font-size: 12px; }
  .s3d-dir__list a { font-size: 13px; }
  .s3d-band h2 { font-size: 27px; }
}