*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:#eaf6f8;font-family:'Segoe UI',system-ui,-apple-system,Arial,sans-serif;line-height:1.7;font-size:17px;background:linear-gradient(180deg,#04263e 0%,#063a52 45%,#0a5a6e 100%);min-height:100vh}
h1,h2,h3{line-height:1.25;font-weight:800;color:#fff}
a{color:#5eead4;text-decoration:none}
a:hover{text-decoration:underline;color:#99f6e4}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.site-header{background:rgba(4,38,62,.75);backdrop-filter:blur(12px);border-bottom:1px solid rgba(94,234,212,.25);position:sticky;top:0;z-index:50}
.site-header .wrap{display:flex;align-items:center;gap:20px;padding:12px 24px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:#fff;font-size:23px;font-weight:800}
.brand:hover{text-decoration:none;color:#5eead4}
.brand svg{width:40px;height:40px}
.nav{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto;align-items:center}
.nav a{text-decoration:none;color:#bfe3e8;font-size:14.5px;font-weight:600;padding:9px 15px;border-radius:999px;border:1px solid transparent}
.nav a:hover{color:#5eead4;border-color:rgba(94,234,212,.4);background:rgba(94,234,212,.08);text-decoration:none}
.nav a.cta{background:#5eead4;color:#04263e;border-color:#5eead4}
.nav a.cta:hover{background:#99f6e4;color:#04263e}
.waves{display:block;width:100%;height:90px;margin-bottom:-1px}
.bubbles{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.bubble{position:absolute;border-radius:50%;border:2px solid rgba(94,234,212,.25);background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.18),transparent 60%)}
@keyframes rise{0%{transform:translateY(0)}100%{transform:translateY(-120px)}}
.hero{padding:64px 0 0;position:relative;overflow:hidden}
.hero-inner{position:relative;max-width:70ch;padding-bottom:30px}
.eyebrow{display:inline-block;background:rgba(94,234,212,.12);border:1px solid rgba(94,234,212,.5);color:#5eead4;font-size:13px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;padding:8px 20px;border-radius:999px;margin-bottom:18px}
.hero h1{font-size:clamp(36px,5.4vw,60px);margin:0 0 16px}
.hero h1 .hl{color:#5eead4}
.lede{color:#bfe3e8;font-size:18px}
.console{background:rgba(255,255,255,.06);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(94,234,212,.35);border-radius:20px;margin:10px 0 12px;box-shadow:0 24px 70px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.12);overflow:hidden}
.console-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:20px 28px;border-bottom:1px solid rgba(94,234,212,.2)}
.console-head h2{margin:0;font-size:24px}
.console-head .lights{display:flex;gap:8px}
.console-head .lights span{width:13px;height:13px;border-radius:50%;background:rgba(94,234,212,.35)}
.console-head .lights span:first-child{background:#5eead4}
.privacy-chip{margin-left:auto;display:inline-flex;align-items:center;gap:8px;border:1px solid #5eead4;color:#5eead4;font-size:13px;font-weight:700;letter-spacing:1px;padding:8px 16px;border-radius:999px}
.privacy-chip svg{width:16px;height:16px}
.console-body{padding:28px}
.opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-bottom:24px}
.opt{background:rgba(4,38,62,.5);border:1px solid rgba(94,234,212,.25);padding:18px;border-radius:14px}
.opt-label{display:block;font-weight:700;font-size:13.5px;letter-spacing:1.5px;text-transform:uppercase;color:#5eead4;margin-bottom:12px}
.opt-hint{font-size:13.5px;color:#9fc3cc;margin:10px 0 0}
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg button{border:1px solid rgba(94,234,212,.4);background:rgba(255,255,255,.05);color:#eaf6f8;padding:8px 15px;font-size:13.5px;font-weight:600;cursor:pointer;font-family:inherit;border-radius:999px}
.seg button:hover{border-color:#5eead4}
.seg button[aria-pressed="true"]{background:#5eead4;color:#04263e;border-color:#5eead4;font-weight:700}
.num-row{display:flex;align-items:center;gap:12px}
.num-row input[type=range]{flex:1;accent-color:#5eead4}
.num-row input[type=number]{width:70px;border:1px solid rgba(94,234,212,.4);background:rgba(4,38,62,.6);color:#eaf6f8;padding:8px 10px;font-size:15px;border-radius:10px;font-family:inherit}
.count-val{font-weight:800;color:#5eead4;font-size:20px;min-width:40px;text-align:center}
.actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:8px}
.btn{border:2px solid #5eead4;background:transparent;color:#5eead4;padding:12px 26px;font-weight:700;font-size:15px;cursor:pointer;font-family:inherit;border-radius:999px;display:inline-flex;align-items:center;gap:9px;text-decoration:none}
.btn:hover{background:rgba(94,234,212,.12);text-decoration:none}
.btn.primary{background:#5eead4;color:#04263e;box-shadow:0 8px 26px rgba(94,234,212,.35)}
.btn.primary:hover{background:#99f6e4}
.btn svg{width:17px;height:17px}
.btn:disabled{opacity:.35;cursor:not-allowed;box-shadow:none}
.copy-note{font-size:14px;font-weight:700;color:#5eead4}
.output{margin-top:20px;background:rgba(4,38,62,.55);border:1px solid rgba(94,234,212,.25);min-height:130px;padding:20px;border-radius:14px}
.output ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.output li{background:rgba(255,255,255,.05);border:1px solid rgba(94,234,212,.25);border-radius:12px;padding:14px 18px;cursor:pointer;display:flex;gap:14px;align-items:flex-start}
.output li:hover{background:rgba(94,234,212,.08)}
.output li .idx{flex:none;width:38px;height:38px;border-radius:50%;background:#5eead4;color:#04263e;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:15px}
.output li .txt{min-width:0}
.output li .nm{display:block;font-weight:800;font-size:17px;color:#fff}
.output li .inc{display:block;font-size:14px;color:#bfe3e8}
.output li .fr{display:block;font-size:13.5px;color:#5eead4;margin-top:3px}
.output li .mini-copy{margin-left:auto;flex:none;font-size:12px;font-weight:700;color:#5eead4;border:1px dashed rgba(94,234,212,.6);padding:5px 12px;border-radius:999px;align-self:center}
.output .placeholder{color:#7fa8b3;text-align:center;margin:32px 0;font-size:15px}
.output-meta{margin-top:12px;font-size:13.5px;color:#9fc3cc}
.limits{margin-top:22px;background:rgba(4,38,62,.55);border:2px dashed rgba(94,234,212,.5);padding:20px 22px;border-radius:14px}
.limits h3{margin:0 0 10px;font-size:19px;color:#5eead4;display:flex;align-items:center;gap:10px}
.limits h3 svg{width:22px;height:22px;flex:none}
.limits ul{margin:0;padding-left:20px;font-size:15px;color:#bfe3e8}
.limits li{margin-bottom:7px}
.section{padding:56px 0 8px}
.section h2{font-size:clamp(28px,3.6vw,40px);margin:0 0 14px}
.section h2 .hl{color:#5eead4}
.sub{color:#bfe3e8;max-width:68ch;margin:0 0 24px}
.cards3{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:20px}
.card{background:rgba(255,255,255,.06);backdrop-filter:blur(10px);border:1px solid rgba(94,234,212,.25);border-radius:18px;padding:24px;display:flex;flex-direction:column}
.card h3{margin:0 0 10px;font-size:19px}
.card p{margin:0 0 14px;color:#bfe3e8;font-size:15px;flex:1}
.card .icon{width:46px;height:46px;border-radius:50%;background:rgba(94,234,212,.15);border:1px solid rgba(94,234,212,.5);display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.card .icon svg{width:24px;height:24px}
.card a.more{font-weight:700;font-size:14.5px}
.prose{max-width:74ch}
.prose p{margin:0 0 16px;color:#cfe7ec}
.prose h2{margin:36px 0 12px;font-size:27px}
.prose h3{margin:28px 0 10px;font-size:20px;color:#5eead4}
.prose ul,.prose ol{margin:0 0 18px;padding-left:22px;color:#cfe7ec}
.prose li{margin-bottom:8px}
.prose table{width:100%;border-collapse:collapse;margin:18px 0;font-size:15.5px}
.prose th{background:rgba(94,234,212,.12);color:#5eead4;text-align:left;padding:10px 14px;border:1px solid rgba(94,234,212,.25)}
.prose td{padding:10px 14px;border:1px solid rgba(94,234,212,.25);color:#cfe7ec}
.prose strong{color:#fff}
.prose code{background:rgba(4,38,62,.7);padding:2px 7px;border-radius:5px;font-size:.88em;color:#5eead4}
.callout{background:rgba(94,234,212,.1);border-left:4px solid #5eead4;padding:18px 22px;margin:20px 0;border-radius:0 12px 12px 0}
.callout p{margin:0}
.faq-item{background:rgba(255,255,255,.05);border:1px solid rgba(94,234,212,.25);border-radius:14px;padding:18px 22px;margin-bottom:14px}
.faq-item h3{margin:0 0 8px;font-size:18px;color:#5eead4}
.faq-item p{margin:0;color:#bfe3e8;font-size:15.5px}
.site-footer{background:#03202f;border-top:1px solid rgba(94,234,212,.25);margin-top:70px;padding:44px 0 30px}
.site-footer .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:26px}
.site-footer h4{color:#5eead4;margin:0 0 12px;font-size:15px;letter-spacing:1.5px}
.site-footer a{color:#9fc3cc;font-size:14.5px;display:block;margin-bottom:8px}
.site-footer a:hover{color:#5eead4}
.site-footer .fine{grid-column:1/-1;font-size:13px;color:#6f96a0;border-top:1px solid rgba(94,234,212,.15);padding-top:18px;margin-top:6px}
.breadcrumb{font-size:13.5px;color:#9fc3cc;margin:22px 0 0}
.breadcrumb a{color:#5eead4}
.page-hero{padding:44px 0 6px}
.page-hero h1{font-size:clamp(32px,4.6vw,48px);margin:0 0 14px}
@media(max-width:700px){.console-body{padding:20px 16px}.output li{flex-wrap:wrap}.nav{margin-left:0}}
@media(prefers-reduced-motion:reduce){.bubble{animation:none!important}}
Home / About
About PromoPilot
PromoPilot is a free, no-signup brainstorming tool for store owners, founders, and marketers who need product offer ideas fast.
The idea is simple: structuring a good product offer takes longer than it should. PromoPilot assembles bundle deals, tiered discounts, BOGO pairings, starter kits, and subscription boxes from example product sets at the click of a button, each with a short framing note so the brainstorm stays grounded in real offer practice.
Everything runs in your browser. There is no account to create, no email to hand over, and nothing you build is transmitted anywhere. All products and figures in generated offers are illustrative placeholders; always swap in your real catalog and margin-checked numbers before publishing.
PromoPilot is a brainstorming aid, not a pricing consultant: it suggests structures, and you bring the judgment about your products, costs, and customers.