@font-face {
    font-family: 'Vazirmatn';
    src: url('../../fonts/Vazirmatn/Vazirmatn-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vazirmatn';
    src: url('../../fonts/Vazirmatn/Vazirmatn-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vazirmatn';
    src: url('../../fonts/Vazirmatn/Vazirmatn-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vazirmatn';
    src: url('../../fonts/Vazirmatn/Vazirmatn-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'IranianSans';
    src: url('../../fonts/Iranian-Sans.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

:root {
    /* BOORAN — brushed stainless steel + velvet crimson industrial café */
    --bn-steel-50: #F8FAFC;
    --bn-steel-100: #F1F5F9;
    --bn-steel-200: #E2E8F0;
    --bn-steel-300: #CBD5E1;
    --bn-steel-400: #94A3B8;
    --bn-steel-500: #64748B;
    --bn-steel-600: #475569;
    --bn-steel-700: #334155;
    --bn-steel-800: #1E293B;
    --bn-steel-900: #0F172A;
    --bn-steel-950: #0A0D13;

    --bn-burgundy: #781424;
    --bn-burgundy-deep: #420B14;
    --bn-burgundy-soft: #9E1B32;
    --bn-burgundy-glow: rgba(158, 27, 50, 0.45);
    --bn-crimson-vibrant: #BA2640;

    --bn-gold: #E5A93C;
    --bn-gold-bright: #F59E0B;
    --bn-gold-dim: rgba(229, 169, 60, 0.3);

    --bn-ink: #F1F5F9;
    --bn-ink-pure: #FFFFFF;
    --bn-muted: #94A3B8;
    --bn-line: rgba(226, 232, 240, 0.12);
    --bn-line-gold: rgba(229, 169, 60, 0.45);

    --bn-surface: radial-gradient(ellipse at 50% -10%, #1e2531 0%, #11141a 60%, #0a0c0f 100%);
    --bn-surface-metal:
        linear-gradient(135deg, rgba(255, 255, 255, 0.09) 0%, rgba(255, 255, 255, 0) 45%, rgba(0, 0, 0, 0.35) 100%),
        linear-gradient(115deg, #242a36 0%, #1a1e27 50%, #13161c 100%);
    --bn-surface-plate:
        linear-gradient(160deg, #1e242f 0%, #151821 55%, #0f1218 100%);
    --bn-surface-card:
        linear-gradient(150deg, #1a1f28 0%, #12151c 100%);

    --bn-font-display: 'Vazirmatn', 'IranianSans', Tahoma, sans-serif;
    --bn-font-body: 'Vazirmatn', 'IranianSans', Tahoma, sans-serif;
    --bn-font-ui: 'Vazirmatn', Tahoma, sans-serif;

    --bn-space-2xs: 0.2rem;
    --bn-space-xs: 0.4rem;
    --bn-space-sm: 0.7rem;
    --bn-space-md: 1.1rem;
    --bn-space-lg: 1.6rem;
    --bn-space-xl: 2.4rem;
    --bn-space-2xl: 3.4rem;
    --bn-space-3xl: 4.8rem;

    --bn-cut: 11px;
    --bn-cut-sm: 7px;
    --bn-cut-lg: 16px;

    --bn-bevel:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        inset 0 -1px 0 rgba(0, 0, 0, 0.45),
        0 4px 18px rgba(0, 0, 0, 0.45);
    --bn-bevel-deep:
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        inset 0 -2px 4px rgba(0, 0, 0, 0.55),
        0 14px 34px rgba(0, 0, 0, 0.6);
    --bn-press:
        inset 0 2px 6px rgba(0, 0, 0, 0.5),
        inset 0 -1px 0 rgba(255, 255, 255, 0.15);

    --bn-transition: 0.28s cubic-bezier(0.22, 0.8, 0.28, 1);
    --bn-transition-fast: 0.16s cubic-bezier(0.3, 0.7, 0.3, 1);

    --bn-header-h: 58px;
    --bn-nav-h: 64px;
    --bn-safe-top: env(safe-area-inset-top, 0px);
    --bn-safe-bottom: env(safe-area-inset-bottom, 0px);
    color-scheme: dark;

    /* Compat for shared JS / flr hooks */
    --np-header-h: var(--bn-header-h);
    --np-nav-h: var(--bn-nav-h);
    --np-safe-top: var(--bn-safe-top);
    --np-safe-bottom: var(--bn-safe-bottom);
    --np-ink: var(--bn-ink);
    --np-muted: var(--bn-muted);
    --np-cream: var(--bn-steel-100);
    --np-green: var(--bn-burgundy);
    --np-font-body: var(--bn-font-body);
    --np-transition: var(--bn-transition);
}

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

html {
    scroll-behavior: smooth;
    color-scheme: dark;
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

body.bn-body {
    margin: 0;
    min-height: 100vh;
    font-family: var(--bn-font-body);
    color: var(--bn-ink);
    background:
        url('../../images/decor/steel-grain.svg') center / 240px 240px repeat,
        var(--bn-surface);
    background-attachment: fixed;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
    padding-bottom: calc(var(--bn-nav-h) + var(--bn-safe-bottom) + 12px);
    color-scheme: dark;
}

body.bn-body.flr-nav-open {
    overflow: hidden;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
    display: block;
}

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

.bn-container {
    width: min(1120px, calc(100% - 2rem));
    margin-inline: auto;
}

.bn-main {
    position: relative;
    z-index: 1;
    min-height: 50vh;
}

/* Cut-corner utility via clip — industrial plate geometry */
.bn-cut {
    clip-path: polygon(
        var(--bn-cut) 0%,
        calc(100% - var(--bn-cut)) 0%,
        100% var(--bn-cut),
        100% calc(100% - var(--bn-cut)),
        calc(100% - var(--bn-cut)) 100%,
        var(--bn-cut) 100%,
        0% calc(100% - var(--bn-cut)),
        0% var(--bn-cut)
    );
}

.bn-cut--sm {
    --bn-cut: var(--bn-cut-sm);
}

.bn-cut--lg {
    --bn-cut: var(--bn-cut-lg);
}

/* Typography */
.bn-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin: 0;
    font-family: var(--bn-font-ui);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--bn-burgundy);
}

.bn-kicker::before {
    content: '';
    width: 18px;
    height: 1px;
    background: linear-gradient(90deg, var(--bn-gold), transparent);
}

.bn-display {
    margin: 0;
    font-family: var(--bn-font-display);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.15;
    color: #FFFFFF;
}

/* Industrial divider — double hairline + gold node */
.bn-rule {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    width: 100%;
    margin: var(--bn-space-md) 0;
}

.bn-rule::before,
.bn-rule::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--bn-line), transparent);
}

.bn-rule__node {
    width: 7px;
    height: 7px;
    background: var(--bn-gold);
    transform: rotate(45deg);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--bn-gold) 40%, transparent);
    flex-shrink: 0;
}

/* Buttons — cut steel plates */
.bn-btn {
    --bn-cut: var(--bn-cut-sm);
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 44px;
    padding: 0.65rem 1.35rem;
    border: 1px solid var(--bn-steel-400);
    background: var(--bn-surface-metal);
    color: #FFFFFF;
    font-family: var(--bn-font-ui);
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    cursor: pointer;
    clip-path: polygon(
        var(--bn-cut) 0%,
        calc(100% - var(--bn-cut)) 0%,
        100% var(--bn-cut),
        100% calc(100% - var(--bn-cut)),
        calc(100% - var(--bn-cut)) 100%,
        var(--bn-cut) 100%,
        0% calc(100% - var(--bn-cut)),
        0% var(--bn-cut)
    );
    box-shadow: var(--bn-bevel);
    transition: color var(--bn-transition-fast), background var(--bn-transition), box-shadow var(--bn-transition-fast), transform var(--bn-transition-fast);
    overflow: hidden;
}

.bn-btn::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, 0.35) 48%, transparent 62%);
    transform: translateX(-120%);
    transition: transform 0.45s ease;
    pointer-events: none;
}

.bn-btn:hover {
    border-color: var(--bn-crimson-vibrant);
    color: #FFFFFF;
    background: linear-gradient(135deg, rgba(120, 20, 36, 0.4), rgba(20, 24, 32, 0.9));
}

.bn-btn:hover::after {
    transform: translateX(120%);
}

.bn-btn:active {
    box-shadow: var(--bn-press);
    transform: translateY(1px);
}

.bn-btn--fill {
    border-color: var(--bn-burgundy-deep);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.12) 0%, transparent 40%),
        linear-gradient(160deg, var(--bn-burgundy-soft), var(--bn-burgundy) 45%, var(--bn-burgundy-deep));
    color: #fff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.22),
        0 8px 20px var(--bn-burgundy-glow);
}

