/*
Theme Name: WZ Technology
Theme URI: https://wz-technology.id
Description: Child theme Hello Elementor untuk website company profile WZ Technology. Layout dan konten diatur di Elementor; file ini hanya berisi gaya brand tambahan (pola, bingkai screenshot, ikon list).
Author: WZ Technology
Template: hello-elementor
Version: 1.0.0
Requires PHP: 7.4
Text Domain: wz-technology
*/

/* ==========================================================================
   Brand tokens (mirror Elementor Site Settings > Global Colors)
   ========================================================================== */
:root {
	--wz-navy: #203864;
	--wz-navy-700: #2c4a7e;
	--wz-navy-dark: #172a4d;
	--wz-yellow: #fbb812;
	--wz-yellow-hover: #ffcd3c;
	--wz-white: #ffffff;
	--wz-alt: #f4f6fa;
	--wz-tint: #fff4d6;
	--wz-ink: #203864;
	--wz-muted: #4a5a75;
	--wz-inv-muted: #c3cde0;
	--wz-accent: #2f5ea8;
	--wz-line: #dde3ed;
	--wz-line-strong: #4a5a75;
	--wz-line-inv: #34507f;
	--wz-success: #1b7f4c;
	--wz-shadow-card: 0 1px 2px rgba(32, 56, 100, .06), 0 8px 24px rgba(32, 56, 100, .06);
	--wz-shadow-raised: 0 2px 4px rgba(32, 56, 100, .08), 0 16px 40px rgba(32, 56, 100, .14);
	--wz-dots: radial-gradient(var(--wz-navy-700) 2px, transparent 2.5px);
	--wz-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
	--wz-ic-check: 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.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='5 12.5 10 17.5 19 7'/%3E%3C/svg%3E");
	--wz-ic-ext: 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.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4h6v6'/%3E%3Cline x1='20' y1='4' x2='11' y2='13'/%3E%3Cpath d='M18 14v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5'/%3E%3C/svg%3E");
}

/* ==========================================================================
   Base
   ========================================================================== */
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; }
:focus-visible { outline: 2px solid var(--wz-accent); outline-offset: 2px; border-radius: 4px; }
.e-con[class*="wz-"] :focus-visible { outline-offset: 2px; }

/* Text widgets: spacing between paragraphs is controlled here, not by theme defaults. */
.elementor-widget-text-editor p { margin: 0; }
.elementor-widget-text-editor p + p { margin-top: 16px; }
.elementor-widget-text-editor ul,
.elementor-widget-text-editor ol { margin: 0; }

/* Stroke icons (uploaded SVG): Elementor colors SVGs with `fill`; ours use `stroke`, so keep fill off. */
.elementor-icon svg[stroke="currentColor"],
.elementor-button-icon svg[stroke="currentColor"],
.elementor-icon-list-icon svg[stroke="currentColor"] { fill: none !important; }
.elementor-button .elementor-button-icon svg { width: 18px; height: 18px; }
.wz-btn--sm .elementor-button .elementor-button-icon svg,
.wz-tlink .elementor-button .elementor-button-icon svg { width: 16px; height: 16px; }

/* Buttons: same height regardless of icon. */
.wz-btn .elementor-button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; white-space: nowrap; transition: background-color .15s, border-color .15s, color .15s; }
.wz-btn.wz-btn--sm .elementor-button { min-height: 40px; }
.wz-tlink .elementor-button { min-height: 0; }
.wz-tlink .elementor-button:hover .elementor-button-text { text-decoration: underline; text-underline-offset: 3px; }
.wz-tlink--wrap .elementor-button { white-space: normal; text-align: left; word-break: break-word; }

/* Push an element to the bottom of a flex card. */
.wz-push { margin-top: auto !important; }

/* Yellow words in hero titles: wrap them in <em>…</em> in the Heading text. */
.wz-hl em { font-style: normal; color: var(--wz-yellow); }

/* Small yellow dot inside labels: <span class="wz-dot"></span> */
.wz-dot { display: inline-block; flex: none; width: 12px; height: 12px; border-radius: 50%; background: var(--wz-yellow); margin-right: 8px; vertical-align: -1px; }
.wz-eyebrow-dot .elementor-heading-title { display: flex; align-items: center; }

/* ==========================================================================
   Header & footer
   ========================================================================== */
