:root {
  --ink: #17211d;
  --muted: #68746e;
  --paper: #f6f4ed;
  --white: #fffdf8;
  --line: #dadcd4;
  --lime: #d9ff5a;
  --lime-deep: #b8ea2d;
  --forest: #173f32;
  --coral: #ff674d;
  --shadow: 0 24px 80px rgba(24, 40, 33, 0.12);
  --radius: 24px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "DM Sans", sans-serif; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
.shell { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.is-hidden { display: none !important; }

.nav { height: 86px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 11px; font-family: "Manrope", sans-serif; font-weight: 800; font-size: 20px; letter-spacing: -0.04em; }
.brand-mark { width: 38px; height: 38px; display: block; flex: none; transform: rotate(-5deg); }
.nav nav { display: flex; gap: 34px; font-size: 14px; font-weight: 600; }
.nav nav a { color: #4d5a54; transition: color .2s; }
.nav nav a:hover { color: var(--ink); }
.nav-cta, .primary-button { border: 1px solid var(--ink); background: var(--ink); color: white; border-radius: 999px; padding: 12px 18px; font-weight: 700; font-size: 14px; display: inline-flex; align-items: center; gap: 12px; cursor: pointer; }

.hero { min-height: calc(100vh - 86px); display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 70px; padding-block: 54px 100px; }
.eyebrow, .section-label { text-transform: uppercase; letter-spacing: .16em; font-size: 12px; font-weight: 800; color: #53615a; }
.eyebrow { display: flex; align-items: center; gap: 9px; }
.eyebrow span { width: 9px; height: 9px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 5px rgba(255,103,77,.12); }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: "Manrope", sans-serif; letter-spacing: -.055em; }
h1 { font-size: clamp(56px, 6.4vw, 86px); line-height: .99; margin: 26px 0; }
h1 em, .feature-band em { color: var(--forest); font-style: normal; position: relative; }
h1 em::after { content: ""; position: absolute; height: 13px; background: var(--lime); left: -2px; right: -4px; bottom: 4px; z-index: -1; transform: rotate(-1deg); }
.hero-copy > p { max-width: 600px; color: var(--muted); font-size: 18px; line-height: 1.65; margin-bottom: 32px; }
.extract-form { display: flex; align-items: stretch; background: var(--white); padding: 7px; border: 1px solid var(--line); border-radius: 17px; box-shadow: 0 12px 34px rgba(28,45,38,.08); max-width: 670px; }
.url-field { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; padding: 0 14px; }
.youtube-icon { width: 32px; height: 24px; display: grid; place-items: center; background: var(--coral); color: white; font-size: 10px; border-radius: 7px; flex: none; }
.url-field input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 15px; }
.extract-form button { border: 0; border-radius: 11px; padding: 16px 20px; background: var(--ink); color: white; font-weight: 700; cursor: pointer; white-space: nowrap; transition: transform .2s, background .2s; }
.extract-form button:hover { background: var(--forest); transform: translateY(-1px); }
.extract-form button:disabled { cursor: wait; opacity: .7; }
.form-message { min-height: 24px; padding: 8px 4px 0; color: #ba3b2c; font-size: 14px; }
.form-message:empty { min-height: 0; padding: 0; }
.error-card { display:flex; align-items:center; gap:9px; max-width:670px; margin-top:12px; padding:10px 12px; border:1px solid #f0b6ab; border-radius:11px; background:#fff2ef; color:#963526; line-height:1.35; }
.error-card > span { width:20px; height:20px; display:grid; place-items:center; border-radius:50%; background:#ffd7cf; font-weight:800; flex:none; }
.error-card p { margin:0; flex:1; }.error-card button{border:0;background:transparent;color:#78291e;font-weight:800;text-decoration:underline;cursor:pointer;padding:0;white-space:nowrap}
.extract-progress { max-width:670px; margin-top:13px; padding:16px 17px; border:1px solid var(--line); border-radius:16px; background:var(--white); box-shadow:0 12px 34px rgba(28,45,38,.06); text-align:left; }
.progress-head { display:grid; grid-template-columns:32px 1fr auto; gap:11px; align-items:center; }
.progress-head strong,.progress-head small{display:block}.progress-head strong{font:700 14px "Manrope",sans-serif}.progress-head small{margin-top:2px;color:var(--muted);font-size:11px}.progress-head>span{color:var(--forest);font-size:12px;font-weight:800;font-variant-numeric:tabular-nums}
.progress-spinner{width:28px;height:28px;border:3px solid #e6e9df;border-top-color:var(--forest);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.progress-track{height:5px;margin:14px 0;background:#e7e9e3;border-radius:99px;overflow:hidden}.progress-track span{display:block;width:15%;height:100%;background:linear-gradient(90deg,var(--forest),var(--lime-deep));border-radius:inherit;transition:width .5s ease}
.progress-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;list-style:none;margin:0;padding:0}.progress-steps li{color:#9aa19d;font-size:10px;line-height:1.3;display:flex;gap:5px;align-items:flex-start}.progress-steps li span{width:16px;height:16px;display:grid;place-items:center;flex:none;border-radius:50%;border:1px solid #cfd3cd;font-size:8px;font-weight:800}.progress-steps li.done,.progress-steps li.active{color:var(--ink)}.progress-steps li.done span{background:var(--forest);border-color:var(--forest);color:white}.progress-steps li.active span{background:var(--lime);border-color:var(--lime-deep);color:var(--ink)}
.trust-row { display: flex; flex-wrap: wrap; gap: 22px; color: #77817c; font-size: 12px; margin-top: 14px; }
.trust-row b { color: var(--forest); }

.hero-visual { min-height: 580px; position: relative; }
.glow { position: absolute; inset: 10% 0 0 7%; border-radius: 50%; background: radial-gradient(circle, rgba(217,255,90,.75), rgba(217,255,90,0) 68%); filter: blur(12px); }
.preview-card { position: absolute; background: #fff; border: 1px solid rgba(23,33,29,.1); box-shadow: var(--shadow); }
.video-card { width: 78%; right: 2%; top: 6%; border-radius: 22px; padding: 12px; transform: rotate(2.5deg); }
.preview-topline { display: flex; gap: 7px; align-items: center; color: #8b948f; font-size: 10px; padding: 2px 4px 11px; }
.preview-topline span:last-child { margin-left: 5px; }
.dot { width: 6px; height: 6px; border-radius: 50%; }.red{background:#ff7863}.amber{background:#ffc34d}.green{background:#89cf60}
.mock-video { height: 290px; position: relative; border-radius: 14px; overflow: hidden; background: radial-gradient(circle at 30% 20%, #a8bfa7, transparent 27%), linear-gradient(145deg,#21372f,#64806e 53%,#c2cbb5); }
.mock-video::before { content:""; position:absolute; width:55%; height:72%; right:-10%; bottom:-12%; border-radius: 48% 48% 0 0; background:#e4dfc8; transform:rotate(-14deg); }
.play { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; background: var(--coral); color: white; font-size: 17px; padding-left: 3px; box-shadow: 0 10px 26px rgba(255,103,77,.35); }
.mock-video .play { position: absolute; inset: 0; margin: auto; }
.mock-caption { position: absolute; left: 18px; bottom: 17px; background: rgba(13,23,19,.83); color: white; border-radius: 7px; padding: 8px 11px; font-size: 11px; }
.transcript-card { width: 74%; left: 0; bottom: 2%; border-radius: 20px; padding: 20px; transform: rotate(-2deg); }
.preview-heading { display:flex; justify-content:space-between; align-items:center; font-weight:800; margin-bottom:13px; }
.live-pill { background:#eefcc4; color:#527105; padding:5px 9px; border-radius:99px; font-size:9px; text-transform:uppercase; letter-spacing:.09em; }
.preview-line { display:grid; grid-template-columns:42px 1fr; gap:7px; padding:10px 8px; border-radius:10px; font-size:11px; color:#69736e; line-height:1.45; }
.preview-line time { color:#9aa29e; font-variant-numeric:tabular-nums; }.preview-line.active{background:#f2f6e5;color:var(--ink)}.preview-line.active time{color:#6f8e1e}
.format-float { position:absolute; right:-2%; bottom:12%; width:93px; height:88px; border-radius:20px; background:var(--ink); color:white; display:grid; place-items:center; align-content:center; gap:5px; box-shadow:var(--shadow); transform:rotate(6deg); }.format-float span{color:var(--lime);font-size:25px}.format-float b{font-size:12px;letter-spacing:.1em}
.creator-hero{display:flex;align-items:center;justify-content:flex-end}.creator-frame{position:absolute;inset:0 0 0 8%;margin:0;border:10px solid var(--white);border-radius:34px;overflow:hidden;background:#e8e2d6;box-shadow:var(--shadow);transform:rotate(1deg)}.creator-frame::after{content:"";position:absolute;inset:0;border:1px solid rgba(23,33,29,.12);border-radius:24px;pointer-events:none}.creator-frame img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}.source-float{position:absolute;top:10%;left:-2%;display:flex;align-items:center;gap:10px;padding:13px 15px;background:var(--ink);color:white;border-radius:16px;box-shadow:var(--shadow);transform:rotate(-2deg)}.source-icon{width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:var(--lime);color:var(--ink);font-weight:900}.source-float b,.source-float small{display:block}.source-float b{font:700 12px "Manrope",sans-serif}.source-float small{color:#b8c5bf;font-size:9px;margin-top:3px}.mini-transcript{width:72%;left:0;bottom:-3%;border-radius:20px;padding:17px;transform:rotate(-1.5deg)}

.confidence{padding:26px 0 110px}.confidence-heading{display:grid;grid-template-columns:.45fr 1.05fr .8fr;gap:42px;align-items:start;border-top:1px solid var(--line);padding-top:42px}.confidence-heading h2{font-size:clamp(34px,4vw,52px);line-height:1.08;margin:0}.confidence-heading>p:last-child{color:var(--muted);line-height:1.7;margin:4px 0 0}.confidence-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:42px}.confidence-grid article{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:24px;min-height:220px}.confidence-grid article>span{color:#82906e;font-size:11px;letter-spacing:.14em}.confidence-grid h3{font:700 18px "Manrope",sans-serif;margin:32px 0 10px}.confidence-grid p{color:var(--muted);font-size:13px;line-height:1.65;margin:0}

.workspace { padding: 46px 0 90px; min-height: calc(100vh - 86px); }
.workspace-head { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:26px; }.workspace-head h2{font-size:clamp(30px,4vw,46px);margin:7px 0 0;max-width:720px}.back-button{border:0;background:transparent;padding:0;margin-bottom:23px;color:var(--muted);cursor:pointer}.workspace-actions{display:flex;gap:10px;flex:none}.secondary-button{border:1px solid var(--line);background:var(--white);padding:12px 17px;border-radius:999px;font-weight:700;cursor:pointer}.workspace-grid{display:grid;grid-template-columns:320px 1fr;gap:18px}.panel{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 14px 45px rgba(32,48,41,.06)}.video-panel{padding:13px;height:max-content}.thumbnail-wrap{position:relative;aspect-ratio:16/9;border-radius:15px;overflow:hidden;background:#dfe3dc}.thumbnail-wrap img{width:100%;height:100%;object-fit:cover}.play.large{position:absolute;inset:0;margin:auto;width:48px;height:48px}.video-meta{padding:16px 8px 7px}.video-meta h3{font:700 18px/1.3 "Manrope",sans-serif;margin-bottom:7px}.video-meta p{color:var(--muted);font-size:13px}.meta-stats{display:flex;gap:7px;flex-wrap:wrap}.meta-stats span{font-size:11px;background:#eff1eb;padding:6px 8px;border-radius:999px}.stat-box{margin-top:12px;background:var(--ink);color:white;border-radius:15px;padding:16px;display:grid;gap:4px}.stat-box span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#b8c3bd}.stat-box b{font-size:20px}.stat-box small{color:#9fab9f}.transcript-panel{padding:13px;min-width:0}.transcript-tools{display:grid;grid-template-columns:1fr 190px;gap:10px;padding-bottom:12px;border-bottom:1px solid var(--line)}.search-field{display:flex;align-items:center;gap:9px;background:#f0f1ec;border-radius:11px;padding:0 12px}.search-field input{border:0;outline:0;background:transparent;width:100%;padding:12px 0}.transcript-tools select,.dialog-label select{border:1px solid var(--line);border-radius:11px;background:white;padding:11px}.transcript-scroll{height:520px;overflow:auto;padding:10px 4px 10px 0;scrollbar-color:#c8ccc5 transparent}.transcript-line{display:grid;grid-template-columns:66px 1fr;gap:10px;padding:13px 12px;border-radius:11px;line-height:1.55;font-size:14px}.transcript-line:hover{background:#f3f5ed}.transcript-line time{color:#7e9161;font-size:12px;font-variant-numeric:tabular-nums;padding-top:3px}.transcript-line mark{background:var(--lime);color:inherit;border-radius:2px}.transcript-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:13px 7px 2px;color:var(--muted);font-size:12px}.toggle{display:flex;align-items:center;gap:8px;cursor:pointer}.toggle input{position:absolute;opacity:0}.toggle span{width:34px;height:19px;border-radius:99px;background:#ccd1ca;position:relative}.toggle span::after{content:"";position:absolute;width:13px;height:13px;border-radius:50%;background:white;left:3px;top:3px;transition:.2s}.toggle input:checked+span{background:var(--forest)}.toggle input:checked+span::after{transform:translateX(15px)}

.steps,.faq{padding-block:120px}.section-label{margin-bottom:17px}.section-heading{display:grid;grid-template-columns:1.1fr .9fr;gap:100px;align-items:end;margin-bottom:55px}.section-heading h2,.feature-band h2{font-size:clamp(40px,5vw,64px);line-height:1.05;margin:0}.section-heading p{color:var(--muted);font-size:16px;line-height:1.7;margin:0}.step-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}.step-grid article{position:relative;padding:32px 32px 10px 0;border-right:1px solid var(--line);min-height:285px}.step-grid article+article{padding-left:32px}.step-grid article:last-child{border:0}.step-number{color:#a2aaa6;font-size:11px;letter-spacing:.15em}.step-icon{width:52px;height:52px;display:grid;place-items:center;background:var(--lime);border-radius:15px;font-size:22px;margin:34px 0 25px;transform:rotate(-4deg)}.step-grid h3{font:700 20px "Manrope",sans-serif}.step-grid p{color:var(--muted);line-height:1.65;font-size:14px;max-width:280px}
.feature-band{background:var(--forest);color:white;padding:110px 0}.feature-inner{display:grid;grid-template-columns:.85fr 1.15fr;gap:120px}.section-label.light{color:var(--lime)}.feature-band h2 em{color:var(--lime)}.feature-list article{display:grid;grid-template-columns:50px 1fr;gap:20px;padding:28px 0;border-top:1px solid rgba(255,255,255,.18)}.feature-list article:last-child{border-bottom:1px solid rgba(255,255,255,.18)}.feature-list article>span{color:var(--lime);font-size:11px;letter-spacing:.14em}.feature-list h3{font:700 20px "Manrope",sans-serif;margin-bottom:8px}.feature-list p{color:#b7c6bf;line-height:1.6;margin:0;font-size:14px}
.faq .section-heading{grid-template-columns:1fr;margin-bottom:28px}.faq-list{border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line)}summary{list-style:none;cursor:pointer;padding:25px 0;display:flex;justify-content:space-between;font:700 19px "Manrope",sans-serif}summary::-webkit-details-marker{display:none}summary span{font-size:25px;font-weight:400;transition:.2s}details[open] summary span{transform:rotate(45deg)}details p{color:var(--muted);line-height:1.7;max-width:760px;padding-bottom:23px}
.site-footer{border-top:0;padding:0;background:#10251e;color:white}.footer-lead{display:flex;justify-content:space-between;align-items:center;gap:40px;padding-block:64px 45px;border-bottom:1px solid rgba(255,255,255,.14)}.footer-lead p{max-width:620px;color:#aebdb6;line-height:1.65;margin:15px 0 0;font-size:14px}.footer-lead .primary-button{background:var(--lime);border-color:var(--lime);color:var(--ink);white-space:nowrap}.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:42px;padding-block:46px}.footer-grid h3{font:700 12px "Manrope",sans-serif;text-transform:uppercase;letter-spacing:.13em;color:var(--lime);margin:0 0 18px}.footer-grid a{display:block;text-decoration:none;color:#c0ccc6;font-size:13px;line-height:1.45;margin:0 0 12px;transition:color .2s}.footer-grid a:hover{color:white}.footer-bottom{border-top:1px solid rgba(255,255,255,.14);display:flex;justify-content:space-between;gap:24px;padding-block:22px;color:#81948b;font-size:11px}

dialog{border:0;padding:0;background:transparent}dialog::backdrop{background:rgba(15,25,21,.6);backdrop-filter:blur(4px)}.dialog-card{width:min(480px,calc(100vw - 30px));background:var(--white);border-radius:24px;padding:25px;box-shadow:var(--shadow)}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start}.dialog-head h2{font-size:30px;margin:0 0 24px}.icon-button{border:0;background:#eef0eb;width:34px;height:34px;border-radius:50%;font-size:23px;cursor:pointer}.dialog-label{display:grid;gap:9px;font-weight:700;font-size:13px}.dialog-check{display:flex;gap:9px;margin:18px 0 23px;color:var(--muted);font-size:13px}.full{width:100%;justify-content:center;border-radius:12px;padding:15px}

@media (max-width: 900px) {
  .nav nav{display:none}.hero{grid-template-columns:1fr;gap:20px;padding-top:60px}.hero-copy{text-align:center}.eyebrow{justify-content:center}.hero-copy>p,.extract-form{margin-left:auto;margin-right:auto}.trust-row{justify-content:center}.hero-visual{min-height:520px;max-width:620px;width:100%;margin:auto}.confidence-heading{grid-template-columns:1fr;gap:15px}.confidence-grid{grid-template-columns:1fr 1fr}.workspace-grid{grid-template-columns:1fr}.video-panel{display:grid;grid-template-columns:270px 1fr;gap:10px}.stat-box{grid-column:1/-1}.section-heading,.feature-inner{grid-template-columns:1fr;gap:30px}.feature-inner{gap:60px}.footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width: 640px) {
  .shell{width:min(100% - 28px,1180px)}.nav{height:72px}.nav-cta{padding:10px 13px}.hero{min-height:auto;padding:55px 0 70px}.hero-copy>p{font-size:16px}.extract-form{display:grid}.url-field{height:56px}.extract-form button{width:100%}.trust-row{gap:8px 16px}.hero-visual{min-height:420px}.creator-frame{inset:0 0 0 3%;border-width:7px;border-radius:25px}.source-float{left:-1%;top:5%}.mini-transcript{width:86%;bottom:-4%}.confidence{padding-bottom:80px}.confidence-grid{grid-template-columns:1fr}.confidence-grid article{min-height:auto}.video-card{width:88%;right:0}.mock-video{height:220px}.transcript-card{width:86%}.format-float{width:72px;height:70px;right:0}.workspace{padding-top:35px}.workspace-head{align-items:flex-start;flex-direction:column}.workspace-actions{width:100%}.workspace-actions button{flex:1}.video-panel{display:block}.transcript-tools{grid-template-columns:1fr}.transcript-scroll{height:480px}.transcript-line{grid-template-columns:54px 1fr;padding:12px 6px}.steps,.faq{padding-block:80px}.step-grid{grid-template-columns:1fr}.step-grid article,.step-grid article+article{border-right:0;border-bottom:1px solid var(--line);padding:28px 0;min-height:auto}.step-icon{margin:24px 0 20px}.feature-band{padding:75px 0}.footer-lead{align-items:flex-start;flex-direction:column}.footer-grid{grid-template-columns:1fr}.footer-bottom{align-items:flex-start;flex-direction:column}.progress-steps{grid-template-columns:1fr 1fr}.error-card{text-align:left}
}

.analytics-consent{position:fixed;z-index:1000;right:18px;bottom:18px;width:min(520px,calc(100vw - 36px));display:flex;align-items:center;justify-content:space-between;gap:22px;padding:18px 20px;background:#17211d;color:#fff;border:1px solid rgba(255,255,255,.14);border-radius:18px;box-shadow:0 20px 60px rgba(10,20,16,.28)}.analytics-consent strong{font:800 15px "Manrope",sans-serif}.analytics-consent p{margin:5px 0 0;color:#c2cec8;font-size:12px;line-height:1.5}.analytics-consent a{color:#d9ff57}.analytics-consent-actions{display:flex;gap:8px;flex:none}.analytics-consent button{border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:10px 13px;background:transparent;color:#fff;font-weight:800;cursor:pointer}.analytics-consent button.accept{border-color:#d9ff57;background:#d9ff57;color:#17211d}@media(max-width:600px){.analytics-consent{align-items:stretch;flex-direction:column}.analytics-consent-actions button{flex:1}}