:root{

    --primary:#0B6B46;

    --secondary:#1E8E5A;

    --primary-light:#27AE60;

    --primary-dark:#083F2A;

    --cream:#FDFBF6;

    --background:#F7F6F2;

    --surface:#FFFFFF;

    --white:#FFFFFF;

    --gold:#D8B04C;

    --gold-light:#F4D06F;

    --text:#18352C;

    --muted:#74827A;

    --border:#E8ECE8;

    --danger:#F44336;

    --success:#16C784;

    --warning:#FFB020;

}

*{
    box-sizing:border-box;
}

html,
body{

    overflow-x:hidden;

    max-width:100%;

}

body{

    font-family:'Poppins',sans-serif;

    background:

        radial-gradient(
            ellipse at top left,
            rgba(11,107,70,.08),
            transparent 40%
        ),

        radial-gradient(
            ellipse at bottom right,
            rgba(216,176,76,.08),
            transparent 40%
        ),

        var(--background);

    color:var(--text);

    min-height:100vh;

}

/* ── Navbar ── */

.navbar{

    padding:1rem 0;

}

.navbar.scrolled{

    background-color:rgba(255,255,255,.96);

    backdrop-filter:blur(12px);

    border-bottom:1px solid var(--border);

    box-shadow:0 4px 20px rgba(0,0,0,.05);

}

.navbar-brand img{

    height:44px;

}

.navbar-nav .nav-link{

    color:var(--text);

    font-weight:500;

    margin:0 .6rem;

    transition:color .2s;

}

.navbar-nav .nav-link:hover{

    color:var(--primary);

}

.navbar-toggler{

    border:none;

    color:var(--text);

}

.navbar-toggler-icon{

    background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%2318352C' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");

}

.navbar-toggler:focus{

    box-shadow:none;

}

.navbar-custom.toggled{

    background:#FFFFFF;

    backdrop-filter:blur(10px);

}

.btn-gold-nav{

    background:linear-gradient(
        135deg,
        var(--gold),
        var(--gold-light)
    );

    color:#fff;

    font-weight:700;

    border:none;

    border-radius:8px;

    padding:.45rem 1.2rem;

    font-size:.88rem;

    text-decoration:none;

    display:inline-block;

    transition:all .3s;

}

.btn-gold-nav:hover{

    opacity:.9;

    color:#fff;

    transform:translateY(-2px);

}

/* ── Register shell ── */

.register-shell{

    min-height:100vh;

    padding:110px 0 80px;

}

/* ── Register Card ── */

.register-card{

    background:var(--surface);

    border:1px solid var(--border);

    border-radius:24px;

    padding:36px 32px;

    box-shadow:0 20px 50px rgba(11,107,70,.10);

}

.register-badge{

    display:inline-flex;

    align-items:center;

    gap:8px;

    background:rgba(11,107,70,.08);

    border:1px solid rgba(11,107,70,.18);

    color:var(--primary);

    border-radius:999px;

    padding:7px 14px;

    font-size:.7rem;

    font-weight:600;

    margin-bottom:1.1rem;

}

.register-logo{

    width:88px;

    margin-bottom:1rem;

}

.register-card h2{

    font-size:1.45rem;

    font-weight:800;

    color:var(--text);

    margin-bottom:.4rem;

}

.register-card h2 span{

    color:var(--primary);

}

.register-copy{

    color:var(--muted);

    font-size:.83rem;

    line-height:1.65;

    margin-bottom:1.6rem;

}

/* ── Form ── */

.form-label{

    color:var(--text);

    font-weight:600;

    font-size:.8rem;

    margin-bottom:6px;

}

.form-control,
.form-select{

    border-radius:12px;

    border:1px solid var(--border);

    background:#fff;

    color:var(--text);

    padding:11px 14px;

    font-family:'Poppins',sans-serif;

    font-size:.87rem;

    transition:border-color .2s, box-shadow .2s;

}

.form-control::placeholder{

    color:#98A39D;

}

.form-control:focus,
.form-select:focus{

    background:#fff;

    color:var(--text);

    border-color:var(--primary);

    box-shadow:0 0 0 3px rgba(11,107,70,.12);

}

.form-select option{

    background:#fff;

    color:var(--text);

}

        /* ── Package picker ── */

.pkg-option{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:12px;

    background:var(--surface);

    border:1.5px solid var(--border);

    border-radius:14px;

    padding:14px 16px;

    cursor:pointer;

    transition:border-color .2s,
               background .2s,
               transform .15s;

    margin-bottom:10px;

    user-select:none;

    box-shadow:0 4px 12px rgba(11,107,70,.04);

}

.pkg-option:hover{

    border-color:var(--primary);

    background:rgba(11,107,70,.04);

}

.pkg-option:active{

    transform:scale(.99);

}

.pkg-option.selected{

    border-color:var(--primary);

    background:rgba(11,107,70,.08);

    box-shadow:0 8px 24px rgba(11,107,70,.10);

}

.pkg-name{

    font-size:.95rem;

    font-weight:700;

    color:var(--text);

    display:flex;

    align-items:center;

    gap:8px;

}

.pkg-tag{

    font-size:.6rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.06em;

    color:var(--gold);

}

.pkg-desc{

    font-size:.74rem;

    color:var(--muted);

    margin-top:3px;

}

.pkg-side{

    display:flex;

    align-items:center;

    gap:12px;

    flex-shrink:0;

}

