/* =========================================================
   Canopy Insurance UI CSS
   Scope: pages wrapped in .canopyPage
   Goals: consistent spacing, cards, grids, forms, pills
   Notes: Keep Divi safe, no theme wide resets outside .canopyPage
   ========================================================= */

/* Base scope */
.canopyPage,
.canopyPage * { box-sizing: border-box; }

.canopyPage{
  --ink:#0f172a;
  --muted:#475569;
  --muted2:#64748b;

  --border:rgba(226,232,240,.95);
  --borderSoft:rgba(203,213,225,1);

  --card:#ffffff;

  --brand:#1a365d;
  --brandDark:#0f2744;
  --link:#1a365d;

  --accent:#c4501a;
  --accentDark:#a8430f;
  --accentGlow:rgba(196,80,26,.18);

  --danger:#b91c1c;
  --ok:#16a34a;

  --shadowMain:0 22px 60px rgba(15,23,42,.12);
  --shadowSoft:0 12px 32px rgba(15,23,42,.08);

  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color: var(--ink);
  background:
    radial-gradient(1200px 520px at 20% 0%, rgba(26,54,93,.16), transparent 55%),
    radial-gradient(900px 520px at 80% 18%, rgba(212,152,30,.12), transparent 58%),
    linear-gradient(180deg,#f0ede8 0%,#f6f8fc 45%,#f6f8fc 100%);
  padding: 22px 0 80px;
}

/* Prevent Divi theme styles from mangling our typography inside .canopyPage */
.canopyPage h1,
.canopyPage h2,
.canopyPage h3,
.canopyPage h4,
.canopyPage p,
.canopyPage ul,
.canopyPage ol,
.canopyPage li{
  font-family: inherit;
  letter-spacing: normal;
}

/* Wrapper */
.canopyPage .canopyWrap{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 18px;
}
@media (max-width:960px){
  .canopyPage .canopyWrap{ padding: 0 14px; }
}

/* Links */
.canopyPage a{
  color: var(--link);
  text-decoration: none;
  font-weight: 800;
}
.canopyPage a:hover{ text-decoration: underline; }

/* Skip link */
.canopySkip{
  position:absolute;
  left:-9999px;
  top:0;
  padding:10px 12px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  box-shadow: var(--shadowSoft);
  z-index:9999;
}
.canopySkip:focus{ left: 14px; top: 14px; }

/* HERO */
.canopyHero{
  background:#fff;
  border-radius:24px;
  border:1px solid var(--border);
  box-shadow:var(--shadowMain);
  padding:18px 20px 16px;
  margin-bottom:14px;
}

/* Breadcrumb */
.canopyBreadcrumb{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted2);
  font-weight:800;
  margin-bottom:8px;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
}
.canopyBreadcrumb a{ color:inherit; text-decoration:none; font-weight:800; }
.canopyBreadcrumb a:hover{ text-decoration:underline; }
.canopyBreadcrumb span[aria-hidden="true"]{ opacity:.9; }

/* Eyebrow */
.canopyHero-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid rgba(196,80,26,.55);
  background:#fff;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted2);
  width:fit-content;
  max-width:100%;
}
.canopyHero-dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--accent);
  box-shadow:0 0 0 5px var(--accentGlow);
  flex-shrink:0;
}
.canopyAccentWord{ color:var(--ok); font-weight:950; }

/* Headings */
.canopyHero h1{
  margin:10px 0 6px;
  font-size:clamp(26px,3vw,34px);
  font-weight:950;
  letter-spacing:-.03em;
  color:var(--brand);
  line-height:1.15;
}

/* Meta row */
.canopyHero-meta{
  margin:0;
  font-size:12px;
  color:var(--muted2);
  font-weight:800;
  line-height:1.7;
}
.canopyHero-meta time{ font-weight:950; }
.canopyMetaSep{ margin:0 6px; opacity:.9; }

/* Lead */
.canopyHero-lead{
  margin:10px 0 0;
  font-size:14px;
  line-height:1.75;
  color:var(--muted);
  max-width:1100px;
}
.canopyHero-lead strong{ font-weight:950; color: var(--ink); }

/* Scenario jump pills */
.canopyHero-jumps{
  margin-top:8px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  justify-content:center;
  font-size:12px;
}
.canopyJumpPill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:7px 11px;
  border-radius:999px;
  border:1px solid rgba(15,39,68,.85);
  background:#f8fafc;
  color:var(--brandDark);
  font-size:12px;
  font-weight:900;
  text-decoration:none;
  line-height:1.2;
  -webkit-tap-highlight-color:transparent;
}
.canopyJumpPill:hover{ background:#faf6f0; text-decoration:none; }
.canopyJumpPill:focus-visible{
  outline:3px solid rgba(26,54,93,.35);
  outline-offset:2px;
}

/* Quick Answers block (THIS is the ATF layout you're missing) */
.canopyHero-quick{
  margin-top:12px;
  background:#faf6f0;
  border-radius:18px;
  border:1px solid rgba(191,219,254,.9);
  padding:12px 12px 10px;
}
.canopyHero-quickHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:8px;
  flex-wrap:wrap;
}
.canopyHero-quickHead h2{
  margin:0;
  font-size:12px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--link);
}
.canopyHero-quickHead span{
  font-size:12px;
  color:var(--muted2);
  font-weight:800;
}

