/* These additions inherit WaveBot's plum surfaces and format typography.
   Use cases read as a compact format index; the launch form is one quiet
   destination between pricing and FAQs. Both reflow in DOM reading order. */
.format-band{margin-bottom:64px}
.jobs-section{--ink:#292331;--muted:#665b70;--accent:#b82671;--violet:#7650c4;--line:#c9bfd2;background:#ece7f3;color:var(--ink);padding-block:72px 80px}
.jobs-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:80px}
.jobs-intro{padding-top:24px}
.jobs-section .section-kicker{margin-bottom:20px}
.jobs-section h2{font-size:clamp(32px,3.6vw,46px);line-height:1.13}
.jobs-note{color:var(--muted);font-size:13px;line-height:1.8;margin-top:28px}
.jobs-list{min-width:0;border-top:1px solid var(--line)}
.job-card{display:grid;grid-template-columns:96px minmax(0,1fr);gap:24px;padding:28px 0;border-bottom:1px solid var(--line)}
.job-format{color:var(--violet);font-size:28px;font-weight:600;letter-spacing:-.03em;line-height:1.2;padding-top:1px}
.job-format>span{display:block;font-size:18px;letter-spacing:0;margin-top:4px}
.job-card:first-child .job-format{color:var(--accent)}
.job-card h3{font-size:21px;line-height:1.3;letter-spacing:-.02em}
.job-card p{font-size:14px;line-height:1.75;color:var(--muted);margin-top:8px;max-width:42ch}
.job-link{display:flex;align-items:center;gap:12px;margin-top:16px;color:var(--ink);font-size:12px;font-weight:600}
.job-link svg{width:18px;height:18px;color:var(--accent);transition:transform .2s var(--ease)}
.job-card:hover h3,.job-card:focus-visible h3{color:var(--accent)}
.job-card:hover .job-link svg{transform:translateX(4px)}

.notify-section{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;padding:44px 48px;margin-bottom:88px;background:var(--tint);border-radius:16px}
.notify-section .section-kicker{margin-bottom:12px}
.notify-section h2{font-size:clamp(28px,3vw,36px);line-height:1.15}
.notify-intro>p:last-child{color:var(--muted);font-size:14px;line-height:1.75;margin-top:12px;max-width:34ch}
.notify-signup{min-width:0}
.notify-signup label{display:block;font-size:13px;font-weight:500;margin-bottom:8px}
.notify-controls{display:flex;gap:8px}
.notify-controls input{width:100%;min-width:0;border:1px solid var(--line);border-radius:9px;background:var(--page);color:var(--ink);padding:12px 14px;min-height:52px;font-size:16px}
.notify-controls input::placeholder{color:var(--muted)}
.notify-controls input:hover{border-color:var(--muted)}
.notify-controls button{flex-shrink:0;padding-inline:20px}
.notify-controls button:hover{transform:none}
.notify-privacy,.notify-status{font-size:12px;line-height:1.7;color:var(--muted);margin-top:12px}
.notify-privacy a{display:inline-block;min-height:24px;text-decoration:underline;text-underline-offset:3px}
.notify-privacy a:hover{color:var(--ink)}
.notify-status:empty{display:none}
.notify-status:not(:empty){padding:12px 0 0}
.notify-status[data-state="error"]{color:var(--ink)}
.notify-status[data-state="success"]{color:var(--success)}
.notify-trap{display:none}

@media(max-width:1100px){
  .jobs-layout{gap:48px}
  .notify-section{gap:32px;padding:36px 32px}
  .notify-controls{flex-direction:column}
}
@media(max-width:700px){
  .format-band{margin-bottom:48px}
  .jobs-section{padding-block:48px 56px}
  .jobs-layout{grid-template-columns:1fr;gap:32px}
  .jobs-intro{padding-top:0}
  .jobs-section .section-kicker{margin-bottom:16px}
  .jobs-section h2{font-size:36px}
  .jobs-note{margin-top:20px}
  .jobs-note br{display:none}
  .job-card{grid-template-columns:72px minmax(0,1fr);gap:20px;padding-block:24px}
  .job-format{font-size:23px}
  .job-format>span{font-size:16px}
  .job-card h3{font-size:20px}
  .job-card p{font-size:14px}
  .job-link{margin-top:14px;gap:8px}
  .notify-section{grid-template-columns:1fr;gap:28px;padding:28px 24px;margin-bottom:56px;border-radius:12px}
  .notify-section h2{font-size:29px}
  .notify-controls{gap:12px}
  .notify-controls button{width:100%}
  .notify-privacy{margin-top:16px}
}
@media(max-width:360px){
  .job-card{grid-template-columns:1fr;gap:12px}
  .job-format>span{display:inline;font-size:inherit;margin-left:8px}
  .notify-section{padding-inline:20px}
  /* Keep the adjacent price from widening the whole page on small phones. */
  .pricing-section>*{min-width:0}
  .price-line{flex-wrap:wrap;gap:12px}
}
@media(prefers-reduced-motion:reduce){.job-card:hover .job-link svg{transform:none}}

