:root {
    --ex-ink: #0b1220;
    --ex-navy: #12203a;
    --ex-gold: #d4a017;
    --ex-gold-2: #f3c14a;
    --ex-paper: #f6f1e7;
    --ex-card: #ffffff;
    --ex-muted: #5c6578;
    --ex-line: rgba(18, 32, 58, 0.12);
    --ex-radius: 18px;
    --ex-shadow: 0 18px 50px rgba(11, 18, 32, 0.12);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.embroxo-body {
    margin: 0;
    font-family: "Manrope", "Segoe UI", sans-serif;
    color: var(--ex-ink);
    background: var(--ex-paper);
    line-height: 1.55;
}
a { color: inherit; }
img { max-width: 100%; display: block; }
.ex-wrap { width: min(1120px, calc(100% - 32px)); margin-inline: auto; }
.ex-skip {
    position: absolute; left: -999px; top: 8px;
}
.ex-skip:focus { left: 8px; background: #fff; padding: 8px 12px; z-index: 50; }
.ex-topbar {
    background: var(--ex-navy);
    color: #f7efe0;
    font-size: 0.92rem;
}
.ex-topbar .ex-wrap { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; flex-wrap: wrap; }
.ex-topbar a { color: var(--ex-gold-2); text-decoration: none; }
.ex-header {
    position: sticky; top: 0; z-index: 20;
    background: rgba(246, 241, 231, 0.92);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--ex-line);
}
.ex-header .ex-wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; }
.ex-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; font-weight: 800; letter-spacing: 0.08em; }
.ex-mark {
    width: 36px; height: 36px; border-radius: 10px;
    background: linear-gradient(135deg, var(--ex-navy), #2a4578);
    color: var(--ex-gold-2); display: grid; place-items: center; font-weight: 800;
}
.ex-nav { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.ex-nav a { text-decoration: none; font-weight: 600; color: var(--ex-navy); }
.ex-nav a:hover, .ex-nav a[aria-current="page"] { color: var(--ex-gold); }
.ex-actions { display: flex; gap: 8px; align-items: center; }
.ex-btn {
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 999px; padding: 10px 16px; text-decoration: none; font-weight: 700;
    border: 0; cursor: pointer; font: inherit;
}
.ex-btn-primary { background: var(--ex-navy); color: #fff; }
.ex-btn-gold { background: var(--ex-gold); color: var(--ex-ink); }
.ex-btn-ghost { background: transparent; border: 1px solid var(--ex-line); }
.ex-menu { display: none; background: none; border: 1px solid var(--ex-line); border-radius: 10px; padding: 8px 10px; }
.ex-hero {
    background:
        radial-gradient(circle at 10% 10%, rgba(212, 160, 23, 0.22), transparent 35%),
        linear-gradient(160deg, var(--ex-navy), #1c335c 55%, #0b1220);
    color: #fff; padding: 72px 0 80px;
}
.ex-hero h1 { font-size: clamp(2.1rem, 5vw, 4rem); line-height: 1.05; margin: 0 0 16px; max-width: 14ch; }
.ex-hero p { max-width: 52ch; color: #d7deea; font-size: 1.1rem; }
.ex-hero-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 24px; }
.ex-grid { display: grid; gap: 18px; }
.ex-grid-3 { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.ex-grid-2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.ex-section { padding: 64px 0; }
.ex-kicker { color: var(--ex-gold); font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; font-size: 0.78rem; }
.ex-card {
    background: var(--ex-card); border-radius: var(--ex-radius); padding: 22px;
    box-shadow: var(--ex-shadow); border: 1px solid var(--ex-line);
}
.ex-price { font-size: 2rem; font-weight: 800; margin: 8px 0; }
.ex-list { padding-left: 18px; }
.ex-list li { margin: 8px 0; }
.ex-page { padding: 48px 0 72px; }
.ex-page h1 { margin-top: 0; }
.ex-form label { display: block; font-weight: 700; margin: 12px 0 6px; }
.ex-form input, .ex-form textarea, .ex-form select {
    width: 100%; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--ex-line); font: inherit; background: #fff;
}
.ex-alert { padding: 12px 14px; border-radius: 12px; background: #fde8e8; color: #7a1d1d; }
.ex-alert-ok { background: #e7f6ea; color: #1c5a2c; }
.ex-footer { background: var(--ex-ink); color: #d5dbe6; padding: 48px 0 24px; }
.ex-footer a { color: var(--ex-gold-2); text-decoration: none; }
.ex-footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 24px; }
.ex-copy { border-top: 1px solid rgba(255,255,255,0.08); margin-top: 28px; padding-top: 16px; font-size: 0.9rem; }
.ex-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.ex-gallery-item { margin: 0; }
.ex-gallery-item figcaption { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; font-size: 0.92rem; }
.ex-tile { min-height: 140px; border-radius: 16px; background: linear-gradient(135deg, #1d3258, #c9a227); color: #fff; display: grid; place-items: end start; padding: 14px; font-weight: 700; }
.ex-steps { list-style: none; padding: 0; margin: 24px 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; }
.ex-steps h2, .ex-steps h3 { margin: 0 0 8px; }
.ex-chat {
    position: fixed; right: 16px; bottom: 16px; z-index: 30; width: min(340px, calc(100% - 24px));
    background: #fff; border-radius: 18px; box-shadow: var(--ex-shadow); border: 1px solid var(--ex-line);
}
.ex-chat header { background: var(--ex-navy); color: #fff; padding: 12px 14px; border-radius: 18px 18px 0 0; display: flex; justify-content: space-between; }
.ex-chat .body { padding: 12px 14px; display: none; }
.ex-chat.open .body { display: block; }
.ex-chat button.link { background: none; border: 0; color: inherit; font: inherit; cursor: pointer; }
.ex-muted { color: var(--ex-muted); }
.container { width: min(1120px, calc(100% - 32px)); margin-inline: auto; }
.form-control, .form-control-sm { width: 100%; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--ex-line); font: inherit; }
.btn { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; padding: 10px 16px; border: 0; font: inherit; cursor: pointer; text-decoration: none; }
.btn-primary { background: var(--ex-navy); color: #fff; }
.alert-danger { background: #fde8e8; color: #7a1d1d; padding: 12px; border-radius: 12px; }
.inner-wrap { padding: 40px 0 72px; }
.custom-card { background: #fff; border-radius: 18px; padding: 24px; box-shadow: var(--ex-shadow); }
.form-group { margin: 14px 0; }
@media (max-width: 860px) {
    .ex-menu { display: inline-flex; }
    .ex-nav, .ex-actions { display: none; }
    .ex-header.open .ex-nav, .ex-header.open .ex-actions { display: flex; width: 100%; }
    .ex-header .ex-wrap { flex-wrap: wrap; }
    .ex-footer-grid { grid-template-columns: 1fr; }
}
