/* Feature showcase: real product screenshots in a neutral phone frame.
   Shared by the homepage section, /features/* pages and the trade pages. */
/* Takeoff capabilities and reserved desktop captures share the site's tokens. */
.tm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;width:100%}
.tm-card{min-width:0;padding:22px;border:1px solid var(--line);border-radius:12px;background:var(--card);overflow-wrap:anywhere}
.tm-card h3{margin:0 0 10px;font-size:19px;line-height:1.35;color:var(--ink)}
.tm-card h3 a{color:inherit;text-decoration:none}.tm-card h3 a:hover{text-decoration:underline}
.tm-card p,.tm-note{margin:0;color:var(--muted);line-height:1.65}
.tm-workflow{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:18px 22px;border:1px solid var(--line);border-radius:12px;background:var(--teal-light);font-weight:700;color:var(--ink)}
.tm-note{font-size:14px}.tm-shot{min-width:0;margin:28px 0 0;overflow-wrap:anywhere}
.tm-shot picture,.tm-shot img{display:block;width:100%;max-width:100%;height:auto;border-radius:12px}
.tm-shot img{aspect-ratio:8/5;background:var(--card);border:1px solid var(--line);object-fit:contain;box-sizing:border-box}
.tm-shot figcaption{margin-top:10px;color:var(--muted);font-size:13px;line-height:1.6}
.ts-heading .tm-paragraph+.tm-paragraph{margin-top:16px}
.tm-captures{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;width:100%}
.tm-captures>a{display:block;min-width:0;color:inherit;text-decoration:none}
.tm-captures>a:hover figcaption{text-decoration:underline}
.tm-captures .tm-shot{margin:0}
@media(max-width:640px){.tm-captures{grid-template-columns:minmax(0,1fr)}}
@media(max-width:640px){.tm-grid{grid-template-columns:minmax(0,1fr)}.tm-card{padding:18px}.tm-workflow{padding:16px;font-size:15px}}
.sc-phone{position:relative;display:block;margin:0;width:100%;max-width:300px;padding:9px;border-radius:42px;
  background:linear-gradient(160deg,#2b3134,#0d1112 42%,#181d1f);box-shadow:0 0 0 1px rgba(255,255,255,.07) inset,
  0 28px 60px -18px rgba(2,12,10,.55),0 10px 24px -12px rgba(2,12,10,.45)}
.sc-phone::before,.sc-phone::after{content:"";position:absolute;right:-3px;width:3px;border-radius:0 3px 3px 0;background:#1f2427}
.sc-phone::before{top:120px;height:56px}
.sc-phone::after{top:190px;height:38px}
.sc-phone picture,.sc-phone img{display:block;width:100%;height:auto;border-radius:33px}
.sc-phone img{background:#e9efed}
.sc-phone .sc-shot-dark{display:none}
html[data-theme="dark"] .sc-phone .sc-shot-dark{display:block}
html[data-theme="dark"] .sc-phone .sc-shot-light{display:none}

.sc-label{position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);white-space:nowrap;border-radius:999px;
  padding:6px 12px;background:var(--card);color:var(--ink);border:1px solid var(--line);font-size:12px;font-weight:800;
  letter-spacing:.02em;box-shadow:0 8px 20px -10px rgba(2,12,10,.4)}

/* Two overlapping phones; the second sits lower and smaller. Collapses to a row of two at phone width. */
.sc-pair{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start;
  max-width:560px;margin:0 auto;padding-bottom:22px}
.sc-pair .sc-phone{max-width:none}
.sc-pair .sc-phone + .sc-phone{margin-top:56px}

.sc-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;align-items:start;margin-top:28px}
.sc-gallery figure{margin:0;min-width:0}
.sc-gallery .sc-phone{margin:0 auto}
.sc-gallery figcaption{margin:24px auto 0;max-width:300px;font-size:14px;line-height:1.55;color:var(--muted)}
.sc-gallery figcaption strong{display:block;color:var(--ink);font-size:15px;margin-bottom:3px}

/* Feature page hero */
.sc-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px;align-items:center;padding:20px 0 44px}
.sc-hero .mp-actions{margin-bottom:12px}
.sc-hero .sc-pair{isolation:isolate}
.sc-hero .sc-pair::before{content:"";position:absolute;z-index:-1;inset:4% -6% 2%;border-radius:48px;
  background:radial-gradient(58% 52% at 50% 46%,color-mix(in srgb,var(--teal) 24%,transparent),transparent 72%)}
