/* Buyer's and seller's guides: the blocks under the title (Pascal, 2026-09-30).
   Order is now: title, the short version, the contents, then one "about me" card.
   Each has its own look so they no longer read as one flat run of white boxes:
   - the short version: the lead card, Cinzel plum heading, check marks
   - the contents: numbered rows on the soft amethyst tint
   - about me: a quieter card, photo, bio, and the reviews strip as its footer
   Loaded after pwc-ui.css, so it wins without fighting the guides' own sheets. */

/* ---- the short version ---- */
html body div.site .tldr{background:#fff !important;border:1px solid #EAE2F0 !important;border-radius:26px !important;
  padding:34px clamp(20px,4vw,40px) 30px !important;margin-top:30px !important;
  box-shadow:0 26px 54px -38px rgba(51,32,74,.45) !important;position:relative;overflow:hidden}
html body div.site .tldr::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:#563B79}
html body div.site .tldr h2{font-family:'Cinzel',Georgia,serif !important;font-size:clamp(24px,3.2vw,30px) !important;
  font-weight:600 !important;letter-spacing:.03em !important;text-transform:none !important;color:#43285A !important;
  margin:0 0 6px !important;line-height:1.15}
html body div.site .tldr .tldrlead{font-size:15px !important;color:#6E657E !important;margin:0 0 22px !important}
html body div.site .tldr ul{list-style:none !important;padding:0 !important;margin:0 !important;display:grid;gap:4px}
html body div.site .tldr li{position:relative;padding:12px 0 12px 42px !important;margin:0 !important;
  border-top:1px solid #F0EAF5;font-size:16.5px !important;line-height:1.6 !important}
html body div.site .tldr li:first-child{border-top:0}
html body div.site .tldr li::before{content:"";position:absolute;left:0;top:15px;width:26px;height:26px;border-radius:50%;
  background:#F1EAF7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23563B79' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/13px no-repeat}
html body div.site .tldr li::marker{content:none}

/* ---- the contents ---- */
html body div.site .toc{background:#F3EEF8 !important;border:1px solid #E4DAF0 !important;border-radius:26px !important;
  padding:30px clamp(20px,4vw,40px) 26px !important;margin-top:22px !important;box-shadow:none !important}
html body div.site .toc h2{font-family:'Cinzel',Georgia,serif !important;font-size:clamp(20px,2.6vw,24px) !important;
  font-weight:600 !important;letter-spacing:.03em !important;text-transform:none !important;color:#43285A !important;margin:0 0 16px !important}
html body div.site .toc ol{columns:auto !important;display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 28px;padding:0 !important;margin:0 !important;list-style:none !important;counter-reset:toc}
html body div.site .toc li{counter-increment:toc;margin:0 !important;border-bottom:1px solid #E4DAF0}
html body div.site .toc li a{display:flex !important;align-items:center;gap:14px;padding:11px 2px !important;font-size:16px !important;
  color:#43285A !important;font-weight:500 !important;text-decoration:none !important;background:none !important}
html body div.site .toc li a::before{content:counter(toc);flex:none;width:30px;height:30px;border-radius:50%;background:#fff;
  border:1px solid #DCCFE8;color:#563B79;font:600 13px/28px 'Jost',sans-serif;text-align:center}
html body div.site .toc li a:hover{color:#7E3A8C !important}
html body div.site .toc li a:hover::before{background:#33204A;border-color:#33204A;color:#fff}
@media (max-width:640px){html body div.site .toc ol{grid-template-columns:1fr}}

/* ---- about me: the bio, with the reviews strip as its footer ---- */
html body div.site .me26{margin-top:22px;background:#FBF8F3;border:1px solid #EAE2F0;border-radius:26px;
  padding:26px clamp(20px,4vw,36px) 0;overflow:hidden}
html body div.site .me26eb{margin:0 0 14px;font:600 12px/1.2 'Jost',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#563B79}
html body div.site .me26 .bio{display:flex !important;flex-direction:row !important;align-items:flex-start !important;text-align:left !important;
  gap:22px;background:none !important;border:0 !important;box-shadow:none !important;padding:0 !important;margin:0 !important}
html body div.site .me26 .bio .face{width:96px;height:96px;border-radius:50%;border:3px solid #fff;
  box-shadow:0 10px 24px -14px rgba(51,32,74,.6)}
html body div.site .me26 .bioname{font-family:'Cinzel',Georgia,serif !important;font-size:20px !important;color:#43285A !important}
html body div.site .me26 .bio p{font-size:15px !important;line-height:1.6 !important}
html body div.site .me26 .proof{margin:22px calc(-1 * clamp(20px,4vw,36px)) 0 !important;border:0 !important;border-top:1px solid #EAE2F0 !important;
  border-radius:0 !important;background:#fff !important;box-shadow:none !important;padding:16px 20px !important;justify-content:center}
@media (max-width:560px){
  html body div.site .me26 .bio{flex-direction:column !important;align-items:center !important;text-align:center !important}
  html body div.site .me26eb{text-align:center}
}
@media print{html body div.site .tldr,html body div.site .me26{box-shadow:none !important}}
