← Back to catalog
Sidebar Live

Sidebar Option A — Default (CTA → Trust) v2026-06-15c

White-card default sidebar: CTA card followed by the trust card. No form. Replaces the old dark-gradient + modular-add-on model.

Source skill: sa-sidebar-option-a · Updated 2026-06-15 16:50:13

Edit

Live preview

Open ↗

When to use

Sitewide default sidebar on any page or post that doesn't need a lead-capture form. Use when a clean two-card column (Call Now CTA + trust list) is enough.

Rules & constraints

Live reference

https://aguiarinjurylawyers.com/

Deployment notes

Two font variants. Poppins (default, CTA headline 22px) shown in the HTML field. Serif variant (Georgia/Times, CTA headline 19px) is in the source skill (sa-sidebar-option-a) references. Production blocks: blocks/option-a-poppins.html and blocks/option-a-serif.html. WordPress-deployable, scoped CSS, no global leak. Source skill: sa-sidebar-option-a. 2026-06-15c: Repaired sidebar trust-list marker overlap guardrails in the registry source.

HTML

<!-- wp:html -->
<style>
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;600;700&display=swap');
.sa-sidebar-opta-poppins *{box-sizing:border-box;font-family:Poppins, sans-serif;}
.sa-sidebar-opta-poppins{display:flex;flex-direction:column;gap:20px;}

