/*==================================================
SHARED PAGE SHELL
==================================================*/

:root{
    --paper-width:min(92%,1450px);
    --paper-radius:42px;
    --paper-shadow:0 30px 90px rgba(15,23,42,.12);
    --paper-bg:#ffffff;
    --canvas-blue-1:#08192F;
    --canvas-blue-2:#12335F;
    --canvas-blue-3:#1F5FAF;
    --gold:#D4AF37;
}

body{
    background:#061320;
}

.nobo-canvas{
    position:fixed;
    inset:0;
    z-index:0;
    overflow:hidden;
    pointer-events:none;
    background:

radial-gradient(
circle at 12% 10%,
rgba(212,175,55,.14),
transparent 22%
),

radial-gradient(
circle at 90% 90%,
rgba(31,95,175,.28),
transparent 38%
),

radial-gradient(
circle at 70% 20%,
rgba(255,255,255,.03),
transparent 45%
),

linear-gradient(
145deg,
#04111F 0%,
#0A1F39 32%,
#133867 68%,
#1F5FAF 100%
);
}

.canvas-glow{
    position:absolute;
    width:700px;
    height:700px;
    left:-180px;
    top:-180px;
    border-radius:50%;
    background:radial-gradient(circle,
        rgba(212,175,55,.25),
        transparent 70%);
    filter:blur(30px);
}

.canvas-logo{
    position:absolute;
    right:-180px;
    bottom:-120px;
    width:720px;
    opacity:.06;
    filter:grayscale(100%) brightness(220%);
}

main{
    position:relative;
    z-index:10;
    padding:2rem 0 5rem;
}

.paper{
    width:var(--paper-width);
    margin:100px auto;
    padding:80px;
    background:var(--paper-bg);
    border-radius:var(--paper-radius);
    box-shadow:

0 20px 60px rgba(0,0,0,.06),

0 60px 120px rgba(0,0,0,.10),

0 1px 0 rgba(255,255,255,.7) inset;
    transition:transform .35s ease,
               box-shadow .35s ease;
}

.paper:hover{
    transform:translateY(-4px);
    box-shadow:0 45px 110px rgba(15,23,42,.16);
}

.cta-paper{
    text-align:center;
}

.cta-paper h2{
    margin:20px 0;
}

@media (max-width:900px){
    .paper{
        width:calc(100% - 28px);
        padding:42px 28px;
        margin:40px auto;
    }

    .canvas-logo{
        width:520px;
        right:-160px;
    }
}