/* SelSup fulfillment: common visual system. All rules are scoped to this page. */
html:has(> body.selsup-ff-landing) {min-width:0}
body.selsup-ff-landing {
  min-width:0;
  --ff-brand-blue: #075fda;
  --ff-brand-blue-hover: #084eb5;
  --ff-brand-ink: #101f3d;
  --ff-brand-muted: #53647d;
  --ff-brand-line: #dbe5f1;
  --ff-brand-surface: #f3f7fd;
  --ff-brand-green: #087957;
  --ff-card-shadow: 0 8px 24px rgb(16 31 61 / 5%);
  --ff-float-shadow: 0 16px 40px rgb(16 31 61 / 10%);
}
.ff-v2 {
  --ff-blue: var(--ff-brand-blue);
  --ff-ink: var(--ff-brand-ink);
  --ff-muted: var(--ff-brand-muted);
  --ff-line: var(--ff-brand-line);
  font-weight: 500;
}
.selsup-ff-landing .viewport-wrapper {min-width:0}

/* Typography roles: display, section, supporting heading, body, interface. */
.ff-v2 h1 {font-size:clamp(54px,4.6vw,66px);font-weight:1000;letter-spacing:-.04em;line-height:1.02}
.ff-v2 h2 {font-weight:900;letter-spacing:-.035em;line-height:1.06}
.ff-v2 h3 {font-weight:800;letter-spacing:-.02em;line-height:1.18}
.ff-v2 .ff-story h2,.ff-v2 .ff-billing h2,.ff-v2 .ff-stock h2,.ff-v2 .ff-client h2 {font-size:44px}
.ff-v2 .ff-process h2 {font-size:48px}
.ff-v2 .ff-final h2 {font-size:40px}
.ff-v2 .ff-bottom-grid h3 {font-size:24px}
.ff-v2 .ff-brand>h3 {font-size:28px}
.ff-v2 .ff-section-lead,.ff-v2 .ff-lead,.ff-v2 .ff-client-copy>p:not(.ff-eyebrow),
.ff-v2 .ff-brand>p,.ff-v2 .ff-bottom-grid p,.ff-v2 .ff-final p {font-weight:500;line-height:1.5}
.ff-v2 .ff-eyebrow {font-weight:800;letter-spacing:.09em;color:var(--ff-blue);margin-bottom:16px}
.ff-v2 .ff-hero-modules {font-weight:700;color:var(--ff-ink)}
.ff-v2 .ff-ui-heading strong,.ff-v2 .ff-charge strong,.ff-v2 .ff-bill-heading strong,
.ff-v2 .ff-story-steps b,.ff-v2 .ff-launch li>b {font-weight:800}
.ff-v2 .ff-bill-total>b,.ff-v2 .ff-client-summary>b {font-weight:900;letter-spacing:-.03em}
.ff-v2 table,.ff-v2 .ff-cell-kpis,.ff-v2 .ff-bill-total,.ff-v2 .ff-client-summary {font-variant-numeric:tabular-nums}
.ff-v2 .ff-text-link,.ff-v2 .ff-page-nav {font-weight:700}
.ff-v2 .ff-page-nav a:hover {color:var(--ff-blue)}

