.db-page-banner{ display: block; }
    .db-page-banner img{ width: 100%; height: auto; display: block; }

    /* ============================================================
       Shared "DB form card" — matches the Contact form (.contact-one__inner)
       so all forms look like one product.
       ============================================================ */
    .contact-one__inner.db-form{
        text-align:left;
        padding:50px 50px 56px;
    }
    .contact-one__inner.db-form .db-form__title{
        font-size:34px; font-weight:800; color:#fff; margin:0 0 6px; line-height:1.2; text-align:center;
    }
    .contact-one__inner.db-form .db-form__lead{
        margin:0 auto 36px; max-width:640px; text-align:center;
        color:rgba(255,255,255,.78); font-size:15px; line-height:1.7;
    }
    .contact-one__inner.db-form .db-form__lead strong{ color:#ffd29a; }
    .contact-one__inner.db-form .db-form__footer{
        text-align:center; margin-top:24px; color:rgba(255,255,255,.6); font-size:13px;
    }
    .contact-one__inner.db-form .db-form__footer a{ color:#ffd29a; font-weight:700; }
    @media (max-width:767px){
        .contact-one__inner.db-form{ padding:32px 22px 36px; }
        .contact-one__inner.db-form .db-form__title{ font-size:26px; }
    }

    /* ----- Stepper ----- */
    .db-stepper{
        display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
        gap:0; margin:0 auto 36px; max-width:720px;
    }
    .db-stepper .step{
        display:flex; align-items:center; gap:10px;
        padding:8px 14px; border-radius:30px;
        color:rgba(255,255,255,.65); font-weight:600; font-size:13px;
        text-transform:uppercase; letter-spacing:.4px;
        border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.03);
        transition:all .25s ease;
    }
    .db-stepper .step .num{
        width:30px; height:30px; border-radius:50%;
        background:rgba(255,255,255,.10); color:rgba(255,255,255,.8);
        display:inline-flex; align-items:center; justify-content:center; font-weight:800;
    }
    .db-stepper .step.is-active{
        color:#fff;
        background:linear-gradient(90deg, #B20D5D 0%, #4A0AB4 100%);
        border-color:transparent;
    }
    .db-stepper .step.is-active .num{ background:rgba(255,255,255,.20); color:#fff; }
    .db-stepper .step.is-done .num{ background:#21bf73; color:#fff; }
    .db-stepper .sep{
        flex:1 1 auto; height:2px; min-width:18px; max-width:60px; margin:0 6px;
        background:rgba(255,255,255,.10);
    }

    /* ----- Fields ----- */
    .db-step{ display:none; }
    .db-step.is-current{ display:block; animation:dbfade .25s ease-out; }
    @keyframes dbfade{ from{opacity:0;transform:translateY(6px);} to{opacity:1;transform:none;} }
    .db-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px 22px; }
    @media (max-width:767px){ .db-grid{ grid-template-columns:1fr; } }
    .db-grid .full{ grid-column:1 / -1; }
    .db-field label{
        display:block; font-weight:600; color:#fff; margin-bottom:8px; font-size:14px;
    }
    .db-field label .req{ color:#ff6b8a; }
    .db-field input[type=text],
    .db-field input[type=email],
    .db-field input[type=tel],
    .db-field input[type=number],
    .db-field input[type=url],
    .db-field input[type=date],
    .db-field select{
        width:100%; height:54px;
        background:rgba(255,255,255,.04);
        color:#fff;
        border:1px solid rgba(255,255,255,.20);
        border-radius:30px;
        padding:0 22px; font-size:15px;
        outline:none; transition:all .25s ease;
    }
    .db-field input::placeholder{ color:rgba(255,255,255,.55); }
    .db-field input:focus,
    .db-field select:focus{
        border-color:#ffd29a;
        background:rgba(255,255,255,.06);
        box-shadow:0 0 0 3px rgba(255,210,154,.18);
    }
    .db-field select{
        appearance:none; -webkit-appearance:none; -moz-appearance:none;
        background-image:linear-gradient(45deg, transparent 50%, #ffd29a 50%), linear-gradient(135deg, #ffd29a 50%, transparent 50%);
        background-position:calc(100% - 22px) 22px, calc(100% - 14px) 22px;
        background-size:8px 8px, 8px 8px;
        background-repeat:no-repeat;
        padding-right:46px;
    }
    .db-field select option{ background:#1a1126; color:#fff; }
    .db-field .hint{ font-size:12px; color:rgba(255,255,255,.55); margin:6px 4px 0; }
    .db-field .hint .ok{ color:#3ae07c; font-weight:700; }
    .db-field .hint .err{ color:#ff6b8a; font-weight:600; }

    .db-otp-row{ display:flex; gap:10px; align-items:flex-end; }
    .db-otp-row .db-field{ flex:1; }
    .db-btn-ghost{
        height:54px; padding:0 22px; border-radius:30px;
        border:1px solid #ffd29a; background:transparent; color:#ffd29a;
        font-weight:700; cursor:pointer; white-space:nowrap; font-size:14px;
        transition:all .25s ease;
    }
    .db-btn-ghost:hover{ background:#ffd29a; color:#1a1126; }
    .db-btn-secondary{
        height:54px; padding:0 26px; border-radius:30px;
        background:rgba(255,255,255,.06); color:#fff;
        border:1px solid rgba(255,255,255,.18); font-weight:700; cursor:pointer; font-size:14px;
    }
    .db-btn-secondary:hover{ background:rgba(255,255,255,.10); }
    .db-actions{ display:flex; justify-content:space-between; align-items:center; gap:14px; margin-top:36px; flex-wrap:wrap; }
    .db-section-title{ margin:0 0 4px; font-size:22px; font-weight:800; color:#fff; }
    .db-section-sub{ margin:0 0 24px; color:rgba(255,255,255,.7); font-size:14px; line-height:1.6; }

    /* ----- Platform rows ----- */
    .reg-platform-row{
        padding:18px 22px;
        border:1px solid rgba(255,255,255,.10);
        border-radius:16px;
        background:rgba(255,255,255,.03);
        margin-bottom:14px;
        transition:all .25s ease;
    }
    .reg-platform-row.is-primary{
        border-color:#ffd29a;
        background:linear-gradient(90deg, rgba(178,13,93,.18) 0%, rgba(74,10,180,.18) 100%);
    }
    .reg-platform-row .row-head{
        display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; gap:10px; flex-wrap:wrap;
    }
    .reg-platform-row .row-head h5{
        margin:0; font-size:15px; font-weight:700; color:#fff; display:flex; align-items:center; gap:10px;
    }
    .reg-platform-row .row-head h5 i{ color:#ffd29a; font-size:18px; }
    .reg-platform-row .primary-badge{
        display:none; font-size:11px; padding:4px 12px; border-radius:30px; font-weight:800;
        letter-spacing:.6px; text-transform:uppercase;
        background:#ffd29a; color:#1a1126;
    }
    .reg-platform-row.is-primary .primary-badge{ display:inline-block; }
    .reg-platform-row .row-grid{ display:grid; grid-template-columns:2fr 1fr; gap:12px; }
    @media (max-width:575px){ .reg-platform-row .row-grid{ grid-template-columns:1fr; } }

    /* ----- Totals + tier ----- */
    .reg-totals{
        padding:18px 22px;
        border:1.5px dashed rgba(255,210,154,.45);
        border-radius:14px;
        background:rgba(255,210,154,.05);
        display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px;
        color:#fff;
    }
    .reg-totals strong{ color:#ffd29a; font-size:22px; }
    .reg-tier-pill{
        display:inline-flex; align-items:center; gap:8px;
        padding:8px 18px; border-radius:30px;
        background:linear-gradient(90deg, #B20D5D 0%, #4A0AB4 100%);
        color:#fff; font-weight:800; letter-spacing:.4px;
    }
    .reg-tier-pill .dot{ width:10px; height:10px; border-radius:50%; background:#ffd29a; }
    .reg-tier-card{
        text-align:center; padding:14px;
        border:1px solid rgba(255,255,255,.10); border-radius:12px;
        background:rgba(255,255,255,.03); color:#fff;
    }
    .reg-tier-card strong{ display:block; color:#fff; font-size:15px; }
    .reg-tier-card small{ color:rgba(255,255,255,.6); }

    /* ----- Categories ----- */
    .reg-cat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
    @media (max-width:767px){ .reg-cat-grid{ grid-template-columns:1fr 1fr; } }
    @media (max-width:480px){ .reg-cat-grid{ grid-template-columns:1fr; } }
    .reg-cat-grid label{
        display:flex; align-items:center; gap:12px;
        padding:14px 16px; border-radius:12px; cursor:pointer;
        background:rgba(255,255,255,.04);
        border:1px solid rgba(255,255,255,.10);
        color:#fff; font-weight:500; font-size:14px;
        transition:all .2s ease;
    }
    .reg-cat-grid label:hover{ border-color:#ffd29a; background:rgba(255,255,255,.07); }
    .reg-cat-grid input{ accent-color:#B20D5D; width:18px; height:18px; }
    .reg-cat-grid input:checked + span{ color:#ffd29a; font-weight:700; }

    /* ----- Select2 — dark theme to match .db-field inputs ----- */
    /* Hide every Select2-managed native <select> unconditionally. Select2
       creates its own visible widget after init, so the native one never
       needs to be on screen. We use display:none with !important so it
       beats the existing .db-field select rules (background-image arrows,
       54px height, etc.) and works even before Select2's CSS has loaded. */
    .db-field select.js-db-select{
        display:none !important;
    }
    .db-field .select2-container{ width:100% !important; display:block; }
    .db-field .select2-container--default .select2-selection--single{
        height:54px;
        background:rgba(255,255,255,.04);
        border:1px solid rgba(255,255,255,.20);
        border-radius:30px;
        padding:0 22px;
        display:flex; align-items:center;
        transition:all .25s ease;
    }
    .db-field .select2-container--default .select2-selection--single:hover{
        background:rgba(255,255,255,.06);
    }
    .db-field .select2-container--open .select2-selection--single,
    .db-field .select2-container--focus .select2-selection--single{
        border-color:#ffd29a !important;
        background:rgba(255,255,255,.06) !important;
        box-shadow:0 0 0 3px rgba(255,210,154,.18);
    }
    .db-field .select2-container--default .select2-selection--single .select2-selection__rendered{
        color:#fff;
        font-size:15px;
        line-height:54px;
        padding:0;
    }
    .db-field .select2-container--default .select2-selection--single .select2-selection__placeholder{
        color:rgba(255,255,255,.55);
    }
    .db-field .select2-container--default .select2-selection--single .select2-selection__arrow{
        height:54px;
        right:18px;
    }
    .db-field .select2-container--default .select2-selection--single .select2-selection__arrow b{
        border-color:#ffd29a transparent transparent transparent;
    }
    .db-field .select2-container--open .select2-selection__arrow b{
        border-color:transparent transparent #ffd29a transparent !important;
    }
    /* Dropdown panel */
    .select2-dropdown.db-select2-dropdown,
    .select2-container--open .select2-dropdown{
        background:#1a1126;
        border:1px solid rgba(255,210,154,.30);
        border-radius:14px;
        overflow:hidden;
        box-shadow:0 14px 40px rgba(0,0,0,.45);
    }
    .select2-container--default .select2-results__option{
        color:rgba(255,255,255,.85);
        padding:11px 18px;
        font-size:14.5px;
    }
    .select2-container--default .select2-results__option--highlighted[aria-selected],
    .select2-container--default .select2-results__option--highlighted{
        background:linear-gradient(90deg, rgba(178,13,93,.6) 0%, rgba(74,10,180,.6) 100%);
        color:#fff;
    }
    .select2-container--default .select2-results__option[aria-selected=true]{
        background:rgba(255,210,154,.10);
        color:#ffd29a;
        font-weight:700;
    }
    .select2-container--default .select2-search--dropdown .select2-search__field{
        background:rgba(255,255,255,.06);
        border:1px solid rgba(255,255,255,.18);
        color:#fff;
        border-radius:10px;
        padding:8px 12px;
    }
    /* Mark Select2 selection as errored when its hidden native select has .error */
    .db-field select.error + .select2-container .select2-selection--single{
        border-color:#ff6b8a !important;
        box-shadow:0 0 0 3px rgba(255,107,138,.18) !important;
        background:rgba(255,107,138,.06) !important;
    }
    .db-field select.valid + .select2-container .select2-selection--single{
        border-color:rgba(58,224,124,.45);
    }

    /* ----- Validation error styling ----- */
    .db-field label.error,
    .db-field-error{
        display:block;
        color:#ff6b8a;
        font-size:12.5px;
        font-weight:600;
        margin:6px 4px 0;
        line-height:1.4;
        letter-spacing:.1px;
    }
    .db-field input.error,
    .db-field select.error,
    .db-field input.is-invalid,
    .db-field select.is-invalid{
        border-color:#ff6b8a !important;
        box-shadow:0 0 0 3px rgba(255,107,138,.18) !important;
        background:rgba(255,107,138,.06) !important;
    }
    .db-field input.valid,
    .db-field select.valid{
        border-color:rgba(58,224,124,.45);
    }
    .reg-cat-grid + label.error{
        display:block;
        color:#ff6b8a;
        font-size:13px;
        font-weight:600;
        margin-top:12px;
    }

    /* Tier reference cards — responsive grid (was hardcoded inline) */
    .reg-tier-grid{
        margin-top:14px;
        display:grid;
        grid-template-columns:repeat(4,1fr);
        gap:10px;
    }
    @media (max-width:767px){ .reg-tier-grid{ grid-template-columns:1fr 1fr; } }
    @media (max-width:480px){ .reg-tier-grid{ grid-template-columns:1fr; } }

    /* OTP row — wrap button below input on very small screens */
    @media (max-width:480px){
        .db-otp-row{ flex-wrap:wrap; }
        .db-otp-row .db-btn-ghost{ width:100%; }
    }

    /* Stepper text — shrink on very small screens so it fits one line */
    @media (max-width:480px){
        .db-stepper .step{ font-size:11px; padding:6px 10px; }
        .db-stepper .step .num{ width:24px; height:24px; font-size:12px; }
        .db-stepper .sep{ min-width:10px; max-width:24px; }
    }

/* ----- Extracted static inline styles (register.blade.php) ----- */
.reg-mark-danger{ color:#ff6b8a; }
.reg-mark-accent{ color:#ffd29a; }
.reg-flex-1{ flex:1; }
.reg-hidden{ display:none; }
.reg-mt-18{ margin-top:18px; }
.reg-mt-34{ margin-top:34px; }
.reg-fs-20{ font-size:20px; }
.reg-mb-0{ margin-bottom:0; }