/* ======================================================
   BULLFROG — HATCHERY V3
====================================================== */

:root{
    --hat-bg:#010604;
    --hat-panel:rgba(4,15,10,.76);
    --hat-panel2:rgba(7,25,16,.72);

    --hat-text:#f5fff7;
    --hat-muted:#809188;

    --hat-lime:#c8ff4d;
    --hat-green:#6dff9b;
    --hat-aqua:#58ead4;
    --hat-gold:#e8c76c;

    --hat-line:rgba(194,255,105,.13);
    --hat-line2:rgba(255,255,255,.055);
}

body.hatchery-v3-loaded{
    background:#010604 !important;
}

/* AMBIENT WORLD */

#hatcheryV3Glow{
    position:fixed;
    inset:0;
    z-index:-29;
    pointer-events:none;
    background:
        radial-gradient(circle at 72% 17%,rgba(200,255,77,.09),transparent 28%),
        radial-gradient(circle at 16% 75%,rgba(84,236,205,.05),transparent 34%),
        linear-gradient(180deg,rgba(1,8,5,.18),rgba(1,5,3,.90) 72%,#010403);
}

#hatcheryV3Particles{
    position:fixed;
    inset:0;
    z-index:-28;
    pointer-events:none;
    background-size:cover;
    background-position:center;
    opacity:.20;
    mix-blend-mode:screen;
}

/* HERO */

.hatchery-v3-hero{
    width:min(1340px,calc(100% - 28px));
    min-height:min(740px,calc(100vh - 105px));
    margin:112px auto 14px;

    position:relative;
    overflow:hidden;

    display:flex;
    align-items:flex-end;

    border-radius:34px;
    border:1px solid rgba(194,255,105,.15);

    background:#020c08;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.06),
        0 55px 150px rgba(0,0,0,.55);
}

.hatchery-v3-hero-bg{
    position:absolute;
    inset:0;

    background-size:cover;
    background-position:center;

    opacity:.70;

    filter:
        brightness(.52)
        saturate(.82)
        contrast(1.10);
}

.hatchery-v3-hero-bg:after{
    content:"";
    position:absolute;
    inset:0;

    background:
        linear-gradient(
            90deg,
            rgba(1,7,4,.86) 0%,
            rgba(1,7,4,.58) 43%,
            rgba(1,7,4,.28) 72%,
            rgba(1,7,4,.50)
        ),
        linear-gradient(
            180deg,
            rgba(0,0,0,.04),
            rgba(1,6,4,.92) 88%,
            #010403
        );
}

.hatchery-v3-hero-grid{
    position:relative;
    z-index:3;

    width:100%;

    display:grid;
    grid-template-columns:.95fr 1.05fr;
    gap:24px;
    align-items:end;

    padding:clamp(28px,5vw,60px);
}

.hatchery-v3-kicker{
    color:var(--hat-lime);
    font-size:9px;
    font-weight:950;
    letter-spacing:.20em;
}

.hatchery-v3-title{
    margin:15px 0 17px;

    color:#fff;

    font-size:clamp(67px,8.5vw,118px);
    line-height:.77;
    letter-spacing:-.085em;
}

.hatchery-v3-title span{
    color:var(--hat-lime);
}

.hatchery-v3-copy{
    max-width:680px;
    margin:0;

    color:#a1b2a7;
    font-size:clamp(14px,1.4vw,17px);
    line-height:1.7;
}

.hatchery-v3-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:25px;
}

.hatchery-v3-action{
    min-height:51px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:0 18px;

    border-radius:14px;

    text-decoration:none;

    color:#fff;

    border:1px solid rgba(194,255,105,.14);
    background:rgba(2,12,7,.56);

    backdrop-filter:blur(15px);

    font-size:9px;
    font-weight:950;
    letter-spacing:.10em;

    transition:
        transform .18s ease,
        border-color .18s ease;
}

.hatchery-v3-action:hover{
    transform:translateY(-2px);
    border-color:rgba(194,255,105,.32);
}

.hatchery-v3-action.primary{
    color:#041006;
    border:0;
    background:linear-gradient(135deg,var(--hat-lime),var(--hat-green));
}

/* REWARD VAULT */

.hatchery-v3-vault{
    padding:20px;

    border-radius:23px;

    border:1px solid rgba(255,255,255,.07);

    background:rgba(0,10,6,.68);

    backdrop-filter:blur(28px) saturate(145%);
    -webkit-backdrop-filter:blur(28px) saturate(145%);
}