.pkg-price{

    font-size:1rem;

    font-weight:800;

    color:var(--primary);

    white-space:nowrap;

}

.pkg-radio{

    width:22px;

    height:22px;

    border-radius:50%;

    border:2px solid var(--border);

    flex-shrink:0;

    transition:.2s;

    display:flex;

    align-items:center;

    justify-content:center;

}

.pkg-option.selected .pkg-radio{

    border-color:var(--primary);

    background:var(--primary);

}

.pkg-option.selected .pkg-radio::after{

    content:"";

    width:8px;

    height:8px;

    border-radius:50%;

    background:#fff;

}

/* ── Submit Button ── */

.btn-register{

    width:100%;

    padding:13px;

    border-radius:12px;

    border:none;

    background:linear-gradient(
        135deg,
        var(--primary),
        var(--secondary)
    );

    color:#fff;

    font-family:'Poppins',sans-serif;

    font-weight:800;

    font-size:.92rem;

    cursor:pointer;

    transition:all .3s;

}

.btn-register:hover:not(:disabled){

    transform:translateY(-3px);

    box-shadow:0 14px 35px rgba(11,107,70,.28);

}

.btn-register:disabled{

    opacity:.6;

    cursor:not-allowed;

}

/* ── Info Note ── */

.register-note{

    margin-top:1.5rem;

    padding:16px 18px;

    border-radius:14px;

    background:rgba(11,107,70,.06);

    border:1px solid rgba(11,107,70,.15);

    color:var(--muted);

    font-size:.8rem;

    line-height:1.6;

}

.register-note strong{

    color:var(--primary);

}

/* ── Side info panel ── */

.register-info-panel{

    padding:2rem;

    height:100%;

    display:flex;

    flex-direction:column;

    justify-content:center;

}

.register-info-panel h3{

    font-size:1.5rem;

    font-weight:800;

    color:var(--text);

    margin-bottom:1.1rem;

    line-height:1.3;

}

.register-info-panel h3 span{

    color:var(--primary);

}

.info-feature{

    display:flex;

    align-items:flex-start;

    gap:14px;

    margin-bottom:1.4rem;

}

.info-feature-icon{

    width:44px;

    height:44px;

    border-radius:12px;

    background:rgba(11,107,70,.08);

    border:1px solid rgba(11,107,70,.15);

    display:flex;

    align-items:center;

    justify-content:center;

    color:var(--primary);

    font-size:1.1rem;

    flex-shrink:0;

}

.info-feature-text strong{

    display:block;

    color:var(--text);

    font-size:.95rem;

    margin-bottom:3px;

}

.info-feature-text span{

    font-size:.83rem;

    color:var(--muted);

    line-height:1.5;

}

.info-stat-row{

    display:flex;

    gap:1rem;

    margin-top:2rem;

}

.info-stat{

    flex:1;

    background:var(--surface);

    border:1px solid var(--border);

    border-radius:14px;

    padding:1rem;

    text-align:center;

    box-shadow:0 6px 18px rgba(11,107,70,.05);

}

.info-stat-value{

    font-size:1.5rem;

    font-weight:800;

    color:var(--primary);

}

.info-stat-label{

    font-size:.72rem;

    color:var(--muted);

    text-transform:uppercase;

    letter-spacing:.07em;

    margin-top:3px;

}

       /* ── Footer ── */

#footer{

    background:var(--surface);

    padding:3rem 0 1.5rem;

    border-top:1px solid var(--border);

    font-size:.88rem;

    color:var(--muted);

    box-shadow:0 -8px 30px rgba(11,107,70,.04);

}

.footer-logo img{

    height:38px;

    margin-bottom:.6rem;

}

.footer-links ul{

    list-style:none;

    padding:0;

    margin:0;

}

.footer-links ul li{

    margin-bottom:.5rem;

}

.footer-links ul a{

    color:var(--muted);

    text-decoration:none;

    transition:all .25s ease;

}

.footer-links ul a:hover{

    color:var(--primary);

}

.footer-links h5{

    font-size:.88rem;

    font-weight:700;

    color:var(--text);

    margin-bottom:.8rem;

}

.social-links a{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:34px;

    height:34px;

    border-radius:50%;

    border:1px solid var(--border);

    background:var(--surface);

    color:var(--primary);

    margin-right:7px;

    transition:all .3s;

    text-decoration:none;

    box-shadow:0 4px 12px rgba(11,107,70,.05);

}

.social-links a:hover{

    background:var(--primary);

    border-color:var(--primary);

    color:#fff;

    transform:translateY(-3px);

    box-shadow:0 10px 24px rgba(11,107,70,.22);

}

.copyright{

    text-align:center;

    padding-top:1.5rem;

    margin-top:1.5rem;

    border-top:1px solid var(--border);

    font-size:.8rem;

    color:var(--muted);

}

.copyright span{

    color:var(--primary);

    font-weight:600;

}

/* ── Error message ── */

.pay-error{

    color:var(--danger);

    font-size:.84rem;

    margin-top:.5rem;

    text-align:center;

}

/* ── Responsive ── */

@media (max-width:991.98px){

    .register-info-panel{

        display:none;

    }

    .register-card{

        padding:30px 24px;

    }

}

@media (max-width:575px){

    .register-shell{

        padding:95px 0 60px;

    }

    .register-card h2{

        font-size:1.6rem;

    }

}