.wz-header { z-index: 100; }
.wz-header.elementor-sticky--effects { box-shadow: 0 1px 0 var(--wz-line), 0 8px 24px rgba(32, 56, 100, .06); }
.wz-logo img { height: auto; display: block; }
.wz-nav .elementor-nav-menu--dropdown { border-top: 1px solid var(--wz-line); box-shadow: 0 16px 40px rgba(32, 56, 100, .14); }
.wz-nav .elementor-menu-toggle { border-style: solid; border-color: var(--wz-line-strong); width: 44px; height: 44px; justify-content: center; }

.wz-footlinks ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.wz-footlinks a { color: inherit; text-decoration: none; }
.wz-footlinks a:hover { color: var(--wz-white); text-decoration: underline; }
.wz-social-icon .elementor-icon { border-color: var(--wz-inv-muted) !important; }
.wz-social-icon .elementor-icon:hover { border-color: var(--wz-white) !important; }
.wz-footer :focus-visible, .wz-pagehero :focus-visible, .wz-hero :focus-visible, .wz-cta :focus-visible { outline-color: var(--wz-yellow); }

/* ==========================================================================
   Home hero
   ========================================================================== */
.wz-hero__art { position: relative; aspect-ratio: 1 / 1; max-width: 460px; justify-self: end; }
.wz-hero__img, .wz-hero__img img { width: 100%; height: 100%; display: block; }
.wz-hero__chip { position: absolute !important; left: 0; bottom: 3%; width: auto !important; max-width: calc(100% - 16px); }
@media (max-width: 960px) {
	.wz-hero__art { justify-self: start; max-width: 360px; }
}

/* ==========================================================================
   Inner page hero
   ========================================================================== */
.wz-pagehero__inner { position: relative; z-index: 1; }
.wz-pagehero__deco { position: absolute !important; right: 0; top: 50%; transform: translateY(-50%); width: 360px !important; max-width: none !important; z-index: 0; pointer-events: none; }
.wz-pagehero__deco img { width: 360px; height: 240px; display: block; }
@media (max-width: 960px) { .wz-pagehero__deco { opacity: .35; } }

.wz-crumbs p, nav.wz-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; }
.wz-crumbs a { color: inherit; text-decoration: none; }
.wz-crumbs a:hover { color: var(--wz-white); text-decoration: underline; }
.wz-crumbs [aria-current] { color: var(--wz-white); font-weight: 600; }
nav.wz-crumbs--light { font-size: 14px; line-height: 20px; color: var(--wz-muted); }
.wz-crumbs--light a:hover { color: var(--wz-ink); }
.wz-crumbs--light [aria-current] { color: var(--wz-ink); }

.wz-subnav p { display: flex; flex-wrap: wrap; gap: 8px; }
.wz-subnav a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1.5px solid var(--wz-inv-muted); color: var(--wz-white); text-decoration: none; font-weight: 600; }
.wz-subnav a:hover { border-color: var(--wz-yellow); color: var(--wz-yellow); }

/* ==========================================================================
   Lists (edit as normal bullet lists in the Text Editor widget)
   ========================================================================== */
/* ✓ checklist (accent check) */
.wz-checklist ul { list-style: none; padding: 0; display: grid; gap: 6px; }
.wz-checklist li { display: flex; gap: 8px; align-items: flex-start; }
.wz-checklist li::before { content: ""; flex: none; width: 18px; height: 18px; margin-top: 2px; background: var(--wz-accent); -webkit-mask: var(--wz-ic-check) center / contain no-repeat; mask: var(--wz-ic-check) center / contain no-repeat; }
.wz-checklist--2col ul { grid-template-columns: 1fr 1fr; gap: 12px 24px; }
@media (max-width: 640px) { .wz-checklist--2col ul { grid-template-columns: 1fr; } }

/* ✓ in a tinted tile (service detail) */
.wz-ticklist ul { list-style: none; padding: 0; display: grid; gap: 12px; }
.wz-ticklist li { display: flex; gap: 12px; align-items: center; }
.wz-ticklist li::before { content: ""; flex: none; width: 32px; height: 32px; border-radius: 6px; background: var(--wz-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23203864' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='5 12.5 10 17.5 19 7'/%3E%3C/svg%3E") center / 18px no-repeat; }

/* • yellow dot list (on navy) */
.wz-dotlist ul { list-style: none; padding: 0; display: grid; gap: 8px; }
.wz-dotlist li { display: flex; gap: 12px; }
.wz-dotlist li::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--wz-yellow); margin-top: 10px; }