.hatchery-v3-vault-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.hatchery-v3-vault-head span{
    color:#7b8e82;
    font-size:8px;
    font-weight:950;
    letter-spacing:.14em;
}

.hatchery-v3-vault-head strong{
    color:var(--hat-lime);
    font-size:8px;
    letter-spacing:.10em;
}

.hatchery-v3-vault-art{
    position:relative;

    min-height:275px;

    display:grid;
    place-items:center;

    margin:4px 0 10px;
}

.hatchery-v3-vault-art:before{
    content:"";

    position:absolute;

    width:210px;
    height:210px;

    border-radius:50%;

    background:rgba(198,255,76,.12);

    filter:blur(55px);

    animation:hatcheryPulse 3s ease-in-out infinite;
}

.hatchery-v3-vault-art img{
    position:relative;
    z-index:2;

    width:min(82%,310px);
    max-height:260px;

    object-fit:contain;

    filter:
        drop-shadow(0 0 28px rgba(193,255,75,.25))
        drop-shadow(0 0 80px rgba(72,236,204,.09));

    animation:hatcheryFloat 5s ease-in-out infinite;
}

@keyframes hatcheryPulse{
    50%{
        opacity:.52;
        transform:scale(1.15);
    }
}

@keyframes hatcheryFloat{
    50%{
        transform:translateY(-7px) scale(1.015);
    }
}

.hatchery-v3-vault-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:7px;
}

.hatchery-v3-stat{
    padding:13px;

    border-radius:13px;

    border:1px solid var(--hat-line2);
    background:rgba(255,255,255,.021);
}

.hatchery-v3-stat span{
    display:block;

    color:#718479;

    font-size:7px;
    font-weight:950;
    letter-spacing:.12em;
}

.hatchery-v3-stat strong{
    display:block;
    margin-top:6px;

    color:#f4fff5;
    font-size:10px;
}

/* CAMPAIGN CHAMBER */

.hatchery-v3-chamber{
    width:min(1340px,calc(100% - 28px));
    margin:0 auto 14px;

    padding:clamp(22px,4vw,38px);

    border-radius:30px;
    border:1px solid var(--hat-line);

    background:rgba(2,13,8,.77);

    backdrop-filter:blur(26px) saturate(140%);
}

.hatchery-v3-section-head{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:20px;

    margin-bottom:20px;
}

.hatchery-v3-section-head span{
    color:var(--hat-lime);
    font-size:8px;
    font-weight:950;
    letter-spacing:.17em;
}

.hatchery-v3-section-head h2{
    margin:6px 0 0;

    color:#fff;

    font-size:clamp(38px,5vw,65px);
    letter-spacing:-.06em;
}

.hatchery-v3-section-head p{
    max-width:540px;
    margin:0;

    color:#7e9185;
    font-size:11px;
    line-height:1.6;
}

.hatchery-v3-campaigns{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
}

.hatchery-v3-capsule{
    position:relative;

    min-height:330px;

    overflow:hidden;

    display:flex;
    flex-direction:column;

    padding:19px;

    border-radius:19px;

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

    background:
        radial-gradient(circle at 80% 12%,rgba(194,255,75,.07),transparent 35%),
        rgba(255,255,255,.018);
}

.hatchery-v3-capsule:before{
    content:"";

    position:absolute;
    inset:12px;

    border-radius:15px;

    border:1px solid rgba(194,255,105,.035);

    pointer-events:none;
}

.hatchery-v3-capsule-top{
    display:flex;
    justify-content:space-between;
    gap:10px;

    position:relative;
    z-index:2;
}

.hatchery-v3-capsule-tag{
    color:#74877b;

    font-size:7px;
    font-weight:950;
    letter-spacing:.12em;
}

.hatchery-v3-capsule-state{
    padding:5px 7px;

    border-radius:999px;

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

    color:#9aa89f;

    font-size:7px;
    font-weight:950;
}

.hatchery-v3-capsule-orb{
    width:92px;
    height:92px;

    margin:30px auto 18px;

    border-radius:50%;

    display:grid;
    place-items:center;

    color:var(--hat-lime);

    font-size:28px;
    font-weight:950;

    border:1px solid rgba(194,255,105,.13);

    background:
        radial-gradient(circle,rgba(194,255,75,.10),rgba(194,255,75,.015));

    box-shadow:
        0 0 45px rgba(194,255,75,.06);
}

