/* ===== Campaign landing page: /storyboard =====
   The Instagram "Screenplay in. Storyboard out." page. Every rule is scoped
   under #campaign-page so nothing here reaches the homepage (home.css) or the
   app (style.css): the three share class names (.section, .step, .hero,
   .brand, .eyebrow, .button) and must not share rules. Generated from the
   design mockup's stylesheet and then edited by hand. Its fonts (Archivo with
   the width axis, DM Sans, Courier Prime) come from the Google Fonts link in
   index.html like the rest of the site; a self-hosted font was tried and its
   CORS-mode request hit the server's origin allowlist on any host but
   production.

   The page is shown by an attribute the inline script in index.html's <head>
   sets from the URL before first paint, so a visitor never sees the homepage
   first. app.js removes it when the visitor enters the app (_leaveCampaignPage).

   style.css has a few element and class rules with no scope of their own
   (.hero, .hero h1, .footer-inner, a, button). Scoping wins on specificity,
   but only for properties set here, so the ones they set are set here too. */
#campaign-page{display:none}
html[data-page="campaign"] #campaign-page{display:block}
html[data-page="campaign"] #landing-page{display:none!important}
#campaign-page [hidden]{display:none!important}
#campaign-page h1,#campaign-page h2,#campaign-page h3{font-family:Archivo,Arial,sans-serif}
/* Condensed Archivo with tight tracking swallows the word space ("STOPWAITING."). */
#campaign-page h1,#campaign-page h2{word-spacing:.12em}
#campaign-page .hero{display:block;min-height:0;padding:0;text-align:left;position:static}
#campaign-page .hero h1{color:var(--ink);max-width:none}
#campaign-page .step{border:0;border-top:1px solid #54514c;border-radius:0}
#campaign-page .footer-inner{flex-direction:row;text-align:left;max-width:none;color:inherit;font-size:inherit}
#campaign-page .pricing-link{text-decoration:underline}

#campaign-page{--red:#ec3013;--ink:#201e1d;--paper:#f2f0e9;--dark:#242323;--muted:#69665e;--line:#d0cdc4}
#campaign-page *{box-sizing:border-box}
#campaign-page{margin:0;background:var(--paper);color:var(--ink);font-family:Archivo,Arial,sans-serif;-webkit-font-smoothing:antialiased}
#campaign-page button,#campaign-page input{font:inherit}
#campaign-page button,#campaign-page a{-webkit-tap-highlight-color:transparent}
#campaign-page button{cursor:pointer}
#campaign-page a{color:inherit}
#campaign-page button:focus-visible,#campaign-page a:focus-visible,#campaign-page input:focus-visible,#campaign-page summary:focus-visible,#campaign-page [role=tabpanel]:focus-visible{outline:3px solid #1561c4;outline-offset:5px}
#campaign-page button{border:0}
#campaign-page img{display:block;max-width:100%;height:auto}
#campaign-page h1,#campaign-page h2,#campaign-page h3,#campaign-page p,#campaign-page figure{margin:0}
#campaign-page h1,#campaign-page h2{font-weight:850;font-stretch:66%;font-variation-settings:'wdth' 66;letter-spacing:-.025em}
#campaign-page button:disabled{cursor:default}
#campaign-page button,#campaign-page a{touch-action:manipulation}
#campaign-page .wrap{width:min(1280px,calc(100% - 112px));margin-inline:auto}
#campaign-page .eyebrow{font-size:11px;line-height:1.5;font-weight:650;letter-spacing:.12em}
#campaign-page .site-header{background:var(--paper)}
#campaign-page .nav{height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px}
#campaign-page .brand{display:inline-flex;align-items:center;gap:10px;font:700 21px/1 'DM Sans',Arial,sans-serif;letter-spacing:-.04em;text-decoration:none}
/* The mark is drawn, like the homepage's .logo-icon, so there is no image to load. */
#campaign-page .brand-mark{display:inline-block;width:30px;height:30px;border-radius:50%;background:var(--ink);position:relative;flex:none}
#campaign-page .brand-mark::after{content:'';position:absolute;top:50%;left:50%;width:30%;height:30%;transform:translate(-50%,-50%);border-radius:50%;background:var(--red)}
#campaign-page .nav-note{font-size:12px;letter-spacing:.12em;margin-left:auto;margin-right:32px}
#campaign-page .button{display:inline-flex;align-items:center;justify-content:space-between;gap:42px;min-height:58px;background:var(--ink);color:var(--paper);padding:17px 24px;border-radius:3px;font-weight:650;font-size:16px;text-decoration:none;transition:background .18s,transform .18s}
#campaign-page .button>span{font-size:24px;line-height:1}
#campaign-page .button:hover{background:#393632;transform:translateY(-2px)}
#campaign-page .button.small{min-height:44px;font-size:13px;padding:10px 18px;gap:22px}
#campaign-page .button.small>span{font-size:20px}
#campaign-page .hero{background:var(--red);overflow:hidden}
#campaign-page .hero-eyebrow{display:flex;justify-content:flex-end;padding-top:28px}
#campaign-page .eyebrow i,#campaign-page .demo-bar i{display:inline-block;width:6px;height:6px;background:currentColor;border-radius:50%}
#campaign-page .hero-grid{display:grid;grid-template-columns:1.08fr 1fr;gap:25px;align-items:center;padding:40px 0 36px;min-height:650px}
#campaign-page .hero-copy{position:relative;z-index:2}
#campaign-page .hero h1{font-size:clamp(60px,6.3vw,94px);line-height:.98;white-space:nowrap;letter-spacing:-.015em}
#campaign-page .hero h1 span{color:var(--paper)}
/* Hero rhythm: headline, tagline close under it, the module words, then the
   CTA with the most air before it. Sizes step 94 / 22 / 15 / 16 / 13. */
