/* ===== Article block styles (inc/blocks.php) =====
   Tokens use currentColor so blocks read well on the dark site (cream text) and in the light editor.
   Spacing on a 4/8 scale; square corners to match the site. */
:root{
  --elb-line:color-mix(in srgb,currentColor 16%,transparent);
  --elb-line-strong:color-mix(in srgb,currentColor 32%,transparent);
  --elb-tint:color-mix(in srgb,currentColor 5%,transparent);
  --elb-accent:#CFA984;
  --elb-s2:8px;--elb-s3:12px;--elb-s4:16px;--elb-s5:20px;--elb-s6:24px;--elb-s8:32px;--elb-s12:48px;
  --elb-ico-info:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5M12 8h.01'/%3E%3C/svg%3E");
  --elb-navy:#272155;--elb-deep:#1F1A47;--elb-cream:#F9E5C5;
}

/* consistent section rhythm: every H2 that follows a block gets the same top space */
.eli-content :is(figure,.wp-block-group,.wp-block-shortcode,ol,ul,.call__banner)+h2,
.eli-content :is(figure,.wp-block-group,ol,ul)+.wp-block-heading{margin-top:var(--elb-s12) !important}

/* ---------- Lead ---------- */
p.is-style-lead,.eli-content p.is-style-lead{max-width:60ch;font-size:20px !important;line-height:1.6 !important;opacity:1 !important;margin:0 0 var(--elb-s8) !important}
@media (min-width:992px){p.is-style-lead,.eli-content p.is-style-lead{font-size:22px !important;line-height:1.55 !important}}

/* ---------- Statement ---------- */
p.is-style-statement,.eli-content p.is-style-statement{max-width:62ch;margin:var(--elb-s8) 0 !important;padding:var(--elb-s6) 0 !important;border-top:1px solid var(--elb-line);border-bottom:1px solid var(--elb-line);font-size:20px !important;line-height:1.55 !important;opacity:1 !important}
@media (min-width:992px){p.is-style-statement,.eli-content p.is-style-statement{font-size:22px !important}}

/* ---------- shared list reset (theme adds diamond bullets via li::after and li margin-bottom) ---------- */
ul.is-style-checklist,ul.is-style-cards,ol.is-style-steps{list-style:none !important;padding:0 !important;margin:var(--elb-s2) 0 var(--elb-s8) !important}
:is(.is-style-checklist,.is-style-cards,.is-style-steps) li::after{display:none !important;content:none !important}
:is(.is-style-checklist,.is-style-cards,.is-style-steps) li{opacity:1 !important;overflow-wrap:anywhere}
.eli-content :is(ul.is-style-checklist,ul.is-style-panel,ul.is-style-diamonds,ul.is-style-ledger,ul.is-style-tiles,ul.is-style-cards,ol.is-style-steps) li,
.eli-content .wp-block-group:is(.is-style-pros,.is-style-cons) li{margin:0 !important}

