.cms-page {
    max-width: 1200px;
    margin: 0 auto;
    padding: 120px 20px 40px;
}

.cms-page__preview {
    margin-bottom: 16px;
    padding: 10px 12px;
    border: 1px solid #f59e0b;
    background: #fffbeb;
    color: #92400e;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
}

.cms-page__header {
    margin-bottom: 24px;
}

.cms-page__title {
    margin: 0;
    font-size: 28px;
    line-height: 1.2;
    color: #111827;
}

.cms-page__meta {
    margin-top: 6px;
    color: #6b7280;
    font-size: 13px;
}

.cms-block {
    margin-bottom: 24px;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}

.cms-block__header {
    padding: 14px 16px;
    border-bottom: 1px solid #e5e7eb;
    background: #f8fafc;
}

.cms-block__title {
    font-weight: 700;
    color: #0f172a;
}

.cms-block__body {
    padding: 16px;
}

.cms-badge {
    display: inline-block;
    padding: 8px 12px;
    border-radius: 999px;
    background: #111827;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}

.cms-note {
    padding: 14px;
    border: 1px dashed #d1d5db;
    border-radius: 8px;
    color: #6b7280;
    font-size: 14px;
}

/* CMS fullpage hero: center horizontal slider dots in LTR and lift above language switcher */
html:not([dir=rtl]) body.cms-page-template .cms-hero .slider .slider-dots {
    left: 50%;
    transform: translateX(-50%);
    bottom: 68px; /* lang bottom (20px) + spacing (~30px) + lang height */
}

html[dir=rtl] body.cms-page-template .cms-hero .slider .slider-dots {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
    bottom: 68px;
}

/* CMS horizontal hero indicator: keep only dots */
body.cms-page-template .cms-hero .slider .slider-dots .carousel-dots-box {
    backdrop-filter: none;
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
    gap: 0;
}

body.cms-page-template .cms-hero .slider .slider-dots .carousel-dots-current,
body.cms-page-template .cms-hero .slider .slider-dots .carousel-dots-total,
body.cms-page-template .cms-hero .slider .slider-dots .carousel-dots-arrow {
    display: none !important;
}

/* CMS hero CTA buttons spacing */
body.cms-page-template .cms-hero .hero-slide-actions {
    gap: 20px;
}