/* ============================================================
   ENHANCEMENT PACK C — FINAL CLEAN SCROLL-SAFE VERSION
   Features:
   - Accent Reactive Glow
   - Animated Shard Glass
   - Neon Grid Background
   - Horizontal Pulse Beam
   - Zero Scroll Freeze
   - Zero Conflicts
=============================================================== */

/* -----------------------------------------
   GLOBAL BACKGROUND — GRID + PULSE BAR
----------------------------------------- */

body {
    position: relative;
}

/* Neon grid */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 1;

    background:
        linear-gradient(rgba(var(--accent-rgb),0.10) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--accent-rgb),0.10) 1px, transparent 1px);
    background-size: 120px 120px;

    opacity: 1.00; /* 40% stronger grid */
    animation: gridFloat 22s linear infinite;
    mix-blend-mode: screen;
}

@keyframes gridFloat {
    from { background-position: 0 0; }
    to   { background-position: 160px 160px; }
}

/* Horizontal pulse bar moving vertically */
body::after {
    content: "";
    position: fixed;
    width: 100%;
    height: 3px;
    left: 0;
    pointer-events: none;
    z-index: 1;

    background: linear-gradient(
        to right,
        rgba(var(--accent-rgb),0),
        rgba(var(--accent-rgb),0.9),
        rgba(var(--accent-rgb),0)
    );

    opacity: 0.45;
    animation: pulseSlide 12s linear infinite;
}

@keyframes pulseSlide {
    0%   { top: 5%; }
    50%  { top: 95%; }
    100% { top: 5%; }
}

/* -----------------------------------------
   MAIN FORM PANEL (.container or .content-column)
----------------------------------------- */

.container,
.content-column {
    position: relative;
    overflow: hidden;
    border-radius: 22px;
    z-index: 3;
    background: rgba(0,0,0,0.55);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    /* Micro bevel for extra depth */
    box-shadow:
        inset 0 0 22px rgba(255,255,255,0.05),
        inset 0 0 6px rgba(255,255,255,0.02);

    /* Smooth parallax tilt */
animation: panelBreathe 14s ease-in-out infinite;
}

/* Outer glow */
.container::before,
.content-column::before {
    content: "";
    position: absolute;
    inset: -24px;
    border-radius: inherit;
    z-index: -1;

    box-shadow:
        0 0 65px rgba(var(--accent-rgb),0.55),
        0 0 120px rgba(var(--accent-rgb),0.30);
        
            /* Subtle horizontal lens-shine */
    background: linear-gradient(
        to right,
        rgba(255,255,255,0),
        rgba(255,255,255,0.05),
        rgba(255,255,255,0)
    );
    mix-blend-mode: screen;
    opacity: 0.35;


    animation: glowPulse 6s ease-in-out infinite;
}

@keyframes glowPulse {
    0%,100% { opacity: 0.75; transform: scale(1); }
    50%     { opacity: 1;   transform: scale(1.03); }
}

/* Shard glass sweep */
.container::after,
.content-column::after {
    content: "";
    position: absolute;
    width: 180%;
    height: 180%;
    left: -40%;
    top: -40%;
    border-radius: inherit;
    z-index: -1;

background: linear-gradient(
    120deg,
    rgba(255,255,255,0.12) 0%,   /* +140% stronger highlight */
    rgba(255,255,255,0.40) 18%,  /* brighter shard edge */
    rgba(255,255,255,0.14) 38%,  /* increased reflection */
    rgba(255,255,255,0) 60%
);


    mix-blend-mode: overlay;
    animation: shardSweep 12s ease-in-out infinite;
    pointer-events: none;
}

@keyframes shardSweep {
    0%   { transform: translateX(-60%) rotate(12deg); opacity: 0.12; }
    40%  { opacity: 0.55; }
    55%  { transform: translateX(55%) rotate(12deg); opacity: 0.40; }
    90%  { opacity: 0.55; }
    100% { transform: translateX(-60%) rotate(12deg); opacity: 0.12; }
}

@keyframes panelTilt {
    0%   { transform: perspective(900px) rotateX(0deg) rotateY(0deg); }
    40%  { transform: perspective(900px) rotateX(2deg) rotateY(-2deg); }
    60%  { transform: perspective(900px) rotateX(-1deg) rotateY(2deg); }
    100% { transform: perspective(900px) rotateX(0deg) rotateY(0deg); }
}

@keyframes panelBreathe {
    0%   { transform: scale(1); }
    50%  { transform: scale(1.025); }
    100% { transform: scale(1); }
}



/* -----------------------------------------
   SUBHEADLINE BLOCK GLOW
----------------------------------------- */

.lead-subheadline {
    position: relative;
    padding: 20px;
    border-radius: 14px;
    margin-top: 30px !important;
    margin-bottom: 35px !important;
    z-index: 5;
}

.lead-subheadline::before {
    content: "";
    position: absolute;
    inset: -14px;
    border-radius: 20px;
    z-index: -1;

/* Tone-down glow for all colours very slightly */
box-shadow:
    0 0 38px rgba(var(--accent-rgb),0.35),  /* ↓ from 0.45 */
    0 0 70px rgba(var(--accent-rgb),0.12);  /* ↓ from 0.18 */
}

.lead-subheadline::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 14px;
    z-index: -1;

    box-shadow: inset 0 0 25px rgba(var(--accent-rgb),0.55);
    opacity: 0.22;
}

/* -----------------------------------------
   INPUT FOCUS EFFECT
----------------------------------------- */

form input:focus {
    box-shadow:
        0 0 26px rgba(var(--accent-rgb),0.55),
        0 0 45px rgba(var(--accent-rgb),0.25) !important;

    border-color: rgba(var(--accent-rgb),1) !important;
    background: rgba(255,255,255,0.28) !important;
}

/* -----------------------------------------
   BUTTON HOVER EFFECT
----------------------------------------- */

.btn-primary:hover {
    box-shadow:
        0 0 35px rgba(var(--accent-rgb),0.55),
        0 0 70px rgba(var(--accent-rgb),0.30) !important;

    transform: translateY(-5px) scale(1.02);
}