/* ---------- Checklist (one column, compact, no dividers) ---------- */
ul.is-style-checklist{display:flex;flex-direction:column}
ul.is-style-checklist li{position:relative;margin:0 !important;padding:6px 0 6px 32px !important;font-size:16px !important;line-height:1.5 !important}
ul.is-style-checklist li::before{content:"";position:absolute;left:0;top:calc(6px + .75em - 10px);width:20px;height:20px;border-radius:50%;background:color-mix(in srgb,var(--elb-accent) 16%,transparent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23CFA984' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4.5 4.5L19 7'/%3E%3C/svg%3E") center/11px 11px no-repeat}

/* ---------- Cards grid → bento (first card featured) ---------- */
ul.is-style-cards{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--elb-s3)}
ul.is-style-cards li{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:var(--elb-s3);min-height:120px;margin:0 !important;padding:var(--elb-s6) !important;border:1px solid var(--elb-line);background:var(--elb-tint);font-size:17px !important;line-height:1.55 !important;transition:border-color .2s ease,background-color .2s ease}
ul.is-style-cards li::before{content:none !important;display:none !important}
ul.is-style-cards li:hover{border-color:var(--elb-line-strong)}
ul.is-style-cards li:first-child{background:color-mix(in srgb,var(--elb-accent) 14%,transparent);border-color:color-mix(in srgb,var(--elb-accent) 55%,transparent);font-size:20px !important;line-height:1.45 !important}
@media (min-width:768px){
  ul.is-style-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  ul.is-style-cards li:first-child{grid-column:1/-1}
  ul.is-style-cards li:last-child:nth-child(even){grid-column:1/-1}
}
@media (min-width:1200px){
  ul.is-style-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
  ul.is-style-cards li:first-child{grid-column:span 2;grid-row:span 2;font-size:22px !important;padding:var(--elb-s8) !important}
  ul.is-style-cards li:last-child:nth-child(n){grid-column:auto}
  /* featured card fills 4 cells → close the last row */
  ul.is-style-cards li:last-child:nth-child(3n+1){grid-column:1/-1}
  ul.is-style-cards li:last-child:nth-child(3n+2){grid-column:span 2}
}

/* ---------- Steps (ordered list) ---------- */
ol.is-style-steps{counter-reset:els}
ol.is-style-steps li{counter-increment:els;position:relative;margin:0 !important;padding:6px 0 var(--elb-s6) 56px !important;min-height:40px;line-height:1.55 !important}
ol.is-style-steps li::before{content:counter(els);position:absolute;left:0;top:0;width:36px;height:36px;box-sizing:border-box;border-radius:50%;border:1px solid var(--elb-accent);background:var(--elb-accent);color:#272155;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;z-index:1}
ol.is-style-steps li:not(:last-child){background:linear-gradient(var(--elb-line-strong),var(--elb-line-strong)) no-repeat 17.5px 36px/1px calc(100% - 36px)}
ol.is-style-steps li:last-child{padding-bottom:0 !important}

/* ---------- Key facts table ---------- */
figure.wp-block-table.is-style-facts{margin:var(--elb-s2) 0 var(--elb-s8) !important;overflow-x:auto;max-width:100%}
.is-style-facts table{width:100%;border-collapse:collapse !important;border:1px solid var(--elb-line) !important;border-top:2px solid var(--elb-accent) !important;font-variant-numeric:tabular-nums}
.is-style-facts td,.is-style-facts th{border:0 !important;border-top:1px solid var(--elb-line) !important;padding:var(--elb-s4) var(--elb-s6) !important;vertical-align:top;text-align:left;line-height:1.55 !important}
.is-style-facts tr:first-child td{border-top:0 !important}
.is-style-facts td:first-child{width:34%;background:var(--elb-tint);font-size:13px !important;line-height:1.5 !important;letter-spacing:.06em;text-transform:uppercase;opacity:.72;padding-top:calc(var(--elb-s4) + 3px) !important}
.is-style-facts td:last-child{font-size:16px !important}
.is-style-facts tr{transition:background-color .2s ease}
.is-style-facts tr:hover{background:var(--elb-tint)}
@media (max-width:767px){
  .eli-content figure.wp-block-table.is-style-facts,
  .eli-content .is-style-facts,
  .eli-content .is-style-facts table{display:block !important;width:100% !important;max-width:100% !important;overflow-x:hidden !important}
  .eli-content .is-style-facts tbody{display:block !important;width:100% !important}
  .eli-content .is-style-facts tr{display:block;width:100%}
  .eli-content .is-style-facts td,
  .eli-content .is-style-facts td:first-child{display:block !important;width:100% !important;min-width:0 !important;max-width:100% !important;box-sizing:border-box;border-right:0 !important;white-space:normal;overflow-wrap:anywhere}
}
@media (max-width:575px){
  .is-style-facts td{padding:var(--elb-s3) var(--elb-s4) !important}
  .is-style-facts td:first-child{padding-bottom:4px !important;background:transparent}
  .is-style-facts td+td{border-top:0 !important;padding-top:0 !important}
}

/* ---------- Note ---------- */
.wp-block-group.is-style-note{position:relative;margin:var(--elb-s2) 0 var(--elb-s8) !important;padding:var(--elb-s5) var(--elb-s6) var(--elb-s5) 60px !important;background:var(--elb-tint);border:1px solid var(--elb-line)}
.wp-block-group.is-style-note::before{content:"";position:absolute;left:var(--elb-s6);top:calc(var(--elb-s5) + 2px);width:22px;height:22px;background:var(--elb-accent);-webkit-mask:var(--elb-ico-info) center/contain no-repeat;mask:var(--elb-ico-info) center/contain no-repeat}
.wp-block-group.is-style-note p{margin:0 !important;opacity:1 !important;font-size:16px !important;line-height:1.6 !important}

/* ---------- Cream panel list (inverted) ---------- */
ul.is-style-panel{list-style:none !important;margin:var(--elb-s2) 0 var(--elb-s8) !important;padding:var(--elb-s4) var(--elb-s6) !important;background:var(--elb-cream);color:var(--elb-navy) !important;display:flex;flex-direction:column}
ul.is-style-panel li{position:relative;margin:0 !important;padding:6px 0 6px 30px !important;color:var(--elb-navy) !important;opacity:1 !important;font-size:16px !important;line-height:1.5 !important}
ul.is-style-panel li::after{display:none !important;content:none !important}
ul.is-style-panel li::before{content:"";position:absolute;left:0;top:calc(6px + .75em - 9px);width:18px;height:18px;border-radius:50%;background:var(--elb-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F9E5C5' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4.5 4.5L19 7'/%3E%3C/svg%3E") center/10px 10px no-repeat}
ul.is-style-panel a{color:var(--elb-navy) !important}

/* ---------- Tiles (wrapping row of compact boxes) ---------- */
ul.is-style-tiles{list-style:none !important;margin:var(--elb-s2) 0 var(--elb-s8) !important;padding:0 !important;display:flex;flex-wrap:wrap;align-items:flex-start;gap:var(--elb-s2)}
ul.is-style-tiles li{flex:0 1 auto;margin:0 !important;padding:10px var(--elb-s4) !important;border:1px solid var(--elb-line);border-top:2px solid var(--elb-accent);background:var(--elb-tint);opacity:1 !important;font-size:15px !important;line-height:1.5 !important;display:flex;align-items:center}
ul.is-style-tiles li::after{display:none !important;content:none !important}

/* ---------- Index (gold dash marker, one column) ---------- */
ul.is-style-ledger{list-style:none !important;margin:var(--elb-s2) 0 var(--elb-s8) !important;padding:0 !important;display:flex;flex-direction:column}
ul.is-style-ledger li{margin:0 !important;padding:6px 0 !important;opacity:1 !important;font-size:16px !important;line-height:1.5 !important;display:flex;flex-direction:row;align-items:baseline;gap:var(--elb-s3)}
ul.is-style-ledger li::before{content:"";flex:none;display:block;width:16px;height:2px;background:var(--elb-accent);transform:translateY(-4px)}
ul.is-style-ledger li::after{display:none !important;content:none !important}

/* ---------- Diamond list (brand diamond marker, used inside the dark panel) ---------- */
ul.is-style-diamonds{list-style:none !important;margin:0 !important;padding:0 !important;display:flex;flex-direction:column}
ul.is-style-diamonds li{position:relative;margin:0 !important;padding:6px 0 6px 24px !important;opacity:.85 !important;font-size:14px !important;line-height:1.5 !important}
@media (min-width:768px){ul.is-style-diamonds li{font-size:16px !important}}
@media (min-width:992px){ul.is-style-diamonds li{font-size:18px !important}}
ul.is-style-diamonds li::after{display:none !important;content:none !important}
ul.is-style-diamonds li::before{content:"";position:absolute;left:2px;top:calc(6px + .75em - 4px);width:8px;height:8px;background:var(--elb-accent);transform:rotate(45deg)}

/* ---------- Dark panel group (watermark of the brand mark) ---------- */
.wp-block-group.is-style-dark{position:relative;overflow:hidden;margin:var(--elb-s2) 0 var(--elb-s8) !important;padding:var(--elb-s6) !important;background:var(--elb-deep);color:var(--elb-cream);border:1px solid rgba(249,229,197,.14)}
.wp-block-group.is-style-dark::after{content:"";position:absolute;right:-60px;bottom:-50px;width:340px;height:244px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 520 296' fill='%23F9E5C5'%3E%3Cpath d='M161.4 186.3 122 146.2l48.9-50-15.1-15.7L55.1 183 15.4 142.9 155.8 0l94.4 96.2z'/%3E%3Cpath d='M163.6 296 68.6 199.3l39.7-40.4 55.3 56.6 82-83.5L368.7 8.2l140.9 143.5-39.7 40.1-101.5-103.3-83.4 83.8z'/%3E%3Cpath d='M368.7 296 282.1 207.8l39.4-40.4 47.2 48.1 47.8-48.6 39.4 40.4z'/%3E%3Cpath d='m369.4 121.4-30 30.5 30 30.5 30-30.5z'/%3E%3C/svg%3E") center/contain no-repeat;opacity:.06;pointer-events:none}
.wp-block-group.is-style-dark > *{position:relative;z-index:1}
.wp-block-group.is-style-dark p{color:var(--elb-cream);opacity:.85 !important;font-size:14px !important;line-height:1.5 !important}
.wp-block-group.is-style-dark p:first-child{margin-bottom:var(--elb-s2) !important}
@media (min-width:768px){.wp-block-group.is-style-dark p{font-size:16px !important}}
@media (min-width:992px){.wp-block-group.is-style-dark p{font-size:18px !important}}
.wp-block-group.is-style-dark ul{margin-bottom:0 !important}
@media (min-width:992px){.wp-block-group.is-style-dark{padding:var(--elb-s8) !important}}

/* ---------- Pros & Cons ----------
   Group "Pros & Cons" (is-style-procon) holds "Pros column" (is-style-pros) and/or "Cons column" (is-style-cons),
   each = H3 + list. Two columns side by side only when both exist. */
.wp-block-group.is-style-procon{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--elb-s4);margin:var(--elb-s2) 0 var(--elb-s8) !important}
@media (min-width:768px){
  .wp-block-group.is-style-procon:has(> .is-style-pros):has(> .is-style-cons){grid-template-columns:repeat(2,minmax(0,1fr))}
}
.wp-block-group:is(.is-style-pros,.is-style-cons){margin:0 !important;padding:var(--elb-s4) var(--elb-s5) var(--elb-s2) !important;border:1px solid var(--elb-line)}
.wp-block-group.is-style-pros{background:color-mix(in srgb,var(--elb-accent) 8%,transparent);border-color:color-mix(in srgb,var(--elb-accent) 40%,transparent)}
.wp-block-group.is-style-cons{background:var(--elb-tint)}
.wp-block-group:is(.is-style-pros,.is-style-cons) > :is(h3,h4){display:flex;align-items:center;gap:var(--elb-s3);margin:0 0 var(--elb-s2) !important;padding:0 0 var(--elb-s3);border-bottom:1px solid var(--elb-line-strong);font-size:18px !important;line-height:1.3 !important;opacity:1 !important}
.wp-block-group:is(.is-style-pros,.is-style-cons) > :is(h3,h4)::before{content:"";flex:none;width:24px;height:24px;border-radius:50%;background-position:center;background-repeat:no-repeat;background-size:12px 12px}
.wp-block-group.is-style-pros > :is(h3,h4)::before{background-color:var(--elb-accent);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23272155' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E")}
.wp-block-group.is-style-cons > :is(h3,h4)::before{box-shadow:inset 0 0 0 1.5px var(--elb-line-strong);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23CFA984' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E")}
.wp-block-group:is(.is-style-pros,.is-style-cons) ul{list-style:none !important;margin:0 !important;padding:0 !important;display:flex;flex-direction:column}
.wp-block-group:is(.is-style-pros,.is-style-cons) li{position:relative;margin:0 !important;padding:6px 0 6px 24px !important;opacity:1 !important;font-size:16px !important;line-height:1.5 !important;overflow-wrap:anywhere}
.wp-block-group:is(.is-style-pros,.is-style-cons) li::after{display:none !important;content:none !important}
.wp-block-group:is(.is-style-pros,.is-style-cons) li::before{position:absolute;left:0;top:6px;width:16px;text-align:center;font-weight:600;font-size:18px;line-height:1.4;color:var(--elb-accent)}
.wp-block-group.is-style-pros li::before{content:"+"}
.wp-block-group.is-style-cons li::before{content:"\2212";opacity:.8}

@media (prefers-reduced-motion:reduce){:is(.is-style-cards li,.is-style-facts tr,.el-related-card){transition:none}}

/* ---------- Related post cards ---------- */
.el-related-card{
  display:flex;
  flex-direction:column;
  min-height:100%;
  padding:var(--elb-s6);
  border:1px solid color-mix(in srgb,var(--elb-cream) 28%,transparent);
  background:transparent;
  color:var(--elb-cream) !important;
  text-decoration:none !important;
  opacity:1 !important;
  transition:border-color .2s ease,background-color .2s ease;
}
.el-related-card:hover{
  border-color:var(--elb-accent);
  background:color-mix(in srgb,var(--elb-cream) 6%,transparent);
  color:var(--elb-cream) !important;
  text-decoration:none !important;
}
.el-related-card__date{
  display:block;
  margin-bottom:var(--elb-s3);
  font-size:13px;
  line-height:1.4;
  letter-spacing:.02em;
  opacity:.65;
}
.el-related-card__title{
  margin:0 0 var(--elb-s3) !important;
  color:var(--elb-cream) !important;
  font-size:18px !important;
  font-weight:600;
  line-height:1.35 !important;
  opacity:1 !important;
}
.el-related-card__excerpt{
  margin:0 0 var(--elb-s5);
  color:var(--elb-cream);
  font-size:15px;
  line-height:1.5;
  opacity:.8;
  flex:1 1 auto;
}
.el-related-card__more{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:auto;
  color:var(--elb-cream);
  font-size:15px;
  line-height:1.2;
}
.el-related-card__more span{
  color:var(--elb-accent);
  transition:transform .2s ease;
}
.el-related-card:hover .el-related-card__more span{
  transform:translateX(4px);
}
@media (min-width:992px){
  .el-related-card__title{font-size:20px !important}
}