/* Outlast funnel v2 (checkout + upgrade pages). Only colours already defined in outlast.css. */
.fv .fvtick{background:var(--lime);color:var(--ink);font-weight:900;font-size:13px;letter-spacing:1px;text-transform:uppercase;text-align:center;padding:7px 12px;overflow:hidden;white-space:nowrap}
.fv .fvtick span{display:inline-block}
.fv .fvtick i{font-style:normal;opacity:.55;margin:0 10px}
.fv .fvtick .short{display:none}
.fv .nav .wrap{height:56px}
.fv .progress .wrap{padding:8px 20px;flex-wrap:nowrap;gap:4px}
.fv .progress span{padding:3px 10px;white-space:nowrap}
.fv .token{background:none;color:inherit;padding:0}

/* ---------- checkout ---------- */
.ck{padding:22px 0 48px}
.ckgrid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:28px;align-items:start}
.ckgrid>*{min-width:0}
.fv .row2>*{min-width:0}
.fv .ordertable .tot span{color:#C9CDD3!important}
.ckorder{background:var(--ink);color:var(--white);border-radius:18px;padding:18px 20px;margin-bottom:16px}
.ckline{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.ckline b{font-size:19px}
.ckline .what{display:block;color:#C9CDD3;font-size:15px;margin-top:3px}
.ckprice{text-align:right;white-space:nowrap}
.ckprice b{font-size:26px;color:var(--lime)}
.ckprice s{display:block;color:#9BA0A8;font-size:15px}
.fvthumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}
.fvthumbs button{padding:0;border:0;background:none;cursor:zoom-in;line-height:0;border-radius:8px;overflow:hidden}
.fvthumbs img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:8px;border:2px solid #333840}
.ckorder .note{font-size:13px;color:#9BA0A8;margin-top:8px}
.ckorder .note b{color:var(--white);font-size:13px}
.fv form.panel h3{font-size:20px;margin:24px 0 6px}
.fv form.panel h3:first-of-type{margin-top:0}
.fv .bumpbox{margin-top:12px}
.fv .bumpbox h4{font-size:18px}
.fv .bumpbox .opt{display:inline-block;font-size:12px;font-weight:900;letter-spacing:1px;text-transform:uppercase;color:var(--mute);margin-bottom:2px}
.ckpay{background:var(--paper);border:1px dashed #CFCBC1;border-radius:14px;padding:14px 16px;font-size:15px;color:var(--mute)}
.ckpay p{margin:0 0 6px}
.ckpay p:last-child{margin:0}
.ckpay b{color:var(--ink)}
.ckcards{font-size:13px;color:var(--mute);text-align:center;margin-top:10px}
.cknext{font-size:14px;color:var(--mute);margin-top:10px;border-top:1px solid var(--line);padding-top:10px}
.cknext b{color:var(--ink)}
.ck .summary ul{list-style:none;margin-top:14px;font-size:15px;color:var(--mute)}
.ck .summary li{padding:3px 0}

/* ---------- upgrade pages ---------- */
.upv{padding:22px 0 26px;background:var(--ink);color:var(--white)}
.upv .wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:34px;align-items:center}
.upv .paid{display:inline-block;font-size:13px;font-weight:700;color:var(--lime);margin-bottom:6px}
.upv .eyebrow{font-size:12px;padding:4px 10px}
.upv h1{font-size:40px;line-height:1.06;letter-spacing:-1px;margin:10px 0 8px}
.upv h1 em{font-style:normal;color:var(--lime)}
.upv .sub{font-size:18px;color:#C9CDD3}
.upbuy{background:var(--white);color:var(--ink);border-radius:16px;padding:16px 18px;margin-top:14px}
.upbuy .row{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.upbuy .row b{font-size:17px}
.upbuy .row .p{font-size:28px;font-weight:900}
.upbuy .row .p small{font-size:15px;color:var(--mute);font-weight:600}
.upbuy .cta{display:block;text-align:center;margin-top:10px;font-size:19px;padding:15px 18px}
.upbuy .terms{font-size:14px;color:var(--mute);margin-top:10px;text-align:center}
.upbuy .terms b{color:var(--ink)}
.upmedia{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.upmedia.n3{grid-template-columns:repeat(3,1fr)}
.upmedia.n4{grid-template-columns:repeat(4,1fr)}
.upmedia button{padding:0;border:0;background:none;cursor:zoom-in;line-height:0}
.upmedia img,.upmedia video{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:10px;border:2px solid #333840;background:#1E2127}
.upmedia video{aspect-ratio:9/16;height:auto}
.upmedia figure{margin:0;line-height:0}
.upmedia figcaption{line-height:1.3;font-size:12px;color:#9BA0A8;margin-top:5px}
.upv .cap{font-size:13px;color:#9BA0A8;margin-top:8px}
.upsec{padding:44px 0;border-top:1px solid var(--line)}
.upsec.white{background:var(--white)}
.upsec h2{font-size:32px;text-align:center}
.upsec .lead{text-align:center;margin:0 auto 24px;font-size:18px}
.kick2{display:block;text-align:center;font-size:13px;font-weight:900;letter-spacing:1.5px;text-transform:uppercase;color:var(--mute);margin-bottom:8px}
.upgal{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:920px;margin:0 auto}
.upgal{align-items:flex-start}
.upgal>*{flex:0 0 calc((100% - 30px)/4)}
.upgal figure video{max-height:420px}
.upgal button{padding:0;border:0;background:none;cursor:zoom-in;line-height:0}
.upgal img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:10px;border:1px solid var(--line)}
.upgal figure{margin:0}
.upgal video{width:100%;height:auto;aspect-ratio:9/16;object-fit:cover;border-radius:10px;background:var(--ink)}
.upgal figcaption{font-size:13px;color:var(--mute);margin-top:4px;text-align:center}
.upnote{text-align:center;font-size:14px;color:var(--mute);margin-top:12px}
.upcompare{max-width:820px;margin:0 auto}
.fv .offer{max-width:820px;margin:0 auto}
.fv .charge{max-width:820px;margin:14px auto 0;text-align:center}
.fv .decline{max-width:820px;margin:18px auto 0;display:block;text-align:center}
.fv .tiers{max-width:900px;margin:0 auto}
.upfinal{max-width:640px;margin:26px auto 0}
.phoneonly{display:none!important}
.upterms{font-size:14px;color:#C9CDD3;margin-top:12px}
.upterms b{color:var(--white)}
.upv .tiers{margin-top:14px;gap:14px;color:var(--ink)}
.upv .tier{padding:18px}
.upv .tier .cta{display:block;text-align:center;margin:10px 0 12px;padding:13px 14px;font-size:18px}
.upv .tier ul{font-size:15px}

.fvfaq{max-width:820px;margin:0 auto}
.fvfaq details{background:var(--white);border:1px solid var(--line);border-radius:12px;margin-bottom:8px}
.fvfaq summary{cursor:pointer;font-weight:700;font-size:17px;padding:14px 18px;list-style:none;display:flex;justify-content:space-between;gap:12px}
.fvfaq summary::-webkit-details-marker{display:none}
.fvfaq summary::after{content:"+";font-weight:900}
.fvfaq details[open] summary::after{content:"−"}
.fvfaq details p{padding:0 18px 14px;color:var(--mute);font-size:16px}
.fv .honest{max-width:820px;margin:0 auto 18px;background:var(--ink);color:#C9CDD3;border-radius:16px;padding:18px 22px;font-size:17px}
.fv .honest b{color:var(--lime)}
.fvsteps{max-width:820px;margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.fvsteps div{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.fvsteps b{display:block;font-size:17px;margin-bottom:4px}
.fvsteps span{display:inline-block;background:var(--lime);color:var(--ink);font-weight:900;font-size:12px;letter-spacing:1px;text-transform:uppercase;padding:2px 9px;border-radius:20px;margin-bottom:6px}
.fvsteps p{color:var(--mute);font-size:15px}

.fvlb{position:fixed;inset:0;z-index:90;background:rgba(20,22,26,.92);display:none;align-items:center;justify-content:center;padding:20px}
.fvlb.on{display:flex}
.fvlb img{max-width:min(560px,100%);max-height:88vh;border-radius:10px}
.fvlb button{position:absolute;top:14px;right:14px;background:var(--lime);color:var(--ink);border:0;font-weight:900;font-size:15px;padding:8px 14px;border-radius:8px;cursor:pointer}

@media (max-width:980px){
  .ckgrid{grid-template-columns:1fr}
  .upv .wrap{grid-template-columns:1fr;gap:14px}
  .phoneonly{display:grid!important}
  .deskonly{display:none}
}
@media (max-width:700px){
  .fv .fvtick .opt,.fv .fvtick .long{display:none}
  .fv .fvtick .short{display:inline-block}
  .fv .nav .qs{display:none}
  .fv .nav .wrap{height:50px}
  .fv .logo{font-size:24px}
  .fv .nav a{font-size:14px}
  .fv .progress{font-size:12px}
  .ck{padding:12px 0 36px}
  .ckorder{padding:14px;border-radius:14px;margin-bottom:12px}
  .ckline b{font-size:17px}
  .ckline .what{font-size:13px}
  .ckprice b{font-size:22px}
  .fvthumbs{gap:6px;margin-top:10px}
  .ckorder .note{display:none}
  .fv form.panel{padding:16px}
  .fv form.panel h3{font-size:18px;margin-top:20px}
  .fv .row2{grid-template-columns:1fr 1fr;gap:10px}
  .fv label{margin-top:10px;font-size:14px}
  .fv .bumpbox h4{font-size:15px}
  .fv .bumpbox p{font-size:14px;line-height:1.4}
  .fv .bumpbox{margin-top:8px;padding:12px;border-width:2px}
  .fv .bumpbox .bumpyes{gap:10px}
  .ckpay{padding:10px 12px;font-size:14px;line-height:1.4}
  .ckpay p{margin-bottom:4px}
  .ck .summary ul{display:none}
  .ck .summary{padding:14px}
  .fv .hint{font-size:13px}
  .fv form.panel input{padding:10px 12px}
  .fvthumbs img{aspect-ratio:1/1}
  .upv{padding:14px 0 18px}
  .upv h1{font-size:25px;margin:6px 0 6px}
  .upv .sub{font-size:15px;line-height:1.4}
  .upbuy{padding:12px 14px;margin-top:10px}
  .upbuy .row .p{font-size:24px}
  .upbuy .cta{font-size:17px;padding:13px 14px;margin-top:8px}
  .upbuy .terms{font-size:13px;margin-top:8px}
  .upmedia{gap:6px}
  .upmedia.n4{grid-template-columns:repeat(4,1fr)}
  .upmedia figcaption{display:none}
  .upv .cap{display:none}
  .upv .tiers{grid-template-columns:1fr 1fr;gap:8px}
  .upv .tier{padding:12px}
  .upv .tier h3{font-size:17px}
  .upv .tier .big{font-size:26px}
  .upv .tier .cta{font-size:15px;padding:11px 8px;margin:8px 0 10px}
  .upv .tier ul{font-size:13px}
  .upterms{font-size:13px;margin-top:8px}
  .upv .paid{font-size:12px}
  .upsec{padding:32px 0}
  .upsec h2{font-size:26px}
  .upsec .lead{font-size:16px;margin-bottom:16px}
  .upgal{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scroll-snap-type:x mandatory;padding-bottom:6px}
  .upgal>*{flex:0 0 44%;scroll-snap-align:start}
  .fvsteps{grid-template-columns:1fr}
  .fvfaq summary{font-size:16px;padding:12px 14px}
  .fv .honest{font-size:16px;padding:16px}
}

/* ---------- high-ticket pages ---------- */
.fv .brand .wrap{height:56px}
.htrc{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1000px;margin:0 auto}
.htrc .rcard{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:20px}
.htrc .fig{font-size:40px;font-weight:900;line-height:1}
.htrc h4{font-size:18px;margin:6px 0}
.htrc p{color:var(--mute);font-size:15px}
.htrc .cite{font-size:13px;margin-top:8px}
.htrc a{display:inline-block;margin-top:6px;font-weight:700;font-size:14px;color:var(--ink)}
.fv .ht-apply{scroll-margin-top:10px}
.fv section.htsec{padding:44px 0}
.fv .htsec .steps,.fv .htsec.steps{padding:44px 0}
.htbook{display:grid;grid-template-columns:1.2fr 1fr;gap:22px;align-items:start}
.htbook .act{display:block;text-align:center;margin-top:12px}
.htbook .alt{font-size:14px;color:var(--mute);margin-top:10px;text-align:center}
@media (max-width:980px){.htrc{grid-template-columns:1fr}.htbook{grid-template-columns:1fr}}
@media (max-width:700px){.fv .brand small{display:none}.fv .brand .wrap{height:50px}.htrc .fig{font-size:32px}.fv section.htsec{padding:30px 0}}
.htrc .cite{color:var(--mute)}
.fv .strip-note{color:var(--mute)}
.fv .tier.best::before{content:"40 ads + 3 videos a month"}

/* 25 Sep 2026 · short phones (iPhone SE and similar): the YES button must fit on screen one.
   The ticker already says "Upgrade N of 3", so the step bar can go here. */
@media (max-width:480px) and (max-height:700px){
  .fv .progress{display:none}
  .fv .upmedia.phoneonly img{max-height:96px;object-fit:cover}
}

/* 25 Sep 2026 · upsell tops matched (body.up = upsell1-3 + downsell1).
   Wider layout, same hero pattern: headline -> white buy card -> copy, video on the right. */
body.up .wrap{max-width:1320px}
body.up .upv{padding:28px 0 32px}
body.up .upv .wrap{grid-template-columns:1.05fr 1fr;gap:52px;align-items:center}
body.up .upv h1{font-size:46px}
body.up .upv .deskonly{max-width:600px;justify-self:end;width:100%}
.upbuy.duo{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
.upbuy.duo .plan{position:relative;display:flex;flex-direction:column;border:2px solid var(--line);border-radius:12px;padding:12px 14px}
.upbuy.duo .plan.best{border:3px solid var(--ink)}
.upbuy.duo .tag{position:absolute;top:-11px;right:12px;background:var(--lime);color:var(--ink);font-weight:900;font-size:12px;padding:2px 9px;border-radius:20px}
.upbuy.duo .row b{font-size:20px}
.upbuy.duo .gist{font-size:14px;color:var(--mute);margin:2px 0 10px}
.upbuy.duo .cta{margin-top:auto;font-size:18px;padding:13px 10px}
.upbuy.duo .terms{grid-column:1/-1;margin-top:0}
@media (max-width:980px){
  body.up .upv .deskonly{max-width:none;justify-self:stretch}
  /* 26 Sep: one column on phones/tablets. The body.up rule above out-ranked the
     .upv .wrap single-column rule, leaving upsell heroes squeezed into half the width. */
  body.up .upv .wrap{grid-template-columns:1fr;gap:14px}
}
@media (max-width:600px){
  body.up .upv h1{font-size:25px}
  body.up .upv{padding:14px 0 18px}
  .upv .eyebrow{letter-spacing:.6px;font-size:11px}
  .upbuy .row b{font-size:16px}
  .upbuy .row .p small{font-size:13px}
  .upbuy.duo{gap:10px 8px}
  .upbuy.duo .plan{padding:10px 9px}
  .upbuy.duo .row{flex-direction:column;align-items:flex-start;gap:0}
  .upbuy.duo .row b{font-size:16px}
  .upbuy.duo .row .p{font-size:22px}
  .upbuy.duo .gist{font-size:12px;line-height:1.3;margin:2px 0 8px}
  .upbuy.duo .cta{font-size:15px;padding:12px 4px}
  .upbuy.duo .tag{font-size:11px;right:8px}
}
.upbuy.duo .cta{align-self:stretch;width:100%;box-sizing:border-box}
body.up .upv .sub{max-width:none}
@media (max-width:600px){
  body.up .upv .olvid-pill{font-size:15px;padding-left:10px;padding-right:10px}
  .upbuy.duo .cta{font-size:14px;padding:12px 2px}
  .upbuy.duo .gist{margin-bottom:6px}
}
@media (max-width:600px){
  .upbuy.duo{padding:12px 10px}
  .upbuy.duo .cta{white-space:nowrap;letter-spacing:-.2px}
}