#campaign-page .hero-description{font-size:22px;line-height:1.3;letter-spacing:-.015em;font-weight:500;margin-top:18px}
/* The other modules, as one line of words under the headline, divided by
   rules. Ink on this red is 3.9:1, so the words are set at 15px semibold. */
#campaign-page .hero-kit{margin-top:16px;max-width:470px}
/* Each word carries the rule on its left; the list is shifted left by one
   padding and clips, so a word that starts a wrapped line shows no rule. */
#campaign-page .kit-list{list-style:none;margin:0 0 0 -11px;padding:0;display:flex;flex-wrap:wrap;row-gap:7px;overflow:hidden;font-size:15px;font-weight:600;line-height:1.3}
#campaign-page .kit-list li{white-space:nowrap;position:relative;padding:0 11px}
#campaign-page .kit-list li::before{content:"";position:absolute;left:-1px;top:.15em;width:1px;height:.95em;background:#201e1d99}
#campaign-page .hero .primary{margin-top:28px;min-width:285px}
#campaign-page .reassurance{font-size:13px;font-weight:550;margin-top:12px;display:flex;gap:10px;align-items:center}
#campaign-page .watch-link{display:flex;text-decoration:none;align-items:center;gap:9px;padding:0;background:none;color:var(--ink);font-weight:550;font-size:13px;margin-top:20px;min-height:32px}
#campaign-page .play-icon{font-size:9px;width:25px;height:25px;border:1px solid #201e1d80;border-radius:50%;display:grid;place-items:center;padding-left:1px}
/* The cards are absolutely positioned and sized in % of the column, so the box
   is sized the same way: the storyboard card's top (px) plus its height (a 2.05
   image plus its caption rows and the 3deg tilt, as a share of the width). A
   fixed height let that card run past the box on wide screens, over the caption. */
