/* Collections styling (blog + news detail + listing tweaks), built ON Aaron's design tokens
   (elevate-tokens.css). Scoped to .ev-* so it never touches his components. Detail pages
   don't exist in his site, so this is our prose layer in his system. */

/* ---- listing card: give blog/news cards an optional thumbnail on his stub-card ---- */
.stub-card .ev-card__thumb {
  /* FIXLOG #2 (v2, measured): the actual thumbnails are 1080x1080 SQUARES. Old-site
     behavior is height:auto (full image, zero crop); its 374x240 were dead HTML attrs.
     NEVER give this a fixed aspect-ratio or object-fit:cover, that is what clipped them. */
  display: block; width: 100%; height: auto;
  border-radius: 12px; margin-bottom: 16px; background: var(--fill-2, #F1F5F9);
}
.stub-card .ev-card__meta { color: var(--slate-500, #64748B); font-size: 13px; }

/* ---- article (blog/news detail) ---- */
.ev-article { background: var(--canvas, #fff); }
.ev-article__hero {
  max-width: 760px; margin: 0 auto; padding: 96px 24px 24px;
}
.ev-article__title {
  font-family: var(--font-display, Satoshi), var(--font-body, Inter);
  font-weight: 700; font-size: clamp(30px, 5vw, 52px); line-height: 1.05;
  letter-spacing: -.02em; color: var(--ink, #0F172A); margin: 0 0 20px;
}
.ev-article__meta {
  display: flex; gap: 14px; flex-wrap: wrap; align-items: center;
  font-size: 14px; color: var(--slate-500, #64748B); margin: 0 0 8px;
}
.ev-article__meta strong { color: var(--ink, #0F172A); font-weight: 600; }
.ev-article__banner {
  /* FIXLOG #3 (measured): banners are 3.33:1 (1200x360 / 2000x600). Natural height,
     zero crop, same as the old site. No aspect-ratio, no object-fit. */
  display: block; width: 100%; max-width: 1040px; margin: 32px auto 0;
  border-radius: var(--radius-card, 24px); height: auto;
}
.ev-article__body {
  max-width: 720px; margin: 0 auto; padding: 40px 24px 80px;
  font-family: var(--font-body, Inter); font-size: 18px; line-height: 1.7;
  color: var(--slate-800, #1E293B);
}
.ev-article__body > *:first-child { margin-top: 0; }
.ev-article__body h2 {
  font-family: var(--font-display, Satoshi), var(--font-body, Inter);
  font-size: 28px; line-height: 1.2; letter-spacing: -.01em; color: var(--ink, #0F172A);
  margin: 48px 0 16px; font-weight: 700;
}
.ev-article__body h3 { font-size: 22px; color: var(--ink, #0F172A); margin: 36px 0 12px; font-weight: 600; }
.ev-article__body p { margin: 0 0 22px; }
.ev-article__body a { color: var(--green-700, #15803D); text-decoration: underline; text-underline-offset: 2px; }
.ev-article__body ul, .ev-article__body ol { margin: 0 0 22px; padding-left: 24px; }
.ev-article__body li { margin: 0 0 10px; }
.ev-article__body img { max-width: 100%; height: auto; border-radius: 12px; margin: 24px 0; }
.ev-article__body blockquote {
  margin: 28px 0; padding: 4px 0 4px 24px; border-left: 3px solid var(--lime, #4ADE80);
  font-size: 20px; color: var(--ink, #0F172A);
}
.ev-article__body pre {
  background: var(--forest, #002E11); color: #fff; padding: 20px; border-radius: 12px;
  overflow-x: auto; font-family: var(--font-mono, "SF Mono", monospace); font-size: 14px; margin: 24px 0;
}
.ev-article__body code { font-family: var(--font-mono, "SF Mono", monospace); font-size: .92em; }
.ev-article__body figure { margin: 24px 0; }
.ev-article__body figcaption { font-size: 13px; color: var(--slate-500, #64748B); margin-top: 8px; }
.ev-article__back { max-width: 720px; margin: 0 auto; padding: 0 24px 64px; }
.ev-article__back a { color: var(--green-700, #15803D); font-weight: 600; text-decoration: none; }

/* ---- media & press sections ---- */
.ev-press__group { margin-bottom: 8px; }

/* ---- launch film embed ---- */
.ev-film__frame { max-width: 960px; margin: 0 auto; border-radius: var(--radius-card, 24px); overflow: hidden; background: #000; }
.ev-film__frame video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain; }

/* ---- accessory pages (contact, legal, claims, reports, forms) ---- */
.ev-prose{max-width:760px;margin-left:auto;margin-right:auto;font-family:var(--font-body,Inter);font-size:16.5px;line-height:1.72;color:var(--slate-800,#1E293B);}
.ev-prose h2{font-family:var(--font-display,Satoshi),var(--font-body,Inter);font-size:24px;line-height:1.25;
  letter-spacing:-.01em;color:var(--ink,#0F172A);margin:40px 0 12px;font-weight:700;}
.ev-prose h3{font-size:19px;color:var(--ink,#0F172A);margin:30px 0 10px;font-weight:600;}
.ev-prose h4{font-size:16.5px;color:var(--ink,#0F172A);margin:24px 0 8px;font-weight:600;}
.ev-prose > *:first-child{margin-top:0;}
.ev-prose p{margin:0 0 18px;}
.ev-prose a{color:var(--green-700,#15803D);text-decoration:underline;text-underline-offset:2px;}
.ev-prose ul{margin:0 0 18px;padding-left:22px;}
.ev-prose li{margin:0 0 8px;}
.ev-prose strong{font-weight:600;color:var(--ink,#0F172A);}
/* HubSpot embeds: give the iframe room and keep it on the grid */
.ev-formcol{max-width:640px;margin-left:auto;margin-right:auto;}   /* Aaron centers his own
   .stub-form the same way (max-width + margin:0 auto); without the auto margins the column
   sat flush-left under a centered hero, which is what Lex saw on /contact. */
.ev-formwrap{background:var(--fill-1,#F8FAFC);border:1px solid var(--hairline,#E2E8F0);
  border-radius:var(--radius-card,24px);padding:28px;}
.ev-formwrap .hs-form-frame{min-height:320px;}
/* newsletter (blog listing): one email field, no reason for a 320px well or a centered
   card detached from its left-aligned heading (Hannah's issues doc, 2026-07-27) */
.ev-formcol--left{margin-left:0;}
.ev-formwrap--slim{padding:20px 24px;}
.ev-formwrap--slim .hs-form-frame{min-height:150px;}
.ev-formwrap iframe{width:100% !important;border:0;}
.ev-pre{background:var(--forest,#002E11);color:#fff;padding:20px 24px;border-radius:12px;
  font-family:var(--font-mono,"SF Mono",monospace);font-size:13.5px;line-height:1.7;overflow-x:auto;max-width:760px;}

/* ---- gated asset page (/report): cover beside the form ---- */
.ev-gated{display:grid;grid-template-columns:minmax(0,0.85fr) minmax(0,1fr);gap:var(--space-lg,48px);
  align-items:start;max-width:1040px;margin:0 auto;text-align:left;}
.ev-gated__cover{margin:0;}
.ev-gated__cover img{display:block;width:100%;height:auto;border-radius:var(--radius-card,24px);
  border:1px solid var(--hairline,#E2E8F0);background:var(--fill-1,#F8FAFC);}
.ev-gated__form{display:grid;gap:0;}
.ev-gated__h{font-family:var(--font-display,Satoshi),var(--font-body,Inter);font-size:clamp(24px,2.6vw,32px);
  line-height:1.14;letter-spacing:-.015em;color:var(--ink,#0F172A);margin:0 0 8px;font-weight:700;}
.ev-gated__note{font-size:15px;line-height:1.55;color:var(--slate-600,#475569);margin:0 0 20px;}
.ev-gated .ev-formwrap{margin:0;}
@media (max-width:880px){
  .ev-gated{grid-template-columns:1fr;gap:var(--space-md,32px);}
  .ev-gated__cover{max-width:420px;margin:0 auto;}
}

/* ---- report listing cards (/reports) ---- */
.ev-reportgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:var(--space-md,32px);max-width:1040px;margin:0 auto;text-align:left;}
.ev-reportcard{display:grid;gap:0;text-decoration:none;color:inherit;
  border:1px solid var(--hairline,#E2E8F0);border-radius:var(--radius-card,24px);overflow:hidden;
  background:var(--surface,#fff);transition:border-color .18s ease;}
.ev-reportcard:hover{border-color:var(--lime,#4ADE80);}
.ev-reportcard__cover{margin:0;background:var(--fill-1,#F8FAFC);}
.ev-reportcard__cover img{display:block;width:100%;height:auto;}
.ev-reportcard__body{padding:24px 24px 28px;}
.ev-reportcard__h{font-family:var(--font-display,Satoshi),var(--font-body,Inter);font-size:20px;
  line-height:1.22;letter-spacing:-.01em;color:var(--ink,#0F172A);margin:0 0 10px;font-weight:700;}
.ev-reportcard__p{font-size:14.5px;line-height:1.6;color:var(--slate-600,#475569);margin:0 0 14px;}

/* ---- design pass 2026-07-25: reading order + site-consistent layouts ---- */
/* split: copy column left, form card right; DOM puts copy first so mobile order is right */
.ev-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,0.92fr);
  gap:var(--space-lg,48px);align-items:start;max-width:1080px;margin:0 auto;text-align:left;}
.ev-split__copy .ev-prose{max-width:56ch;margin:0;}
.ev-split__side{position:sticky;top:96px;}
@media (max-width:980px){
  .ev-split{grid-template-columns:1fr;gap:var(--space-md,32px);}
  .ev-split__side{position:static;max-width:560px;}
}

/* form card: a heading gives the form a job; the wrap stays Aaron's fill-1 card */
.ev-formcard__h{font-family:var(--font-display,Satoshi),var(--font-body,Inter);
  font-size:clamp(22px,2.4vw,28px);line-height:1.15;letter-spacing:-.015em;
  color:var(--ink,#0F172A);margin:0 0 6px;font-weight:700;}
.ev-formcard__note{font-size:15px;line-height:1.55;color:var(--slate-600,#475569);margin:0 0 18px;}

/* link list: quiet rows, hairline separated, like the site's text-link rows */
.ev-linklist{margin-top:36px;}
.ev-linklist__h,.ev-bullets__h{font-family:var(--font-body,Inter);font-size:13px;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;color:var(--slate-500,#64748B);margin:0 0 6px;}
.ev-linklist ul{list-style:none;margin:0;padding:0;}
.ev-linklist li{border-bottom:1px solid var(--hairline,#E2E8F0);}
.ev-linklist a{display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:13px 2px;font-size:16px;font-weight:600;color:var(--ink,#0F172A);text-decoration:none;}
.ev-linklist a:hover{color:var(--green-700,#15803D);}
.ev-linklist__go{color:var(--green-700,#15803D);font-weight:400;}

/* bullets: short checklist, green markers, no card chrome */
.ev-bullets{margin:0 0 8px;}
.ev-bullets ul{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:14px;}
.ev-bullets li{position:relative;padding-left:28px;font-size:16.5px;line-height:1.55;
  color:var(--slate-800,#1E293B);}
/* Checkmark, not a hyphen bar (Lex 2026-07-26), SAME lime: the glyph is a MASK over the
   lime background, so the colour is literally the same token and the shape stays crisp
   vector at any size. Stroked-path mask matches Aaron own icon convention. */
.ev-bullets li::before{content:"";position:absolute;left:0;top:.28em;width:15px;height:15px;
  background:var(--lime,#4ADE80);border-radius:0;
  -webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A//www.w3.org/2000/svg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'3.2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M20%206L9%2017l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A//www.w3.org/2000/svg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'3.2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M20%206L9%2017l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;}

/* legal / policy doc treatment: separators give the wall of text a spine */
.ev-prose--doc h2{border-top:1px solid var(--hairline,#E2E8F0);padding-top:28px;margin-top:44px;}
.ev-prose--doc h2:first-child{border-top:0;padding-top:0;margin-top:0;}

/* gated right column: description reads before the form */
.ev-prose--gated{max-width:none;margin:0 0 22px;font-size:16px;}
.ev-prose--center{max-width:640px;margin:0 auto 28px;text-align:left;}

/* CVE exclusion list: a mono grid, not a hundred bullets */
.ev-cvelist{list-style:none;margin:14px 0 22px;padding:16px 18px;columns:3;column-gap:28px;
  background:var(--fill-1,#F8FAFC);border:1px solid var(--hairline,#E2E8F0);border-radius:12px;}
.ev-cvelist li{font-family:var(--font-mono,"SF Mono",monospace);font-size:13px;line-height:1.9;
  margin:0;break-inside:avoid;color:var(--slate-800,#1E293B);}
@media (max-width:760px){.ev-cvelist{columns:2;}}
@media (max-width:480px){.ev-cvelist{columns:1;}}

/* Wider hero lead for the demo page only (Lex 2026-07-26: wrap to 2 lines, not 3).
   .stub-hero__lead is Aaron GLOBAL class used by every stub hero, so widening it there
   would reflow contact/dealreg/scanners too. Scoped modifier instead. */
.stub-hero__lead.ev-lead--wide{max-width:68ch;}
