/* ==========================================================================
   VIKA — Guarantee (Guarantee/Index, IndexAr, IndexEn, IndexRu)
   Direction-neutral; identical file in css/RTL (guarantee-rtl.css) and css/LTR (guarantee-ltr.css).
   ========================================================================== */
.guarantee-hero { padding-block: var(--sp-8) var(--sp-5); text-align: center; position: relative; z-index: 1; }
.guarantee-hero-content { max-width: 720px; margin-inline: auto; padding-inline: var(--sp-5); }
.guarantee-hero-title { font-size: clamp(2rem, 5vw, 3.4rem); font-weight: 500; line-height: 1.35; margin-block-end: var(--sp-4); }
.guarantee-hero-subtitle { color: var(--fg-muted); }

.guarantee-section { padding-block: var(--sp-5) var(--sp-9); position: relative; z-index: 1; }
.guarantee-container { width: min(100% - 2 * var(--sp-5), 920px); margin-inline: auto; }
.guarantee-content { padding: clamp(var(--sp-5), 4vw, var(--sp-8)); background: var(--glass-bg); border: 1px solid var(--glass-border); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(1.3); backdrop-filter: blur(var(--glass-blur)) saturate(1.3); box-shadow: 0 24px 60px oklch(0% 0 0 / 0.35), inset 0 1px 0 oklch(100% 0 0 / 0.08); }
.guarantee-image-wrapper { margin-block-end: var(--sp-6); border: 1px solid var(--glass-border); background: var(--c-ink-soft); overflow: hidden; }
.guarantee-main-image { display: block; width: 100%; max-height: 460px; object-fit: cover; }
.guarantee-content-title { font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 500; line-height: 1.5; margin-block-end: var(--sp-5); padding-block-end: var(--sp-4); border-block-end: 1px solid var(--glass-border); }
.guarantee-content-title::after { content: ""; display: block; width: 56px; height: 2px; margin-block-start: var(--sp-4); margin-block-end: calc(var(--sp-4) * -1 - 1px); background: linear-gradient(90deg, var(--c-gold-dim), var(--c-gold-bright)); }

/* body = rich HTML from the admin editor */
.guarantee-body { color: var(--fg-muted); font-size: 1rem; line-height: 2.1; overflow-wrap: anywhere; }
.guarantee-body > * + * { margin-block-start: var(--sp-5); }
.guarantee-body h1, .guarantee-body h2, .guarantee-body h3, .guarantee-body h4 { color: var(--fg); line-height: 1.6; margin-block-start: var(--sp-7); }
.guarantee-body h2 { font-size: 1.5rem; } .guarantee-body h3 { font-size: 1.25rem; } .guarantee-body h4 { font-size: 1.1rem; }
.guarantee-body a { color: var(--accent); border-block-end: 1px solid oklch(74% 0.09 85 / 0.35); transition: border-color var(--t-fast); }
.guarantee-body a:hover { border-color: var(--accent); }
.guarantee-body strong, .guarantee-body b { color: var(--fg); font-weight: 500; }
.guarantee-body ul, .guarantee-body ol { padding-inline-start: var(--sp-6); }
.guarantee-body ul { list-style: square; }
.guarantee-body li::marker { color: var(--accent); }
.guarantee-body li + li { margin-block-start: var(--sp-2); }
.guarantee-body img, .guarantee-body video { max-width: 100%; height: auto; border: 1px solid var(--glass-border); }
.guarantee-body iframe { max-width: 100%; border: 0; }
.guarantee-body blockquote { padding: var(--sp-4) var(--sp-5); border-inline-start: 2px solid var(--accent); background: var(--glass-bg); color: var(--fg); }
.guarantee-body hr { border: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--c-gold-dim), transparent); }
.guarantee-body table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; font-size: 0.92rem; }
.guarantee-body th, .guarantee-body td { padding: var(--sp-3) var(--sp-4); border: 1px solid var(--glass-border); text-align: start; }
.guarantee-body th { color: var(--fg); background: var(--glass-bg); }
/* editor-pasted inline colours are unreadable on the dark theme */
.guarantee-body [style*="color"] { color: inherit !important; }
.guarantee-body [style*="background"] { background: transparent !important; }
.guarantee-body a[style*="color"] { color: var(--accent) !important; }

.guarantee-empty { text-align: center; padding: var(--sp-9) var(--sp-5); background: var(--glass-bg); border: 1px solid var(--glass-border); color: var(--fg-muted); }
.guarantee-empty i { display: block; font-size: 2.8rem; color: var(--accent); opacity: 0.6; margin-block-end: var(--sp-4); }
.guarantee-empty h3 { color: var(--fg); margin-block-end: var(--sp-2); }

@media (max-width: 767px) { .guarantee-body { font-size: 0.95rem; } }