/* Primary/secondary/link actions share one palette and geometry. */
.ff-v2 .ff-btn {
  background:linear-gradient(115deg,#075fda,#086ce8);
  border-color:var(--ff-blue);border-radius:12px;font-weight:800;
  box-shadow:0 6px 16px rgb(7 95 218 / 14%);
  transition:background .18s ease,box-shadow .18s ease,transform .18s ease;
}
.ff-v2 .ff-btn:hover {background:var(--ff-brand-blue-hover);box-shadow:0 8px 20px rgb(7 95 218 / 18%);transform:translateY(-1px)}
.ff-v2 .ff-btn--outline {background:#fff;color:var(--ff-ink);border-color:var(--ff-line);box-shadow:none}
.ff-v2 .ff-btn--outline:hover {background:var(--ff-brand-surface);color:var(--ff-blue);border-color:#aac6ec;box-shadow:none}
.ff-v2 .ff-process .ff-btn--outline {background:rgb(255 255 255 / 6%);border-color:rgb(255 255 255 / 48%);color:#fff;box-shadow:none}
.ff-v2 .ff-process .ff-btn--outline:hover {background:rgb(255 255 255 / 14%);color:#fff;border-color:#fff}
.ff-v2 .ff-final .ff-btn {background:#fff;color:var(--ff-blue);border-color:#fff;box-shadow:0 6px 16px rgb(16 31 61 / 10%)}
.ff-v2 .ff-final .ff-btn:hover {background:#edf4ff;color:var(--ff-brand-blue-hover)}
.ff-v2 .ff-small-button {background:var(--ff-blue);border-radius:8px;font-weight:700;min-height:44px;padding:10px 14px}
.ff-v2 .ff-small-button:hover {background:var(--ff-brand-blue-hover)}
.ff-v2 a:focus-visible,.ff-v2 button:focus-visible {outline-color:var(--ff-blue)}
.ff-v2 .ff-process :focus-visible,.ff-v2 .ff-final :focus-visible {outline-color:#fff}

/* Readable interface colours, including active states and numeric status. */
.ff-v2 .ff-demo,.ff-v2 .ff-charge div>span,.ff-v2 .ff-charge>small,
.ff-v2 .ff-mini-flow,.ff-v2 .ff-request-details small,
.ff-v2 .ff-story-steps small,.ff-v2 .ff-story-detail>span:last-child,
.ff-v2 .ff-page-nav,.ff-v2 .ff-tabs>button,.ff-v2 .ff-window th,
.ff-v2 .ff-cell-product small,.ff-v2 .ff-cell-kpis small,.ff-v2 .ff-order-card li small,
.ff-v2 .ff-client-summary>small,.ff-v2 .ff-client-summary>span,.ff-v2 .ff-document-row small,
.ff-v2 .ff-brand-products>div>span,.ff-v2 .ff-brand-domain,.ff-v2 .ff-color-label,
.ff-v2 .ff-launch li>span {color:var(--ff-muted)}
.ff-v2 .ff-bill-heading>span,.ff-v2 .ff-checklist>li:before,
.ff-v2 .ff-tariff-picker>button>span,.ff-v2 .ff-cell-card .ff-icon {color:var(--ff-blue)}
.ff-v2 .ff-tabs>button[aria-selected=true] {color:var(--ff-blue);background:#e7f0fd}
.ff-v2 .ff-tariff-picker>button[aria-pressed=true] {color:var(--ff-blue);border-color:var(--ff-blue);background:#f3f7fd}
.ff-v2 .ff-world-label[aria-pressed=true] {color:#fff;background:var(--ff-blue);border-color:var(--ff-blue)}
.ff-v2 .ff-app-nav {color:var(--ff-muted)}
.ff-v2 .ff-app-nav .is-active {color:var(--ff-blue);background:#e7f0fd}
.ff-v2 .ff-mini-flow>span:nth-child(-n+2):before {background:var(--ff-blue)}
.ff-v2 .ff-status {color:var(--ff-brand-green);background:#e6f6ed;font-weight:700;border-radius:8px}
.ff-v2 .ff-status:before {background:var(--ff-brand-green)}
.ff-v2 .ff-charge-check,.ff-v2 .ff-order-card li b {color:var(--ff-brand-green);background:#e6f6ed}
.ff-v2 .ff-cell-kpis>div:first-child b,.ff-v2 .ff-cell-confirm,.ff-v2 .ff-team-table td:last-child {color:var(--ff-brand-green)}
.ff-v2 .ff-order-card .ff-order-current b {color:#fff;background:var(--ff-blue)}
.ff-v2 .ff-swatches>button[aria-pressed=true] {box-shadow:0 0 0 2px var(--ff-blue)}
.ff-v2 .ff-integration--1,.ff-v2 .ff-integration--6 {color:var(--ff-blue)}
.ff-v2 .ff-story-detail .ff-status {color:var(--ff-brand-green)}

/* Two elevations: normal panels and floating panels over photographs. */
.ff-v2 .ff-window,.ff-v2 .ff-brand-preview,.ff-v2 .ff-tariff-picker {
  background:#fff;border-color:var(--ff-line);border-radius:16px;box-shadow:var(--ff-card-shadow);
}
.ff-v2 .ff-charge,.ff-v2 .ff-cell-card,.ff-v2 .ff-order-card {border-radius:16px;box-shadow:var(--ff-float-shadow);background:#fff;border-color:var(--ff-line)}
.ff-v2 .ff-hero-window {border-color:#17283f;border-radius:18px;box-shadow:12px 16px 32px rgb(16 31 61 / 8%)}
.ff-v2 .ff-tabs>button,.ff-v2 .ff-tariff-picker>button,.ff-v2 .ff-order-card li {border-radius:8px}
.ff-v2 .ff-window th {background:var(--ff-brand-surface);font-weight:600}
.ff-v2 .ff-icon {background:#eaf1fb;color:var(--ff-blue);border-radius:12px}
.ff-v2 .ff-icon svg {stroke-width:1.75}
.ff-v2 .ff-window-bar {border-color:var(--ff-line);font-weight:700}
.ff-v2 .ff-client-summary {background:var(--ff-brand-surface);border-radius:12px}
.ff-v2 .ff-order-card li {background:#f6f8fc}
.ff-v2 .ff-order-card .ff-order-current {background:#e7f0fd}
.ff-v2 .ff-tariff-picker>button {border-color:var(--ff-line)}
.ff-v2 .ff-stock-founder {filter:drop-shadow(0 12px 18px rgb(16 31 61 / 8%))}
.ff-v2 .ff-warehouse-art {filter:saturate(.94)}

/* Common vertical spacing and repeated content density. */
.ff-v2 .ff-lead {margin:24px 0}
.ff-v2 .ff-actions {gap:12px}
.ff-v2 .ff-hero-modules {margin-top:24px}
.ff-v2 .ff-section-lead {margin-top:20px}
.ff-v2 .ff-story {padding:40px 0;background:#f3f7fd}
.ff-v2 .ff-story-grid {gap:32px}
.ff-v2 .ff-story-detail {padding:16px;border-color:var(--ff-line);border-radius:12px}
.ff-v2 .ff-page-nav {padding:24px 0 8px}
.ff-v2 .ff-billing {padding-top:64px;padding-bottom:64px;gap:32px}
.ff-v2 .ff-services {gap:20px 24px;margin-top:28px}
.ff-v2 .ff-stock {background:#f3f7fd}
.ff-v2 .ff-stock-copy,.ff-v2 .ff-process-copy {padding:48px 0}
.ff-v2 .ff-process {background:linear-gradient(110deg,#102e64,#0955b6)}
.ff-v2 .ff-process .ff-eyebrow {color:#a8d8ff}
.ff-v2 .ff-process .ff-section-lead {color:#edf5ff}
.ff-v2 .ff-process-steps>span {color:#fff}
.ff-v2 .ff-process-steps b {background:#164b8e;border-color:#a8ccee}
.ff-v2 .ff-cabinet-section {padding-top:64px;padding-bottom:64px;gap:32px;align-items:start}
.ff-v2 .ff-client {align-items:start}
.ff-v2 .ff-client-copy>.ff-btn {margin-top:24px}
.ff-v2 .ff-bottom-grid {padding-top:40px;padding-bottom:64px;gap:32px}
.ff-v2 .ff-bottom-grid>div+div {padding-left:24px}
.ff-v2 .ff-final {margin-top:0;margin-bottom:64px;border-radius:24px;background:linear-gradient(115deg,#075fda,#086ce8)}
.ff-v2 .ff-note {color:var(--ff-blue);line-height:1.35;max-width:220px}
.ff-v2 .ff-brand-note {max-width:220px}
.ff-v2 .ff-process .ff-note,.ff-v2 .ff-final .ff-note {color:#fff}
.ff-v2 .ff-reveal {transition:transform .4s ease}
.ff-v2 .ff-reveal-pending {opacity:1;transform:translateY(12px)}
@keyframes ff-stage {from{background:#164b8e}to{background:#075fda}}

/* Shared chrome uses page-scoped tokens; no shared theme file is changed. */
.selsup-ff-landing .selsup-site-header-wrap {
  --sh-accent:var(--ff-brand-blue);--sh-cta-bg:var(--ff-brand-blue);
  --sh-cta-shadow:0 5px 14px rgb(7 95 218 / 12%);--sh-focus:var(--ff-brand-blue);
  --sh-text:var(--ff-brand-ink);--sh-text-strong:var(--ff-brand-ink);
  --sh-action-text:var(--ff-brand-ink);--sh-menu-text:var(--ff-brand-muted);
  --sh-wrap-shadow:0 1px 0 var(--ff-brand-line);
  --sh-wrap-sticky-shadow:0 4px 16px rgb(16 31 61 / 6%);
  font-family:FF-Nunito,Arial,sans-serif;
}
.selsup-ff-landing .selsup-site-header {width:min(1260px,calc(100% - 80px));padding-left:0;padding-right:0}
.selsup-ff-landing .selsup-site-header__nav>a,.selsup-ff-landing .selsup-site-header__platform-button {font-weight:700}
.selsup-ff-landing .selsup-site-header__try,.selsup-ff-landing .selsup-site-header__login {border-radius:12px;font-weight:800;font-size:15px}
.selsup-ff-landing .selsup-site-header__login {border-color:var(--ff-brand-line);background:#fff}
.selsup-ff-landing .selsup-site-header__try:hover {background:var(--ff-brand-blue-hover)}
.selsup-ff-landing .selsup-site-header__phone {font-weight:700}
.selsup-ff-landing .footer {font-family:FF-Nunito,Arial,sans-serif;color:var(--ff-brand-muted);background:#f8fafd;border-top:1px solid var(--ff-brand-line);padding-top:48px;margin-top:0;min-width:0}
.selsup-ff-landing .footer>.wrapper {width:min(1260px,calc(100% - 80px));max-width:none;margin-inline:auto;padding-inline:0}
.selsup-ff-landing .footer .footer__menu h3,.selsup-ff-landing .footer .footer__menu h4,
.selsup-ff-landing .footer .footer_opp__item>strong,.selsup-ff-landing .footer .footer__menu b {color:var(--ff-brand-ink);font-weight:800}
.selsup-ff-landing .footer .opp_block__title {font-weight:800;color:var(--ff-brand-ink);line-height:1.25}
.selsup-ff-landing .footer .footer__menu a {color:var(--ff-brand-muted);font-size:16px;line-height:1.4}
.selsup-ff-landing .footer .footer__menu a:hover,.selsup-ff-landing .footer .footer__help a {color:var(--ff-brand-blue)}
.selsup-ff-landing .footer .footer__help>div {font-size:14px!important;line-height:1.5}
.selsup-ff-landing .footer .footer__help>div>a {font-size:16px}
.selsup-ff-landing .footer .footer__bt>a {border-color:var(--ff-brand-blue);color:var(--ff-brand-blue);border-radius:12px;font-weight:700}
.selsup-ff-landing .footer .footer__bot {font-size:14px;line-height:1.5;color:var(--ff-brand-muted);margin-top:40px;border-color:var(--ff-brand-line)}
.selsup-ff-landing .footer .footer__bot a {color:var(--ff-brand-blue)}
.selsup-ff-landing .footer .footer__bot:before {left:0;right:0;background:var(--ff-brand-line)}

@media(min-width:1101px){.ff-v2 .ff-charge{width:280px}}
@media(min-width:1101px) and (max-width:1240px){
 .ff-v2 .ff-billing-workspace{grid-template-columns:minmax(0,1fr)}
 .ff-v2 .ff-tariff-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
 .ff-v2 .ff-tariff-picker>h3,.ff-v2 .ff-tariff-picker>p{grid-column:1 / -1}
 .ff-v2 .ff-tariff-picker>button{margin:0}
 .ff-v2 .ff-client-note{margin-right:12px}
}
@media(min-width:1101px) and (max-height:850px){.ff-v2 h1{font-size:clamp(50px,4.6vw,62px)}}
@media(min-width:1101px) and (max-height:740px){.ff-v2 h1{font-size:clamp(48px,4.4vw,57px)}.ff-v2 .ff-charge{top:270px}}
@media(max-width:1100px){
 .ff-v2 h1{font-size:44px}
 .ff-v2 .ff-story h2,.ff-v2 .ff-billing h2,.ff-v2 .ff-stock h2,.ff-v2 .ff-client h2{font-size:40px}
 .ff-v2 .ff-process h2{font-size:44px}
 .ff-v2 .ff-brand>h3{font-size:28px}
 .ff-v2 .ff-final h2{font-size:35px}
 .ff-v2 .ff-bottom-grid>div+div{padding-left:24px}
 .ff-v2 .ff-bottom-grid>.ff-launch{padding-left:0}
 .selsup-ff-landing .selsup-site-header,.selsup-ff-landing .footer>.wrapper{width:calc(100% - 52px)}
}
@media(max-width:680px){
 .ff-v2 .ff-wrap{width:calc(100% - 40px)}
 .ff-v2 h1{font-size:clamp(38px,10.6vw,54px);letter-spacing:-.04em;line-height:1.02}
 .ff-v2 .ff-story h2,.ff-v2 .ff-billing h2,.ff-v2 .ff-stock h2,.ff-v2 .ff-client h2{font-size:34px}
 .ff-v2 .ff-process h2{font-size:38px}
 .ff-v2 .ff-final h2{font-size:32px}
 .ff-v2 .ff-bottom-grid h3{font-size:24px}
 .ff-v2 .ff-actions{gap:10px}
 .ff-v2 .ff-hero-copy{padding-top:32px}
 .ff-v2 .ff-lead{margin:20px 0 24px}
 .ff-v2 .ff-hero-modules{margin-top:20px}
 .ff-v2 .ff-world{height:570px;margin:24px -20px 0;width:calc(100% + 40px)}
 .ff-v2 .ff-hero-window{left:20px;width:calc(100% - 40px)}
 .ff-v2 .ff-world-founder{top:290px}
 .ff-v2 .ff-world-founder img{width:210px}
 .ff-v2 .ff-charge{top:300px}
 .ff-v2 .ff-warehouse-art,.ff-v2 .ff-world-route{height:40%}
 .ff-v2 .ff-world-label--receive{top:78%}
 .ff-v2 .ff-world-label--store{top:75%}
 .ff-v2 .ff-world-label--pack{top:90%}
 .ff-v2 .ff-world-label--ship{top:89%}
 .ff-v2 .ff-hero-note{margin:8px 0 24px 10px}
 .ff-v2 .ff-story{padding:32px 0}
 .ff-v2 .ff-story-grid{gap:24px}
 .ff-v2 .ff-story-steps{gap:12px}
 .ff-v2 .ff-story-detail{margin-top:16px;padding:12px;gap:6px 12px}
 .ff-v2 .ff-story-detail>span:last-child{font-size:16px}
 .ff-v2 .ff-billing{padding-top:40px;padding-bottom:48px;gap:24px}
 .ff-v2 .ff-services{gap:16px 12px}
 .ff-v2 .ff-billing-workspace{gap:16px}
 .ff-v2 .ff-charges-table tbody{gap:8px}
 .ff-v2 .ff-charges-table tr{padding:12px;gap:6px 12px;border-radius:12px}
 .ff-v2 .ff-charges-table td:last-child{grid-column:1 / -1;grid-row:3;display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid var(--ff-line);padding-top:8px!important;text-align:right}
 .ff-v2 .ff-charges-table td:first-child{grid-column:1 / -1;font-weight:800}
 .ff-v2 .ff-charges-table td:nth-child(2){grid-column:1;grid-row:2}
 .ff-v2 .ff-charges-table td:nth-child(3){grid-column:2;grid-row:2;text-align:right}
 .ff-v2 .ff-charges-table td:last-child:before{margin:0}
 .ff-v2 .ff-stock-copy,.ff-v2 .ff-process-copy{padding:40px 0 0}
 .ff-v2 .ff-stock-scene,.ff-v2 .ff-packing-scene{margin-left:-20px;margin-right:-20px}
 .ff-v2 .ff-stock-founder{height:320px}
 .ff-v2 .ff-cell-card,.ff-v2 .ff-order-card{width:calc(100% - 40px);padding:16px}
 .ff-v2 .ff-stock-note{margin-top:20px}
 .ff-v2 .ff-process-steps{margin-top:24px;gap:12px}
 .ff-v2 .ff-process-note{margin-top:20px;margin-bottom:16px}
 .ff-v2 .ff-packing-scene{margin-top:16px}
 .ff-v2 .ff-order-card li{padding:10px 8px}
 .ff-v2 .ff-cabinet-section{padding-top:48px;padding-bottom:48px;gap:32px}
 .ff-v2 .ff-client{gap:24px}
 .ff-v2 .ff-client-summary{padding:12px;margin-top:12px}
 .ff-v2 .ff-client-copy>.ff-btn{margin-top:16px}
 .ff-v2 .ff-client-note{margin-bottom:0;max-width:180px}
 .ff-v2 .ff-bottom-grid{padding-top:32px;padding-bottom:48px;gap:24px}
 .ff-v2 .ff-bottom-grid>div+div{padding:24px 0 0}
 .ff-v2 .ff-team-table tbody{gap:8px}
 .ff-v2 .ff-team-table tr{padding:12px;gap:6px 12px;background:var(--ff-brand-surface)}
 .ff-v2 .ff-launch ol{gap:16px 12px}
 .ff-v2 .ff-final{padding:24px 20px 0;margin-bottom:48px}
 .selsup-ff-landing .selsup-site-header,.selsup-ff-landing .footer>.wrapper{width:calc(100% - 40px)}
 .selsup-ff-landing .footer{padding-top:32px}
 .selsup-ff-landing .footer .footer__bot{margin-top:24px}
}
@media(max-width:370px){
 .ff-v2 h1{font-size:34px}
 .ff-v2 .ff-story h2,.ff-v2 .ff-billing h2,.ff-v2 .ff-stock h2,.ff-v2 .ff-client h2{font-size:31px}
 .ff-v2 .ff-process h2{font-size:35px}
 .ff-v2 .ff-world{height:645px}
 .ff-v2 .ff-world-founder{top:355px}
 .ff-v2 .ff-charge{top:380px;width:190px}
 .ff-v2 .ff-world-label--store{top:82%}
 .ff-v2 .ff-world-label--receive{top:83%}
 .ff-v2 .ff-charges-table tr{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}
 .ff-v2 .ff-final h2{font-size:30px}
 .ff-v2 .ff-final-founder,.ff-v2 .ff-final-founder>img{width:155px}
}
@media(prefers-reduced-motion:reduce){.ff-v2 .ff-reveal-pending{transform:none}.ff-v2 .ff-btn:hover{transform:none}}