/* Grid must be forced, Divi sometimes nukes it */
.canopyHero-quickGrid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
@media (max-width:900px){
  .canopyHero-quickGrid{ grid-template-columns:1fr; }
}

/* Cards */
.canopyHero-quickCard{
  background:#fff;
  border-radius:12px;
  border:1px solid rgba(226,232,240,.95);
  padding:10px 11px;
  box-shadow:0 8px 18px rgba(15,23,42,.04);
}
.canopyHero-quickCard h3{
  margin:0 0 6px;
  font-size:14px;
  font-weight:950;
  color:var(--ink);
  letter-spacing:-.01em;
}
.canopyHero-quickCard ul{
  margin:0;
  padding-left:18px;
  list-style:disc !important;
  list-style-position:outside;
  font-size:13px;
  color:var(--muted);
  line-height:1.65;
}
.canopyHero-quickCard li{ margin:3px 0; }

.canopyHero-qaNote{
  margin-top:8px;
  font-size:12px;
  color:var(--muted2);
  font-weight:800;
}

/* CTA buttons */
.canopyHero-ctas{
  margin-top:14px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

.canopyBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 16px;
  border-radius:999px;
  border:1px solid transparent;
  font-size:13px;
  font-weight:900;
  text-decoration:none;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  min-height:44px;
  white-space:nowrap;
  line-height:1;
  user-select:none;
}

.canopyBtn-secondary{
  background:#fff;
  color:var(--link);
  border-color:rgba(226,232,240,.95);
}
.canopyBtn-secondary:hover{
  border-color:rgba(26,54,93,.55);
  background:#faf6f0;
  text-decoration:none;
}

.canopyBtn-ghost{
  background:#fff;
  color:var(--muted2);
  border-color:rgba(226,232,240,.95);
  font-weight:850;
}
.canopyBtn-ghost:hover{
  color:var(--link);
  border-color:rgba(26,54,93,.55);
  background:#faf6f0;
  text-decoration:none;
}

.canopyBtn-success{
  background:var(--ok);
  border-color:var(--ok);
  box-shadow:0 14px 30px rgba(15,23,42,.20);
  color:#fff !important;
}
.canopyBtn-success:hover{
  background:var(--accentDark);
  border-color:var(--accentDark);
  color:#fff !important;
  text-decoration:none;
}

.canopyBtn-reset{
  background:#fff;
  color:var(--danger);
  border-color:var(--danger);
  font-weight:650;
}
.canopyBtn-reset:hover{
  background:var(--danger);
  border-color:var(--danger);
  color:#fff;
  text-decoration:none;
}

.canopyLeadPill{
  background:#fff !important;
  color:#7c2d12 !important;
  border:1px solid rgba(22,163,74,.95) !important;
  font-weight:950;
}
.canopyLeadPill:hover{
  background:var(--ok) !important;
  border-color:var(--ok) !important;
  color:#fff !important;
  text-decoration:none !important;
}

.canopyBtn:focus-visible{
  outline:3px solid rgba(26,54,93,.35);
  outline-offset:2px;
}

/* Top nav */
.canopyTopNav{
  margin-top:12px;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:14px;
  font-size:13px;
}
.canopyTopNav a{
  color:var(--ink);
  font-weight:600;
  text-decoration:none;
  padding:6px 2px;
  border-bottom:2px solid transparent;
}
.canopyTopNav a:hover{
  color:var(--link);
  text-decoration:none;
  border-bottom-color:rgba(26,54,93,.55);
}
.canopyTopNav a:focus-visible{
  outline:3px solid rgba(26,54,93,.35);
  outline-offset:2px;
  border-radius:8px;
}

/* Sections */
.canopySection{
  margin-top:18px;
  background:#fff;
  border-radius:22px;
  border:1px solid var(--border);
  box-shadow:var(--shadowSoft);
  padding:16px 18px 16px;
  scroll-margin-top:90px;
}
.canopySection-head h2{
  margin:0 0 6px;
  font-size:18px;
  font-weight:950;
  letter-spacing:-.02em;
  color:var(--brand);
}
.canopySection-head p{
  margin:0;
  font-size:14px;
  color:var(--muted);
  line-height:1.7;
}

/* Tool headings */
.canopyTool-title{
  margin-top:12px;
  margin-bottom:4px;
  font-size:15px;
  font-weight:950;
  letter-spacing:-.01em;
  color:var(--ink);
}
.canopyTool-intro{
  margin:0 0 8px;
  font-size:14px;
  color:var(--muted);
  line-height:1.7;
}
.canopyTool-grid{
  margin-top:8px;
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:18px;
  align-items:flex-start;
}
@media (max-width:1040px){
  .canopyTool-grid{ grid-template-columns:1fr; }
}

