:root{
    --brand-navy:#0b2545;
    --brand-navy-dark:#081b33;
    --brand-navy-soft:#13315c;
    --brand-gold:#d9a441;
    --brand-gold-soft:#f0c877;
    --brand-cream:#fbf6ec;
    --brand-cream-dark:#f3ead9;
    --brand-gray:#75818f;
    --radius:14px;
    --radius-sm:10px;
    --shadow-soft:0 10px 30px rgba(11,37,69,.08);
    --shadow-lift:0 16px 34px rgba(11,37,69,.14);
}

*{ box-sizing:border-box; }

body{
    font-family:'Poppins',Segoe UI,Arial,sans-serif;
    background:
        radial-gradient(1200px 500px at 10% -10%, rgba(217,164,65,.08), transparent),
        radial-gradient(1000px 500px at 100% 0%, rgba(11,37,69,.05), transparent),
        var(--brand-cream);
    color:#22303e;
}

h1,h2,h3,.section-title{
    font-family:'Playfair Display',Georgia,serif;
}

/* ---------- Header / Footer ---------- */
.site-header{
    background:linear-gradient(135deg,var(--brand-navy) 0%,var(--brand-navy-dark) 100%);
    position:relative;
    z-index:10;
}
.site-header .navbar-brand{
    color:#fff;
    font-size:1.5rem;
    letter-spacing:.5px;
}
.brand-logo-wrap{
    background:#fff;
    padding:4px 10px;
    border-radius:8px;
    display:inline-flex;
    align-items:center;
    line-height:0;
    box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.brand-logo{
    height:26px;
    width:auto;
    display:block;
}
.ayush-logo-wrap{
    background:#fff;
    padding:3px 6px;
    border-radius:8px;
    line-height:0;
    box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.ayush-logo{
    height:38px;
    width:auto;
    display:block;
}
@media (max-width:576px){
    .brand-logo{ height:20px; }
}
.site-footer{
    background:var(--brand-navy-dark);
    color:#c7d1dd;
    margin-top:3rem;
}

/* ---------- Registration page hero backdrop ----------
   A contained, rounded "hero" section that sits behind the wizard on
   Register.aspx: the conference photo, heavily blurred and darkened for
   contrast, with the wizard floating on top as a frosted glass card.
   Scoped entirely to .register-hero-wrap so it never affects any other
   page (Default/Success/Error keep the plain cream background). */
.register-hero-wrap{
    position:relative;
    border-radius:28px;
    overflow:hidden;
    padding:2.75rem 1rem 3rem;
    isolation:isolate;
    box-shadow:0 30px 70px rgba(8,20,40,.35);
}
.register-hero-wrap:before{
    content:"";
    position:absolute;
    inset:-12px;
    background:
        linear-gradient(165deg, rgba(6,20,40,.88), rgba(11,37,69,.6)),
        url('images/register-hero.jpg') center 30%/cover no-repeat;
    filter:blur(7px) saturate(1.08);
    z-index:0;
}
.register-hero-wrap > *{ position:relative; z-index:1; }

.hero-eyebrow{ margin-bottom:1.75rem; }
.hero-eyebrow .badge-gold{
    display:inline-block;
    background:linear-gradient(135deg,var(--brand-gold-soft),var(--brand-gold));
    color:#3a2a00;
    padding:.35rem 1rem;
    border-radius:999px;
    font-weight:700;
    font-size:.78rem;
    letter-spacing:1px;
    text-transform:uppercase;
    box-shadow:0 6px 16px rgba(217,164,65,.35);
}
.hero-eyebrow .hero-subtitle{
    color:rgba(255,255,255,.82);
    margin-top:.6rem;
    font-size:.95rem;
}

/* Frosted-glass variant of .card-panel, used only inside the hero */
.card-panel.glass{
    background:rgba(255,255,255,.95);
    -webkit-backdrop-filter:blur(10px);
    backdrop-filter:blur(10px);
    box-shadow:0 25px 55px rgba(0,0,0,.32), 0 0 0 1px rgba(255,255,255,.5) inset;
}

/* Stepper re-themed for the dark blurred backdrop */
.register-hero-wrap .wizard-steps li{ color:rgba(255,255,255,.75); }
.register-hero-wrap .wizard-steps li:before{ background:rgba(255,255,255,.28); }
.register-hero-wrap .wizard-steps li .step-circle{
    background:rgba(255,255,255,.14);
    border-color:rgba(255,255,255,.45);
    color:#fff;
}
.register-hero-wrap .wizard-steps li.completed .step-circle{
    background:var(--brand-gold);
    border-color:var(--brand-gold);
    color:#3a2a00;
}
.register-hero-wrap .wizard-steps li.completed:before{ background:var(--brand-gold); }
.register-hero-wrap .wizard-steps li.active .step-circle{
    background:#fff;
    border-color:#fff;
    color:var(--brand-navy);
    box-shadow:0 0 0 6px rgba(255,255,255,.22);
}
.register-hero-wrap .wizard-steps li.active{ color:#fff; font-weight:600; }

@media (max-width:576px){
    .register-hero-wrap{ border-radius:18px; padding:1.75rem .5rem 2rem; }
}

/* ---------- Slim top progress bar (shown during AJAX wizard postbacks) ---------- */
#topLoadingBar{
    position:fixed;
    top:0; left:0;
    height:3px;
    width:0;
    background:linear-gradient(90deg,var(--brand-gold),var(--brand-gold-soft));
    opacity:0;
    transition:width .35s ease, opacity .3s ease;
    z-index:2000;
    pointer-events:none;
}

/* ---------- Entrance animation ----------
   Applied unconditionally to elements that re-appear as fresh DOM nodes
   whenever an UpdatePanel swaps its markup (Next/Back clicks, new pages).
   No JS timing needed - a keyframe animation on a permanently-present
   class auto-replays every time the browser inserts a brand-new node. */
@keyframes fadeSlideIn{
    from{ opacity:0; transform:translateY(14px); }
    to{ opacity:1; transform:translateY(0); }
}
.card-panel{
    background:#fff;
    border-radius:var(--radius);
    box-shadow:var(--shadow-soft);
    padding:2rem;
    animation:fadeSlideIn .45s cubic-bezier(.22,.68,0,1.2);
    border-top:3px solid var(--brand-gold);
}
@media (max-width:576px){
    .card-panel{ padding:1.25rem; }
}

.section-title{
    color:var(--brand-navy);
    font-weight:600;
    margin-bottom:1.25rem;
    position:relative;
    padding-bottom:.5rem;
}
.section-title:after{
    content:"";
    display:block;
    width:56px;
    height:3px;
    background:var(--brand-gold);
    margin-top:.4rem;
    border-radius:2px;
}
.text-center .section-title:after{ margin-left:auto; margin-right:auto; }

/* ---------- Wizard stepper ---------- */
.wizard-steps{
    display:flex;
    list-style:none;
    padding:0;
    margin:0 0 2rem 0;
    justify-content:space-between;
    animation:fadeSlideIn .45s cubic-bezier(.22,.68,0,1.2);
}
.wizard-steps li{
    flex:1;
    text-align:center;
    position:relative;
    font-size:.8rem;
    color:var(--brand-gray);
}
.wizard-steps li .step-circle{
    width:38px;height:38px;line-height:38px;
    border-radius:50%;
    background:#fff;
    border:2px solid #e3e8ef;
    color:var(--brand-gray);
    font-weight:600;
    margin:0 auto 6px auto;
    transition:all .3s ease;
}
.wizard-steps li:before{
    content:"";
    position:absolute;
    top:19px;left:-50%;
    width:100%;height:2px;
    background:#e3e8ef;
    z-index:0;
}
.wizard-steps li:first-child:before{ content:none; }
.wizard-steps li.completed .step-circle{
    background:var(--brand-navy);
    border-color:var(--brand-navy);
    color:#fff;
}
.wizard-steps li.active .step-circle{
    background:var(--brand-gold);
    border-color:var(--brand-gold);
    color:#3a2a00;
    box-shadow:0 0 0 5px rgba(217,164,65,.22);
    animation:stepPulse .5s ease;
}
@keyframes stepPulse{
    0%{ transform:scale(.7); }
    60%{ transform:scale(1.12); }
    100%{ transform:scale(1); }
}
.wizard-steps li.active{ color:var(--brand-navy); font-weight:600; }
.wizard-steps li.completed:before{ background:var(--brand-navy); }

@media (max-width:576px){
    .wizard-steps li{ font-size:.65rem; }
    .wizard-steps li .step-circle{ width:30px;height:30px;line-height:28px;font-size:.75rem; }
}

/* ---------- Fee badge ---------- */
.fee-badge{
    display:inline-block;
    background:linear-gradient(135deg,var(--brand-gold-soft),var(--brand-gold));
    color:#3a2a00;
    font-weight:700;
    font-size:1.25rem;
    padding:.4rem 1.1rem;
    border-radius:var(--radius-sm);
    box-shadow:0 4px 12px rgba(217,164,65,.35);
}

/* ---------- Form controls ---------- */
.form-label{
    font-weight:500;
    color:#33445a;
}
.form-control, .form-select{
    border-radius:var(--radius-sm);
    padding:.6rem .85rem;
    border-color:#e3e8ef;
    transition:border-color .2s ease, box-shadow .2s ease;
}
.form-control:focus, .form-select:focus{
    border-color:var(--brand-navy);
    box-shadow:0 0 0 .2rem rgba(11,37,69,.12);
}
.role-card{
    border:2px solid #e9edf3;
    border-radius:var(--radius);
    padding:1.1rem 1rem;
    cursor:pointer;
    text-align:center;
    transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    height:100%;
    background:#fff;
}
.role-card:hover{
    border-color:var(--brand-gold);
    transform:translateY(-3px);
    box-shadow:var(--shadow-lift);
}
.role-card.selected{
    border-color:var(--brand-navy);
    background:linear-gradient(160deg,#eef3fb,#fff);
    box-shadow:var(--shadow-soft);
}

/* ---------- Buttons ---------- */
.btn-brand{
    background:var(--brand-navy);
    border-color:var(--brand-navy);
    color:#fff;
    font-weight:500;
    padding:.6rem 1.7rem;
    border-radius:var(--radius-sm);
    transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.btn-brand:hover{
    background:var(--brand-navy-soft);
    color:#fff;
    transform:translateY(-2px);
    box-shadow:0 10px 20px rgba(11,37,69,.25);
}
.btn-brand:active{ transform:translateY(0); }
.btn-outline-brand{
    border:1px solid var(--brand-navy);
    color:var(--brand-navy);
    font-weight:500;
    padding:.6rem 1.7rem;
    border-radius:var(--radius-sm);
    background:#fff;
    transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.btn-outline-brand:hover{
    background:var(--brand-navy);
    color:#fff;
    transform:translateY(-2px);
    box-shadow:0 10px 20px rgba(11,37,69,.18);
}
.btn-outline-brand:active{ transform:translateY(0); }

/* ---------- Review table ---------- */
.review-table td{ padding:.55rem .75rem; }
.review-table td.label{ color:var(--brand-gray); width:40%; }
.review-table td.value{ font-weight:600; }
.review-table tr{ border-bottom:1px solid #f0ede4; }

/* ---------- Success page ---------- */
.success-icon{
    width:80px;height:80px;border-radius:50%;
    background:#e7f7ec;color:#1e9e50;
    display:flex;align-items:center;justify-content:center;
    font-size:2.5rem;margin:0 auto 1rem auto;
    animation:popIn .5s cubic-bezier(.22,.68,0,1.2);
}
@keyframes popIn{
    from{ opacity:0; transform:scale(.5); }
    to{ opacity:1; transform:scale(1); }
}
.reg-id-box{
    background:var(--brand-navy);
    color:#fff;
    border-radius:var(--radius-sm);
    padding:1rem 1.5rem;
    display:inline-block;
    font-size:1.4rem;
    letter-spacing:1px;
    font-weight:700;
}

/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce){
    .card-panel, .wizard-steps, .success-icon, .wizard-steps li.active .step-circle{
        animation:none !important;
    }
    .role-card, .btn-brand, .btn-outline-brand{
        transition:none !important;
    }
}

/* ---------- Group registration ---------- */
.fee-breakdown{
    width:100%;
    max-width:420px;
    font-size:.9rem;
    margin-bottom:.75rem;
}
.fee-breakdown td{ padding:.2rem 0; }
.fee-breakdown td:last-child{ text-align:right; font-weight:600; }
.fee-breakdown tr.discount td{ color:#1e9e50; }

.member-card{
    background:#fbfcfe;
    border:1px solid #e6ebf2;
    border-radius:12px;
    padding:1rem 1rem .85rem;
    margin-bottom:.9rem;
    transition:box-shadow .2s ease, border-color .2s ease;
}
.member-card:hover{
    border-color:var(--brand-gold);
    box-shadow:0 8px 20px rgba(11,37,69,.08);
}
.member-card-head{
    display:flex;
    align-items:center;
    gap:.55rem;
    font-weight:600;
    color:var(--brand-navy);
    margin-bottom:.65rem;
}
.member-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:26px;height:26px;
    border-radius:50%;
    background:var(--brand-gold);
    color:#3a2a00;
    font-size:.8rem;
    font-weight:700;
}
.review-members-table th{
    color:var(--brand-gray);
    font-weight:500;
    font-size:.8rem;
    white-space:nowrap;
}
.review-members-table td{ font-size:.88rem; vertical-align:middle; }
.badge-leader{
    display:inline-block;
    margin-left:.35rem;
    padding:.1rem .5rem;
    border-radius:999px;
    background:var(--brand-navy);
    color:#fff;
    font-size:.68rem;
    font-weight:600;
    letter-spacing:.3px;
    vertical-align:middle;
}
.group-offer{
    background:linear-gradient(135deg,#fff8e6,#fdf0cf);
    border:1px dashed var(--brand-gold);
    border-radius:var(--radius-sm);
    padding:.9rem 1.1rem;
    color:#5b4300;
    font-size:.92rem;
}