/* pill tags */
.wz-tags ul { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.wz-tags li { padding: 4px 12px; border-radius: 999px; border: 1px solid var(--wz-line); font-size: 13px; line-height: 20px; font-weight: 600; }

/* numbered steps (contact) */
.wz-next ol { list-style: none; counter-reset: next; padding: 0; display: grid; gap: 16px; }
.wz-next li { counter-increment: next; display: grid; grid-template-columns: 32px 1fr; column-gap: 12px; }
.wz-next li::before { content: counter(next); grid-row: span 2; width: 32px; height: 32px; border-radius: 50%; background: var(--wz-navy); color: var(--wz-white); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; }
.wz-next strong { color: var(--wz-ink); display: block; }
.wz-next span { font-size: 15px; line-height: 22px; }

/* product links list (contact) */
.wz-prodlinks ul { list-style: none; padding: 0; border-top: 1px solid var(--wz-line); }
.wz-prodlinks a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--wz-line); text-decoration: none; color: var(--wz-ink); font-weight: 600; }
.wz-prodlinks .wz-url, .wz-ext .elementor-heading-title { display: inline-flex; align-items: center; gap: 6px; font-family: var(--wz-mono); font-size: 13px; line-height: 18px; font-weight: 400; color: var(--wz-accent); }
.wz-prodlinks .wz-url::after, .wz-ext .elementor-heading-title::after { content: ""; flex: none; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--wz-ic-ext) center / contain no-repeat; mask: var(--wz-ic-ext) center / contain no-repeat; }
.wz-prodlinks a:hover .wz-url { text-decoration: underline; }
.wz-ext .elementor-heading-title a { color: inherit; }

/* "Cocok untuk" line with yellow dot */
.wz-fit p { display: flex; align-items: center; gap: 0; }
.wz-fit strong { color: var(--wz-ink); }

/* ==========================================================================
   Product cards (home)
   ========================================================================== */
.wz-product--wide { grid-column: span 2; }
.wz-product__media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; display: flex !important; flex-direction: row !important; align-items: flex-end !important; justify-content: center !important; padding: 24px 24px 0 !important;
	background-color: var(--wz-navy); background-image: var(--wz-dots); background-size: 48px 48px; background-position: 12px 12px; }
.wz-product__media .elementor-widget-image { height: 100%; width: 100%; }
.wz-shot img { width: 100% !important; height: 100% !important; object-fit: cover; object-position: top left; border-radius: 10px 10px 0 0; box-shadow: 0 -2px 24px rgba(0, 0, 0, .25); background: var(--wz-white); display: block; }
.wz-product__media--phone .elementor-widget-image { width: 50%; }
.wz-product__media--phone .wz-shot img { object-position: top center; border-radius: 22px 22px 0 0; border: 6px solid var(--wz-navy-700); border-bottom: 0; }
.wz-product__media--art { padding: 0 !important; align-items: stretch !important; background-image: none; }
.wz-art img { width: 100% !important; height: 100% !important; object-fit: contain; display: block; }
.wz-product--wide > .wz-product__media { width: 48% !important; flex: none; aspect-ratio: auto; padding: 32px 0 0 32px !important; justify-content: flex-start !important; }
.wz-product--wide .wz-shot img { border-radius: 10px 0 0 0; }
@media (max-width: 960px) {
	.wz-product--wide { grid-column: span 2; }
}
@media (max-width: 640px) {
	.wz-product--wide { grid-column: auto; }
	.wz-product--wide > .wz-product__media { width: 100% !important; aspect-ratio: 16 / 10; }
}

/* ==========================================================================
   Photo with caption pill
   ========================================================================== */
.wz-figure { position: relative; }
.wz-figure__img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 16px; display: block; }
.wz-figure__tag { position: absolute !important; left: 16px; bottom: 16px; width: auto !important; }
.wz-figure__tag .elementor-heading-title { display: inline-flex; align-items: center; background: var(--wz-white); border-radius: 999px; padding: 8px 14px 8px 10px; font-weight: 600; box-shadow: var(--wz-shadow-card); }

/* ==========================================================================
   Service / product detail visuals
   ========================================================================== */
.wz-visual { position: relative; aspect-ratio: 4 / 3; border-radius: 16px; overflow: hidden;
	background-color: var(--wz-navy); background-image: var(--wz-dots); background-size: 48px 48px; background-position: 12px 12px; }
