/* Motion is progressive: the page and first slide remain visible without JS. */
/* Share one continuous background behind the navigation and hero. */
body{background:#fff radial-gradient(ellipse 680px 390px at 50% 180px,#edf2e4b3,transparent 100%) no-repeat}
.site-nav{position:sticky;top:0;z-index:20;transition:background .3s,box-shadow .3s;border-radius:0 0 12px 12px}
.page-scrolled .site-nav{background:#ffffffed;backdrop-filter:blur(16px);box-shadow:0 8px 28px #24351b08}
.marketing-hero{position:relative;isolation:isolate;padding:81px 0 59px}
.hero-kicker{display:flex;align-items:center;justify-content:center;gap:9px;font-size:10px;letter-spacing:1.8px;color:#78836c;margin-bottom:24px}
.hero-kicker>span{height:5px;width:5px;border-radius:50%;background:#829568;box-shadow:0 0 0 4px #e9efdf}
.marketing-hero h1{font-size:clamp(40px,5.2vw,68px);line-height:1.14;letter-spacing:-2.6px;font-weight:550;text-wrap:balance}
.marketing-hero h1>span{color:#526646}
.marketing-hero h1 .hero-word{white-space:nowrap}
.marketing-hero>p{max-width:640px;font-size:16px;line-height:1.75;margin:23px auto 27px}
.hero-actions{align-items:center}
.hero-cta{gap:12px;min-height:46px;padding:11px 19px;border-radius:10px;background:#38543b;font-size:14px;box-shadow:none;transition:background .2s}
.hero-cta:hover{background:#2f4932}

.design-demo{max-width:1000px;margin:0 auto;padding-top:20px;scroll-margin-top:96px}
.demo-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;margin-bottom:24px}
.demo-proof{margin:10px 0 0;text-align:center;font-size:11px;font-weight:400;line-height:1.5;color:#738066}
.demo-heading h2{font-size:32px;line-height:1.2;letter-spacing:-1px;font-weight:500}
.demo-labels{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px;max-width:620px;margin:0 auto 16px;font-size:14px;font-weight:550;color:#526646}
.demo-labels>span{font-size:20px;font-weight:400;color:#637357}
.demo-labels>button{min-width:0;min-height:44px;padding:9px 12px;border:1px solid #d4dfca;border-radius:8px;background:#f7f9f3;color:#526646;font:inherit;line-height:1.45;transition:background .15s,color .15s,border-color .15s}
.demo-labels>button:hover:not(:disabled){border-color:#8b9f7b;background:#edf2e6}.demo-labels>button[aria-pressed="true"]{background:#38543b;border-color:#38543b;color:#fff}.demo-labels>button[aria-pressed="true"]:hover{background:#2f4932}.demo-labels>button:disabled{opacity:.55}
.demo-deck-picker{display:grid;gap:7px;flex:none;min-width:235px;font-size:12px;color:#5f6c54}
.demo-deck-picker select{width:100%;min-height:44px;padding:9px 30px 9px 12px;border:1px solid #d4dfca;border-radius:8px;background:#fff;color:#38543b;font:inherit;font-size:13px}
.demo-deck-picker select:focus-visible{outline:3px solid #6b8c4b;outline-offset:3px}
.demo-preservation{max-width:600px;margin:10px 0 0;font-size:14px;line-height:1.7;color:#5f6c54}
.demo-player{position:relative;border:1px solid #dce2d4;border-radius:13px;background:#fff;overflow:hidden;box-shadow:0 4px 8px #25331b03,0 22px 60px -20px #25331b22;transform:perspective(1400px) translateY(var(--demo-lift,0px)) rotateX(var(--demo-tilt,0deg));transform-origin:center top}

.demo-stage{position:relative;aspect-ratio:16/9;overflow:hidden;background:#fff;container-type:inline-size;isolation:isolate}
.demo-stage>.demo-source,.demo-stage>.demo-result{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}
.demo-result{opacity:0}
.slide-morph{position:absolute;inset:0;opacity:0;background:rgb(calc(255 - var(--brand,0)*255),calc(255 - var(--brand,0)*172),calc(255 - var(--brand,0)*29));color:var(--morph-ink,#082f58);font-family:Arial,sans-serif}
.morph-title{position:absolute;left:calc(3.7% - var(--brand,0)*.7%);top:calc(3.2% + var(--brand,0)*3.2%);font-size:calc(2.5cqw + var(--brand,0)*1.7cqw);font-weight:calc(700 - var(--brand,0)*400);line-height:1.2}
.morph-line{position:absolute;left:calc(6.8% - var(--brand,0)*3.8%);font-size:calc(2.1cqw + var(--brand,0)*.53cqw);line-height:1.3;white-space:nowrap;font-weight:400;letter-spacing:calc(var(--brand,0)*-.05cqw)}
.morph-line strong{font-weight:calc(400 + var(--brand,0)*300)}
.morph-line-1{top:calc(16.5% + var(--brand,0)*17.8%)}
.morph-line-2{top:calc(25.9% + var(--brand,0)*20.7%)}
.morph-line-3{top:calc(35.2% + var(--brand,0)*23.7%)}
.morph-line-4{top:calc(44.5% + var(--brand,0)*26.7%)}
.morph-bullet{display:inline-block;width:calc((1 - var(--brand,0))*1.25cqw);opacity:calc(1 - var(--brand,0));overflow:hidden;vertical-align:bottom}
.morph-photo-frame{position:absolute;left:calc(57.73% - var(--brand,0)*9.84%);top:calc(13.33% + var(--brand,0)*15.14%);width:calc(39.06% + var(--brand,0)*7.59%);height:calc(46.67% + var(--brand,0)*15.83%);padding:calc(var(--brand,0)*3.2cqw) calc(var(--brand,0)*1.8cqw);background:#fff;border-radius:calc(var(--brand,0)*1.9cqw)}
.morph-photo{position:relative;width:100%;height:100%;overflow:hidden;border-radius:calc(var(--brand,0)*1.8cqw)}
.morph-photo>img{position:absolute;max-width:none;width:256%;height:214.286%;left:-147.8%;top:-28.571%;object-fit:fill}

.demo-expand{position:absolute;right:12px;bottom:12px;width:30px;height:30px;display:grid;place-items:center;border:1px solid #ffffff90;border-radius:6px;background:#ffffffe8;color:#526343;font-size:16px;opacity:0;transition:opacity .2s}
.demo-stage:hover .demo-expand,.demo-expand:focus-visible{opacity:1}

.workspace{margin-top:60px;scroll-margin-top:96px}
.results .result-header{margin-bottom:30px}
.results #download{flex:none;white-space:nowrap}.results .result-format{margin-top:8px;font-weight:550;color:#38543b}
.results .preview-title{font-size:12px;color:#6d7d60}
.results .figure-label{font-size:11px;color:#697a5b;margin-bottom:10px}
.results figure:last-child .figure-label{color:#3f5c2d}
.results .comparison img{background:#fff;border-color:#d7e0cc}
.results .slide-strip{margin:22px 0 19px;gap:7px}
.review-note{font-size:12px;line-height:1.75;color:#738366;margin-bottom:23px;max-width:600px}
.motion-ready [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s,transform .7s cubic-bezier(.2,.7,.2,1)}
.motion-ready [data-reveal].is-visible{opacity:1;transform:none}
.motion-ready .hero-kicker,.motion-ready .marketing-hero h1,.motion-ready .marketing-hero>p,.motion-ready .hero-actions{animation:hero-arrive .8s both cubic-bezier(.2,.7,.2,1)}
.motion-ready .marketing-hero h1{animation-delay:.08s}
.motion-ready .marketing-hero>p{animation-delay:.16s}
.motion-ready .hero-actions{animation-delay:.24s}
@keyframes hero-arrive{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
@media(max-width:900px){.marketing-hero h1{font-size:clamp(36px,6.1vw,56px);letter-spacing:-1.8px}.demo-heading h2{font-size:28px}}
@media(max-width:650px){
 .marketing-hero{padding:38px 0 27px}.hero-kicker{font-size:8px;letter-spacing:1.25px;margin-bottom:21px}
 .marketing-hero h1{font-size:clamp(32px,7.3vw,44px);letter-spacing:-1.2px;line-height:1.2}.marketing-hero h1>span{display:block;max-width:340px;margin:auto}
 .marketing-hero>p{font-size:13px;max-width:335px;margin:18px auto 21px}.hero-cta{font-size:13px;gap:12px;padding:11px 18px}
 .design-demo{padding-top:14px;scroll-margin-top:82px}.demo-heading{display:block;margin-bottom:20px}.demo-heading h2{font-size:28px;letter-spacing:-.8px}.demo-deck-picker{margin-top:20px;min-width:0}.demo-deck-picker select{font-size:13px}
 .demo-labels{gap:10px;font-size:12px;margin-bottom:14px}.demo-preservation{font-size:13px;max-width:320px}.demo-player{border-radius:9px}

 .demo-expand{width:25px;height:25px;font-size:13px;right:7px;bottom:7px;opacity:1}.workspace{margin-top:35px;scroll-margin-top:82px}
 .results .result-header{margin-bottom:24px}.results .preview-title{font-size:10px;max-width:125px}.results .slide-nav{font-size:9px;gap:5px}.review-note{font-size:11px;margin-bottom:19px}
}
@media(prefers-reduced-motion:reduce){
 .motion-ready [data-reveal]{opacity:1;transform:none}.motion-ready .hero-kicker,.motion-ready .marketing-hero h1,.motion-ready .marketing-hero>p,.motion-ready .hero-actions{animation:none}.demo-player{transform:none}.site-nav{backdrop-filter:none}
}

/* Quiet demo controls and a deliberate transition into the two-step tool. */
.demo-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:17px}
.demo-replay{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 2px;border:0;background:transparent;font-size:13px;color:#526646}
.demo-replay>span{font-size:21px;line-height:1}.demo-replay:hover{color:#263e1d}.demo-replay:disabled{opacity:.45}
.demo-slide-nav{display:flex;align-items:center;gap:10px;color:#5f6c54;font-size:13px}
.demo-slide-nav button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-width:44px;min-height:44px;padding:8px 14px;border:1px solid #dce3d3;border-radius:7px;background:#fff;color:#38543b;font:inherit;white-space:nowrap;transition:background .15s,border-color .15s}
.demo-slide-nav button:hover:not(:disabled){border-color:#8b9f7b;background:#edf2e6}.demo-slide-nav button:disabled{opacity:.4;cursor:default}
.demo-slide-nav button:focus-visible{outline:3px solid #6b8c4b;outline-offset:3px}
.demo-slide-count{min-width:52px;text-align:center;white-space:nowrap;font-variant-numeric:tabular-nums}
.demo-downloads{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px 24px;margin-top:14px;padding-top:14px;border-top:1px solid #e0e7d7;color:#5f6c54;font-size:12px}
.demo-download-copy{display:grid;gap:3px}.demo-download-copy>span:first-child{color:#38543b;font-size:13px;font-weight:550}
.demo-download-links{display:flex;flex-wrap:wrap;gap:10px}
.demo-download-links a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 14px;border:1px solid #dce3d3;border-radius:7px;background:#fff;color:#38543b;font-size:13px}
.demo-download-links a:hover{border-color:#8b9f7b;background:#edf2e6}
.workspace{max-width:1000px;margin:80px auto 0;border:0;padding:0;background:transparent;scroll-margin-top:78px}
.workspace-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:24px;margin-bottom:25px}.workspace-heading>div{display:contents}.workspace-heading h2{grid-column:1;grid-row:1}
.workspace-heading h2{font-size:32px;line-height:1.2;font-weight:500;letter-spacing:-1px}
.workspace-heading p{grid-column:1/-1;grid-row:2;max-width:none;font-size:14px;line-height:1.7;color:#7b8771;margin-top:9px}
.workspace-heading>.text-button{grid-column:2;grid-row:1;justify-self:end}
.wizard-shell{padding:30px;border:1px solid #e0e7d7;border-radius:18px;background:linear-gradient(180deg,#fafbf7,#f3f6ee)}
.wizard-steps{list-style:none;padding:0;margin:0 0 24px;display:flex;justify-content:center;align-items:center;gap:17px}
.wizard-steps button{display:flex;align-items:center;gap:8px;padding:0;min-height:35px;border:0;background:none;font-size:12px;color:#9aa58e;white-space:nowrap}
.wizard-steps button>span{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#eaf0e2;font-size:10px;color:#81956d}
.wizard-steps button[aria-current="step"]{color:#3c5730;font-weight:550}
.wizard-steps button[aria-current="step"]>span{color:#fff;background:#60784d}
.wizard-steps button:disabled{cursor:default}.step-connector{width:65px;height:1px;background:#dbe3d0}
.step-heading{text-align:center;max-width:560px;margin:0 auto 20px}.step-heading h3{font-size:23px;line-height:1.3;font-weight:500;letter-spacing:-.6px}.step-heading p{font-size:12px;line-height:1.65;color:#7c8970;margin-top:9px}
.step-heading h3:focus{outline:none}
.wizard-step>.upload-card,#template-upload>.upload-card{max-width:620px;margin:0 auto;padding:20px 23px 15px;border-radius:12px}
.wizard-step .drop-target{min-height:128px;background:#fcfdf9;margin-top:16px}
.step-actions,.wizard-step>.action-row{max-width:620px;margin:19px auto 0;display:flex;align-items:center;justify-content:space-between;gap:18px}
.step-actions>p{font-size:11px;color:#849174}.step-actions .primary{font-size:12px;gap:20px}
.template-summary{max-width:620px;margin:0 auto 20px;padding:12px 15px;border:1px solid #dce6d1;border-radius:9px;background:#ffffffb3;display:flex;align-items:center;justify-content:space-between;gap:18px}
.template-summary>div{display:flex;align-items:center;gap:11px;min-width:0}.template-summary>div>div{min-width:0}.template-summary-check{display:grid;place-items:center;border-radius:50%;background:#e9f0df;color:#637c4f;width:25px;height:25px;flex:none;font-size:11px}
.template-summary strong{display:block;font-size:12px;font-weight:500;color:#536849;overflow-wrap:anywhere}.template-summary p{font-size:10px;color:#8a957e;margin-top:3px;line-height:1.6}.template-summary .text-button{font-size:10px;flex:none}
.saved-template{max-width:620px;margin:0 auto;border:1px solid #dce6d1;border-radius:12px;background:#fff;text-align:center;padding:26px 25px 22px}
.saved-template-kicker{display:block;font-size:8px;letter-spacing:1.2px;color:#829271;margin-bottom:12px}.saved-template>strong{display:block;font-size:18px;font-weight:500;color:#46603a;overflow-wrap:anywhere}.saved-template>p{font-size:12px;color:#839175;margin:7px 0 21px}.saved-template-links{display:flex;justify-content:center;flex-wrap:wrap;gap:25px;margin-top:17px}.saved-template-links .text-button{font-size:10px}
.wizard-shell .privacy-copy{max-width:620px;margin:22px auto 0;font-size:10px;line-height:1.7;color:#8c977f}
.wizard-shell .sample-note{max-width:620px;margin:18px auto 0;font-size:11px}
.wizard-shell .progress-panel{margin:0;background:#fff}.wizard-shell .results .result-header{margin-top:0}.wizard-shell .error{margin:18px 0 0}
.wizard-step:not(.hidden){animation:step-arrive .25s ease-out}
@keyframes step-arrive{from{opacity:.3;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(max-width:650px){
 .demo-actions{gap:12px;padding-top:16px}.demo-replay{font-size:12px;gap:8px;min-height:44px}.demo-replay>span{font-size:19px}.demo-slide-nav{gap:6px;font-size:12px}.demo-slide-nav button{padding:8px 12px}.demo-slide-count{min-width:44px}.demo-prev-label{display:none}
 .workspace{margin-top:48px;padding:0;scroll-margin-top:85px}.workspace-heading{display:block;margin-bottom:20px}.workspace-heading h2{font-size:28px;letter-spacing:-.8px}.workspace-heading p{font-size:12px;max-width:310px;margin-top:8px}.workspace-heading>.text-button{font-size:10px;margin-top:9px}
 .wizard-shell{padding:23px 15px 19px;border-radius:13px}.wizard-steps{gap:12px;margin-bottom:25px}.wizard-steps button{font-size:10px;gap:6px}.wizard-steps button>span{width:24px;height:24px;font-size:9px}.step-connector{width:32px}
 .step-heading{margin-bottom:20px}.step-heading h3{font-size:20px;letter-spacing:-.5px;max-width:265px;margin:auto}.step-heading p{font-size:11px;max-width:290px;margin:9px auto 0}
 .wizard-step>.upload-card,#template-upload>.upload-card{padding:16px 15px 12px}.wizard-step .drop-target{min-height:145px;margin-top:13px}.step-actions,.wizard-step>.action-row{flex-direction:column;align-items:stretch;gap:12px;margin-top:16px}.step-actions>p{text-align:center;font-size:10px}.step-actions .primary{width:100%;font-size:11px}
 .template-summary{padding:10px;margin-bottom:22px;gap:10px}.template-summary strong{font-size:10px}.template-summary p{font-size:9px}.template-summary .text-button{font-size:9px}.template-summary-check{width:20px;height:20px;font-size:9px}.template-summary>div{gap:8px}
 .saved-template{padding:22px 15px 18px}.saved-template>strong{font-size:15px}.saved-template>p{font-size:11px}.saved-template-kicker{font-size:7px}.saved-template-links{gap:15px}.wizard-shell .privacy-copy{font-size:9px;margin-top:19px;text-align:center}
}
@media(prefers-reduced-motion:reduce){.wizard-step:not(.hidden){animation:none}}

@media(max-width:650px){.demo-replay{white-space:nowrap;flex:none}}
.workspace-heading p{color:#6b775f}.step-heading p{color:#68775c}.step-actions>p{color:#6c7c5f}.template-summary p{color:#6c7c5f}

/* Readable helper text outside the illustrative PowerPoint canvas. */
.workspace .text-button,.engine-status,.wizard-steps button,.step-actions>p,
.template-summary p,.template-summary .text-button,.saved-template-links .text-button,
.wizard-shell .privacy-copy,.wizard-shell .sample-note{font-size:12px}
.wizard-steps button>span,.step-number,.file-kind,.file-meta,.file-ready{font-size:12px}
.card-top{flex-wrap:wrap;row-gap:8px}.file-kind{margin-left:auto}
.file-label{font-size:13px}.step-heading p,.saved-template>p{font-size:14px}
.step-heading p,.step-actions>p,.template-summary p,.saved-template>p,
.wizard-shell .privacy-copy{color:#5f6c54}
.saved-template-kicker{font-size:11px;color:#5f6c54}
.supporting-templates legend span,.supporting-actions>span,
.supporting-templates .supporting-note,.template-role{font-size:12px;color:#5f6c54}
.results .figure-label,.results .preview-title,.review-note{font-size:13px;color:#5f6c54}
.results .slide-nav{font-size:12px}.footer-links{font-size:13px;color:#5f6c54}
@media(max-width:650px){
 .step-heading p,.saved-template>p{font-size:13px}.footer-links{font-size:12px}
}

.footer-tagline{font-size:14px;font-weight:550;color:#526646}

/* Give the two-line hero room to breathe before the format strip and demo. */
.marketing-hero{padding:56px 0 40px}
.marketing-hero h1{font-size:clamp(40px,4.6vw,60px)}
.marketing-hero h1>.hero-line{display:block}
.marketing-hero>.hero-description{max-width:760px;margin:24px auto 28px}
.marketing-hero+.design-demo{padding-top:8px}
@media(max-width:650px){.marketing-hero{padding:40px 0 32px}.marketing-hero h1{font-size:clamp(32px,7.3vw,44px)}.marketing-hero h1>.hero-line{display:inline}.marketing-hero>.hero-description{max-width:335px}}