/* StayPutPDF — layout v2 styles. Linked in <head> so the first paint already has the new layout;
   layout2.js links it again at the end of <head>, so it still wins over styles app.js adds later. */
/* ---------- tool tiles: flat, icon left (all widths from 641px) ---------- */
@media (min-width:641px){
  html body .ws-groups .ws-grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))!important;gap:12px!important}
  html body .ws-groups .ws-card{flex-direction:row!important;align-items:center!important;text-align:left!important;justify-content:flex-start!important;padding:12px 14px!important;min-height:72px!important;height:100%!important;gap:12px!important;border-radius:12px!important}
  html body .ws-groups .ws-card-top{width:auto!important;justify-content:flex-start!important;align-self:center!important}
  html body .ws-groups .ws-ic{width:40px!important;height:40px!important;border-radius:10px!important}
  html body .ws-groups .ws-ic svg{width:20px!important;height:20px!important}
  html body .ws-groups .ws-txt{align-items:flex-start!important;width:auto!important;padding-top:0!important}
  html body .ws-groups .ws-name{font-size:15px!important;white-space:normal!important}
  html body .ws-groups .ws-desc{font-size:13px!important;margin-top:2px!important;line-height:1.35!important}
  html body .ws-groups .ws-pill{top:-8px!important;right:10px!important}
  html body .ws-grp{margin-top:18px!important}
  html body .ws-gh{margin-bottom:10px!important}
}
@media (min-width:1200px){html body .ws-groups .ws-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important}}
.ws-pill.ws-pill-free{background:#FBEBD0!important;color:#7A4E0E!important}

/* ---------- home hero ---------- */
.ws-lead{margin:10px auto 0;max-width:760px;font-size:17px;line-height:1.5;color:#4A4F4B;text-align:center}
.ws-sc{position:relative}
/* scenario cards: white, coloured like their tool group (blue Organize/Send, coral Edit & Sign, purple Protect) */
html body .ws-sc.ws-sc-main{background:#fff!important;border:1.6px solid #0077B6!important}
.ws-sc-tile{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:#C3D8EC;color:#005A8C}
.ws-sc-edit .ws-sc-tile{background:#F3CDBA;color:#A8401F}
.ws-sc-prot .ws-sc-tile{background:#E2CAEB;color:#753891}
html body .ws-sc-edit .ws-sc-go{color:#8C3418!important}
html body .ws-sc-prot .ws-sc-go{color:#753891!important}
html body .ws-sc-edit:hover{border-color:#A8401F!important}
html body .ws-sc-prot:hover{border-color:#753891!important}
html body .ws-sc-prot .ws-free{background:#EFE3F5!important;color:#753891!important}
.ws-sc .ws-sc-go{margin-top:auto;padding-top:10px;font-size:14px!important;font-weight:600;color:#005A8C!important}
/* header: Upgrade is a quiet outline, so "Choose a PDF" stays the only filled blue button */
html body #upgradeNavBtn{background:#fff!important;color:#005A8C!important;border:1.5px solid #0077B6!important}
html body #upgradeNavBtn:hover{background:#EEF6FB!important}
.l2-myfiles{display:none;border:0;background:none;padding:0 4px;font:inherit;font-size:15px;color:#1B1F1C;cursor:pointer;white-space:nowrap;align-items:center;gap:6px}
.l2-myfiles:hover{color:#005A8C}
@media (min-width:1024px){html body:not(.l2-doc) .l2-myfiles.has{display:inline-flex;margin-right:6px}}
/* drop zone: "Try a sample PDF" under the button */
@media (min-width:1024px){
  html body.l2-home .l2-sample{order:4;font-size:14px;color:#5C635D;margin:-4px 0 0}
  .l2-sample button{border:0;background:none;padding:0;font:inherit;color:#005A8C;font-weight:600;cursor:pointer}
  .l2-sample button:hover{text-decoration:underline}
}
.l2-sample{display:none}
@media (min-width:1024px){html body.l2-home .l2-sample{display:block}}
.ws-trust{margin:16px auto 0;text-align:center;display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:4px 18px}
.ws-trust p{margin:0!important;font-size:14px!important;font-weight:400!important;color:#5C635D!important;display:inline!important}
.ws-trust p *{font-weight:400!important;color:inherit!important;font-size:14px!important}
.ws-trust .ws-promise svg{display:none!important}
.ws-trust a{color:#005A8C!important;text-decoration:none!important}
.ws-trust a:hover{text-decoration:underline!important}
.ws-trust .ws-openlink{display:inline!important;max-width:none!important}
.ws-trust .ws-promise > *{margin:0 3px!important}
.ws-trust .ws-openlink a{margin-left:5px!important}
html body.l2-home .ws-main{padding-top:0!important}
.l2-hdr-places{display:flex;gap:22px;align-items:center}
.l2-hdr-places button{border:0;background:none;padding:0;font:inherit;font-size:inherit;line-height:inherit;color:inherit;cursor:pointer;position:relative;white-space:nowrap}
@media (min-width:1024px) and (max-width:1279px){html body.l2-home .app-hdr .links a[href="/compare"],html body.l2-home .app-hdr .links a[href="/app"]{display:none!important}}
.l2-hdr-places .msg-badge{position:absolute;top:-8px;right:-14px}
@media (min-width:1024px){
  html body.l2-home .ws-side,html body.l2-home .ws-topbar{display:none!important}
  html body.l2-home .ws-page{grid-template-columns:minmax(0,1fr)!important}
  html body.l2-home .ws-page > *{grid-column:1 / -1!important}
  html body.l2-home .ws-home{max-width:1120px!important;width:auto!important;margin-left:auto!important;margin-right:auto!important;padding:48px 24px 0!important;box-sizing:content-box}
  html body.l2-home .ws-head{display:block!important;text-align:center}
  html body.l2-home .ws-head > .ws-search{display:none!important}
  html body.l2-home .ws-title{font-size:40px!important;margin:0!important;line-height:1.1!important;color:#1B1F1C!important;font-weight:700!important;letter-spacing:-.02em!important}
  html body.l2-home .ws-title .ws-off{display:block;white-space:normal;color:#5C635D;font-weight:600}
  html body.l2-home .ws-start,html body.l2-home .ws-start.has-chats{display:block!important;margin-top:24px!important}
  html body.l2-home .ws-lead{max-width:none;white-space:nowrap;font-size:17px}
  html body.l2-home .ws-start > .hm-send,html body.l2-home .ws-start > .hm-msg{display:none!important}
  html body.l2-home .ws-start > .ws-drop{height:auto!important;min-height:0!important;padding:30px 24px 26px!important;max-width:none!important;width:auto!important;margin:0!important;border:1.5px dashed #9CC5DE!important;box-shadow:none!important;gap:12px!important}
  html body.l2-home .ws-drop .ws-drop-t{display:none!important}
  html body.l2-home .ws-drop .ws-drop-s{order:3;font-size:14px!important;color:#5C635D!important;margin:0!important}
  html body.l2-home .ws-drop .ws-drop-b{order:2;background:#0077B6!important;margin-top:0!important}
  html body.l2-home .ws-drop:hover .ws-drop-b{background:#005A8C!important}
  html body.l2-home.l2-dragging .ws-drop{background:#EEF6FB!important;border-color:#0077B6!important}
  html body.l2-home .ws-start > .ws-drop::before,html body.l2-home .ws-start > .ws-drop::after{display:none!important;content:none!important}
  html body.l2-home .ws-drop-more{max-width:none!important;margin:22px 0 0!important;padding-top:0!important;border-top:0!important}
  html body.l2-home .ws-drop-or{margin-bottom:10px!important}
  html body.l2-home .ws-drop-more .ws-scen{grid-template-columns:1.25fr 1fr 1fr!important}
  html body.l2-home .ws-drop-more .ws-sc{padding:16px 18px!important}
  html body.l2-home .ws-groups{margin-top:34px!important;padding-top:8px;border-top:1px solid #EDE4D0}
}
.l2-places-hdr{display:none}

/* ---------- file open: the header becomes the file bar ---------- */
#l2Doc{display:none}
@media (min-width:1024px){
  html body.l2-doc .app-hdr .links,html body.l2-doc .app-hdr #quotaBadge,html body.l2-doc .app-hdr #upgradeNavBtn,html body.l2-doc .app-hdr .l2-hdr-places{display:none!important}
  html body.l2-doc #l2Doc{display:flex}
  html body.l2-doc .ws-topbar .sp-docbar{display:none!important}
  html body.l2-doc .ws-topbar .tb-places,html body.l2-doc .ws-topbar .tb-places + .tb-sep{display:none!important}
  html body.l2-doc .app-hdr .spacer{display:none!important}
  html body.l2-doc .app-hdr{z-index:45!important}
  /* with a file open: the logo mark only, so the file name leads; "to PDF" converters leave the rail */
  html body.l2-doc .app-hdr .logo-word{display:none!important}
  html body.l2-doc .ws-side .ws-nav[data-ws-tool="jpg"],html body.l2-doc .ws-side .ws-nav[data-ws-tool="word"],html body.l2-doc .ws-side .ws-nav[data-ws-tool="excel"]{display:none!important}
  /* Reader is for reading and search; Highlight, Note, Draw… live in Annotate */
  html body.sp-reader #spwRight #panel-annotate .an-seg{display:none!important}
  /* first step hint on the sample file: Redact glows until the person does anything */
  html body.l2-doc .ws-topbar .ws-nav.l2-hint{background:#FBE9E0!important;box-shadow:inset 0 0 0 1.5px #A8401F!important;border-radius:10px;animation:l2pulse 1.6s ease-in-out 3}
}
@keyframes l2pulse{50%{background:#F6D3C2}}
@media (prefers-reduced-motion:reduce){html body .ws-topbar .ws-nav.l2-hint{animation:none!important}}
@media (min-width:1024px) and (max-width:1279px){
  #l2Doc{margin-left:10px;gap:12px}
  #l2Doc .l2-f{max-width:200px}
  #l2Doc .l2-a button{padding:6px 7px;font-size:14px}
}
@media (min-width:1024px) and (max-width:1119px){
  #l2Doc .l2-save [data-l2d="save"] .l2-t2,#l2Doc .l2-send .l2-t2{display:none}
}
#l2Doc{flex:1 1 auto;align-items:center;gap:22px;min-width:0;margin-left:18px}
#l2Doc .l2-f{display:flex;flex-direction:column;min-width:0;max-width:340px}
#l2Doc .l2-n{font-weight:650;font-size:15.5px;color:#1B1F1C;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#l2Doc .l2-m{font-size:12.5px;color:#5C635D;white-space:nowrap}
#l2Doc .l2-a{display:flex;gap:4px;align-items:center}
#l2Doc .l2-a button{border:0;background:none;font:inherit;font-size:14.5px;color:#353A36;padding:8px 10px;border-radius:8px;cursor:pointer;white-space:nowrap}
#l2Doc .l2-a button:hover{background:#F3EDDF;color:#1B1F1C}
#l2Doc .l2-sp{flex:1}
#l2Doc .l2-r{display:flex;gap:10px;align-items:center;position:relative}
#l2Doc .l2-save{display:inline-flex;align-items:stretch;border:1px solid #CBD4DE;border-radius:10px;background:#fff;overflow:hidden}
#l2Doc .l2-save button{white-space:nowrap;border:0;background:none;font:inherit;font-size:14.5px;font-weight:600;color:#1B1F1C;padding:0 14px;height:40px;cursor:pointer;display:inline-flex;align-items:center;gap:7px}
#l2Doc .l2-save button:hover{background:#F5F8FB}
#l2Doc .l2-save .l2-more{border-left:1px solid #E1E7ED;padding:0 10px}
#l2Doc .l2-send{white-space:nowrap;flex:none;border:0;background:#0077B6;color:#fff;font:inherit;font-size:14.5px;font-weight:600;height:42px;padding:0 18px;border-radius:10px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
#l2Doc .l2-send:hover{background:#005A8C}
#l2Doc .l2-undo{width:40px;height:40px;padding:0!important;display:inline-flex;align-items:center;justify-content:center}
#l2Doc [hidden]{display:none!important}
#l2Doc .l2-menu{position:absolute;top:48px;right:150px;background:#fff;border:1px solid #E6DCC2;border-radius:12px;box-shadow:0 12px 30px rgba(40,30,10,.14);padding:6px;min-width:220px;z-index:60}
#l2Doc .l2-menu button{display:block;width:100%;text-align:left;border:0;background:none;font:inherit;font-size:14px;padding:9px 12px;border-radius:8px;cursor:pointer;color:#1B1F1C}
#l2Doc .l2-menu button:hover{background:#F3EDDF}

/* ---------- first paint: home pieces that app.js styles later, set here too so a reload doesn't jump ---------- */
@media (min-width:1024px){
  html body.l2-home .ws-start{align-items:start;gap:20px;margin:24px 0 30px}
  html body.l2-home #wsDrop{min-height:216px!important;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;background:#fff;border-radius:18px;text-align:center;cursor:pointer}
  html body.l2-home .ws-drop-b{display:flex;align-items:center;justify-content:center;padding:0 26px;height:46px;border-radius:10px;color:#fff;font-size:15px;font-weight:600;line-height:1.5}
  html body.l2-home .ws-drop-s{display:block;text-align:center}
  html body.l2-home .ws-drop-or{color:#6B6F69;font-size:12.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;text-align:center;line-height:1.5}
  html body.l2-home .ws-scen{margin:0}
  html body.l2-home .ws-sc b,html body.l2-home .ws-sc strong{font-size:15px;line-height:1.5}
}