.wz-visual__art { position: absolute !important; inset: 0; }
.wz-visual__art img { width: 100%; height: 100%; display: block; }
.wz-visual--art { background-image: none; }
.wz-visual--art .wz-visual__img { position: absolute !important; inset: 0; padding: 16px; }
.wz-visual--art .wz-visual__img img { width: 100%; height: 100%; object-fit: contain; display: block; }

.wz-visual__win { position: absolute !important; left: 8%; top: 10%; width: 82% !important; }
.wz-visual__win img { width: 100%; border-radius: 10px; box-shadow: 0 8px 32px rgba(0, 0, 0, .3); background: var(--wz-white); display: block; }
.wz-visual__phone { position: absolute !important; right: 6%; bottom: -6%; width: 26% !important; }
.wz-visual__phone img { width: 100%; border-radius: 18px; border: 5px solid var(--wz-navy-700); box-shadow: 0 8px 32px rgba(0, 0, 0, .35); display: block; }
.wz-visual__cap { position: absolute !important; left: 16px; bottom: 16px; width: auto !important; }
.wz-visual__cap .elementor-heading-title { background: var(--wz-white); border-radius: 999px; padding: 6px 12px; font-size: 12px; line-height: 18px; font-weight: 600; box-shadow: var(--wz-shadow-card); }

.wz-visual--win, .wz-visual--phone { display: flex !important; flex-direction: row !important; justify-content: center !important; padding: 32px 32px 0 !important; }
.wz-visual--win { align-items: flex-end !important; }
.wz-visual--win .wz-visual__img { width: 100% !important; height: 100%; }
.wz-visual--win .wz-visual__img img { width: 100%; height: 100%; object-fit: cover; object-position: top left; border-radius: 10px 10px 0 0; box-shadow: 0 -2px 24px rgba(0, 0, 0, .25); background: var(--wz-white); display: block; }
.wz-visual--phone { align-items: flex-start !important; }
.wz-visual--phone .wz-visual__img { width: 100% !important; text-align: center; }
.wz-visual--phone .wz-visual__img img { width: 56%; height: auto; border-radius: 24px 24px 0 0; border: 6px solid var(--wz-navy-700); border-bottom: 0; box-shadow: 0 -2px 24px rgba(0, 0, 0, .3); }

/* Expertise cards: "Produk siap pakai: Hazkia ↗" */
.wz-exp__prod .elementor-heading-title { display: inline-flex; align-items: center; gap: 0; font-family: inherit; font-size: 14px; line-height: 20px; font-weight: 600; }
.wz-exp__prod .wz-dot { margin-right: 8px; }
.wz-exp__prod.wz-ext .elementor-heading-title::after { margin-left: 8px; }
.wz-exp__prod:not(.wz-ext) .elementor-heading-title { font-weight: 500; }
.wz-exp__prod a:hover { text-decoration: underline; }

/* Ecosystem flow arrows (navy band) */
.wz-flow > .e-con-inner > .wz-flow__step, .wz-flow > .wz-flow__step { position: relative; }
.wz-flow .wz-flow__step:not(:last-child)::after { content: ""; position: absolute; right: -18px; top: 50%; width: 12px; height: 12px; border-top: 3px solid var(--wz-yellow); border-right: 3px solid var(--wz-yellow); transform: translateY(-50%) rotate(45deg); }
@media (max-width: 960px) { .wz-flow .wz-flow__step:nth-child(2)::after { display: none; } }
@media (max-width: 640px) {
	.wz-flow .wz-flow__step:not(:last-child)::after { display: block; right: auto; left: 50%; top: auto; bottom: -18px; transform: translateX(-50%) rotate(135deg); }
}

/* Ecosystem product tiles */
.wz-eco { color: inherit; text-decoration: none; }

/* ==========================================================================
   Map
   ========================================================================== */
.wz-map, .wz-map iframe { border-radius: 16px; overflow: hidden; }
.wz-map iframe { display: block; border: 1px solid var(--wz-line); }
.wz-mapwide { position: relative; }
.wz-mapwide__card { position: absolute !important; left: 24px; bottom: 24px; max-width: 380px; width: auto !important; z-index: 2; }
@media (max-width: 640px) {
	.wz-mapwide__card { position: static !important; max-width: none; margin-top: 16px; box-shadow: none !important; border: 1px solid var(--wz-line); }
}

/* ==========================================================================
   Contact form (Elementor Pro Form)
   ========================================================================== */
