/* Conversion AI (redesign): two landing pages side by side near full width, as two browser windows. Four numbered
   differences are pinned on both; the chosen one is ringed in coral on both pages. No ribbon in the hero: the pages
   are the visual. The test plan follows as a document. */
.cv-hero{padding-bottom:var(--s9)}
.cv-grid{margin:var(--s8) auto 0;max-width:1600px;padding:0 var(--gut);display:grid;gap:var(--s6)}
.cv-pages{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);padding:var(--s6);border-radius:var(--r-stage);background:var(--cloud)}
.cv-pg{margin:0;display:grid;gap:12px;align-content:start}
.cv-pg figcaption{display:flex;align-items:baseline;gap:10px}
.cv-pg figcaption b{font-size:20px;letter-spacing:-.012em;color:var(--ink)}.cv-pg figcaption span{font-size:15.5px;color:var(--text)}
.cv-win{border-radius:14px;background:#fff;box-shadow:var(--sh-ui);overflow:hidden}
.cv-url{padding:10px 16px;border-bottom:1px solid var(--line);background:#F7FAFF;font-size:14px;color:var(--text)}
.lp{position:relative;height:790px;overflow:hidden;padding:26px 28px;display:flex;flex-direction:column;gap:16px}
.lp>*{flex-shrink:0}
.lp-nav{display:flex;gap:16px;font-size:14.5px;color:var(--text)}.lp-nav b{margin-right:auto;font-size:16px;color:var(--ink)}
.lp-banner{position:relative;height:130px;border-radius:12px;background:#F2F5FA;display:grid;place-items:center;font-size:20px;font-weight:700;color:var(--text)}
.lp-h{position:relative;font-size:clamp(24px,2.2vw,32px);line-height:1.12;letter-spacing:-.02em;font-weight:800;color:var(--ink)}
.lp-p{font-size:16px;line-height:1.55;color:var(--text)}
.lp-facts{position:relative;display:flex;flex-wrap:wrap;gap:8px}
.lp-facts span{padding:6px 12px;border-radius:6px;background:#F2F5FA;font-size:14.5px;font-weight:700;color:var(--ink)}
.lp-facts.a{display:grid;gap:4px}.lp-facts.a b{font-size:15px;color:var(--ink)}.lp-facts.a span{background:none;padding:0;font-weight:500;color:var(--text)}
.lp-top{display:grid;grid-template-columns:1.25fr .75fr;gap:20px;align-items:start}.lp-top>div:first-child{display:grid;gap:14px}
.lp-img{position:relative;border-radius:12px;height:300px}.lp-img img{width:100%;height:100%;object-fit:cover;border-radius:12px}
.lp-form{position:relative;display:grid;gap:10px;padding:18px;border-radius:12px;background:#F7FAFF;box-shadow:inset 0 0 0 1px var(--line)}
.lp-form b{font-size:16px;color:var(--ink)}
.ffg{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}
.ff{display:grid;gap:3px}.ff small{font-size:13px;font-weight:600;color:var(--ink)}.ff i{height:26px;border-radius:7px;background:#fff;box-shadow:inset 0 0 0 1.5px #C9D6EA}
.lp-form.b .ffg{grid-template-columns:1fr}.lp-form.b .ff i{height:40px}.lp-form.b .ff small{font-size:14.5px}
.lp-form em{font-style:normal;justify-self:start;padding:10px 16px;border-radius:9px;background:#0870E6;color:#fff;font-size:15px;font-weight:700}
/* pins and the marked difference */
.pin{position:absolute;z-index:2;top:-13px;right:-13px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--ink);font-size:14px;font-weight:800;font-style:normal;letter-spacing:0;line-height:1;box-shadow:0 0 0 2px var(--ma-coral),0 6px 14px -6px rgba(11,42,102,.5);transition:background-color .3s ease,color .3s ease}
[data-d]{transition:box-shadow .45s var(--out)}
.cv-grid[data-d=offer] .lp [data-d=offer],.cv-grid[data-d=facts] .lp [data-d=facts],.cv-grid[data-d=form] .lp [data-d=form],.cv-grid[data-d=proof] .lp [data-d=proof]{box-shadow:0 0 0 4px #fff,0 0 0 7px var(--ma-coral);border-radius:10px}
.cv-grid[data-d=offer] .pin[data-pin=offer],.cv-grid[data-d=facts] .pin[data-pin=facts],.cv-grid[data-d=form] .pin[data-pin=form],.cv-grid[data-d=proof] .pin[data-pin=proof]{background:var(--t-coral);color:#fff}
.cv-diffs{width:100%;display:grid;gap:12px}
.df-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.df{width:100%;height:100%;text-align:left;display:grid;grid-template-columns:30px 1fr;gap:6px 12px;align-content:start;padding:18px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line);transition:box-shadow .3s ease}
.df-n{grid-row:span 2;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:14px;font-weight:800;box-shadow:inset 0 0 0 2px var(--ma-coral);color:var(--ink)}
.df b{font-size:17px;line-height:1.3;color:var(--ink)}.df-t{font-size:15px;line-height:1.5;color:var(--text)}
.df[aria-pressed=true]{box-shadow:inset 0 0 0 2px var(--t-coral),var(--sh-ui)}
.df[aria-pressed=true] .df-n{background:var(--t-coral);color:#fff;box-shadow:none}
@media (hover:hover){.df[aria-pressed=false]:hover{box-shadow:inset 0 0 0 1.5px var(--sky)}}

/* the test plan */
.cv-plan-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--s7) var(--s9);align-items:center}
.cv-plan-copy{display:grid;gap:var(--s5)}
.cv-rules{display:grid}
.cv-rules li{display:grid;gap:4px;padding:16px 0;border-top:1px solid var(--line);font-size:16px;line-height:1.55;color:var(--text)}
.cv-rules b{font-size:18px;color:var(--ink)}
.cv-src{font-size:15px;color:var(--text)}
.cv-sheet{overflow:hidden}
.sh-dl{display:grid;padding:4px 26px}
.sh-dl div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:15px 0;border-top:1px solid var(--line)}
.sh-dl div:first-child{border-top:0}
.sh-dl dt{font-size:15px;font-weight:700;color:var(--deep)}.sh-dl dd{font-size:16.5px;line-height:1.55;color:var(--ink)}
.sh-res{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:18px 26px;background:#FFF0F2;font-size:16.5px;line-height:1.55;color:var(--ink)}
.sh-res b{color:var(--t-coral)}

@media (max-width:1100px){.df-list{grid-template-columns:1fr 1fr}.cv-plan-in{grid-template-columns:1fr}.lp{height:auto}}
@media (max-width:760px){
  .cv-grid{padding:0 12px}.cv-pages{grid-template-columns:1fr;padding:14px}
  .lp{padding:18px}.lp-top{grid-template-columns:1fr 110px}.lp-img{height:180px}.ffg{grid-template-columns:1fr}
  .df-list{grid-template-columns:1fr}
  .sh-dl div,.sh-res{grid-template-columns:1fr;gap:4px}.sh-dl{padding:4px 18px}.sh-res{padding:16px 18px}
}