.sc-plan{display:inline-flex;align-items:center;gap:8px;border:1px solid color-mix(in srgb,var(--teal) 35%,var(--line));
  border-radius:999px;padding:7px 12px;font-size:13px;font-weight:700;color:var(--ink);background:var(--card)}
.sc-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.sc-point{border:1px solid var(--line);border-top:3px solid var(--teal);border-radius:12px;padding:20px;background:var(--card);min-width:0}
.sc-point h3{font-size:17px;margin:0 0 8px}
.sc-point p{margin:0;font-size:15px}
.sc-steps{counter-reset:sc;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding:0;margin:0;list-style:none}
.sc-steps li{counter-increment:sc;position:relative;border:1px solid var(--line);border-radius:12px;padding:20px 18px;background:var(--card);min-width:0}
.sc-steps li::before{content:counter(sc);display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:50%;background:var(--teal);color:#fff;font-weight:800;font-size:14px;margin-bottom:12px}
.sc-steps h3{font-size:17px;margin:0 0 6px}
.sc-steps p{margin:0;font-size:14.5px;line-height:1.6}
.sc-privacy{display:grid;gap:10px;padding:0;margin:0;list-style:none}
.sc-privacy li{display:flex;gap:10px;align-items:flex-start;color:var(--muted);line-height:1.6}
.sc-privacy li::before{content:"";flex:0 0 8px;height:8px;margin-top:9px;border-radius:50%;background:var(--teal)}
.sc-next{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:center}

/* Homepage band */
.sc-home .sc-duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;margin-top:34px}
.sc-feature{display:flex;flex-direction:column;min-width:0;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(255,255,255,.04);padding:28px 24px 26px}
.sc-feature .sc-pair{max-width:430px}
.sc-kicker{display:inline-block;color:#8be1cc;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.sc-feature h3{color:var(--lp-on-dark,#f4f5f6);font-size:24px;line-height:1.2;margin:10px 0 8px}
.sc-feature p{color:var(--lp-on-dark-muted,#c9d0d6);font-size:15px;line-height:1.6;margin:0 0 10px}
.sc-feature ul{margin:0 0 14px;padding:0;list-style:none;display:grid;gap:7px}
.sc-feature li{display:flex;gap:8px;color:var(--lp-on-dark-muted,#c9d0d6);font-size:14px;line-height:1.5}
.sc-feature li::before{content:"";flex:0 0 7px;height:7px;margin-top:8px;border-radius:50%;background:#2EA98C}
.sc-feature a{color:#8be1cc;font-weight:800}
.sc-feature .sc-copy{margin-top:auto;padding-top:30px}
.sc-home .sc-label{background:#101a19;color:#f4f5f6;border-color:rgba(255,255,255,.16)}
.sc-note{font-size:13px;color:var(--lp-on-dark-muted,#c9d0d6);text-align:center;margin:20px auto 0;max-width:720px}

/* Trade pages */
.sc-trade{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:28px;align-items:center}
.sc-trade .sc-phone{max-width:220px;margin:0 auto}

@media(max-width:980px){
  .sc-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sc-home .sc-duo{grid-template-columns:1fr}
}
@media(max-width:860px){
  .sc-hero,.sc-next{grid-template-columns:1fr}
  .sc-hero{gap:28px}
  .sc-points{grid-template-columns:1fr}
  .sc-gallery{grid-template-columns:1fr;gap:34px}
}
@media(max-width:640px){
  .sc-steps{grid-template-columns:1fr}
  .sc-trade{grid-template-columns:1fr}
  .sc-trade .sc-phone{max-width:200px}
  .sc-phone{padding:7px;border-radius:32px}
  .sc-phone picture,.sc-phone img{border-radius:26px}
  .sc-pair{gap:12px}
  .sc-pair .sc-phone + .sc-phone{margin-top:36px}
  .sc-feature{padding:22px 16px}
  .sc-feature h3{font-size:21px}
  .sc-label{font-size:11px;padding:5px 9px}
}
@media(max-width:360px){
  .sc-phone{padding:5px;border-radius:24px}
  .sc-phone picture,.sc-phone img{border-radius:20px}
  .sc-phone::before,.sc-phone::after{display:none}
}