.wz-form .elementor-field-group .elementor-field-textual { min-height: 48px; padding: 11px 14px; font-size: 16px; line-height: 24px; }
.wz-form .elementor-field-group textarea.elementor-field-textual { min-height: 120px; resize: vertical; }
.wz-form .elementor-field-textual::placeholder { color: var(--wz-muted); opacity: 1; }
.wz-form .elementor-field-textual:focus { outline: 2px solid var(--wz-accent); outline-offset: 1px; border-color: var(--wz-accent) !important; box-shadow: none; }
.wz-form .elementor-select-wrapper .select-caret-down-wrapper { right: 14px; color: var(--wz-ink); }
.wz-form .elementor-button { min-height: 48px; width: 100%; }
.wz-form .elementor-message { font-weight: 600; font-size: 14px; margin-top: 12px; }

/* ==========================================================================
   Articles: cards, loop, single
   ========================================================================== */
.wz-acard, .wz-acard:hover { color: inherit; text-decoration: none; }
.wz-cover img, .wz-acard__thumb img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; display: block; }
.wz-acard__thumb--big img { border-radius: 16px; }
.wz-acard:hover .wz-acard__title .elementor-heading-title { text-decoration: underline; text-decoration-color: var(--wz-yellow); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.wz-afeat:hover .wz-acard__title .elementor-heading-title { text-decoration-thickness: 3px; text-underline-offset: 6px; }
.wz-badge .elementor-heading-title { display: inline-flex; padding: 4px 10px; border-radius: 999px; background: var(--wz-tint); color: var(--wz-ink); font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: .02em; }
.wz-meta { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; font-size: 13px; line-height: 18px; color: var(--wz-muted); }
.wz-thumb-hero img { aspect-ratio: 21 / 8; border-radius: 16px; }
@media (max-width: 640px) { .wz-thumb-hero img { aspect-ratio: 16 / 9; } }
.wz-avatar img { width: 36px; height: 36px; border-radius: 50%; object-fit: contain; background: var(--wz-alt); border: 1px solid var(--wz-line); padding: 6px; display: block; }
.wz-avatar.wz-avatar--lg img { width: 56px; height: 56px; padding: 10px; }
.wz-avatar { width: auto !important; flex: none; }
.e-con .wz-avatar + .elementor-widget-shortcode .wz-meta { font-size: 14px; }
.e-loop-nothing-found-message { margin: 0; }

/* Article list: category chips + search */
.wz-chips .e-filter { display: flex; flex-wrap: wrap; gap: 8px; }
.wz-chips .e-filter-item { min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1.5px solid var(--wz-line-strong); background: transparent; color: var(--wz-ink); font-size: 14px; font-weight: 600; cursor: pointer; }
.wz-chips .e-filter-item:hover { border-color: var(--wz-ink); }
.wz-chips .e-filter-item[aria-pressed="true"] { background: var(--wz-navy); border-color: var(--wz-navy); color: var(--wz-white); }
.wz-search .elementor-search-form__container { border: 1.5px solid var(--wz-line-strong) !important; border-radius: 999px !important; min-height: 44px; overflow: hidden; background: var(--wz-white); }
.wz-search .elementor-search-form__input { font-size: 15px; color: var(--wz-ink); }
.wz-search .elementor-search-form__icon { color: var(--wz-muted); padding-left: 16px; }

/* Single article layout */
.wz-aside { position: sticky !important; top: 104px; }
@media (max-width: 960px) { .wz-aside { position: static !important; } }
.wz-toc .elementor-toc__header { padding: 0 0 8px; border: 0; }
.wz-toc .elementor-toc__header-title { font-family: var(--wz-mono); font-size: 13px; line-height: 16px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--wz-accent); }
.wz-toc .elementor-toc__body { padding: 0; border-left: 2px solid var(--wz-line); }
.wz-toc .elementor-toc__list-wrapper { margin: 0; padding: 0; list-style: none; }
.wz-toc .elementor-toc__list-item { margin: 0; }
.wz-toc .elementor-toc__list-item-text-wrapper::before { display: none; }
.wz-toc .elementor-toc__list-item-text { display: block; padding: 6px 0 6px 16px; margin-left: -2px; border-left: 2px solid transparent; font-size: 14px; line-height: 20px; text-decoration: none; }
.wz-toc .elementor-toc__list-item-text:hover, .wz-toc .elementor-toc__list-item-text.elementor-item-active { color: var(--wz-ink); border-left-color: var(--wz-yellow); }
.wz-share .elementor-share-btn { border-radius: 50%; }

