/* GrandBrands Network V3 — preview only */

/* Compact framed hero */
body > section.hero {
    position:relative!important;
    width:calc(100% - 48px)!important;
    max-width:1300px!important;
    min-height:0!important;
    height:auto!important;
    margin:22px auto 16px!important;
    overflow:hidden!important;
    border:3px double #c99739!important;
    border-radius:9px!important;
    background:
      url("/assets/network-globe.png")
      center 48% / cover no-repeat!important;
    box-shadow:
      0 8px 24px rgba(6,22,40,.17),
      inset 0 0 0 3px rgba(255,255,255,.45)!important;
}

/* Soft white screen for readable hero copy */
body > section.hero::before {
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:0!important;
    pointer-events:none!important;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,.97) 0%,
      rgba(255,255,255,.93) 35%,
      rgba(255,255,255,.60) 56%,
      rgba(255,255,255,.03) 85%
    )!important;
}

body > section.hero .hero-inner {
    position:relative!important;
    z-index:2!important;
    padding:26px 38px 30px!important;
}

body > section.hero h1 {
    font-size:clamp(35px,4vw,54px)!important;
    line-height:1.06!important;
    margin:10px 0!important;
    max-width:720px!important;
}

body > section.hero .goldline {
    font-size:clamp(22px,2.7vw,31px)!important;
    line-height:1.18!important;
    max-width:780px!important;
    margin:12px 0!important;
}

body > section.hero p {
    max-width:735px!important;
    font-size:17px!important;
    line-height:1.48!important;
    margin-bottom:0!important;
}

/* Bring the four operation centers up */
body > section.hero + section.section {
    padding-top:12px!important;
    padding-bottom:26px!important;
}

/* Floating gold-framed operation cards */
.centers > * {
    position:relative;
    border:1px solid #c99b42!important;
    border-radius:9px!important;
    overflow:hidden;
    box-shadow:0 9px 22px rgba(4,22,42,.18)!important;
    transition:
      transform .3s ease,
      box-shadow .3s ease,
      border-color .3s ease!important;
}

.centers > *:hover {
    transform:translateY(-8px)!important;
    border-color:#e0b455!important;
    box-shadow:0 19px 35px rgba(4,22,42,.30)!important;
    z-index:3;
}

/* Reflected card effect, without duplicating content */
.centers > * img {
    transition:transform .4s ease!important;
}

.centers > *:hover img {
    transform:scale(1.035);
}

@media(max-width:700px) {
    body > section.hero {
        width:calc(100% - 24px)!important;
    }

    body > section.hero::before {
        background:rgba(255,255,255,.86)!important;
    }

    body > section.hero .hero-inner {
        padding:22px!important;
    }

    .centers {
        grid-template-columns:1fr!important;
    }
}

@media(prefers-reduced-motion:reduce) {
    .centers > *,
    .centers > * img {
        transition:none!important;
    }
}