/* CTA card (white, navy text) */
.sa-sidebar-opta-poppins .sa-sidebar-cta{background:#fff;border:1px solid rgba(11,33,45,.12);border-radius:8px;padding:28px 22px;text-align:center;}
.sa-sidebar-opta-poppins .sa-sidebar-cta h3{font-weight:700;font-size:22px;letter-spacing:normal;line-height:1.25;color:#0B212D;margin:0 0 12px;text-align:center;text-transform:uppercase;}
.sa-sidebar-opta-poppins .sa-sidebar-cta h3 .cta-l2{display:block;color:#0B212D !important;}
.sa-sidebar-opta-poppins .sa-sidebar-cta p{font-weight:600;font-size:16px;line-height:1.5;color:#0B212D;margin:0 0 18px;text-align:center;}
.sa-sidebar-opta-poppins .sa-sidebar-cta a{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;background:transparent;color:#0B212D;font-size:18px;font-weight:700;padding:11px 16px;border-radius:6px;text-decoration:none;border:1.5px solid #0B212D;}

/* Trust card (white, orange left border) */
.sa-sidebar-opta-poppins .sa-sidebar-trust{background:#fff;border:1px solid rgba(11,33,45,.12);border-left:4px solid #D97706;border-radius:0 8px 8px 0;padding:22px;}
.sa-sidebar-opta-poppins .sa-sidebar-trust h4{font-weight:700;font-size:18px;line-height:1.3;color:#0B212D;margin:0 0 14px;text-align:center;text-transform:uppercase;}
.sa-sidebar-opta-poppins .sa-sidebar-trust ul{list-style:none;margin:0;padding:0;}
.sa-sidebar.sa-sidebar-opta-poppins .sa-sidebar-trust li{display:grid !important;grid-template-columns:24px minmax(0,1fr) !important;column-gap:10px !important;align-items:start !important;font-weight:500;font-size:16px;line-height:1.4;color:#0B212D;padding:10px 0 !important;border-bottom:1px solid rgba(11,33,45,.08);}
.sa-sidebar-opta-poppins .sa-sidebar-trust li:last-child{border-bottom:0;}
.sa-sidebar.sa-sidebar-opta-poppins .sa-sidebar-trust li .ck{position:static !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;width:24px !important;min-width:24px !important;color:#D97706 !important;font-weight:700;line-height:1.4 !important;}

/* Approved custom intake form (maps to Litify) */
.sa-sidebar-opta-poppins .sa-custom-contact-intake-form{background:#fff;border:1px solid rgba(11,33,45,.12);border-radius:8px;padding:24px 22px;}
.sa-sidebar-opta-poppins .sa-custom-contact-intake-form h4{font-weight:700;font-size:18px;color:#0B212D;margin:0 0 16px;text-align:center;text-transform:uppercase;}
.sa-sidebar-opta-poppins .sa-custom-contact-intake-form label{display:block;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;color:#0B212D;margin:0 0 5px;}
.sa-sidebar-opta-poppins .sa-custom-contact-intake-form .fld,.sa-sidebar-opta-poppins .sa-custom-contact-intake-form input,.sa-sidebar-opta-poppins .sa-custom-contact-intake-form select{width:100%;height:42px;border:2px solid #C7D4E3;border-radius:10px;background:#fff;margin:0 0 14px;padding:0 14px;font-size:14px;color:#0B212D;font-weight:500;font-family:inherit;}
.sa-sidebar-opta-poppins .sa-custom-contact-intake-form .consent{display:flex;align-items:flex-start;gap:8px;margin:0 0 16px;text-align:left;}
.sa-sidebar-opta-poppins .sa-custom-contact-intake-form .consent input{width:18px;height:18px;margin:2px 0 0;flex:none;}
.sa-sidebar-opta-poppins .sa-custom-contact-intake-form .consent span{font-size:12px;font-weight:500;color:#0B212D;line-height:1.4;}
.sa-sidebar-opta-poppins .sa-custom-contact-intake-form .submit{width:100%;height:46px;background:linear-gradient(0deg,#000 0%,#0B212D 100%);border-radius:8px;color:#fff;font-weight:700;font-size:16px;letter-spacing:0.6px;text-transform:uppercase;border:2px solid #0B212D;cursor:pointer;font-family:inherit;}

/* Video card (white, matches other cards) */
.sa-sidebar-opta-poppins .sa-sidebar-rvid{background:#fff;border:1px solid rgba(11,33,45,.12);border-radius:8px;padding:24px 22px;box-shadow:0 4px 14px rgba(0,0,0,0.06);}
.sa-sidebar-opta-poppins .sa-sidebar-rvid .rvid-thumb{position:relative;display:block;width:100%;aspect-ratio:1/1;border-radius:6px;overflow:hidden;background:#13303f;text-decoration:none;}
.sa-sidebar-opta-poppins .sa-sidebar-rvid .rvid-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.sa-sidebar-opta-poppins .sa-sidebar-rvid .rvid-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:68px;height:48px;border-radius:14px;background:#FF0000;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.35);transition:background .2s ease;} .sa-sidebar-opta-poppins .sa-sidebar-rvid .rvid-thumb:hover .rvid-play{background:#CC0000;}
.sa-sidebar-opta-poppins .sa-sidebar-rvid .rvid-play svg{width:30px;height:30px;}
.sa-sidebar-opta-poppins .sa-sidebar-rvid .rvid-title{font-weight:700;font-size:18px;line-height:1.3;color:#0B212D;text-align:center;margin:16px 0 6px;text-transform:uppercase;}
.sa-sidebar-opta-poppins .sa-sidebar-rvid .rvid-meta{font-weight:500;font-size:15px;color:#0B212D;opacity:.7;text-align:center;margin:0;}

/* Founder/partner card (white, Foundry orange top border) */
.sa-sidebar-opta-poppins .sa-partner-inner{background:#fff;border:1px solid rgba(11,33,45,.12);border-top:4px solid #D97706;border-radius:8px;padding:28px 22px;text-align:center;box-shadow:0 4px 14px rgba(0,0,0,0.06);}
.sa-sidebar-opta-poppins .sa-partner-headshot{width:90px;height:90px;border-radius:50%;overflow:hidden;margin:0 auto 14px;border:3px solid #D97706;}
.sa-sidebar-opta-poppins .sa-partner-headshot img{width:100%;height:100%;object-fit:cover;display:block;}
.sa-sidebar-opta-poppins .sa-partner-name{font-size:18px;font-weight:700;color:#0B212D;margin:0 0 2px;}
.sa-sidebar-opta-poppins .sa-partner-role{font-size:15px;font-weight:600;color:#D97706;text-transform:uppercase;letter-spacing:1.5px;margin:0 0 12px;}
.sa-sidebar-opta-poppins .sa-partner-area{font-size:14px;color:#0B212D;font-weight:500;line-height:1.45;margin:0 auto 18px;max-width:200px;}
.sa-sidebar-opta-poppins .sa-partner-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;background:transparent;color:#0B212D;font-weight:700;font-size:18px;padding:11px 16px;border-radius:6px;text-decoration:none;border:1.5px solid #0B212D;}
</style>
<aside class="sa-sidebar sa-sidebar-opta-poppins">
  <div class="sa-sidebar-cta">
    <h3>Focus On Healing.<span class="cta-l2">We&rsquo;ll Handle The Rest.</span></h3>
    <p>Get Back To Living Your Best Life</p>
    <a href="tel:5028888888"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" style="width:18px;height:18px;fill:#D97706;vertical-align:middle;"><path d="M6.62 10.79a15.053 15.053 0 006.59 6.59l2.2-2.2a1.003 1.003 0 011.01-.24c1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.1.31.03.66-.25 1.01l-2.2 2.2z"/></svg> CALL NOW</a>
  </div>
  <aside class="sa-sidebar-trust">
    <h4>Why Clients Choose<br>Sam Aguiar</h4>
    <ul>
      <li><span class="ck">&#10003;</span>Bigger Share Guarantee&reg;</li>
      <li><span class="ck">&#10003;</span>Forbes Best-In-State<br>(1 Of 16 Nationwide In PI)</li>
      <li><span class="ck">&#10003;</span>Average Settlement Timeline Under 7 Months</li>
      <li><span class="ck">&#10003;</span>Camera Database Access</li>
      <li><span class="ck">&#10003;</span>$0 Out-Of-Pocket Forever</li>
      <li><span class="ck">&#10003;</span>No Increased Charges For Litigation</li>
      <li><span class="ck">&#10003;</span>Smaller Caseloads</li>
      <li><span class="ck">&#10003;</span>More Personal Attention</li>
      <li><span class="ck">&#10003;</span>1,000+ Five-Star Google Reviews</li>
    </ul>
  </aside>
</aside>
<!-- /wp:html -->

CSS

No CSS on file yet. Edit this element to add it.