/*!*************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./app/globals.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************/

:root { --black: #050505; --ink: #f5f5f5; --red: #d60000; --yellow: #d60000; --cream: #0b0b0b; --white: #ffffff; --line: #2b2b2b; --muted: #a7a7a7; --green: #12a56b; --red-soft: #ffe0e0; --soft: #171717; --card: #111111; --panel: #151515; }

* { box-sizing: border-box }

body { margin: 0; font-family: Arial,Helvetica,sans-serif; background: var(--black); color: #fff; }

a { text-decoration: none; color: inherit }

button,
.btn,
.button { display: inline-block; border: 0; border-radius: 999px; background: var(--red); color: #fff; padding: 15px 24px; font-weight: 1000; text-transform: uppercase; letter-spacing: -.02em; cursor: pointer; }

    .btn.dark,
    .button.dark,
    button.dark { background: #fff; color: #111; }

    .btn.ghost,
    .button.ghost { background: transparent; color: #fff; border: 1px solid #444; }

.header,
.site-header { max-width: 1220px; margin: auto; padding: 26px 20px; display: flex; justify-content: space-between; align-items: center; gap: 20px; background: transparent; }

.logo,
.brand { font-size: 42px; font-weight: 1000; color: var(--red); letter-spacing: -.1em; }

.nav,
.top-nav { display: flex; gap: 8px; flex-wrap: wrap; }

    .nav a,
    .top-nav a { background: #151515; border: 1px solid #333; color: #fff; padding: 10px 14px; border-radius: 999px; font-size: 13px; font-weight: 800; }

        .nav a:hover,
        .top-nav a:hover { border-color: var(--red); }

.hero { max-width: 1220px; margin: auto; padding: 0px 20px 70px; }

.kicker { display: inline-flex; gap: 8px; align-items: center; background: #151515; border: 1px solid #333; border-radius: 999px; padding: 9px 13px; color: #ddd; font-weight: 800; font-size: 13px; }

.dot { width: 9px; height: 9px; border-radius: 50%; background: var(--red); }

h1 { font-size: clamp(44px,8vw,94px); line-height: .88; letter-spacing: -.075em; text-transform: uppercase; margin: 22px 0; }
h1[tabindex="-1"]:focus, h1[tabindex="-1"]:focus-visible { outline: none; }
h2 { font-size: 30px; letter-spacing: -.04em; margin: 0 0 16px; }

p { line-height: 1.45 }

.hero p { font-size: 21px; color: #c8c8c8; max-width: 790px; }

.main { background: #0b0b0b; color: #fff; border-radius: 42px 42px 0 0; min-height: 66vh; padding: 34px 20px 86px; border-top: 1px solid #242424; }

.container { max-width: 1220px; margin: auto; }

.card,
.panel,
.admin-card { background: var(--panel); color: #fff; border: 1px solid var(--line); border-radius: 30px; padding: 30px; margin-bottom: 22px; box-shadow: 0 16px 40px rgba(0,0,0,.35); }

    .card.light,
    .form-card { background: #fff; color: #111; border-color: #e6e6e6; }

.grid { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 16px; gap: 16px; }

.three { display: grid; grid-template-columns: repeat(3,1fr); grid-gap: 16px; gap: 16px; }

.four { display: grid; grid-template-columns: repeat(4,1fr); grid-gap: 16px; gap: 16px; }

.wrap,
.quote-grid { display: grid; grid-template-columns: 1fr 390px; grid-gap: 24px; gap: 24px; align-items: start; }

label { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .07em; font-weight: 1000; color: #cfcfcf; }

.card.light label,
.form-card label { color: #5e594e; }

input,
select,
textarea { width: 100%; margin-top: 8px; padding: 16px; border: 1px solid #333; border-radius: 17px; background: #0f0f0f; color: #fff; font: inherit; }

.card.light input,
.card.light select,
.card.light textarea,
.form-card input,
.form-card select,
.form-card textarea { background: #fff; color: #111; border: 1px solid #ddd4c4; }

textarea { min-height: 120px }

.actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 18px; }

.card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
    .card-header h2 { margin: 0; }

.field-error { display: block; color: var(--red); font-size: 12px; margin-top: 6px; font-weight: 700; }
.text-danger { color: var(--red); font-size: 14px; font-weight: 700; }
.text-success { color: var(--green); font-size: 14px; font-weight: 700; }

.flash-message { border-radius: 16px; padding: 16px 22px; margin-bottom: 22px; font-weight: 700; font-size: 14px; }
.flash-success { background: #0d2e1e; border: 1px solid #1a5c3a; color: #4ade80; }
.flash-error { background: #2e0d0d; border: 1px solid #5c1a1a; color: #f87171; }

.summary { background: #050505; color: #fff; border: 1px solid #2a2a2a; border-radius: 30px; padding: 28px; position: -webkit-sticky; position: sticky; top: 20px; box-shadow: 0 18px 40px rgba(0,0,0,.45); }

.line { display: flex; justify-content: space-between; gap: 15px; border-bottom: 1px solid #333; padding: 13px 0; }

.total { font-size: 40px; color: var(--red); font-weight: 1000; }

.notice { background: #160000; border: 1px solid #551515; color: #fff; border-radius: 19px; padding: 16px; }

.step { background: #111; color: #fff; border: 1px solid #2a2a2a; border-radius: 26px; padding: 24px; min-height: 142px; }

    .step strong { display: block; color: var(--red); font-size: 34px; margin-bottom: 10px; }

.feature { background: #111; color: #fff; border: 1px solid #2a2a2a; border-radius: 26px; padding: 24px; }

.table { width: 100%; border-collapse: collapse; background: #111; color: #fff; border-radius: 22px; overflow: hidden; }

    .table th,
    .table td { text-align: left; padding: 15px; border-bottom: 1px solid #2c2c2c; vertical-align: top; }

    .table th { background: #050505; color: #fff; }

    .table input { background: #0b0b0b; color: #fff; }

.badge { display: inline-block; border-radius: 999px; padding: 7px 11px; font-size: 12px; font-weight: 1000; text-transform: uppercase; }

    .badge.green { background: #ddf7ec; color: #087747; }

    .badge.yellow { background: #fff2bd; color: #8a6800; }

    .badge.red { background: #ffe0e0; color: #9b1111; }

    .badge.dark { background: #111; color: #fff; }

.progress { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }

    .progress span { padding: 8px 11px; border-radius: 999px; background: #1b1b1b; color: #ddd; font-size: 12px; font-weight: 900; }

    .progress .active { background: var(--red); color: #fff; }

.admin-page { background: #0b0b0b; color: #fff; min-height: 100vh; padding: 30px 20px; }

.admin-inner { max-width: 1220px; margin: auto; }

.admin-head { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; margin-bottom: 28px; }

    .admin-head h1 { color: #fff; margin: 0; }

.admin-nav { gap: 8px; flex-wrap: wrap; margin-bottom: 22px; }

    .admin-nav a { background: #151515; color: #fff; text-align: center; margin: 10px 10px; border: 1px solid #333; display: block; border-radius: 999px; padding: 10px 14px; font-weight: 900; font-size: 13px; }

        .admin-nav a:hover { border-color: var(--red); }

.admin-stats { display: grid; grid-template-columns: repeat(3,1fr); grid-gap: 18px; gap: 18px; margin-bottom: 24px; }

    .admin-stats div { background: #111; color: #fff; border: 1px solid #2a2a2a; border-radius: 24px; padding: 24px; }

    .admin-stats strong { display: block; text-transform: uppercase; color: #aaa; font-size: 13px; }

    .admin-stats p { color: var(--red); font-size: 36px; font-weight: 1000; margin: 8px 0 0; }

.scaffold-card-grid { display: grid; grid-template-columns: repeat(2,1fr); grid-gap: 14px; gap: 14px; }

.scaffold-card { border: 1px solid #2a2a2a; border-radius: 22px; background: #111; color: #fff; padding: 18px; min-height: 170px; text-align: left; text-transform: none; letter-spacing: normal; display: block; }

    .scaffold-card.active { background: #050505; color: #fff; border-color: var(--red); box-shadow: 0 0 0 2px rgba(214,0,0,.2); }

.scaffold-image { display: grid; place-items: center; min-height: 64px; border-radius: 16px; background: #1c1c1c; font-size: 36px; margin-bottom: 8px; }

.scaffold-card.active .scaffold-image { background: #250000; }

.scaffold-card small { display: block; color: #aaa; line-height: 1.35; margin-top: 6px; }

.scaffold-card.active small { color: #ddd; }

.mb-3 { margin-bottom: 10px; }
@media(max-width:900px) {
    .header,
    .site-header,
    .admin-head { flex-direction: column; align-items: flex-start; }

    .wrap,
    .quote-grid,
    .grid,
    .three,
    .four,
    .stats,
    .admin-stats,
    .scaffold-card-grid { grid-template-columns: 1fr; }

    .summary { position: static; order: -1; }
}

/* ── Auth pages ──────────────────────────────────────────── */
.auth-page { min-height: 60vh; display: flex; align-items: center; justify-content: center; padding: 40px 20px; }

.auth-card { width: 100%; max-width: 460px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 40px 36px; }

.auth-title { font-size: 28px; font-weight: 1000; letter-spacing: -.04em; margin: 0 0 24px; }

.auth-description { color: var(--muted); margin: 0 0 20px; font-size: 14px; line-height: 1.6; }

.auth-alert { padding: 12px 16px; border-radius: 8px; font-size: 14px; margin-bottom: 20px; }
.auth-alert--error { background: #2d0a0a; border: 1px solid var(--red); color: #ff7b7b; }
.auth-alert--success { background: #0a2d1a; border: 1px solid var(--green); color: #5fdc9e; }

.field-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 18px; }
.field-label { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.field-input { background: var(--soft); border: 1px solid var(--line); border-radius: 8px; color: #fff; padding: 11px 14px; font-size: 15px; transition: border-color .15s; }
.field-input:focus { outline: none; border-color: var(--red); }
.field-hint { font-size: 12px; color: var(--muted); }
.field-error { font-size: 12px; color: #ff7b7b; margin-top: 2px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

.auth-forgot { text-align: right; margin: -8px 0 18px; font-size: 13px; color: var(--muted); }
.auth-forgot a:hover { color: #fff; }

.auth-submit { width: 100%; justify-content: center; margin-top: 4px; }
.auth-submit:disabled { opacity: .5; cursor: not-allowed; }

.auth-switch { margin: 20px 0 0; text-align: center; font-size: 14px; color: var(--muted); }
.auth-switch a { color: var(--red); font-weight: 700; }
.auth-switch a:hover { text-decoration: underline; }

@media (max-width: 600px) {
    .auth-card { padding: 28px 20px; }
    .field-row { grid-template-columns: 1fr; }
}