.hatchery-v3-capsule h3{
    margin:0;

    color:#fff;

    font-size:23px;
    letter-spacing:-.035em;
}

.hatchery-v3-capsule p{
    margin:8px 0 0;

    color:#7b8e82;

    font-size:10px;
    line-height:1.6;
}

.hatchery-v3-capsule-data{
    margin-top:auto;
    padding-top:18px;
}

.hatchery-v3-data-row{
    display:flex;
    justify-content:space-between;
    gap:10px;

    padding:7px 0;

    border-bottom:1px solid rgba(255,255,255,.04);

    font-size:8px;
}

.hatchery-v3-data-row span{
    color:#708278;
}

.hatchery-v3-data-row strong{
    color:#dfeae2;
    text-align:right;
}

/* CLAIM PIPELINE */

.hatchery-v3-pipeline{
    width:min(1340px,calc(100% - 28px));
    margin:0 auto 18px;

    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:8px;
}

.hatchery-v3-step{
    min-height:195px;

    padding:18px;

    border-radius:18px;

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

    background:rgba(2,13,8,.76);
}

.hatchery-v3-step b{
    display:block;

    color:var(--hat-lime);

    font-size:23px;
}

.hatchery-v3-step strong{
    display:block;
    margin-top:14px;

    font-size:12px;
}

.hatchery-v3-step p{
    margin:7px 0 0;

    color:#7d9084;

    font-size:10px;
    line-height:1.55;
}

/* EXISTING HATCHERY POLISH */

body.hatchery-v3-loaded
.glass,

body.hatchery-v3-loaded
.campaign,

body.hatchery-v3-loaded
.arch,

body.hatchery-v3-loaded
.claim-terminal{
    border-color:rgba(194,255,105,.10) !important;
}

/* MOBILE */

@media(max-width:1000px){

    .hatchery-v3-hero-grid{
        grid-template-columns:1fr;
    }

    .hatchery-v3-campaigns,
    .hatchery-v3-pipeline{
        grid-template-columns:repeat(2,1fr);
    }

}

@media(max-width:650px){

    .hatchery-v3-hero,
    .hatchery-v3-chamber,
    .hatchery-v3-pipeline{
        width:calc(100% - 18px);
    }

    .hatchery-v3-hero{
        margin-top:95px;
    }

    .hatchery-v3-title{
        font-size:clamp(58px,20vw,88px);
    }

    .hatchery-v3-campaigns,
    .hatchery-v3-pipeline,
    .hatchery-v3-vault-grid{
        grid-template-columns:1fr;
    }

    .hatchery-v3-section-head{
        align-items:flex-start;
        flex-direction:column;
    }

}

/* ======================================================
   BULLFROG HATCHERY V3.1 TOP GAP FIX
   CSS ONLY
====================================================== */

/*
 * Goal:
 * Pull The Hatchery hero upward so it sits much closer
 * to the ecosystem header while preserving a small
 * intentional breathing gap.
 */

/* Primary V3 hero candidates */

body .hatchery-v3-hero,
body .hatchery-v3-world,
body .hatchery-v3-stage,
body .hatchery-v3-shell,
body .hatchery-v3-vault{
    margin-top:8px !important;
}

/* Tighten main wrapper if it carries legacy spacing */

body main{
    margin-top:0 !important;
    padding-top:0 !important;
}

/* First content block should not create extra dead space */

body main > :first-child{
    margin-top:0 !important;
    padding-top:0 !important;
}

/* Directly attached hero */

header + .hatchery-v3-hero,
header + .hatchery-v3-world,
header + .hatchery-v3-stage,
header + section{
    margin-top:8px !important;
}

/* If hero has inherited top padding, collapse it */

.hatchery-v3-hero{
    padding-top:0 !important;
}

/* Keep visual panel itself close to the top */

.hatchery-v3-hero > :first-child,
.hatchery-v3-world > :first-child,
.hatchery-v3-stage > :first-child{
    margin-top:0 !important;
}

/* Tablet */

@media(max-width:1000px){

    body .hatchery-v3-hero,
    body .hatchery-v3-world,
    body .hatchery-v3-stage{
        margin-top:6px !important;
    }

}

/* Mobile */

@media(max-width:650px){

    body .hatchery-v3-hero,
    body .hatchery-v3-world,
    body .hatchery-v3-stage{
        margin-top:4px !important;
    }

    body main{
        margin-top:0 !important;
        padding-top:0 !important;
    }

}

