/**
 * Security & Trust — front end and editor.
 *
 * A panel (Midnight by default, Cloud, or the Cyber colourway) with a head and a grid of cards: the
 * featured certification card with a drawn badge, then cards with an icon, a
 * sentence, checked points and chips. Phone first: one column, the badge above
 * its text; from 701px two columns, with the featured and "wide" cards running
 * the full row and the badge beside its text.
 */
.wp-block-veramatic-security {
	--vsecu-ink: #fff;
	--vsecu-muted: var(--v-on-dark-2, rgba(234, 239, 255, 0.854));
	--vsecu-quiet: var(--v-on-dark-3, rgba(234, 239, 255, 0.618));
	--vsecu-line: var(--v-line-dark, rgba(234, 239, 255, 0.146));
	--vsecu-card: var(--v-fill-dark, rgba(234, 239, 255, 0.056));
	--vsecu-chip: var(--v-fill-dark-2, rgba(234, 239, 255, 0.09));
	--vsecu-accent: var(--v-blurple-tint, #c9bfff);
	--vsecu-check: var(--v-yellow, #ffd500);
	--vsecu-grad: var(--v-grad, linear-gradient(90deg, #7a5cff 0%, #cd45e9 20%, #ff5973 40%, #ff854c 60%, #ffaf24 80%, #ffd500 100%));
	--vsecu-feature: var(--v-midnight-2, #2a1c69);
	position: relative;
	box-sizing: border-box;
	margin: 0;
	padding: var(--v-s3, 1.618rem) var(--v-s2h, 1.272rem);
	border-radius: var(--v-r-panel, 20px);
	background:
		radial-gradient(70% 60% at 100% 0%, rgba(122, 92, 255, 0.30), transparent 62%),
		radial-gradient(50% 50% at 0% 100%, rgba(171, 7, 196, 0.18), transparent 60%),
		var(--v-midnight, #070028);
	font-family: var(--v-font, "Be Vietnam Pro", sans-serif);
	font-size: var(--v-fs-body, 1rem);
	line-height: var(--v-lh-text, 1.5);
	color: var(--vsecu-ink);
	scroll-margin-top: 24px;
}
.wp-block-veramatic-security.vsecu--light {
	--vsecu-ink: var(--v-midnight, #070028);
	--vsecu-muted: var(--v-midnight-2, #2a1c69);
	--vsecu-quiet: var(--v-ink-3, rgba(42, 28, 105, 0.764));
	--vsecu-line: var(--v-line-ink, rgba(7, 0, 40, 0.09));
	--vsecu-card: #fff;
	--vsecu-chip: var(--v-cloud, #eaefff);
	--vsecu-accent: var(--v-blurple-text, #654bda);
	--vsecu-check: var(--v-blurple-text, #654bda);
	--vsecu-feature: #fff;
	background: var(--v-cloud, #eaefff);
}
/* Cyber (block setting): a terminal accent for security content, on the family's own ground.
   The panel is Midnight, like the panels it sits between, and its text, card fills and
   hairlines are the usual Cloud-on-Midnight tokens, so beside a Cloud or a Midnight panel it
   reads as one of them. What makes it "cyber" is the signal: a green that is not the raw
   #00ff41 of a terminal but the third colour of the triad Blurple and Tangerine already
   belong to (hues 255°, 15° and 150°), used only where Yellow and the Blurple tint are used
   on the Midnight tone (checks, icons, the link, chip text),
   plus a green glow in one corner, Blurple in the other, and a faint Cloud grid for the
   screen. The featured card and the badge run green into Blurple. */
.wp-block-veramatic-security.vsecu--cyber {
	--vsecu-green: #4dffa6;
	--vsecu-accent: var(--vsecu-green);
	--vsecu-check: var(--vsecu-green);
	--vsecu-grad: linear-gradient(90deg, #4dffa6 0%, #35e0c0 40%, #7a5cff 100%);
	--vsecu-feature: #120c47; /* between Midnight and Light Midnight: the Midnight tone's card, a step darker */
	--vsecu-b1: #4dffa6;
	--vsecu-b2: #35e0c0;
	--vsecu-b3: #5aa0ff;
	--vsecu-b4: #7a5cff;
	--vsecu-b5: #b9ffdd; /* the badge's small line */
	background:
		radial-gradient(60% 55% at 100% 0%, rgba(77, 255, 166, 0.13), transparent 62%),
		radial-gradient(55% 55% at 0% 100%, rgba(122, 92, 255, 0.30), transparent 60%),
		repeating-linear-gradient(0deg, rgba(234, 239, 255, 0.035) 0 1px, transparent 1px 32px),
		repeating-linear-gradient(90deg, rgba(234, 239, 255, 0.035) 0 1px, transparent 1px 32px),
		var(--v-midnight, #070028);
}
.wp-block-veramatic-security.vsecu--cyber .vsecu-item__chips li { color: var(--vsecu-green); }
.wp-block-veramatic-security.vsecu--cyber .vsecu-item__icon { background: rgba(77, 255, 166, 0.09); box-shadow: inset 0 0 0 1px rgba(77, 255, 166, 0.236); }
.wp-block-veramatic-security.vsecu--cyber .vsecu-badge { filter: drop-shadow(0 10px 26px rgba(7, 0, 40, 0.382)) drop-shadow(0 0 18px rgba(77, 255, 166, 0.146)); }
.wp-block-veramatic-security *,
.wp-block-veramatic-security *::before,
.wp-block-veramatic-security *::after { box-sizing: inherit; }
.entry-content > .wp-block-veramatic-security:first-child { margin-top: -1.5em; }
/* Width: a panel in the page column, or a band edge to edge */
.wp-block-veramatic-security.vsecu--full,
.wp-block-veramatic-security.vsecu--full-contained { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw) !important; /* !important: a left/right margin set in the editor (even 0) must not cancel the breakout */ margin-right: calc(50% - 50vw) !important; padding-left: 0; padding-right: 0; border-radius: 0 !important; }
.wp-block-veramatic-security.vsecu--full .vsecu__inner,
.wp-block-veramatic-security.vsecu--full-contained .vsecu__inner { margin: 0 auto; padding: 0 var(--v-gutter, 20px); }
.wp-block-veramatic-security.vsecu--full-contained .vsecu__inner { max-width: var(--v-max, 1440px); }
@media (min-width: 1480px) {
	.wp-block-veramatic-security.vsecu--full-contained .vsecu__inner { padding-left: 0; padding-right: 0; }
}
.wp-block-veramatic-security .vsecu__mono {
	font-family: var(--v-font-mono, "IBM Plex Mono", monospace);
	font-weight: var(--v-fw-medium, 500);
	font-size: var(--v-fs-caption, 0.786rem);
	letter-spacing: var(--v-ls-mono, 0.06em);
	text-transform: uppercase;
}
/* Head */
.wp-block-veramatic-security .vsecu__head { max-width: 760px; margin: 0 0 var(--v-s3, 1.618rem); }
.wp-block-veramatic-security .vsecu__kicker { display: block; margin: 0 0 var(--v-s2, 1rem); color: var(--vsecu-muted); } /* as the other panels: Cloud at 85% on Midnight */
.wp-block-veramatic-security.vsecu--light .vsecu__kicker { color: inherit; } /* and the panel's ink on a light one */
.wp-block-veramatic-security .vsecu__h2 {
	margin: 0;
	font-family: var(--v-font, "Be Vietnam Pro", sans-serif);
	font-size: var(--v-fs-h2, 1.618rem);
	font-weight: var(--v-fw-regular, 400);
	line-height: var(--v-lh-head, 1.2);
	letter-spacing: var(--v-ls-head, -0.01em);
	text-transform: none;
	color: var(--vsecu-ink) !important;
}
.wp-block-veramatic-security .vsecu__h2 .callout-gradient { font-weight: inherit; }
.wp-block-veramatic-security .vsecu__deck { margin: var(--v-s2, 1rem) 0 0; font-size: var(--v-fs-body, 1rem); font-weight: var(--v-fw-regular, 400) !important; line-height: var(--v-lh-body, 1.618); color: var(--vsecu-muted); }
/* Head: copy on the left, an optional link on the right (under the copy on a phone) */
.wp-block-veramatic-security .vsecu__head-copy { min-width: 0; }
.wp-block-veramatic-security .vsecu__more { display: inline-flex; align-items: center; min-height: 44px; margin-top: var(--v-s1, 0.618rem); padding: 0; font-weight: var(--v-fw-semibold, 600); text-decoration: none; white-space: nowrap; color: var(--vsecu-accent); }
.wp-block-veramatic-security .vsecu__more:hover { text-decoration: underline; text-underline-offset: 3px; }
.wp-block-veramatic-security .vsecu__more:focus-visible { outline: 3px solid var(--vsecu-accent); outline-offset: 3px; }
/* Grid and cards */
.wp-block-veramatic-security .vsecu__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--v-s2, 1rem); margin: 0; padding: 0; list-style: none; }
.wp-block-veramatic-security .vsecu-item {
	display: flex;
	flex-direction: column;
	gap: var(--v-s2h, 1.272rem);
	min-width: 0;
	margin: 0;
	padding: var(--v-s2h, 1.272rem);
	border: 1px solid var(--vsecu-line);
	border-radius: var(--v-r-card, 12px);
	background: var(--vsecu-card);
	font-size: var(--v-fs-body, 1rem); /* li: the theme sizes .entry-content ul li larger */
	color: var(--vsecu-ink);
}
.wp-block-veramatic-security .vsecu-item::before { display: none; }
.wp-block-veramatic-security .vsecu-item__body { min-width: 0; }
.wp-block-veramatic-security .vsecu-item__icon { display: grid; place-items: center; width: 44px; height: 44px; margin: 0 0 var(--v-s2, 1rem); border-radius: var(--v-r-sm, 8px); background: var(--vsecu-chip); color: var(--vsecu-accent); }
.wp-block-veramatic-security .vsecu-item__icon svg { width: 24px; height: 24px; }
.wp-block-veramatic-security .vsecu-item__title {
	margin: 0 0 var(--v-s1, 0.618rem);
	font-family: var(--v-font, "Be Vietnam Pro", sans-serif);
	font-size: var(--v-fs-h3, 1.272rem);
	font-weight: var(--v-fw-regular, 400);
	line-height: var(--v-lh-sub, 1.3);
	letter-spacing: var(--v-ls-head, -0.01em);
	text-transform: none;
	color: var(--vsecu-ink) !important; /* theme: .entry-content h3 colour is !important */
}
.wp-block-veramatic-security .vsecu-item__text { margin: 0; font-size: var(--v-fs-body, 1rem); font-weight: var(--v-fw-regular, 400) !important; line-height: var(--v-lh-body, 1.618); color: var(--vsecu-muted); }
.wp-block-veramatic-security .vsecu-item__text + .vsecu-item__points,
.wp-block-veramatic-security .vsecu-item__text + .vsecu-item__chips { margin-top: var(--v-s2, 1rem); }
.wp-block-veramatic-security .vsecu-item__points { margin: 0; padding: 0; list-style: none; }
.wp-block-veramatic-security .vsecu-item__points li { display: flex; align-items: flex-start; gap: var(--v-s1h, 0.786rem); margin: 0; padding: var(--v-s1, 0.618rem) 0; border-top: 1px solid var(--vsecu-line); font-size: var(--v-fs-body, 1rem); line-height: var(--v-lh-text, 1.5); color: var(--vsecu-ink); }
.wp-block-veramatic-security .vsecu-item__points li:first-child { border-top: 0; padding-top: 0; }
.wp-block-veramatic-security .vsecu-item__points li::before { display: none; }
.wp-block-veramatic-security .vsecu-item__points svg { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 3px; color: var(--vsecu-check); }
.wp-block-veramatic-security .vsecu-item__chips { display: flex; flex-wrap: wrap; gap: var(--v-s0h, 0.486rem); margin: 0; padding: 0; list-style: none; }
.wp-block-veramatic-security .vsecu-item__chips li { margin: 0; padding: 6px 12px; border: 1px solid var(--vsecu-line); border-radius: var(--v-r-pill, 999px); background: var(--vsecu-chip); font-family: var(--v-font-mono, "IBM Plex Mono", monospace); font-size: var(--v-fs-caption, 0.786rem); font-weight: var(--v-fw-medium, 500); letter-spacing: 0.02em; line-height: 1.4; color: var(--vsecu-ink); }
.wp-block-veramatic-security .vsecu-item__chips li::before { display: none; }
/* Featured: the certification, with its badge */
.wp-block-veramatic-security .vsecu-item--featured { border-color: transparent; background: linear-gradient(var(--vsecu-feature), var(--vsecu-feature)) padding-box, var(--vsecu-grad) border-box; }
.wp-block-veramatic-security .vsecu-item__badge { flex: 0 0 auto; width: 112px; line-height: 0; }
.wp-block-veramatic-security .vsecu-badge { display: block; width: 100%; height: auto; filter: drop-shadow(0 10px 26px rgba(7, 0, 40, 0.382)); }
.wp-block-veramatic-security .vsecu-item--featured .vsecu-item__title { font-size: var(--v-fs-h2, 1.618rem); line-height: var(--v-lh-head, 1.2); }
.wp-block-veramatic-security .vsecu-item--featured .vsecu-item__text { max-width: 46em; }

/* ── Compact layout (block setting): the title and four tight cards across ──
   For a pricing or product page, where security is a reassurance, not the subject.
   A card is its icon, its title and one line. The panel keeps the padding and the head
   type of every other panel; only the cards are tight. Phone first: each card is a row
   (icon beside the text); two across from 601px, four from 1001px. */
.wp-block-veramatic-security.vsecu--compact .vsecu__head { max-width: none; margin-bottom: var(--v-s3, 1.618rem); }
.wp-block-veramatic-security.vsecu--compact .vsecu__grid { gap: var(--v-s1h, 0.786rem); }
.wp-block-veramatic-security .vsecu-item--compact { flex-direction: row; align-items: flex-start; gap: var(--v-s2, 1rem); padding: var(--v-s2, 1rem); }
.wp-block-veramatic-security .vsecu-item--compact .vsecu-item__icon { flex: 0 0 auto; width: 36px; height: 36px; margin: 0; }
.wp-block-veramatic-security .vsecu-item--compact .vsecu-item__icon svg { width: 20px; height: 20px; }
.wp-block-veramatic-security .vsecu-item--compact .vsecu-item__title,
.wp-block-veramatic-security .vsecu-item--compact.vsecu-item--featured .vsecu-item__title { margin: 0 0 var(--v-s00, 0.236rem); font-size: var(--v-fs-body, 1rem); font-weight: var(--v-fw-semibold, 600); line-height: var(--v-lh-sub, 1.3); letter-spacing: 0; }
.wp-block-veramatic-security .vsecu-item--compact .vsecu-item__text { font-size: var(--v-fs-small, 0.887rem); line-height: var(--v-lh-text, 1.5); }
.wp-block-veramatic-security .vsecu-item--compact .vsecu-item__text--clamp { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.wp-block-veramatic-security .vsecu-item--compact.vsecu-item--featured .vsecu-item__icon { background: var(--vsecu-grad); color: var(--v-midnight, #070028); }
@media (min-width: 601px) {
	.wp-block-veramatic-security.vsecu--compact .vsecu__head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--v-s2, 1rem) var(--v-s4, 2.618rem); margin-bottom: var(--v-s3, 1.618rem); }
	.wp-block-veramatic-security.vsecu--compact .vsecu__more { margin-top: 0; }
	.wp-block-veramatic-security.vsecu--compact .vsecu__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--v-s2, 1rem); }
}
@media (min-width: 1001px) {
	.wp-block-veramatic-security.vsecu--compact .vsecu__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.wp-block-veramatic-security .vsecu-item--compact { flex-direction: column; gap: var(--v-s1h, 0.786rem); padding: var(--v-s2h, 1.272rem); }
}

@media (min-width: 701px) {
	.wp-block-veramatic-security:not(.vsecu--compact) .vsecu__head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--v-s2, 1rem) var(--v-s4, 2.618rem); max-width: none; }
	.wp-block-veramatic-security:not(.vsecu--compact) .vsecu__head-copy { max-width: 760px; }
	.wp-block-veramatic-security:not(.vsecu--compact) .vsecu__more { margin-top: 0; }
	.wp-block-veramatic-security { padding: var(--v-s5, 4.236rem); }
	.wp-block-veramatic-security.vsecu--full,
	.wp-block-veramatic-security.vsecu--full-contained { padding-top: var(--v-s5, 4.236rem); padding-bottom: var(--v-s5, 4.236rem); }
	.wp-block-veramatic-security .vsecu__head { margin-bottom: var(--v-s4, 2.618rem); }
	.wp-block-veramatic-security .vsecu__deck { font-size: var(--v-fs-lead, 1.128rem); }
	.wp-block-veramatic-security:not(.vsecu--compact) .vsecu__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--v-s2h, 1.272rem); }
	.wp-block-veramatic-security .vsecu-item:not(.vsecu-item--compact) { padding: var(--v-s3, 1.618rem); }
	.wp-block-veramatic-security .vsecu-item--wide { grid-column: 1 / -1; }
	.wp-block-veramatic-security .vsecu-item--featured:not(.vsecu-item--compact) { flex-direction: row; align-items: center; gap: var(--v-s4, 2.618rem); padding: var(--v-s3h, 2.058rem) var(--v-s4, 2.618rem); }
	.wp-block-veramatic-security .vsecu-item__badge { width: 150px; }
}
@media (min-width: 701px) and (max-width: 1100px) {
	.wp-block-veramatic-security { padding: var(--v-s4, 2.618rem); }
	.wp-block-veramatic-security.vsecu--full,
	.wp-block-veramatic-security.vsecu--full-contained { padding-left: 0; padding-right: 0; }
}