diff --git a/sites/shkor-com/v2/index.html b/sites/shkor-com/v2/index.html index fd87d01..a1fb6e4 100644 --- a/sites/shkor-com/v2/index.html +++ b/sites/shkor-com/v2/index.html @@ -236,34 +236,38 @@

05 — Plans

-

One studio. Choose how close we work.

-

For solo founders and small teams — launching a product or already running a business.

+

One studio. Choose how close we work.

+

For solo founders and small teams — launching a product or already running a business.

-
-
-

Autopilot

+ +
    +
  1. + 01 + +

    Autopilot

    Build it yourself

    -

    $99/month

    -
      -
    • Your own server with an agent, 24/7
    • -
    • A workspace with OpenCode and Claude Code
    • -
    • Your own git, subdomains and card payments
    • -
    +

    Your own server with an agent, a workspace with OpenCode and Claude Code, your own git, subdomains and card payments.

    +

    $99/month

    Start now -
-
-

Lab

+ +
  • + 02 + +

    Lab

    Build it with us

    -

    By applicationa partnership: you pay as you grow

    -
      -
    • Everything in Autopilot
    • -
    • Personal guidance in small cohorts
    • -
    • The studio's agents and network on your side
    • -
    +

    Everything in Autopilot, plus personal guidance in small cohorts and the studio's agents and network on your side.

    +

    By applicationpay as you grow

    Apply for a lab -
  • -
    -

    Next: the studio. Paid roles for builders with traction.

    + +
  • + 03 + +

    Studio

    +

    Paid to build

    +

    Builders with traction join the studio in paid roles — running the next cohorts while building their own products.

    +

    By invitationearned, not bought

    +
  • +
    diff --git a/sites/shkor-com/v2/styles.css b/sites/shkor-com/v2/styles.css index f509480..ce80fbb 100644 --- a/sites/shkor-com/v2/styles.css +++ b/sites/shkor-com/v2/styles.css @@ -47,7 +47,7 @@ h2 { font-size: clamp(34px, 5vw, 64px); max-width: 16ch; text-wrap: balance; } h3 { font-size: 22px; letter-spacing: -.02em; line-height: 1.15; margin-bottom: 10px; } .hl { color: var(--acid); } .lead { font-size: clamp(17px, 1.5vw, 20px); max-width: 58ch; margin-top: 24px; color: var(--fg-2); text-wrap: pretty; } -.kicker, .tag, .lab-tag, .path-k { font: 400 12px/1 var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--acid); } +.kicker, .tag, .lab-tag { font: 400 12px/1 var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--acid); } .kicker { margin-bottom: 20px; } .fine, .muted { font-size: 14px; color: var(--fg-3); } .fine { margin-top: 14px; } @@ -202,27 +202,26 @@ a.lab:hover .lab-tag { color: var(--acid); } .film { position: relative; border-radius: var(--r); overflow: hidden; aspect-ratio: 16 / 9; background: #000; box-shadow: 0 0 0 1px var(--line-2), 0 40px 120px rgba(198,255,77,.08); } .film video { width: 100%; height: 100%; display: block; } -/* paths */ -.paths { display: grid; gap: 16px; grid-template-columns: 1fr; } -@media (min-width: 900px) { .paths { grid-template-columns: 1fr 1fr; } } -.path { display: flex; flex-direction: column; align-items: flex-start; padding: 44px; border-radius: var(--r); background: linear-gradient(180deg, rgba(198,255,77,.07), transparent 60%), var(--bg-1); box-shadow: inset 0 0 0 1px rgba(198,255,77,.25); } -.path-alt { background: var(--bg-1); box-shadow: inset 0 0 0 1px var(--line); } -.path-k { margin-bottom: 20px; } -.path h3 { font-size: 34px; margin-bottom: 16px; } -.path > p { color: var(--fg-2); } -.path .price { font: 700 64px/1 var(--display); color: var(--fg); letter-spacing: -.04em; margin: 36px 0 8px; } -.path .price span { font: 400 18px var(--body); color: var(--fg-3); letter-spacing: 0; margin-left: 6px; } -.sec-sub { margin-top: 16px; color: var(--fg-2); font-size: 18px; max-width: 640px; } -.path .price { margin-top: 8px; } -.perks { list-style: none; margin: 28px 0 24px; padding: 0; display: grid; gap: 12px; } -.perks li { position: relative; padding-left: 28px; color: var(--fg-2); font-size: 16px; line-height: 1.5; } -.perks li::before { content: ""; position: absolute; left: 2px; top: 7px; width: 12px; height: 7px; border: solid var(--acid); border-width: 0 0 2px 2px; transform: rotate(-45deg); } -.path .muted { margin-bottom: 24px; } -.path .btn { margin-top: auto; } -.next-rung { margin-top: 24px; padding: 20px 24px; border-radius: 16px; color: var(--fg-2); box-shadow: inset 0 0 0 1px var(--line); background: var(--bg-1); } -.next-rung b { color: var(--fg); } -.path .muted { margin-bottom: 28px; } -.path-alt .btn { margin-top: auto; } +/* plans: лестница в стиле Method — 01 Autopilot → 02 Lab → 03 Studio */ +.plans .plan { display: flex; flex-direction: column; align-items: flex-start; padding: 40px 32px; } +.plans .plan .ico { margin-bottom: 28px; } +.plans .plan .plan-k { font: 400 12px/1 var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--acid); margin-bottom: 12px; } +.plans .plan h3 { font-size: 30px; margin-bottom: 12px; } +.plans .plan .plan-d { color: var(--fg-3); font-size: 16px; margin-bottom: 32px; } +.plans .plan .plan-price { justify-self: stretch; align-self: stretch; padding-top: 28px; border-top: 1px solid var(--line); margin-bottom: 20px; + font: 600 28px/1.1 var(--display); color: var(--fg); letter-spacing: -.02em; } +.plans .plan .plan-price span { display: block; margin-top: 6px; font: 400 14px/1.4 var(--body); color: var(--fg-3); letter-spacing: 0; } +.plan-main { background: radial-gradient(420px 260px at 0% 0%, rgba(198,255,77,.10), transparent 70%), var(--bg); } +.plan-main:hover { background: radial-gradient(420px 260px at 0% 0%, rgba(198,255,77,.14), transparent 70%), var(--bg-1); } +.plans .plan-main .plan-price { color: var(--acid); } +.plan-dim .ico { color: var(--fg-3); background: rgba(255,255,255,.05); } +.plans .plan-dim .plan-k { color: var(--fg-3); } +.plans .plan-dim h3, .plans .plan-dim .plan-price { color: var(--fg-2); } +@media (min-width: 900px) { + /* общие строки у трёх колонок (subgrid): подпись, заголовок, текст, условия, кнопка — на одной высоте */ + .plans { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(6, auto); } + .plans .plan { display: grid; grid-row: span 6; grid-template-rows: subgrid; row-gap: 0; justify-items: start; align-content: start; } +} /* cta */ .cta { position: relative; padding: 160px 0; text-align: center; overflow: hidden; border-top: 1px solid var(--line); @@ -265,15 +264,10 @@ a.lab:hover .lab-tag { color: var(--acid); } .log { right: 0; left: 0; bottom: auto; top: calc(100% + 20px); width: auto; } .orbit { margin-bottom: 200px; } .tag { letter-spacing: .08em; font-size: 11px; } - .path, .lab-xl { padding: 32px; } + .lab-xl { padding: 32px; } } @media (max-width: 520px) { .sub { border-radius: 20px; } .sub .btn { width: 100%; } .sub-msg { margin-top: 128px; } } - -@media (max-width: 600px) { .path .price-long span { display: block; margin: 12px 0 0; } } - -.path .price-note { font-size: 40px; line-height: 1.1; } -.path .price-note span { display: block; margin: 10px 0 0; font-size: 17px; }