/* Post content typography (what you write in Posts › Add New) */
.wz-article { font-size: 18px; line-height: 31px; color: var(--wz-ink); }
.wz-article > * + *, .wz-article .elementor-widget-container > * + * { margin-top: 24px; }
.wz-article p { margin: 0; }
.wz-article p + p { margin-top: 24px; }
.wz-article h2 { font-size: 28px; line-height: 36px; font-weight: 800; letter-spacing: -.01em; margin: 48px 0 0; scroll-margin-top: 104px; }
.wz-article h3 { font-size: 21px; line-height: 30px; font-weight: 700; margin: 32px 0 0; scroll-margin-top: 104px; }
.wz-article h2 + *, .wz-article h3 + * { margin-top: 16px; }
.wz-article ul, .wz-article ol { padding-left: 24px; margin: 24px 0 0; display: grid; gap: 8px; }
.wz-article li::marker { color: var(--wz-accent); font-weight: 700; }
.wz-article a { color: var(--wz-accent); text-decoration: underline; text-underline-offset: 3px; }
.wz-article blockquote, .wz-article .wp-block-quote { margin: 32px 0 0; padding: 8px 0 8px 24px; border-left: 4px solid var(--wz-yellow); font-size: 22px; line-height: 32px; font-weight: 700; color: var(--wz-ink); }
.wz-article blockquote cite { display: block; margin-top: 8px; font-size: 15px; font-weight: 500; font-style: normal; color: var(--wz-muted); }
.wz-article img { border-radius: 16px; }
.wz-article figure { margin: 32px 0 0; }
.wz-article figcaption { font-size: 14px; line-height: 20px; color: var(--wz-muted); margin-top: 8px; text-align: center; }
.wz-article table { border-collapse: collapse; width: 100%; font-size: 15px; line-height: 22px; }
.wz-article .wp-block-table { overflow-x: auto; border: 1px solid var(--wz-line); border-radius: 10px; }
.wz-article .wp-block-table table { border: 0; }
.wz-article th, .wz-article td { text-align: left; padding: 12px 16px; border: 0; border-bottom: 1px solid var(--wz-line); vertical-align: top; }
.wz-article thead th, .wz-article thead td { background: var(--wz-alt); font-weight: 700; color: var(--wz-ink); }
.wz-article td { color: var(--wz-muted); }
.wz-article tr:last-child th, .wz-article tr:last-child td { border-bottom: 0; }
/* Callout box: in the post editor, add CSS class "wz-callout" to a Group block. */
.wz-article .wz-callout { background: var(--wz-tint); border-radius: 16px; padding: 24px; }
.wz-article .wz-callout > * + * { margin-top: 8px; }
.wz-article .wp-block-button__link { background: var(--wz-navy); color: var(--wz-white); border-radius: 10px; padding: 10px 16px; font-size: 15px; font-weight: 600; text-decoration: none; }
@media (max-width: 640px) {
	.wz-article { font-size: 17px; line-height: 29px; }
}

/* Article header + body centered like the mockup (240px aside + 720px text). */
.wz-ahead { margin-left: auto; margin-right: auto; }
.wz-alayout { justify-content: center; }

/* Share row ([wz_share]) */
.wz-share { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--wz-ink); }
.wz-share span { margin-right: 8px; }
.wz-share a, .wz-share button { width: 36px; height: 36px; padding: 0; border-radius: 50%; border: 1.5px solid var(--wz-line-strong); background: transparent; display: inline-flex; align-items: center; justify-content: center; color: var(--wz-ink); cursor: pointer; }
.wz-share a:hover, .wz-share button:hover { border-color: var(--wz-ink); background: transparent; color: var(--wz-ink); }
.wz-share button.is-copied { border-color: var(--wz-success); color: var(--wz-success); }
.wz-share svg { width: 16px; height: 16px; }

/* Article search: pill with the icon inside */
.wz-search .elementor-search-form__container { display: flex; align-items: center; }
.wz-search .elementor-search-form__icon { order: -1; display: flex; align-items: center; padding: 0 0 0 16px; }
.wz-search .elementor-search-form__icon svg { width: 18px; height: 18px; fill: currentColor; }
.wz-search .elementor-search-form__input { border: 0 !important; background: transparent; min-height: 40px; }
.wz-backlink { font-weight: 600; color: var(--wz-accent); text-decoration: none; }
.wz-backlink:hover { text-decoration: underline; }
.wz-legal h2:first-child { margin-top: 0; }