#campaign-page .hero-art{height:0;padding-bottom:calc(312px + 54%);position:relative;margin-top:2px;isolation:isolate}
#campaign-page .script-slip{position:absolute;left:5%;top:0;width:58%;height:335px;background:#faf9f6;box-shadow:0 12px 30px #60100330;padding:22px;transform:rotate(-8deg);font:11px/1.5 'Courier Prime',monospace;overflow:hidden}
#campaign-page .slip-index{font:9px Archivo,sans-serif;letter-spacing:.08em;color:#777;display:block;margin-bottom:22px;border-bottom:1px solid #ddd;padding-bottom:10px}
#campaign-page .script-slip h2{font:700 12px/1.3 'Courier Prime',monospace;margin-bottom:16px}
#campaign-page .script-slip p{margin-top:12px}
#campaign-page .dialogue{text-align:center}
#campaign-page .blocking-slip{position:absolute;top:104px;right:-1%;width:82%;background:var(--dark);box-shadow:0 14px 26px #65170e3d;transform:rotate(7deg);border:1px solid #444;overflow:hidden}
#campaign-page .blocking-slip figcaption,#campaign-page .frame-slip figcaption{display:flex;justify-content:space-between;padding:11px 14px;font-size:9px;letter-spacing:.08em;color:#f4f1e9}
#campaign-page .blocking-slip img{width:100%;aspect-ratio:1.98;object-fit:cover}
#campaign-page .frame-slip{position:absolute;right:3%;top:245px;width:100%;background:var(--ink);box-shadow:0 18px 35px #65170e60;transform:rotate(-3deg);border:1px solid #3c3834;overflow:hidden}
#campaign-page .live-dot:before{content:'';display:inline-block;width:5px;height:5px;background:var(--red);border-radius:50%;margin-right:6px}
#campaign-page .cinema-crop{aspect-ratio:2.05;overflow:hidden;position:relative}
#campaign-page .cinema-crop img{width:100%;height:133.33%;object-fit:cover;position:absolute;top:-16.666%}
#campaign-page .frame-meta{font-size:8px;letter-spacing:.06em;color:#bfb9ad;padding:10px 14px;display:flex;justify-content:space-between}
#campaign-page .art-caption{position:absolute;top:100%;margin-top:10px;right:0;font-size:9px;text-align:right}
#campaign-page .hero-bottom{border-top:1px solid #201e1d55;min-height:68px;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px;font-weight:600;letter-spacing:.08em}
#campaign-page .hero-bottom a{text-decoration:none;display:flex;align-items:center;gap:30px}
#campaign-page .hero-bottom a span{font-size:20px}
#campaign-page .section{padding-block:90px}
#campaign-page .section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:45px;gap:32px}
#campaign-page .section-heading h2,#campaign-page .start h2,#campaign-page .faq h2{font-size:64px;line-height:.98;margin-top:19px}
#campaign-page .section-heading>p{font-size:16px;line-height:1.5;max-width:290px;margin-bottom:3px}
#campaign-page .workflow{background:var(--dark);color:var(--paper)}
#campaign-page .workflow .eyebrow{color:#fa593e}
#campaign-page .workflow h2 span{color:#fa593e}
#campaign-page .workflow-grid{display:grid;grid-template-columns:31% 1fr;gap:48px;align-items:start}
#campaign-page .step{width:100%;display:grid;grid-template-columns:25px 1fr 20px;gap:12px;padding:24px 0;color:#bdb8af;background:transparent;text-align:left;border-top:1px solid #54514c}
#campaign-page .step-number{font-size:11px;padding-top:5px}
#campaign-page .step strong{font-weight:600;font-size:19px;letter-spacing:-.02em;display:block}
#campaign-page .step-copy{font-size:13px;line-height:1.55;display:block;max-width:235px;margin-top:12px}
#campaign-page .step-arrow{font-size:22px;opacity:0}
#campaign-page .step[aria-selected=true]{color:var(--paper);border-top-color:var(--red)}
#campaign-page .step[aria-selected=true] .step-number,#campaign-page .step[aria-selected=true] .step-arrow{color:#fa593e;opacity:1}
#campaign-page .step:hover strong{color:#fa593e}
#campaign-page .sample-note{font-size:10px;color:#aaa49a;letter-spacing:.06em;margin-top:25px;line-height:1.8}
#campaign-page .sample-note>span:first-child{margin-left:10px}
#campaign-page .sample-note>span:last-child{letter-spacing:0;font-size:12px}
#campaign-page .demo{border:1px solid #53514c;background:#161616;min-width:0;box-shadow:0 15px 35px #0002}
#campaign-page .demo-bar{display:flex;justify-content:space-between;gap:14px;font-size:9px;letter-spacing:.08em;padding:15px 18px;color:#c4bfb7}
#campaign-page .demo-bar i{background:var(--red);margin-right:7px}
#campaign-page .demo-panel{aspect-ratio:1.69;overflow:hidden}
#campaign-page .demo-panel>img{width:100%;height:100%;object-fit:contain}
#campaign-page .board-demo>img{object-fit:cover}
#campaign-page .demo-caption{font-size:11px;line-height:1.5;padding:16px 18px;display:flex;justify-content:space-between;gap:20px;border-top:1px solid #44413d;color:#c8c3ba}
#campaign-page .demo-caption>span:last-child{white-space:nowrap;color:#918b82;font-size:10px}
#campaign-page .script-demo{background:#dedbd4;padding:20px 8%;}
#campaign-page .script-demo article{position:relative;padding:35px 40px;background:#fffdfa;color:var(--ink);height:100%;font:13px/1.5 'Courier Prime',monospace;overflow:auto;scrollbar-width:none}
#campaign-page .script-demo article::-webkit-scrollbar{display:none}
#campaign-page .script-demo h3{font:700 13px/1.4 'Courier Prime',monospace;margin-bottom:20px}
#campaign-page .script-demo p{margin-bottom:18px}
#campaign-page .paper-page{position:absolute;right:25px;top:15px;color:#999;font-size:10px}
#campaign-page .creative-control{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:45px;border-top:1px solid #54514c;padding-top:25px;font-size:12px}
#campaign-page .creative-control>span:first-child{font-size:9px;letter-spacing:.08em;color:#a59f95}
#campaign-page .creative-control>span:not(:first-child):before{content:'+';color:#fa593e;margin-right:10px}
#campaign-page .start{border-block:1px solid var(--line);padding-block:75px;background:#e8e5dc}
#campaign-page .start-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:100px;align-items:center}
#campaign-page .start h2{font-size:60px}
#campaign-page .start p:not(.eyebrow){font-size:15px;line-height:1.65;margin-top:25px;max-width:420px;color:#58544d}
#campaign-page .offer{background:var(--paper);border:1px solid #c0bbb0;padding:28px 32px 22px}
#campaign-page .offer-top{display:flex;justify-content:space-between;gap:12px;font-size:9px;letter-spacing:.08em;border-bottom:1px solid var(--line);padding-bottom:17px}
#campaign-page .offer-number{display:flex;align-items:center;gap:21px;font-weight:750;font-size:100px;line-height:1;margin-top:22px;letter-spacing:-.05em}
#campaign-page .offer-number>span{font-size:22px;line-height:1.1;letter-spacing:-.025em;font-weight:650}
#campaign-page .start .offer>p{font-size:12px;margin-top:9px}
#campaign-page .offer .button{width:100%;margin-top:24px}
#campaign-page .pricing-link{font-size:11px;display:block;text-align:center;margin-top:18px;color:#605b52;text-underline-offset:4px}
#campaign-page .pricing-link>span{padding-left:9px}
#campaign-page .faq-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:90px}
#campaign-page .faq h2{font-size:48px}
#campaign-page .questions details{border-top:1px solid #c8c2b6}
#campaign-page .questions details:last-child{border-bottom:1px solid #c8c2b6}
#campaign-page .questions summary{font-size:16px;font-weight:550;line-height:1.4;display:flex;justify-content:space-between;align-items:center;gap:20px;cursor:pointer;list-style:none;padding:24px 0}
#campaign-page .questions summary::-webkit-details-marker{display:none}
#campaign-page .questions summary span{font-size:24px;font-weight:400;color:#8a8175}
#campaign-page .questions details[open] summary span{transform:rotate(45deg)}
#campaign-page .questions details>p{font-size:14px;line-height:1.7;color:#6a6358;max-width:540px;padding:0 25px 24px 0}
#campaign-page .closing{background:var(--red);padding-block:75px;position:relative;overflow:hidden}
#campaign-page .closing-inner{text-align:center;position:relative}
#campaign-page .closing h2{font-size:clamp(70px,9vw,130px);line-height:.92;margin:28px 0 33px}
#campaign-page .closing h2>span{color:var(--paper)}
#campaign-page .closing .button{min-width:290px}
#campaign-page .closing p:last-child{margin-top:14px;font-size:12px}
#campaign-page .site-footer{background:var(--ink);color:var(--paper);padding:30px 0}
#campaign-page .footer-inner{display:flex;align-items:center;justify-content:space-between;gap:25px}
#campaign-page .footer-inner>.brand{font-size:18px}
#campaign-page .footer-inner>span{font-size:8px;letter-spacing:.1em;color:#a19a8f}
#campaign-page .footer-inner>div{display:flex;gap:24px;font-size:11px;color:#b5ada2}
#campaign-page .footer-inner>div a{text-decoration:none}
#campaign-page .mobile-cta{display:none}
@media(min-width:1600px){
 #campaign-page .hero-grid{min-height:680px}
}
@media(max-width:1150px){
 #campaign-page .wrap{width:calc(100% - 64px)}
 #campaign-page .hero-grid{gap:20px;min-height:620px}
 #campaign-page .hero h1{font-size:6.5vw}
 #campaign-page .hero-art{padding-bottom:calc(277px + 54%)}
 #campaign-page .frame-slip{top:210px}
 #campaign-page .blocking-slip{top:120px}
 #campaign-page .art-caption{font-size:8px}
 #campaign-page .script-slip{height:290px;font-size:10px}
 #campaign-page .hero-description{font-size:20px}
 #campaign-page .hero-kit{max-width:420px}
 #campaign-page .workflow-grid{gap:30px;grid-template-columns:32% 1fr}
 #campaign-page .section-heading h2{font-size:56px}
 #campaign-page .start-grid,#campaign-page .faq-grid{gap:50px}
 #campaign-page .start h2{font-size:50px}
 #campaign-page .script-demo article{font-size:11px;padding:25px}
 #campaign-page .script-demo h3{font-size:11px}
 #campaign-page .script-demo p{margin-bottom:12px}
 #campaign-page .offer{padding:25px}
}
@media(max-width:800px){
 #campaign-page .wrap{width:calc(100% - 40px)}
 #campaign-page .nav{height:72px}
 #campaign-page .brand{font-size:19px}
 #campaign-page .brand img{width:29px}
 #campaign-page .nav-note{display:none}
 #campaign-page .hero-eyebrow{padding-top:23px;font-size:9px}
 #campaign-page .edition{display:none}
 #campaign-page .hero-grid{display:flex;flex-direction:column;align-items:stretch;padding:30px 0 36px;gap:25px;min-height:0}
 #campaign-page .hero h1{font-size:clamp(45px,12.2vw,86px);white-space:normal;line-height:1;letter-spacing:-.015em}
 #campaign-page .hero h1 span{white-space:nowrap}
 #campaign-page .hero-description{font-size:20px;margin-top:14px;max-width:none}
 #campaign-page .hero-kit{max-width:none;margin-top:14px}
 #campaign-page .hero .primary{margin-top:22px;min-height:54px;min-width:285px}
 #campaign-page .reassurance{font-size:12px}
 #campaign-page .watch-link{margin-top:14px}
 #campaign-page .hero-art{width:min(100%,530px);padding-bottom:calc(277px + min(50.5%,268px));margin:4px auto 0}
 #campaign-page .script-slip{top:0;width:54%;left:8%;height:275px}
 #campaign-page .blocking-slip{top:90px;right:3%;width:74%}
 #campaign-page .frame-slip{top:210px;width:93%;right:4%}
 #campaign-page .art-caption{left:0;right:0;text-align:center;font-size:9px}
 #campaign-page .hero-bottom{min-height:58px;font-size:11px;gap:10px}
 #campaign-page .hero-bottom>span{display:none}
 #campaign-page .hero-bottom>a{width:100%;justify-content:space-between}
 #campaign-page .section{padding-block:58px}
 #campaign-page .section-heading{display:block;margin-bottom:28px}
 #campaign-page .section-heading h2,#campaign-page .start h2{font-size:52px}
 #campaign-page .section-heading>p{font-size:14px;margin-top:20px}
 #campaign-page .eyebrow{font-size:9px}
 #campaign-page .workflow-grid{display:flex;flex-direction:column;gap:23px}
 #campaign-page .steps{width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:13px}
 #campaign-page .step{padding:15px 0 4px;display:block}
 #campaign-page .step-number{font-size:10px;display:block;margin-bottom:9px}
 #campaign-page .step strong{font-size:14px;line-height:1.3;max-width:100px}
 #campaign-page .step-copy,#campaign-page .step-arrow,#campaign-page .sample-note{display:none}
 #campaign-page .demo{width:100%}
 #campaign-page .demo-bar{font-size:7px;padding:12px}
 #campaign-page .demo-caption{font-size:10px;padding:12px;min-height:56px;align-items:center}
 #campaign-page .demo-caption>span:last-child{font-size:8px}
 #campaign-page .creative-control{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px;font-size:12px;padding-top:24px}
 #campaign-page .creative-control>span:first-child{grid-column:1/-1;font-size:8px}
 #campaign-page .script-demo{padding:10px 6%}
 #campaign-page .script-demo article{padding:20px;font-size:9px}
 #campaign-page .script-demo h3{font-size:9px;margin-bottom:10px}
 #campaign-page .script-demo p{margin-bottom:8px}
 #campaign-page .paper-page{font-size:8px;top:7px}
 #campaign-page .start-grid,#campaign-page .faq-grid{display:grid;grid-template-columns:1fr;gap:34px}
 #campaign-page .start p:not(.eyebrow){font-size:14px;margin-top:21px}
 #campaign-page .offer{padding:25px}
 #campaign-page .offer-top{font-size:8px}
 #campaign-page .offer-number{font-size:100px}
 #campaign-page .start .offer>p{font-size:12px;margin-top:10px}
 #campaign-page .offer .button{margin-top:23px}
 #campaign-page .faq h2{font-size:44px}
 #campaign-page .questions summary{font-size:14px;padding:22px 0}
 #campaign-page .questions details>p{font-size:13px}
 #campaign-page .closing{padding-block:60px}
 #campaign-page .closing h2{font-size:clamp(44px,12.4vw,100px);margin-top:25px}
 #campaign-page .closing .eyebrow{font-size:8px}
 #campaign-page .closing .button{min-width:285px;min-height:54px}
 #campaign-page .footer-inner{flex-wrap:wrap;gap:25px}
 #campaign-page .footer-inner>span{order:3;flex-basis:100%;font-size:8px}
 #campaign-page .footer-inner>div{font-size:10px;gap:20px}
 #campaign-page .site-footer{padding-bottom:110px}
 #campaign-page .mobile-cta:not([hidden]){display:flex;position:fixed;bottom:0;left:0;right:0;z-index:20;background:var(--paper);color:var(--ink);border-top:1px solid #c2bbaf;box-shadow:0 -4px 18px #0001;padding:12px 20px max(12px,env(safe-area-inset-bottom));align-items:center;justify-content:space-between;gap:14px}
 #campaign-page .mobile-cta strong{display:block;font-size:11px;font-weight:600}
 #campaign-page .mobile-cta>div>span{display:block;font-size:10px;color:#6a645a;margin-top:5px}
 #campaign-page .mobile-cta .button{min-height:44px}
}
@media(max-width:430px){
 #campaign-page .hero h1{font-size:clamp(38px,11.8vw,53px)}
 #campaign-page .hero-art{padding-bottom:calc(225px + 52%);margin-top:13px}
 #campaign-page .script-slip{width:54%;height:210px;padding:16px;font-size:8px;left:7%}
 #campaign-page .slip-index{font-size:6px;margin-bottom:12px}
 #campaign-page .script-slip h2{font-size:9px}
 #campaign-page .script-slip p{margin-top:8px}
 #campaign-page .blocking-slip{top:65px;width:75%;right:2%}
 #campaign-page .blocking-slip figcaption,#campaign-page .frame-slip figcaption{font-size:6px;padding:8px 10px}
 #campaign-page .frame-slip{top:158px;width:96%;right:2%}
 #campaign-page .frame-meta{font-size:6px;padding:8px 10px}
 #campaign-page .art-caption{font-size:8px}
 #campaign-page .hero-description{font-size:18px}
 #campaign-page .kit-list{font-size:14px;margin-left:-9px}
 #campaign-page .kit-list li{padding:0 9px}
 #campaign-page .hero .primary{min-width:0;width:100%}
 #campaign-page .reassurance{justify-content:center}
 #campaign-page .watch-link{margin-inline:auto}
 #campaign-page .hero-grid{gap:17px}
 #campaign-page .demo-bar{letter-spacing:.035em;font-size:6px}
 #campaign-page .demo-caption{font-size:9px;gap:12px}
 #campaign-page .script-demo article{font-size:8px;padding:16px 12px}
 #campaign-page .script-demo h3{font-size:8px}
 #campaign-page .script-demo p{margin-bottom:6px}
 #campaign-page .offer{min-width:0}
 #campaign-page .offer .button{font-size:13px;gap:12px;padding-inline:18px}
 #campaign-page .hero .button{font-size:15px}
}
@media(prefers-reduced-motion:reduce){
 #campaign-page *,#campaign-page *:before,#campaign-page *:after{transition:none!important;animation:none!important}
}
#campaign-page .workflow .eyebrow{color:#e5dfd5;font-size:13px;letter-spacing:.08em}
#campaign-page .workflow h2 span{color:var(--paper)}
#campaign-page .step-number{font-size:14px;font-weight:650}
#campaign-page .step[aria-selected=true] .step-number,#campaign-page .step[aria-selected=true] .step-arrow,#campaign-page .step:hover strong{color:#fffdfa}
#campaign-page .step[aria-selected=true]{border-top:3px solid #f2f0e9}
#campaign-page .step-copy{font-size:15px;line-height:1.6;color:#d3cec5}
#campaign-page .sample-note,#campaign-page .sample-note>span:last-child{font-size:13px;color:#d3cec5}
#campaign-page .demo-bar{font-size:12px;color:#eee9df;line-height:1.5;flex-wrap:wrap;align-items:center}
/* The script's pause control lives in the demo bar, next to what it controls,
   not between Back and Next. */
