/* First-screen composition: title + tool on the left, original reference on the right. */
.site-header{height:60px}.generator-hero{grid-template-columns:minmax(350px,.86fr) minmax(300px,.56fr);gap:clamp(32px,5vw,80px);max-width:1360px;margin:0 auto;padding-top:clamp(22px,2.5vw,38px)}
.generator-left{min-width:0}.hero-copy{padding-top:0}.hero-copy h1{margin:0 0 14px;font-size:clamp(39px,3.7vw,61px);line-height:1.04;letter-spacing:-.065em}.hero-copy h1 em{font-style:normal}.hero-copy .hero-lede{max-width:470px;font-size:14px;line-height:1.62}.independent-note{margin-top:13px;margin-bottom:18px;font-size:10px}.generator-card{max-width:530px;padding:16px;border-radius:14px;background:#fff;box-shadow:0 2px 5px rgba(15,15,15,.08),0 14px 35px rgba(30,30,25,.05)}.generator-card-head{padding:0 0 10px}.account-summary{padding:8px 0}.form-step{margin-top:13px}.step-title{margin-bottom:7px}.dropzone{height:106px}.upload-icon{width:31px;height:31px;font-size:17px}.form-hint{margin-top:6px}.cut{height:46px}.consent{margin:12px 0 10px}.primary-button,.primary-link{height:43px}.generation-note{margin-top:6px}
.original-video-panel{position:relative;align-self:end;overflow:hidden;border-radius:15px;background:#151515;box-shadow:0 14px 42px rgba(42,34,28,.18);aspect-ratio:9/15;max-height:610px;min-height:470px}.original-video{display:block;width:100%;height:100%;object-fit:cover;background:#202020}.original-video::-webkit-media-controls-panel{background:linear-gradient(transparent,rgba(0,0,0,.76))}.video-badge{position:absolute;z-index:2;top:12px;left:12px;padding:7px 10px;border:1px solid rgba(255,255,255,.3);border-radius:999px;background:rgba(15,15,15,.68);color:#fff;font:500 9px 'DM Mono',monospace;letter-spacing:.1em;backdrop-filter:blur(8px)}.video-badge>span:first-child{color:#f16448}.video-caption{position:absolute;z-index:2;right:0;bottom:0;left:0;padding:30px 15px 13px;background:linear-gradient(transparent,rgba(0,0,0,.82));color:#fff;pointer-events:none}.video-caption strong,.video-caption span{display:block}.video-caption strong{font-size:12px}.video-caption span{margin-top:3px;color:rgba(255,255,255,.72);font:9px 'DM Mono',monospace;letter-spacing:.06em}
.primary-button{justify-content:center;gap:12px}.primary-button.guest-action{background:#211e1c;font-size:13px;text-transform:none;letter-spacing:0}.primary-button.guest-action b{display:none}.google-glyph{display:none;width:19px;height:19px;align-items:center;justify-content:center;font:bold 17px Arial;color:#4285f4}.guest-action .google-glyph{display:inline-flex}.guest-action .cta-label{font:600 13px Manrope,Arial,sans-serif}.template-strip{margin-top:clamp(52px,6vw,82px)}
@media(max-width:880px){.generator-hero{grid-template-columns:minmax(0,1fr);max-width:680px}.generator-card{max-width:none}.original-video-panel{justify-self:center;width:min(100%,420px);min-height:0;max-height:none;aspect-ratio:9/14}.template-strip{margin-top:40px}}
@media(max-width:580px){.generator-hero{padding-top:37px}.hero-copy h1{font-size:42px}.original-video-panel{width:min(100%,360px)}.generator-card{padding:16px}.video-caption{padding:35px 14px 13px}}
.hero-trio{position:relative;align-self:end;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%;max-width:none}
.hero-clip{overflow:hidden;border-radius:12px;background:#151515;box-shadow:0 14px 42px rgba(42,34,28,.18);aspect-ratio:9/16}
.hero-clip .original-video{width:100%;height:100%;object-fit:cover}
@media(max-width:880px){.hero-trio{gap:6px}.hero-clip{border-radius:9px}}

/* ---- v2: compact first screen, videos in one row, rounded clips with labels ---- */
[hidden]{display:none!important}
.vclip{margin:0;min-width:0}
.vlabel{display:inline-block;margin:0 0 8px;padding:5px 11px;border-radius:999px;background:var(--ink);color:#fff;font:500 10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase}
.vlabel.is-original{background:#f16448;color:#fff}
.vframe{overflow:hidden;border-radius:18px;background:#151515;box-shadow:0 12px 34px rgba(42,34,28,.16);aspect-ratio:9/16}
.vframe video{display:block;width:100%;height:100%;object-fit:cover}
.vframe video::-webkit-media-controls-panel{background:linear-gradient(transparent,rgba(0,0,0,.7))}

.generator-hero{grid-template-columns:minmax(340px,480px) minmax(0,1fr);align-items:center;gap:clamp(28px,4vw,64px);padding-top:clamp(16px,2vw,28px)}
.hero-trio{align-self:center;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,1.2vw,16px);width:100%;max-width:700px;justify-self:center}
.hero-trio .vframe{max-height:calc(100vh - 170px)}
.hero-copy h1{margin:0 0 10px;font-size:clamp(34px,3.2vw,48px)}
.hero-copy .hero-lede{margin:0;max-width:460px;font-size:13px;line-height:1.55}
.independent-note{margin:8px 0 12px;font-size:10px}
.generator-card{max-width:480px;padding:14px}
.generator-card-head{padding-bottom:8px}
.form-step{margin-top:10px}
.dropzone{height:76px;gap:2px}
.upload-icon{width:26px;height:26px;font-size:15px}
.form-hint{display:none}
.cut{height:40px}
.consent{margin:10px 0 8px}
.primary-button,.primary-link{height:40px}
.generation-note{margin-top:5px}

.template-strip{margin-top:clamp(40px,5vw,70px)}
.showcase-grid{max-width:760px;margin:32px auto 0;gap:clamp(8px,1.6vw,20px)}
.showcase-grid .vlabel{font-size:10px}
.proof-clip{justify-self:end;width:min(100%,300px)}
.ideas-clip{justify-self:end;width:min(100%,300px)}

@media(max-width:880px){
  .generator-hero{grid-template-columns:minmax(0,1fr);max-width:680px}
  .hero-trio{order:-1;max-width:none}
  .hero-trio .vframe{max-height:none}
  .generator-card{max-width:none}
  .proof-clip,.ideas-clip{justify-self:start}
}
@media(max-width:580px){.vlabel{font-size:8px;padding:4px 8px;letter-spacing:.06em}.vframe{border-radius:12px}}
.template-strip{padding-bottom:clamp(48px,6vw,88px)}

/* Give the generator more room and keep uploaded portraits proportional. */
.generator-card{min-height:480px;display:flex;flex-direction:column;justify-content:space-between}
.dropzone.has-preview{height:auto;min-height:0;padding:10px;display:grid;grid-template-columns:minmax(0,clamp(56px,25vw,110px)) minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:10px;row-gap:4px;text-align:left}
.dropzone.has-preview img{position:static;grid-column:1;grid-row:1 / span 2;display:block;width:auto;height:auto;max-width:100%;max-height:120px;justify-self:center;align-self:center;object-fit:contain;border-radius:6px}
.dropzone.has-preview .upload-icon{display:none}
.dropzone.has-preview strong{grid-column:2;grid-row:1;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dropzone.has-preview small{grid-column:2;grid-row:2;align-self:start}
.dropzone.has-preview .replace-photo{position:static;grid-column:3;grid-row:1 / span 2;align-self:center;justify-self:end;white-space:nowrap}
.consent-error{margin:-4px 0 10px;padding-inline-start:23px;color:#d92d20;font-size:11px;font-weight:600;line-height:1.4}