/* ============================================================
   Sell on Threeniti — seller landing page
   Palette: navy #12225b · orange #e62e04 · light #ff8833
   ============================================================ */
.sot-hero{background:
    radial-gradient(900px 420px at 82% -10%,rgba(230,46,4,.35),transparent 60%),
    radial-gradient(700px 380px at -5% 110%,rgba(255,136,51,.16),transparent 55%),
    linear-gradient(135deg,#0b1638 0%,#12225b 55%,#1c3477 100%);
  color:#fff;padding:64px 0 56px;position:relative;overflow:hidden}
.sot-hero::before{content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:56px 56px;mask-image:radial-gradient(75% 70% at 55% 25%,#000,transparent);pointer-events:none}
.sot-hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;gap:44px;align-items:center}
.sot-hero-in{max-width:640px}
.sot-eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.18);padding:7px 16px;border-radius:40px;font-size:12.5px;font-weight:700;letter-spacing:.03em}
.sot-eyebrow i{color:#ff8833}
.sot-hero h1{font-size:clamp(1.95rem,3.6vw,3rem);font-weight:900;line-height:1.08;letter-spacing:-.02em;margin:18px 0 14px;color:#fff}
.sot-hero h1 .hl{background:linear-gradient(100deg,#ff8833,#ffb066);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.sot-sub{font-size:1.02rem;line-height:1.7;color:rgba(255,255,255,.78);max-width:640px}
.sot-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.sot-btn{display:inline-flex;align-items:center;gap:9px;font-weight:800;font-size:.94rem;border-radius:12px;
  padding:13px 26px;text-decoration:none;transition:.18s;border:1px solid transparent}
.sot-btn-primary{background:var(--primary);color:#fff;box-shadow:0 10px 26px -10px rgba(230,46,4,.65)}
.sot-btn-primary:hover{background:var(--primary-dark);transform:translateY(-1px);color:#fff}
.sot-btn-ghost{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.45);color:#fff}
.sot-btn-ghost:hover{background:rgba(255,255,255,.24);color:#fff}

/* hero side panel */
.sot-hero-panel{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:20px;
  padding:22px;backdrop-filter:blur(8px);box-shadow:0 24px 60px -30px rgba(0,0,0,.6)}
.sot-panel-top{display:flex;align-items:center;gap:12px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.14)}
.sot-panel-avatar{width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;font-size:1.1rem;flex:0 0 auto}
.sot-panel-top b{display:block;font-size:.98rem;font-weight:800;color:#fff}
.sot-panel-badge{display:inline-flex;align-items:center;gap:5px;font-size:.7rem;font-weight:700;color:#9ff0bd;margin-top:3px}
.sot-panel-rows{list-style:none;margin:0;padding:14px 0;display:grid;gap:14px}
.sot-panel-rows li{display:flex;align-items:center;gap:12px}
.sot-panel-rows .ic{width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.10);display:flex;
  align-items:center;justify-content:center;color:#ff8833;font-size:.9rem;flex:0 0 auto}
.sot-panel-rows b{display:block;font-size:.86rem;font-weight:700;color:#fff}
.sot-panel-rows small{font-size:.74rem;color:rgba(255,255,255,.62)}
.sot-panel-foot{display:flex;align-items:center;gap:8px;font-size:.78rem;font-weight:700;color:#ffd0b0;
  border-top:1px solid rgba(255,255,255,.14);padding-top:14px}
.sot-btn-lg{padding:15px 32px;font-size:1rem}
.sot-stats{display:flex;gap:0;flex-wrap:wrap;margin-top:38px;border-top:1px solid rgba(255,255,255,.14);padding-top:24px}
.sot-stats > div{flex:1;min-width:130px;padding-right:22px}
.sot-stats > div + div{border-left:1px solid rgba(255,255,255,.14);padding-left:22px}
.sot-stats b{display:block;font-size:1.5rem;font-weight:900;letter-spacing:-.02em}
.sot-stats span{font-size:.78rem;color:rgba(255,255,255,.62)}

.sot-sec{padding:58px 0}
.sot-sec-alt{background:#f7f9fc;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.sot-head{max-width:640px;margin-bottom:30px}
.sot-kicker{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--primary);margin-bottom:8px}
.sot-head h2{font-size:clamp(1.45rem,2.4vw,2rem);font-weight:900;color:#12225b;letter-spacing:-.02em;margin:0 0 8px}
.sot-head p{color:var(--text-muted);font-size:.95rem;margin:0}

.sot-grid{display:grid;gap:16px}
.sot-grid-3{grid-template-columns:repeat(3,1fr)}
.sot-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:22px 22px 24px;transition:.18s}
.sot-card:hover{transform:translateY(-3px);box-shadow:0 16px 34px -18px rgba(18,34,91,.28);border-color:#d8deee}
.sot-card h3{font-size:1rem;font-weight:800;color:#182036;margin:14px 0 7px}
.sot-card p{font-size:.87rem;line-height:1.65;color:var(--text-muted);margin:0}
.sot-ico{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,rgba(230,46,4,.10),rgba(255,136,51,.14));color:var(--primary);font-size:1.05rem}
.sot-card-accent{border-top:3px solid var(--primary)}

.sot-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.sot-step{background:#fff;border:1px solid var(--border);border-radius:16px;padding:22px;position:relative;
  scroll-margin-top:150px;transition:.18s}
.sot-step:hover{border-color:#cfd6ea;box-shadow:0 12px 28px -16px rgba(18,34,91,.25)}
.sot-step-num{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:11px;
  background:linear-gradient(135deg,#12225b,#2b4fd6);color:#fff;font-weight:900;font-size:.85rem;letter-spacing:.02em}
.sot-step h3{font-size:.97rem;font-weight:800;color:#182036;margin:14px 0 6px}
.sot-step p{font-size:.85rem;line-height:1.6;color:var(--text-muted);margin:0}

.sot-two{display:grid;grid-template-columns:1.25fr .9fr;gap:28px;align-items:start}
.sot-two h2{font-size:clamp(1.4rem,2.2vw,1.85rem);font-weight:900;color:#12225b;margin:0 0 16px;letter-spacing:-.02em}
.sot-list{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.sot-list li{display:flex;gap:11px;align-items:flex-start;font-size:.9rem;color:#33405a;line-height:1.5}
.sot-list li i{color:#1f9d55;font-size:.8rem;margin-top:4px;flex:0 0 auto}
.sot-help{background:linear-gradient(150deg,#12225b,#1c3477);color:#fff;border-radius:18px;padding:26px 26px 28px;
  box-shadow:0 20px 44px -22px rgba(18,34,91,.55)}
.sot-help h3{font-size:1.1rem;font-weight:800;margin:0 0 8px}
.sot-help p{font-size:.87rem;line-height:1.65;color:rgba(255,255,255,.75);margin:0 0 16px}
.sot-help ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.sot-help li{display:flex;gap:10px;align-items:center;font-size:.87rem;font-weight:600;color:rgba(255,255,255,.92)}
.sot-help li i{color:#ff8833;width:18px;text-align:center}

.sot-faq-wrap{max-width:860px}
.sot-faq{display:grid;gap:10px}
.sot-faq details{background:#fff;border:1px solid var(--border);border-radius:14px;overflow:hidden;transition:.18s}
.sot-faq details[open]{border-color:#cfd6ea;box-shadow:0 10px 26px -18px rgba(18,34,91,.3)}
.sot-faq summary{cursor:pointer;list-style:none;padding:17px 20px;font-size:.94rem;font-weight:700;color:#182036;
  display:flex;align-items:center;justify-content:space-between;gap:14px}
.sot-faq summary::-webkit-details-marker{display:none}
.sot-faq summary i{color:var(--primary);font-size:.75rem;transition:.2s;flex:0 0 auto}
.sot-faq details[open] summary i{transform:rotate(180deg)}
.sot-faq details p{margin:0;padding:0 20px 18px;font-size:.88rem;line-height:1.7;color:var(--text-muted)}

.sot-cta-band{background:linear-gradient(120deg,#0b1638,#1c3477);padding:44px 0}
.sot-cta-in{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.sot-cta-band h2{color:#fff;font-size:clamp(1.35rem,2.4vw,1.85rem);font-weight:900;margin:0 0 6px;letter-spacing:-.02em}
.sot-cta-band p{color:rgba(255,255,255,.72);margin:0;font-size:.92rem}

@media(max-width:991px){
  .sot-grid-3{grid-template-columns:repeat(2,1fr)}
  .sot-steps{grid-template-columns:repeat(2,1fr)}
  .sot-two{grid-template-columns:1fr}
  .sot-hero-grid{grid-template-columns:1fr;gap:30px}
  .sot-hero-in{max-width:none}
  .sot-hero-panel{display:none}
}
@media(max-width:575px){
  .sot-hero{padding:44px 0 40px}
  .sot-grid-3,.sot-steps{grid-template-columns:1fr}
  .sot-stats > div{min-width:50%;padding:10px 0}
  .sot-stats > div + div{border-left:none;padding-left:0}
  .sot-cta{flex-direction:column}
  .sot-btn{justify-content:center;width:100%}
}


/* hero photo */
.sot-hero-photo{margin:0;position:relative;border-radius:20px;overflow:hidden;
  box-shadow:0 26px 60px -30px rgba(0,0,0,.65);border:1px solid rgba(255,255,255,.16)}
.sot-hero-photo img{width:100%;height:340px;object-fit:cover;display:block}
.sot-hero-photo figcaption{position:absolute;left:14px;bottom:14px}
.sot-hero-photo figcaption span{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.94);
  color:#12225b;font-size:.78rem;font-weight:800;padding:7px 14px;border-radius:30px}
.sot-hero-photo figcaption i{color:#1f9d55}
@media(max-width:991px){.sot-hero-photo{display:none}}