#campaign-page .demo-bar button{background:transparent;color:#eee9df;font-size:11px;letter-spacing:.08em;text-transform:uppercase;line-height:1.5;padding:0;min-height:0;border-bottom:1px solid #8a847a}
#campaign-page .demo-bar button:hover{color:#fffdfa;border-bottom-color:#fffdfa}
#campaign-page .demo-caption,#campaign-page .demo-caption>span:last-child{font-size:13px;color:#e5dfd5}
#campaign-page .creative-control>span:first-child{font-size:12px;color:#d3cec5}
#campaign-page .creative-control>span:not(:first-child):before{color:#f2f0e9}
#campaign-page .script-demo article{font-size:14px;line-height:1.65;scroll-behavior:auto}
#campaign-page .script-demo h3{font-size:14px}
#campaign-page .walkthrough-detail{padding:26px 28px 22px;border-top:1px solid #514d47;background:#2d2b28}
#campaign-page .walkthrough-kicker{font-size:12px;letter-spacing:.08em;font-weight:650;color:#d9d3c9;margin-bottom:12px}
#campaign-page .walkthrough-detail h3{font-size:23px;line-height:1.25;letter-spacing:-.02em;color:#fffdfa;margin-bottom:12px}
#campaign-page .walkthrough-detail>p:not(.walkthrough-kicker){font-size:16px;line-height:1.6;color:#e0dbd2}
#campaign-page .walkthrough-detail .walkthrough-result{margin-top:16px;padding-top:15px;border-top:1px solid #555049}
#campaign-page .walkthrough-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:16px 24px;border-top:1px solid #514d47}
#campaign-page .walkthrough-nav button{min-height:44px;padding:10px 12px;background:transparent;color:#f2f0e9;font-size:14px;border-radius:3px}
#campaign-page .walkthrough-nav button:hover{background:#393632}
#campaign-page .walkthrough-nav button:disabled{opacity:.45}
#campaign-page .walkthrough-nav #cp-walkthrough-next{background:#f2f0e9;color:#201e1d;font-weight:650}
@media(max-width:800px){
 #campaign-page .workflow .eyebrow{font-size:12px;max-width:300px}
 #campaign-page .section-heading>p{font-size:16px;max-width:440px}
 #campaign-page .step-number{font-size:14px}
 #campaign-page .step strong{font-size:15px;max-width:none}
 #campaign-page .demo-panel{aspect-ratio:auto;height:300px}
 #campaign-page .demo-panel:not(.script-demo){height:auto;aspect-ratio:1.69}
 #campaign-page .demo-bar{font-size:11px}
 #campaign-page .demo-bar>span:last-child{display:none}
 #campaign-page .demo-caption,#campaign-page .demo-caption>span:last-child{font-size:12px}
 #campaign-page .script-demo article{font-size:13px;padding:24px 18px}
 #campaign-page .script-demo h3{font-size:13px}
 #campaign-page .script-demo p{margin-bottom:16px}
 #campaign-page .paper-page{font-size:11px}
 #campaign-page .walkthrough-detail{padding:22px 18px}
 #campaign-page .walkthrough-detail h3{font-size:22px}
 #campaign-page .walkthrough-detail>p:not(.walkthrough-kicker){font-size:15px}
 #campaign-page .walkthrough-nav{padding:12px;gap:4px}
 #campaign-page .walkthrough-nav button{font-size:13px}
 #campaign-page .walkthrough-nav #cp-walkthrough-next{flex:1;margin-left:8px}
 #campaign-page .creative-control>span:first-child{font-size:12px}
}
@media(min-width:1000px){
 #campaign-page .workflow{padding:36px 0;scroll-margin-top:0}
 #campaign-page .workflow>.wrap{width:calc(100% - 64px);max-width:1740px}
 #campaign-page .workflow .section-heading{margin-bottom:26px;align-items:center;gap:28px}
 #campaign-page .workflow .section-heading h2{font-size:clamp(38px,3.4vw,56px);margin-top:12px;display:flex;gap:.22em;flex-wrap:wrap}
 #campaign-page .workflow .section-heading h2 br{display:none}
 #campaign-page .workflow .section-heading>p{max-width:360px;font-size:15px}
 #campaign-page .workflow-grid{grid-template-columns:210px minmax(0,1fr);gap:28px}
 #campaign-page .step{padding:18px 0;grid-template-columns:22px 1fr 12px;gap:8px}
 #campaign-page .step strong{font-size:18px}
 /* The detail panel on the right carries each step's copy; the list keeps the titles. */
 #campaign-page .step-copy{display:none}
 #campaign-page .sample-note{display:none}
 #campaign-page .demo{display:grid;grid-template-columns:minmax(0,1fr) 270px;grid-template-rows:auto minmax(400px,52vh) auto}
 #campaign-page .demo-bar{grid-column:1;grid-row:1;padding:12px 16px}
 #campaign-page .demo-panel{grid-column:1;grid-row:2;aspect-ratio:auto;height:100%;min-height:0}
 #campaign-page .demo-caption{grid-column:1;grid-row:3;padding:12px 16px}
 #campaign-page .walkthrough-detail{grid-column:2;grid-row:1/3;border-top:0;border-left:1px solid #514d47;padding:24px;display:flex;flex-direction:column;justify-content:center}
 #campaign-page .walkthrough-detail h3{font-size:22px}
 #campaign-page .walkthrough-detail>p:not(.walkthrough-kicker){font-size:15px;line-height:1.5}
 #campaign-page .walkthrough-nav{grid-column:2;grid-row:3;border-left:1px solid #514d47;padding:10px 14px;gap:4px}
 #campaign-page .walkthrough-nav button{font-size:13px;padding:8px}
 #campaign-page .walkthrough-nav #cp-walkthrough-next{width:100%}
 #campaign-page .creative-control{margin-top:22px;padding-top:18px}
}
#campaign-page .start{padding:64px 0;background:#dcd8ce}
#campaign-page .start-grid{grid-template-columns:1.3fr 1fr;gap:0;align-items:stretch;border:1px solid #bfb8ac}
#campaign-page .start-scene{position:relative;min-height:500px;isolation:isolate;overflow:hidden;background:#111c1f;color:#fffdfa}
#campaign-page .start-scene>img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:57% center;z-index:-2}
#campaign-page .start-scene:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#071014f5 0%,#071014a8 38%,#07101408 85%);z-index:-1}
#campaign-page .start-scene-copy{position:absolute;left:36px;right:30px;bottom:66px}
#campaign-page .start-scene .eyebrow{font-size:13px}
#campaign-page .start-scene h2{font-size:clamp(42px,4.2vw,64px);margin-top:16px}
#campaign-page .start .start-scene p:not(.eyebrow){color:#f2f0e9;font-size:17px;margin-top:18px}
#campaign-page .scene-credit{position:absolute;bottom:24px;left:36px;font-size:11px;letter-spacing:.08em;color:#e0e7e5}
#campaign-page .start .offer{border:0;padding:40px;display:flex;flex-direction:column;justify-content:center}
#campaign-page .offer-top{font-size:12px}
#campaign-page .start .offer>p{font-size:16px;line-height:1.6;margin-top:18px}
#campaign-page .offer-points{display:grid;gap:12px;margin-top:22px;font-size:14px;color:#48443d}
#campaign-page .pricing-link{font-size:13px}
@media(max-width:1099px){
 #campaign-page .start .offer{padding:28px}
}
@media(max-width:800px){
 #campaign-page .start-grid{grid-template-columns:1fr;gap:0}
 #campaign-page .start-scene{min-height:390px}
 #campaign-page .start-scene-copy{left:24px;bottom:58px;right:24px}
 #campaign-page .scene-credit{left:24px;font-size:10px}
 #campaign-page .start-scene h2{font-size:46px}
 #campaign-page .start .offer{padding:28px 24px}
 #campaign-page .offer-top{font-size:11px}
}
/* The other modules, named once between the walkthrough and the offer: the
   page sells the storyboard, and this says the same project carries the rest.
   Copy mirrors the homepage's feature cards (no Treatment: the app has no
   such tab any more). Text only, by the owner's earlier call against a gallery. */
#campaign-page .modules{background:var(--paper)}
#campaign-page .modules-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:90px;align-items:start}
#campaign-page .modules h2{font-size:48px;line-height:.98;margin-top:19px}
#campaign-page .modules-grid>div>p:not(.eyebrow){font-size:16px;line-height:1.6;color:var(--muted);max-width:360px;margin-top:22px}
#campaign-page .module-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:40px;border-top:1px solid #c8c2b6}
#campaign-page .module-list li{padding:20px 0;border-bottom:1px solid #c8c2b6}
#campaign-page .module-list strong{display:block;font-size:17px;font-weight:600;letter-spacing:-.02em}
#campaign-page .module-list span{display:block;font-size:14px;line-height:1.55;color:#6a6358;margin-top:6px}
@media(max-width:1150px){
 #campaign-page .modules-grid{gap:50px}
}
@media(max-width:800px){
 #campaign-page .modules-grid{grid-template-columns:1fr;gap:34px}
 #campaign-page .modules h2{font-size:44px}
 #campaign-page .module-list{grid-template-columns:1fr}
 #campaign-page .module-list li{padding:16px 0}
}