/* Forms */
.canopyForm{
  border-radius:16px;
  border:1px solid rgba(226,232,240,.95);
  background:#f9fafb;
  padding:12px 12px 10px;
}
.canopyForm-group{ margin-bottom:10px; }
.canopyForm-label{
  display:block;
  font-size:12px;
  font-weight:900;
  color:var(--ink);
  margin-bottom:4px;
}
.canopyForm-select,
.canopyForm-input{
  width:100%;
  border-radius:12px;
  border:1px solid var(--borderSoft);
  padding:9px 10px;
  font-size:13px;
  color:var(--ink);
  background:#fff;
  outline:none;
}
.canopyForm-select:focus,
.canopyForm-input:focus{
  border-color:#1a365d;
  box-shadow:0 0 0 3px rgba(26,54,93,.20);
}
.canopyForm-row{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
@media (max-width:640px){
  .canopyForm-row{ grid-template-columns:1fr; }
}
.canopyForm-help{
  margin-top:6px;
  font-size:12px;
  color:var(--muted2);
  line-height:1.55;
}
.canopyForm-tags{
  margin-top:6px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.canopyTag{
  display:inline-flex;
  align-items:flex-start;
  gap:8px;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(226,232,240,.95);
  background:#fff;
  font-size:12px;
  color:var(--muted2);
  cursor:pointer;
  line-height:1.35;
  max-width:100%;
  font-weight:800;
}
.canopyTag input{ margin:2px 0 0; }
.canopyForm-actions{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.canopyForm-error{
  margin-top:6px;
  font-size:12px;
  color:var(--danger);
  font-weight:900;
  min-height:16px;
}

/* Results */
.canopyResult{
  border-radius:18px;
  border:1px solid rgba(226,232,240,.95);
  background:#fff;
  color:var(--ink);
  padding:14px 14px 12px;
  box-shadow:var(--shadowSoft);
  overflow:hidden;
}
.canopyResult-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:8px;
  flex-wrap:wrap;
}
.canopyResult-header h3{
  margin:0;
  font-size:16px;
  font-weight:950;
  letter-spacing:-.01em;
  color:var(--ink);
}
.canopyResult-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:5px 10px;
  border-radius:999px;
  border:1px solid rgba(226,232,240,.95);
  font-size:12px;
  font-weight:900;
  background:#f8fafc;
  color:var(--muted2);
  max-width:100%;
  line-height:1.2;
}
.canopyResult-pill > span:first-child{
  width:7px; height:7px; border-radius:999px;
  background:#94a3b8;
  flex:0 0 7px;
}
.canopyResult-pill[data-level="idle"]{ background:#f8fafc; border-color:#e2e8f0; color:var(--muted2); }
.canopyResult-pill[data-level="idle"] > span:first-child{ background:#94a3b8; }
.canopyResult-pill[data-level="ready"]{ background:#ecfdf3; border-color:#bbf7d0; color:#7c2d12; }
.canopyResult-pill[data-level="ready"] > span:first-child{ background:var(--ok); }
.canopyResult-pill[data-level="close"]{ background:#fff7ed; border-color:#fed7aa; color:#9a3412; }
.canopyResult-pill[data-level="close"] > span:first-child{ background:#ea580c; }
.canopyResult-pill[data-level="prep"]{ background:#fef2f2; border-color:#fecaca; color:#b91c1c; }
.canopyResult-pill[data-level="prep"] > span:first-child{ background:#e11d48; }

.canopyResult-scoreWrap{ margin-top:10px; }
.canopyResult-scoreLabel{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  font-size:12px;
  color:var(--muted2);
  font-weight:800;
  margin-bottom:4px;
}
.canopyResult-barOuter{
  width:100%;
  height:8px;
  border-radius:999px;
  background:#f1f5f9;
  border:1px solid rgba(226,232,240,.95);
  overflow:hidden;
}
.canopyResult-barInner{
  height:100%;
  width:0%;
  border-radius:999px;
  background:linear-gradient(90deg,#c4501a,#a8430f);
  transition:width .25s ease-out;
}

.canopyResult-body{
  margin-top:10px;
  font-size:13px;
  line-height:1.7;
  color:var(--muted);
}
.canopyResult-body p{ margin:0 0 6px; }
.canopyResult-list{
  margin:0;
  padding-left:18px;
  list-style:disc;
  list-style-position:outside;
  font-size:13px;
  color:var(--muted);
  line-height:1.7;
}
.canopyResult-list li{ margin:3px 0; }

.canopyResult-links{
  margin-top:8px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.canopyResult-links a{
  font-size:12px;
  text-decoration:none;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(226,232,240,.95);
  color:var(--link);
  background:#faf6f0;
  font-weight:900;
}
.canopyResult-links a:hover{
  border-color:rgba(26,54,93,.55);
  background:#fde8d8;
  text-decoration:none;
}

/* Lead capture */
.canopyLeadCapture{
  margin-top:12px;
  border-top:1px solid rgba(226,232,240,.95);
  padding-top:12px;
}
.canopyLeadCapture h4{
  margin:0 0 6px;
  font-size:14px;
  font-weight:950;
  color:var(--ink);
}
.canopyLeadCapture p{
  margin:0 0 10px;
  font-size:13px;
  color:var(--muted);
  line-height:1.65;
}
.canopyLeadCapture-note{
  margin-top:8px;
  font-size:12px;
  color:var(--muted2);
  font-weight:700;
  line-height:1.55;
}

/* Honeypot */
.canopyHpWrap{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

/* Types explorer */
.canopyTypes{ margin-top:18px; }
.canopyTypes-grid{
  margin-top:10px;
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:16px;
  align-items:flex-start;
}
@media (max-width:1040px){
  .canopyTypes-grid{ grid-template-columns:1fr; }
}
.canopyTypeTabs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.canopyTypeTab{
  flex:1 1 160px;
  min-width:0;
  text-align:left;
  border-radius:14px;
  border:1px solid rgba(226,232,240,.95);
  background:#f9fafb;
  padding:9px 10px;
  font-size:12px;
  font-weight:900;
  color:var(--muted2);
  cursor:pointer;
}
.canopyTypeTab strong{
  display:block;
  margin-bottom:2px;
  font-size:12px;
  font-weight:950;
  color:var(--ink);
}
.canopyTypeTab span{
  font-size:11px;
  color:var(--muted2);
  font-weight:800;
}
.canopyTypeTab[aria-selected="true"]{
  border-color:#1a365d;
  background:#faf6f0;
  color:var(--link);
  box-shadow:0 10px 22px rgba(26,54,93,.16);
}
.canopyTypeDetail{
  border-radius:16px;
  border:1px solid rgba(226,232,240,.95);
  background:#f9fafb;
  padding:12px 12px 10px;
}
.canopyTypeDetail h3{
  margin:0 0 6px;
  font-size:16px;
  font-weight:950;
  letter-spacing:-.01em;
  color:var(--ink);
}
.canopyTypeDetail p{
  margin:0 0 8px;
  font-size:14px;
  color:var(--muted);
  line-height:1.7;
}
.canopyTypeDetail ul{
  margin:0 0 8px;
  padding-left:18px;
  list-style:disc;
  font-size:13px;
  color:var(--muted);
  line-height:1.7;
}
.canopyTypeDetail li{ margin:3px 0; }

/* Split basics */
.canopySplit{
  margin-top:10px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
@media (max-width:900px){
  .canopySplit{ grid-template-columns:1fr; }
}
.canopySplit-col h3{
  margin:0 0 6px;
  font-size:16px;
  font-weight:950;
  letter-spacing:-.01em;
  color:var(--ink);
}
.canopySplit-col p{
  margin:0 0 8px;
  font-size:14px;
  color:var(--muted);
  line-height:1.7;
}
.canopySplit-col ul{
  margin:0;
  padding-left:18px;
  list-style:disc;
  font-size:14px;
  color:var(--muted);
  line-height:1.7;
}
.canopySplit-col li{ margin:3px 0; }

/* FAQ */
.canopyFaq{ margin-top:18px; }
.canopyFaqHead{
  padding-bottom:4px;
  border-bottom:1px solid rgba(226,232,240,.95);
  margin-bottom:4px;
}
.canopyFaqItem{ border-top:1px solid rgba(226,232,240,.95); }
.canopyFaqItem summary{
  list-style:none;
  cursor:pointer;
  padding:10px 0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  font-size:14px;
  font-weight:950;
  color:var(--ink);
}
.canopyFaqItem summary::-webkit-details-marker{ display:none; }
.canopyFaqIcon{
  width:22px;
  height:22px;
  border-radius:999px;
  border:1px solid rgba(226,232,240,.95);
  background:#fff;
  position:relative;
  flex-shrink:0;
}
.canopyFaqIcon::before,
.canopyFaqIcon::after{
  content:'';
  position:absolute;
  left:50%;
  top:50%;
  background:var(--ink);
  transform:translate(-50%,-50%);
  border-radius:2px;
}
.canopyFaqIcon::before{ width:12px; height:2px; }
.canopyFaqIcon::after{ width:2px; height:12px; }
.canopyFaqItem[open] .canopyFaqIcon::after{ display:none; }
.canopyFaqBody{
  padding:0 0 10px;
  font-size:14px;
  color:var(--muted);
  line-height:1.75;
}

/* Sources */
.canopySourcesList{
  margin:8px 0 0;
  padding-left:18px;
  list-style:disc;
  font-size:14px;
  color:var(--muted);
  line-height:1.7;
}
.canopySourcesList li{ margin:4px 0; }
.canopyFootNote{
  margin-top:6px;
  font-size:12px;
  color:var(--muted2);
  text-align:right;
  font-weight:800;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .canopyPage *{
    scroll-behavior:auto !important;
    transition-duration:0.001ms !important;
    animation-duration:0.001ms !important;
  }
}

/* ================================
   Canopy Insurance — VA MAIN ATF PATCH (Divi-safe)
   Scope: .canopyPage-vaMain only
   ================================ */

.canopyPage-vaMain{
  --canopyText:#0b1a33;
  --canopyMuted:#52627a;
  --canopyBlue:#0b5cff;
  --canopyBlueSoft:rgba(11,92,255,.10);
  --canopyCard:#ffffff;
  --canopyLine:rgba(11,26,51,.12);
  --canopyBg:#f6f9ff;
  --canopyShadow:0 10px 30px rgba(11,26,51,.08);
  color:var(--canopyText);
}

.canopyPage-vaMain,
.canopyPage-vaMain *{ box-sizing:border-box; }

.canopyPage-vaMain .canopyWrap{
  max-width:1160px;
  margin:0 auto;
  padding:24px 16px 64px;
}

.canopyPage-vaMain .canopyHero{
  background:var(--canopyCard);
  border:1px solid var(--canopyLine);
  box-shadow:var(--canopyShadow);
  border-radius:20px;
  padding:18px 18px 16px;
}

.canopyPage-vaMain .canopyHero-meta{
  font-size:13px;
  color:var(--canopyMuted);
}

.canopyPage-vaMain .canopyHero-jumps{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
}

.canopyPage-vaMain .canopyHero-quick{
  border:1px solid rgba(11,92,255,.20);
  background:var(--canopyBlueSoft);
  border-radius:16px;
  padding:14px;
}

.canopyPage-vaMain .canopyHero-quickGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
}

@media (max-width: 900px){
  .canopyPage-vaMain .canopyHero-quickGrid{ grid-template-columns:1fr; }
}

@media (min-width: 1180px){
  .canopyPage-vaMain .canopyHero-quickGrid{ grid-template-columns:repeat(4, minmax(0,1fr)); }
}

.canopyPage-vaMain .canopyHero-quickCard{
  background:var(--canopyBg);
  border:1px solid var(--canopyLine);
  border-radius:14px;
  padding:14px 14px 12px;
}

.canopyPage-vaMain .canopyHero-quickCard h3{
  margin:0 0 8px;
  font-size:15px;
  line-height:1.25;
  color:var(--canopyText);
}

.canopyPage-vaMain .canopyHero-quickCard ul{
  margin:0;
  padding-left:18px;
  color:var(--canopyText);
}

.canopyPage-vaMain .canopyHero-quickCard li{
  margin:6px 0;
  color:var(--canopyText);
}

.canopyPage-vaMain .canopyHero-qaNote{
  margin-top:12px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--canopyLine);
  background:#fff;
  color:var(--canopyMuted);
  font-size:13px;
}


/* ========================================================
   Canopy Insurance UI — SPACING & CALLOUT SYSTEM v3 (merged)
   Targets: canopyPage/canopyPage article body + callouts + bullet-section-*
   Applied: 2026-03-25 (staging + production)
   Decision log:
     - Para bottom: 0.5em (prod tighter) + margin-top: 0 (prod)
     - H2/H3 margins: prod values (staging lacked these entirely)
     - canopySection / canopySectionHead / FAQ: best of both
     - Callout colors + bullet-section: staging (prod never had them)
   ======================================================== */

/* ----------------------------------------------------------
   1. canopyMeta (Primary Sources) — 4px gap below H1
   ---------------------------------------------------------- */
.canopyPage .canopyMeta,
.canopyPage .canopyMeta{
  margin-top: 4px !important;
}

/* ----------------------------------------------------------
   2. PARAGRAPH SPACING — 0.5em bottom, no top margin
   ---------------------------------------------------------- */
.canopyPage p,
.canopyPage p{
  margin-bottom: 0.5em !important;
  margin-top: 0 !important;
}

/* Tighten gap between jump-link pills and first paragraph */
.canopyPage .canopyPills,
.canopyPage .canopyPills{
  margin-bottom: 2px !important;
}

/* ----------------------------------------------------------
   3. H2 IN ARTICLE BODY — 6px below, 1.2em above
   ---------------------------------------------------------- */
.canopyPage h2,
.canopyPage h2{
  margin-bottom: 6px !important;
  margin-top: 1.2em !important;
}

/* ----------------------------------------------------------
   4. H3 IN ARTICLE BODY — 6px below, 1em above
   ---------------------------------------------------------- */
.canopyPage h3,
.canopyPage h3{
  margin-bottom: 6px !important;
  margin-top: 1em !important;
}

/* ----------------------------------------------------------
   5. NEXT STEP PILL — 8px above and below
   ---------------------------------------------------------- */
.canopyPage p.canopyHeroLead:has(.canopyNextPill),
.canopyPage p.canopyHeroLead:has(.canopyNextPill){
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}

/* ----------------------------------------------------------
   6. ATF CARD GRID — reduce gap below grid
   ---------------------------------------------------------- */
.canopyPage .canopyQuickGrid,
.canopyPage .canopyQuickGrid{
  margin-bottom: 4px !important;
}

/* ----------------------------------------------------------
   7. FAQ / SECTION SPACING
   ---------------------------------------------------------- */
/* Section card — tighter top margin */
.canopyPage .canopySection,
.canopyPage .canopySection{
  margin-top: 10px !important;
}

/* Section head — tighten below heading */
.canopyPage .canopySectionHead,
.canopyPage .canopySectionHead{
  margin-bottom: 4px !important;
  padding-bottom: 4px !important;
}

/* FAQ section h2 — kill browser-default top margin inside card
   Specificity (0,2,1) beats .canopyPage h2 at (0,1,1) above */
.canopySection .canopySectionHead h2{
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}

/* Gap between FAQ heading and first toggle: 18px → 8px */
.canopyFaq{
  margin-top: 8px !important;
}

/* FAQ toggle — 8px padding */
.canopyPage .canopyFaq summary,
.canopyPage .canopyFaq summary,
.canopyPage .canopyFaqItem summary,
.canopyPage .canopyFaqItem summary{
  padding: 8px 16px !important;
}

.canopyPage .canopyFaq .ans,
.canopyPage .canopyFaq .ans,
.canopyPage .canopyFaqBody,
.canopyPage .canopyFaqBody{
  padding: 8px 16px !important;
}

/* ----------------------------------------------------------
   8. BULLET / LIST SPACING
   ---------------------------------------------------------- */
.canopyPage li,
.canopyPage li{
  margin-top: 3px !important;
  margin-bottom: 3px !important;
}

/* ATF QuickCard h3 */
.canopyPage .canopyQuickCard h3,
.canopyPage .canopyQuickCard h3{
  font-size: 14px !important;
  margin-bottom: 6px !important;
}

.canopyPage .canopyQuickCard li,
.canopyPage .canopyQuickCard li{
  margin: 3px 0 !important;
}

/* ----------------------------------------------------------
   9. CALLOUT DESIGN SYSTEM
      Specificity (0,2,1) — beats plugin body.canopy-ui .canopyCallout
      (same specificity, theme CSS loads later → wins)
   ---------------------------------------------------------- */

/* Base: info/neutral blue */
body .canopyPage .canopyCallout,
body .canopyPage .canopyCallout{
  padding: 16px 20px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  background: #faf6f0 !important;
  border: 1px solid #bfdbfe !important;
}

/* Success / green */
body .canopyCallout.canopyCallout-green,
body .canopyPage .canopyCallout.canopyCallout-green,
body .canopyPage .canopyCallout.canopyCallout-green{
  background: #f0fdf4 !important;
  border-color: #bbf7d0 !important;
}

/* Warning / yellow */
body .canopyCallout.canopyCallout-yellow,
body .canopyPage .canopyCallout.canopyCallout-yellow,
body .canopyPage .canopyCallout.canopyCallout-yellow,
body .canopyCallout.canopyCallout-warn,
body .canopyPage .canopyCallout.canopyCallout-warn,
body .canopyPage .canopyCallout.canopyCallout-warn{
  background: #fffbeb !important;
  border-color: #fde68a !important;
}

/* Danger / red */
body .canopyCallout.canopyCallout-red,
body .canopyPage .canopyCallout.canopyCallout-red,
body .canopyPage .canopyCallout.canopyCallout-red{
  background: #fef2f2 !important;
  border-color: #fecaca !important;
}

/* Info / blue + ProTip */
body .canopyCallout.canopyCallout-blue,
body .canopyPage .canopyCallout.canopyCallout-blue,
body .canopyPage .canopyCallout.canopyCallout-blue,
body .canopyCallout.canopyProTip,
body .canopyPage .canopyCallout.canopyProTip,
body .canopyPage .canopyCallout.canopyProTip{
  background: #faf6f0 !important;
  border-color: #bfdbfe !important;
}

/* Disclosure / neutral */
body .canopyCallout.canopyDisclosure,
body .canopyPage .canopyCallout.canopyDisclosure,
body .canopyPage .canopyCallout.canopyDisclosure{
  background: #f8fafc !important;
  border-color: #e2e8f0 !important;
}

/* Callout titles — dark navy */
body .canopyCallout h2,
body .canopyCallout h3,
body .canopyCallout h4,
body .canopyPage .canopyCallout h2,
body .canopyPage .canopyCallout h3,
body .canopyPage .canopyCallout h4,
body .canopyPage .canopyCallout h2,
body .canopyPage .canopyCallout h3,
body .canopyPage .canopyCallout h4{
  color: #1e2d4f !important;
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}

/* First p/ul after callout heading — no top gap */
.canopyCallout h2 + p, .canopyCallout h3 + p, .canopyCallout h4 + p,
.canopyCallout h2 + ul, .canopyCallout h3 + ul, .canopyCallout h4 + ul{
  margin-top: 0 !important;
}

/* Callout body text */
body .canopyCallout p,
body .canopyPage .canopyCallout p,
body .canopyPage .canopyCallout p{
  color: inherit !important;
}

/* Callout li */
body .canopyCallout li,
body .canopyPage .canopyCallout li,
body .canopyPage .canopyCallout li{
  margin: 4px 0 !important;
}

/* ----------------------------------------------------------
   10. bullet-section-* (article content boxes)
       Specificity (0,2,2) beats Divi customizer at (0,2,1)
   ---------------------------------------------------------- */
html body .bullet-section-blue.bullet-section-blue,
html body .bullet-section-gray.bullet-section-gray,
html body .bullet-section-green.bullet-section-green,
html body .bullet-section-yellow.bullet-section-yellow,
html body .bullet-section-red.bullet-section-red{
  padding: 16px 20px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  background-image: none !important;
}

html body .bullet-section-blue.bullet-section-blue{
  background: #faf6f0 !important;
  border: 1px solid #bfdbfe !important;
}

html body .bullet-section-gray.bullet-section-gray{
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
}

html body .bullet-section-green.bullet-section-green{
  background: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
}

html body .bullet-section-yellow.bullet-section-yellow{
  background: #fffbeb !important;
  border: 1px solid #fde68a !important;
}

html body .bullet-section-red.bullet-section-red{
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
}

/* bullet-section headings — dark navy */
html body .bullet-section-blue h2, html body .bullet-section-blue h3, html body .bullet-section-blue h4,
html body .bullet-section-gray h2, html body .bullet-section-gray h3, html body .bullet-section-gray h4,
html body .bullet-section-green h2, html body .bullet-section-green h3, html body .bullet-section-green h4,
html body .bullet-section-yellow h2, html body .bullet-section-yellow h3, html body .bullet-section-yellow h4,
html body .bullet-section-red h2, html body .bullet-section-red h3, html body .bullet-section-red h4{
  color: #1e2d4f !important;
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}

/* bullet-section li */
html body .bullet-section-blue li,
html body .bullet-section-gray li,
html body .bullet-section-green li,
html body .bullet-section-yellow li,
html body .bullet-section-red li{
  margin: 3px 0 !important;
}

/* ----------------------------------------------------------
   H1 mobile font size — clamp values for 980px and 480px
   Overrides base .canopyHero h1 { font-size:clamp(26px,3vw,34px) }
   ---------------------------------------------------------- */
@media (max-width:980px){
  .canopyHero h1{
    font-size:clamp(24px,5.5vw,48px);
  }
}
@media (max-width:480px){
  .canopyHero h1{
    font-size:clamp(22px,6vw,32px);
  }
}

/* ── canopyFaq standalone ─────────────────────────────────────────────────────
   The <details>/<summary>/<div class="ans"> markup (generated by faq_full.php)
   works on ANY page regardless of canopyPage wrapper.
   Mirrors .canopyFaqItem rules above + removes .canopyPage scoping from lines 1075-1086. */
.canopyFaq details{
  border-top: 1px solid rgba(226,232,240,.95);
}
.canopyFaq details > summary{
  list-style: none;
  cursor: pointer;
  padding: 8px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--ink, #1e2d4f);
}
.canopyFaq details > summary::-webkit-details-marker{ display: none; }
.canopyFaq .canopyFaqQ{
  flex: 1;
}
.canopyFaq .ans{
  padding: 8px 16px;
  font-size: 14px;
  color: var(--muted, #4a5568);
  line-height: 1.75;
}
/* Also un-scope the padding !important overrides so they apply globally */
.canopyFaq summary,
.canopyFaqItem summary{
  padding: 8px 16px !important;
}
.canopyFaq .ans,
.canopyFaqBody{
  padding: 8px 16px !important;
}

/* ── Desktop horizontal gutter ─────────────────────────────────────────────
   Divi sets padding:0 on all sections/rows at >=981px, so non-canopyWrap content
   runs edge-to-edge. Applies 20px breathing room to all Divi rows at desktop.
   canopyPage articles: canopyWrap (max-width:1200px + padding:0 18px) constrains
   text width, so row padding is additive but harmless. */
@media (min-width: 981px) {
  body.canopy-ui.et_pb_pagebuilder_layout #main-content .et_pb_row {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}
/* canopyFaq expand/collapse indicator — + when closed, − when open */
.canopyFaq details > summary::after {
  content: '+';
  font-size: 18px;
  font-weight: 400;
  line-height: 1;
  flex-shrink: 0;
  color: var(--ink, #1e2d4f);
}
.canopyFaq details[open] > summary::after {
  content: '\2212'; /* minus sign */
}
/* ── YARPP related articles — single row at desktop ─────────────────────
   YARPP default: flex-wrap:wrap + width:230px per thumbnail (4 items).
   4×230px + 3×16px gaps = 968px — wraps to 2 rows in 75% sidebar layout.
   Fix: force single row, let items share space equally. */
@media (min-width: 981px) {
  .yarpp-thumbnails-horizontal {
    flex-wrap: nowrap !important;
  }
  .yarpp-thumbnails-horizontal .yarpp-thumbnail {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
  }
}


/* ── canopyTable — standalone table styling (no .canopyPage root dependency) ── */
.canopyTableScroll{
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:12px;
  border:1px solid #e2e8f0;
  background:#fff;
  margin:1em 0;
}
table.canopyTable{
  display:table;
  width:100%;
  border-collapse:collapse;
  table-layout:auto;
  font-size:0.92rem;
}
table.canopyTable th,
table.canopyTable td{
  border:1px solid #e2e8f0;
  padding:10px 12px;
  text-align:left;
  vertical-align:top;
}
table.canopyTable thead th{
  background:#f8fafc;
  color:#0f172a;
  font-weight:700;
}
table.canopyTable tbody tr:nth-child(even){
  background:#fafbfc;
}
@media (max-width:640px){
  table.canopyTable th,
  table.canopyTable td{
    padding:8px 8px;
    font-size:0.85rem;
  }
}

/* Blog archive grid — consistent thumbnail aspect ratio */
.et_pb_blog_grid .et_pb_post .entry-featured-image-url img {
  width: 100% !important;
  height: 200px !important;
  object-fit: cover !important;
  object-position: center !important;
}
/* ============================================================
   Canopy ATF (Above The Fold) — Article Hero Section
   Appended to canopy-ui.css
   ============================================================ */

/* ATF Wrapper */
.canopyPage.canopyATF {
  padding: 0;
  margin-bottom: 0;
}

.canopyWrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

/* Hero Card */
.canopyHero {
  background: linear-gradient(135deg, #0f2744 0%, #1a365d 100%);
  border-radius: 12px;
  padding: 40px 36px 32px;
  margin-bottom: 24px;
  color: #fff;
}

.canopyHero-inner {
  max-width: 900px;
}

/* Breadcrumb */
.canopyBreadcrumb {
  font-size: 13px;
  color: rgba(255,255,255,0.7);
  margin-bottom: 16px;
  line-height: 1.4;
}

.canopyBreadcrumb a {
  color: rgba(255,255,255,0.7);
  text-decoration: none;
}

.canopyBreadcrumb a:hover {
  color: #fff;
  text-decoration: underline;
}

.canopyBreadcrumb .sep {
  margin: 0 6px;
  opacity: 0.5;
}

/* Eyebrow */
.canopyEyebrow {
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #d4981e;
  margin-bottom: 10px;
}

.canopyEyebrow .sep {
  margin: 0 6px;
  opacity: 0.5;
}

.canopyEyebrow strong {
  color: rgba(255,255,255,0.9);
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
}

/* H1 */
.canopyHero h1 {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(26px, 4vw, 38px);
  font-weight: 800;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 16px;
}

/* Meta / Sources */
.canopyMeta {
  font-size: 13px;
  color: rgba(255,255,255,0.75);
  margin-bottom: 18px;
  line-height: 1.5;
}

.canopyMeta strong {
  color: rgba(255,255,255,0.9);
}

.canopyMeta a {
  color: #d4981e;
  text-decoration: none;
}

.canopyMeta a:hover {
  text-decoration: underline;
}

/* Jump-to Pills */
.canopyPills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 20px;
}

.canopyPill {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,0.12);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s;
  white-space: nowrap;
}

.canopyPill:hover {
  background: rgba(255,255,255,0.22);
  color: #fff;
  text-decoration: none;
}

/* Hero Lead */
.canopyHeroLead {
  font-size: 17px;
  line-height: 1.6;
  color: rgba(255,255,255,0.92);
  margin: 0 0 12px;
}

/* Next Step CTA */
.canopyNextPill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.canopyNextLabel {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #d4981e;
}

.canopyNextLink {
  display: inline-block;
  padding: 8px 20px;
  border-radius: 6px;
  background: #c4501a;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: background 0.2s, box-shadow 0.2s;
}

.canopyNextLink:hover {
  background: #a8430f;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  color: #fff;
}

/* Quick Grid — 4 cards below hero */
.canopyQuickGrid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 28px;
}

.canopyQuickCard {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 20px 18px;
}

.canopyQuickCard h3 {
  font-family: 'Montserrat', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: #1a365d;
  margin: 0 0 10px;
  line-height: 1.3;
}

.canopyQuickCard ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.canopyQuickCard li {
  position: relative;
  padding-left: 18px;
  font-size: 13.5px;
  line-height: 1.5;
  color: #1a202c;
  margin-bottom: 6px;
}

.canopyQuickCard li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: #c4501a;
  font-weight: 700;
}

.canopyQuickCard li:last-child {
  font-weight: 600;
  color: #c4501a;
}

/* Skip link */
.canopySkip {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.canopySkip:focus {
  position: static;
  width: auto;
  height: auto;
  overflow: visible;
  display: inline-block;
  padding: 8px 16px;
  background: #1a365d;
  color: #fff;
  border-radius: 4px;
  font-size: 14px;
  z-index: 100;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
  .canopyQuickGrid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .canopyHero {
    padding: 28px 20px 24px;
    border-radius: 8px;
  }

  .canopyPills {
    gap: 6px;
  }

  .canopyPill {
    padding: 5px 11px;
    font-size: 12px;
  }

  .canopyHeroLead {
    font-size: 15px;
  }

  .canopyQuickGrid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .canopyWrap {
    padding: 0 16px;
  }
}