/* ==========================================================
   ABDELZAHER LEGAL
   GLOBAL DESIGN SYSTEM
   Release 1.0.11
   ========================================================== */

:root {
    --az-black: #0b0d0f;
    --az-graphite: #171a1e;
    --az-gunmetal: #30363d;

    --az-platinum: #c7cbd0;
    --az-steel: #8f969e;
    --az-metal-dark: #24292f;

    --az-ivory: #ece8df;
    --az-text: #d6d8da;
    --az-muted: #979da4;

    --az-bronze: #927451;
    --az-gold-soft: #d9bf8b;
    --az-gold-warm: #cfa86a;
    --az-gold-deep: #a67c45;

    --az-container: 1400px;

    --az-page-padding-desktop: 32px;
    --az-page-padding-tablet: 21px;
    --az-page-padding-mobile: 15px;

    --az-radius-small: 6px;
    --az-radius-medium: 10px;
    --az-radius-large: 16px;

    --az-transition: .28s cubic-bezier(.2,.8,.2,1);
    --az-transition-fast: .18s ease;
}

/* ==========================================================
   BASE RESET
   ========================================================== */

html {
    box-sizing: border-box;
    scroll-behavior: smooth;
}

*,
*::before,
*::after {
    box-sizing: inherit;
}

body {
    margin: 0;
    overflow-x: hidden;
    color: var(--az-text);
    background: var(--az-black);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img {
    max-width: 100%;
    height: auto;
}

a {
    text-decoration: none;
}

button,
input,
textarea,
select {
    font: inherit;
}

::selection {
    color: #111417;
    background: #d7be91;
}

::-moz-selection {
    color: #111417;
    background: #d7be91;
}

/* ==========================================================
   GLOBAL CONTAINER
   ========================================================== */

.az-container {
    width: min(
        calc(100% - (var(--az-page-padding-desktop) * 2)),
        var(--az-container)
    );
    margin-inline: auto;
}

/* ==========================================================
   METALLIC BUTTON BASE
   ========================================================== */

.az-btn-metal {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 48px;
    padding: 10px 18px;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: var(--az-radius-small);
    color: #171a1d !important;
    text-decoration: none !important;
    background:
        linear-gradient(
            180deg,
            #f0f2f3 0%,
            #c9ced2 18%,
            #8f979e 50%,
            #bec4c9 74%,
            #e7e9ea 100%
        );
    text-shadow: 0 1px 0 rgba(255,255,255,.65);
    box-shadow:
        inset 0 2px 1px rgba(255,255,255,.85),
        inset 0 -3px 3px rgba(0,0,0,.28),
        0 4px 0 #3e454b,
        0 9px 18px rgba(0,0,0,.28);
    font-weight: 800;
    cursor: pointer;
    transition:
        transform var(--az-transition),
        filter var(--az-transition),
        box-shadow var(--az-transition);
}

.az-btn-metal:hover {
    color: #0d0f10 !important;
    transform: translateY(-2px);
    filter: brightness(1.06);
    box-shadow:
        inset 0 2px 1px rgba(255,255,255,.95),
        inset 0 -3px 3px rgba(0,0,0,.26),
        0 6px 0 #3b4248,
        0 13px 22px rgba(0,0,0,.34);
}

.az-btn-metal:active {
    transform: translateY(2px);
    box-shadow:
        inset 0 3px 4px rgba(0,0,0,.28),
        0 1px 0 #3b4248,
        0 4px 9px rgba(0,0,0,.24);
}

/* ==========================================================
   ACCESSIBILITY
   ========================================================== */

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 2px solid var(--az-gold-soft);
    outline-offset: 3px;
}

/* ==========================================================
   WORDPRESS / ASTRA BASE CLEANUP
   ========================================================== */

body .site-content {
    margin: 0;
}

body .ast-container {
    max-width: none;
    padding-left: 0;
    padding-right: 0;
}

body .entry-content {
    margin: 0;
}

body .entry-content > * {
    max-width: none;
}

/* ==========================================================
   RESPONSIVE CONTAINER
   ========================================================== */

@media (max-width: 1024px) {
    .az-container {
        width: min(
            calc(100% - (var(--az-page-padding-tablet) * 2)),
            var(--az-container)
        );
    }
}

@media (max-width: 767px) {
    .az-container {
        width: min(
            calc(100% - (var(--az-page-padding-mobile) * 2)),
            var(--az-container)
        );
    }
}

/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}