/* HallowixStudios V26 — layered, artistic page atmospheres for Home / Portfolio / About. */
.hx-art-page{--hx-art-gold:#D9B36C;--hx-art-moss:#5C7A5E;--hx-art-plum:#8B4C63;--hx-art-bark:#2E241E}
.hx-art-page main>section{position:relative;isolation:isolate;overflow:hidden}
.hx-art-page main>section::before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(680px 300px at 7% 14%,color-mix(in srgb,var(--hx-art-moss) 13%,transparent),transparent 72%),
  radial-gradient(620px 340px at 93% 74%,color-mix(in srgb,var(--hx-art-plum) 10%,transparent),transparent 72%),
  radial-gradient(480px 220px at 48% 4%,color-mix(in srgb,var(--hx-art-gold) 8%,transparent),transparent 76%)}
.hx-art-page main>section::after{content:"";position:absolute;inset:-18% -8%;z-index:-1;pointer-events:none;opacity:.52;background:
  linear-gradient(118deg,transparent 0 42%,color-mix(in srgb,var(--hx-art-gold) 5%,transparent) 42.4% 42.8%,transparent 43.2% 100%),
  repeating-linear-gradient(148deg,transparent 0 74px,color-mix(in srgb,var(--hx-art-moss) 3.2%,transparent) 75px 76px),
  repeating-linear-gradient(32deg,transparent 0 108px,color-mix(in srgb,var(--hx-art-plum) 2.4%,transparent) 109px 110px);mask-image:radial-gradient(ellipse at center,#000 0 54%,transparent 86%)}
html[data-theme="light"] .hx-art-page main>section::before{background:
  radial-gradient(680px 300px at 7% 14%,rgba(92,122,94,.13),transparent 72%),
  radial-gradient(620px 340px at 93% 74%,rgba(139,76,99,.09),transparent 72%),
  radial-gradient(480px 220px at 48% 4%,rgba(217,179,108,.14),transparent 76%)}

/* Home: give the historically flat green/brown bands a carved landscape atmosphere. */
.hx-art-page .why-section::before{background:
  radial-gradient(800px 360px at 8% 15%,rgba(120,168,102,.18),transparent 68%),
  radial-gradient(700px 400px at 90% 80%,rgba(139,76,99,.14),transparent 72%),
  linear-gradient(155deg,transparent 0 46%,rgba(237,228,211,.025) 46.2% 47%,transparent 47.2%),
  linear-gradient(180deg,rgba(12,30,25,.22),rgba(8,20,17,.36))!important}
.hx-art-page .why-section::after{opacity:.72;background:
  repeating-radial-gradient(ellipse at 15% 110%,transparent 0 58px,rgba(237,228,211,.035) 59px 60px,transparent 61px 88px),
  repeating-linear-gradient(145deg,transparent 0 82px,rgba(217,179,108,.025) 83px 84px)!important;mask-image:none}
.hx-art-page .portfolio-section::before,.hx-art-page .reviews-section::before{background:
  radial-gradient(780px 360px at 12% 15%,color-mix(in srgb,var(--hx-art-gold) 9%,transparent),transparent 72%),
  radial-gradient(720px 400px at 88% 84%,color-mix(in srgb,var(--hx-art-moss) 11%,transparent),transparent 72%),
  radial-gradient(420px 240px at 58% 52%,color-mix(in srgb,var(--hx-art-plum) 7%,transparent),transparent 74%)!important}

/* Portfolio landing and galleries: subtle blueprint + aurora depth behind the large cards. */
.hx-portfolio-v21 .portfolio-v21-main,.hx-art-page .portfolio-gallery-main{position:relative;isolation:isolate;background:
  radial-gradient(900px 520px at 12% 4%,color-mix(in srgb,var(--hx-art-gold) 11%,transparent),transparent 72%),
  radial-gradient(840px 520px at 92% 44%,color-mix(in srgb,var(--hx-art-plum) 11%,transparent),transparent 74%),
  radial-gradient(780px 460px at 42% 96%,color-mix(in srgb,var(--hx-art-moss) 11%,transparent),transparent 74%),
  var(--bg)!important}
.hx-portfolio-v21 .portfolio-v21-main::before,.hx-art-page .portfolio-gallery-main::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.44;background:
  linear-gradient(90deg,color-mix(in srgb,var(--text) 2.2%,transparent) 1px,transparent 1px),
  linear-gradient(color-mix(in srgb,var(--text) 2.2%,transparent) 1px,transparent 1px);background-size:54px 54px;mask-image:radial-gradient(circle at 52% 38%,#000,transparent 82%)}

/* About: the story sections get separate color moods while keeping the same design system. */
.about-v25 .about-story::before{background:radial-gradient(760px 400px at 0% 42%,color-mix(in srgb,var(--hx-art-gold) 12%,transparent),transparent 72%),radial-gradient(700px 380px at 95% 10%,color-mix(in srgb,var(--hx-art-moss) 10%,transparent),transparent 74%)!important}
.about-v25 .team-section::before{background:radial-gradient(720px 390px at 10% 90%,color-mix(in srgb,var(--hx-art-plum) 11%,transparent),transparent 73%),radial-gradient(740px 400px at 90% 12%,color-mix(in srgb,var(--hx-art-moss) 12%,transparent),transparent 74%)!important}
.about-v25 .about-reviews::before{background:radial-gradient(720px 390px at 50% 0%,color-mix(in srgb,var(--hx-art-gold) 10%,transparent),transparent 74%),radial-gradient(760px 420px at 90% 90%,color-mix(in srgb,var(--hx-art-plum) 9%,transparent),transparent 74%)!important}
@media(max-width:720px){.hx-art-page main>section::after{opacity:.3}.hx-portfolio-v21 .portfolio-v21-main::before{background-size:36px 36px}}
@media(prefers-reduced-motion:reduce){.hx-art-page main>section::after{background-attachment:scroll}}