.bn-btn--fill:hover {
    color: #fff;
    border-color: var(--bn-gold);
}

/* Inputs */
.np-input,
.bn-input {
    width: 100%;
    min-height: 46px;
    padding: 0.65rem 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: #141822;
    color: #FFFFFF;
    border-radius: 0;
    clip-path: polygon(
        6px 0, calc(100% - 6px) 0, 100% 6px, 100% calc(100% - 6px),
        calc(100% - 6px) 100%, 6px 100%, 0 calc(100% - 6px), 0 6px
    );
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.45);
    outline: none;
    transition: border-color var(--bn-transition-fast), box-shadow var(--bn-transition-fast), background var(--bn-transition-fast);
}

.np-input:focus,
.bn-input:focus {
    border-color: var(--bn-crimson-vibrant);
    background: #181f2c;
    color: #FFFFFF;
    box-shadow: 0 0 0 2px rgba(186, 38, 64, 0.35), inset 0 2px 4px rgba(0, 0, 0, 0.45);
}

.np-input--area {
    min-height: 80px;
    resize: vertical;
}

.is-hidden {
    display: none !important;
}

/* Loader — steel plate reveal */
.bn-loader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    background:
        url('../../images/decor/steel-grain.svg') center / 180px repeat,
        radial-gradient(ellipse at 50% 30%, #1e2531 0%, #11141a 60%, #0a0c0f 100%);
    transition: opacity 0.4s ease, visibility 0.4s ease;
}