/* BULLFROG FINAL V3 TOP SPACING NORMALIZER START */

/* ======================================================
   HATCHERY — FINAL HERO SPACING NORMALIZATION

   This intentionally overrides every earlier experimental
   spacing patch on this page.

   Goal:
   - hero close to header
   - hero content starts near top
   - no giant empty vertical dead zone
   - retain enough breathing room for premium layout
====================================================== */

/* ------------------------------------------------------
   PAGE WRAPPER
------------------------------------------------------ */

body main {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

body main > :first-child {
    margin-top: 0 !important;
}


/* ------------------------------------------------------
   MAJOR V3 HERO CONTAINERS
------------------------------------------------------ */

body :is(
    .hatchery-v3-hero,
    .hatchery-v3-world,
    .hatchery-v3-stage,
    .hatchery-v3-shell,
    .hatchery-v3-arena,
    .hatchery-v3-command,
    .hatchery-v3-terminal,
    .hatchery-v3-championship
) {
    margin-top: 10px !important;

    padding-top: 22px !important;
    padding-bottom: 28px !important;

    min-height: 0 !important;
    height: auto !important;

    align-items: start !important;
    align-content: start !important;

    justify-items: stretch;
}


/* ------------------------------------------------------
   DIRECT HERO CONTENT
------------------------------------------------------ */

body :is(
    .hatchery-v3-hero,
    .hatchery-v3-world,
    .hatchery-v3-stage,
    .hatchery-v3-shell,
    .hatchery-v3-arena
) > * {
    margin-top: 0 !important;

    align-self: start !important;
}


/* ------------------------------------------------------
   COMMON INNER V3 WRAPPERS
------------------------------------------------------ */

body :is(
    .hatchery-v3-hero-inner,
    .hatchery-v3-inner,
    .hatchery-v3-container,
    .hatchery-v3-grid,
    .hatchery-v3-hero-grid,
    .hatchery-v3-layout,
    .hatchery-v3-content,
    .hatchery-v3-stage-inner,
    .hatchery-v3-command-grid,
    .hatchery-v3-terminal-grid
) {
    margin-top: 0 !important;
    padding-top: 0 !important;

    min-height: 0 !important;
    height: auto !important;

    align-items: start !important;
    align-content: start !important;
}


/* ------------------------------------------------------
   LEFT-SIDE HERO COPY
------------------------------------------------------ */

body :is(
    .hatchery-v3-copy,
    .hatchery-v3-hero-copy,
    .hatchery-v3-intro,
    .hatchery-v3-left,
    .hatchery-v3-content-left
) {
    margin-top: 0 !important;
    padding-top: 0 !important;

    align-self: start !important;

    transform: none !important;
}


/* ------------------------------------------------------
   RIGHT-SIDE HERO PANEL
------------------------------------------------------ */

body :is(
    .hatchery-v3-right,
    .hatchery-v3-core,
    .hatchery-v3-panel,
    .hatchery-v3-vault,
    .hatchery-v3-radar,
    .hatchery-v3-telemetry,
    .hatchery-v3-terminal,
    .hatchery-v3-identity,
    .hatchery-v3-trophy
) {
    margin-top: 0 !important;

    align-self: start !important;

    transform: none !important;
}


/* ------------------------------------------------------
   HEADER TO FIRST PRODUCT AREA
------------------------------------------------------ */

header + main,
header + section,
header + div {
    margin-top: 10px !important;
}


/* ------------------------------------------------------
   PREVENT OLD HUGE HERO MIN-HEIGHTS
------------------------------------------------------ */

body [class*="hatchery-v3-hero"] {
    min-height: 0 !important;
}

body [class*="hatchery-v3-world"] {
    min-height: 0 !important;
}

body [class*="hatchery-v3-stage"] {
    min-height: 0 !important;
}


/* ------------------------------------------------------
   IMPORTANT:
   Hero cards should size from their actual content,
   not viewport height.
------------------------------------------------------ */

body :is(
    .hatchery-v3-hero,
    .hatchery-v3-world,
    .hatchery-v3-stage,
    .hatchery-v3-arena,
    .hatchery-v3-shell
) {
    max-height: none !important;
}


/* ------------------------------------------------------
   TABLET
------------------------------------------------------ */

@media(max-width: 1000px) {

    body :is(
        .hatchery-v3-hero,
        .hatchery-v3-world,
        .hatchery-v3-stage,
        .hatchery-v3-shell,
        .hatchery-v3-arena
    ) {
        margin-top: 8px !important;

        padding-top: 18px !important;
        padding-bottom: 24px !important;

        min-height: 0 !important;
    }

}


/* ------------------------------------------------------
   MOBILE
------------------------------------------------------ */

@media(max-width: 650px) {

    body main {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    body :is(
        .hatchery-v3-hero,
        .hatchery-v3-world,
        .hatchery-v3-stage,
        .hatchery-v3-shell,
        .hatchery-v3-arena
    ) {
        margin-top: 6px !important;

        padding-top: 14px !important;
        padding-bottom: 20px !important;

        min-height: 0 !important;
        height: auto !important;
    }

    body :is(
        .hatchery-v3-copy,
        .hatchery-v3-hero-copy,
        .hatchery-v3-intro,
        .hatchery-v3-left,
        .hatchery-v3-right,
        .hatchery-v3-core,
        .hatchery-v3-panel,
        .hatchery-v3-vault,
        .hatchery-v3-radar,
        .hatchery-v3-telemetry,
        .hatchery-v3-terminal
    ) {
        transform: none !important;
    }

}

/* BULLFROG FINAL V3 TOP SPACING NORMALIZER END */

/* BULLFROG FINAL TINY HEADER GAP START */

/* ======================================================
   HATCHERY — FINAL TINY HEADER GAP
====================================================== */

/*
 * Previous cleanup removed excessive dead space.
 * This restores only a small intentional separation
 * so hero cards do not visually collide with header.
 */

body :is(
    .hatchery-v3-hero,
    .hatchery-v3-world,
    .hatchery-v3-stage,
    .hatchery-v3-shell,
    .hatchery-v3-arena,
    .hatchery-v3-command,
    .hatchery-v3-terminal,
    .hatchery-v3-championship
) {
    margin-top: 16px !important;
}

/* Direct first content after header */

header + main,
header + section,
header + div {
    margin-top: 16px !important;
}

/* Tablet */

@media(max-width:1000px) {

    body :is(
        .hatchery-v3-hero,
        .hatchery-v3-world,
        .hatchery-v3-stage,
        .hatchery-v3-shell,
        .hatchery-v3-arena
    ) {
        margin-top: 12px !important;
    }

    header + main,
    header + section,
    header + div {
        margin-top: 12px !important;
    }

}

/* Mobile */

@media(max-width:650px) {

    body :is(
        .hatchery-v3-hero,
        .hatchery-v3-world,
        .hatchery-v3-stage,
        .hatchery-v3-shell,
        .hatchery-v3-arena
    ) {
        margin-top: 10px !important;
    }

    header + main,
    header + section,
    header + div {
        margin-top: 10px !important;
    }

}

/* BULLFROG FINAL TINY HEADER GAP END */


/* ======================================================
   BULLFROG HATCHERY FINAL HEADER CLEARANCE
   PAGE-SPECIFIC OVERRIDE
====================================================== */

body :is(
    .hatchery-v3-hero,
    .hatchery-v3-world,
    .hatchery-v3-stage,
    .hatchery-v3-shell,
    .hatchery-v3-vault
){
    margin-top:34px !important;
    transform:none !important;
}

body main{
    margin-top:0 !important;
    padding-top:0 !important;
}

body main > :first-child{
    margin-top:34px !important;
}

/* Neutralize any inherited internal lift */

body :is(
    .hatchery-v3-inner,
    .hatchery-v3-container,
    .hatchery-v3-grid,
    .hatchery-v3-hero-grid,
    .hatchery-v3-content,
    .hatchery-v3-copy,
    .hatchery-v3-left,
    .hatchery-v3-right,
    .hatchery-v3-vault
){
    transform:none !important;
}

@media(max-width:1000px){

    body :is(
        .hatchery-v3-hero,
        .hatchery-v3-world,
        .hatchery-v3-stage,
        .hatchery-v3-shell
    ){
        margin-top:28px !important;
    }

    body main > :first-child{
        margin-top:28px !important;
    }

}

@media(max-width:650px){

    body :is(
        .hatchery-v3-hero,
        .hatchery-v3-world,
        .hatchery-v3-stage,
        .hatchery-v3-shell
    ){
        margin-top:20px !important;
    }

    body main > :first-child{
        margin-top:20px !important;
    }

}