/* Approved homepage composition. */
/* Tasks lead; codec names remain in the links and explorer. */
.jobs-section{--ink:#f3eaf6;--muted:#b7a8c1;--accent:#e16eae;--violet:#c0a0f3;--line:#4e4057;background:transparent;color:var(--ink);padding-block:80px 96px}
.jobs-layout{display:block}
.jobs-intro{display:block;padding:0}
.jobs-intro .section-kicker{grid-column:1/-1}
.jobs-note{margin:24px 0 0;text-align:center;padding:0}
.jobs-note br{display:none}
.jobs-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;border:0;margin-top:40px}
.job-card{display:flex;flex-direction:column;border:0;padding:32px;min-width:0;background:#241f2b;border-radius:12px;transition:background .18s var(--ease)}
.job-card:hover,.job-card:focus-visible{background:#302737}
.job-format{display:none}
.job-copy{display:flex;flex-direction:column;flex:1}
.job-card p{flex:1}
.job-link{margin-top:32px}
/* Keep the original small guide, with a single clean bitrate-control surface. */
.formats-section{padding-block:96px}
.format-detail{border:0;padding-top:0;margin-top:28px}
.bitrate-picker{display:block;background:transparent;padding:0;border-radius:0}
.bitrate-segments{display:flex;gap:4px;padding:4px;background:var(--lift);border-radius:7px}
.bitrate-picker label{min-width:0}
.bitrate-picker label span{min-height:44px;display:grid;place-items:center}
/* Privacy stands on its own; pricing returns to its established two columns. */
.local-section{border:0;border-bottom:1px solid #39303f;padding-block:104px 96px;margin-bottom:0}
/* The divider separates product details from the offer with space on both sides. */
.pricing-section{padding-block:96px 60px;margin-top:0}
.price-panel ul{border:0;padding-bottom:0}
/* Pricing and launch access share one surface and a close vertical interval. */
.notify-section{background:var(--surface);border-radius:12px;padding:37px 35px;margin-bottom:88px}
.notify-controls input{background:var(--page);border-color:#756480}
.notify-controls input::placeholder{color:var(--muted)}
.notify-controls .button-primary{background:var(--accent);color:#27162b}
.notify-controls .button-primary:hover{background:#ef8dc3}
.notify-status[data-state="success"]{color:var(--success)}
/* Two independent accordion columns avoid blank space beside expanded answers. */
.faq-section{display:block}
.faq-section>h2{text-align:center;margin-bottom:48px}
.faq-columns{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.site-footer{border:0}
@media(max-width:1000px){.job-card{padding:24px}.faq-columns{gap:32px}}
@media(max-width:700px){
 .jobs-section{padding-block:40px 64px}
 .jobs-intro{display:block}
 .jobs-note{margin-top:24px;padding:0}
 .jobs-list{grid-template-columns:1fr;gap:12px;margin-top:28px}
 .job-card{display:block;padding:24px}
 .job-link{margin-top:14px}
 .formats-section{padding-block:64px}
 .local-section{padding-block:64px;margin-bottom:0}
 .pricing-section{padding-block:48px;margin-top:0}
 .notify-section{margin-bottom:56px}
 .faq-section>h2{margin-bottom:32px}
 .faq-columns{grid-template-columns:1fr;gap:0}
 .faq-list+.faq-list{border-top:0}
}

@media(max-width:900px){.notify-section{padding:30px 25px}}

/* Mobile reading widths: fill phone containers, cap long lines on wider screens. */
@media(max-width:700px){
 .scene-copy{max-width:none;width:100%}
 .scene-copy>p:last-child,
 .format-story>p:not(.section-kicker),
 .notify-intro>p:last-child{max-width:65ch}
 .scene-copy h2 br,.format-story h2 br{display:none}
}

/* Distinguish the mobile offer from the preceding feature section. */
@media(max-width:700px){.pricing-intro{text-align:center}}