.bn-loader.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    display: grid !important;
}

.bn-loader__stage {
    text-align: center;
}

.bn-loader__mark {
    width: 52px;
    height: 52px;
    margin: 0 auto 1rem;
    border: 1px solid var(--bn-steel-400);
    background: var(--bn-surface-metal);
    clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 10px, 100% calc(100% - 10px), calc(100% - 10px) 100%, 10px 100%, 0 calc(100% - 10px), 0 10px);
    position: relative;
    box-shadow: var(--bn-bevel);
}

.bn-loader__mark::before {
    content: '';
    position: absolute;
    inset: 10px;
    border: 1px solid var(--bn-burgundy);
    clip-path: inherit;
    animation: bn-pulse 1.1s ease-in-out infinite;
}

.bn-loader__text {
    margin: 0;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #FFFFFF;
}

.bn-loader__hint {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.8rem;
    color: var(--bn-muted);
}

@keyframes bn-pulse {
    0%, 100% { opacity: 0.35; }
    50% { opacity: 1; }
}

/* Ambient steel environment */
.bn-env {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.bn-env__beam {
    position: absolute;
    top: -10%;
    width: 42vw;
    height: 140vh;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.18), transparent);
    transform: rotate(18deg);
    opacity: 0.55;
}

.bn-env__beam--a { inset-inline-start: -8%; }
.bn-env__beam--b { inset-inline-start: 55%; opacity: 0.28; transform: rotate(-12deg); }

.bn-env__corner {
    position: absolute;
    width: 120px;
    height: 120px;
    border: 1px solid color-mix(in srgb, var(--bn-gold) 30%, transparent);
    opacity: 0.45;
}

.bn-env__corner--tl {
    top: 12px;
    inset-inline-start: 12px;
    border-bottom: none;
    border-inline-end: none;
    clip-path: polygon(0 0, 100% 0, 100% 18px, 18px 18px, 18px 100%, 0 100%);
}

.bn-env__corner--br {
    bottom: 80px;
    inset-inline-end: 12px;
    border-top: none;
    border-inline-start: none;
}

/* Reveal */
.is-reveal {
    opacity: 0;
    transform: translateY(18px);
}

.is-inview {
    opacity: 1;
    transform: none;
    transition: opacity 0.5s ease, transform 0.5s ease;
}

/* Section head */
.bn-section-head {
    margin-bottom: var(--bn-space-lg);
}

.bn-section-head .bn-display {
    margin-top: 0.35rem;
    font-size: clamp(1.5rem, 3vw, 2rem);
}

.bn-section-head p {
    margin: 0.55rem 0 0;
    max-width: 36ch;
    color: var(--bn-muted);
    font-size: 0.95rem;
}

.bn-section-head--tight {
    margin-bottom: var(--bn-space-md);
}
