/* InstrictLogic spectrum: warm brand orange, cool tools, violet assets, green availability. */
:root{
  --accent:#ff8a4c;
  --accent-warm:#ff8a4c;
  --accent-cyan:#55c7df;
  --accent-blue:#628dff;
  --accent-violet:#a884ff;
  --accent-green:#65d69a;
  --accent-rose:#ef7896;
  --surface-cyan:#132025;
  --surface-violet:#1c1927;
  --surface-green:#16231d;
  --surface-rose:#24191e;
}

body{
  background-color:#0e1114;
  background-image:
    radial-gradient(ellipse 65% 42% at 86% -8%,rgba(82,143,255,.07),transparent 68%),
    radial-gradient(ellipse 58% 36% at 9% 18%,rgba(255,126,69,.055),transparent 70%);
  background-attachment:fixed;
}
.site-header{background:rgba(14,17,20,.91);border-bottom-color:#29323a}
.site-header:after{content:"";position:absolute;inset:auto 0 -1px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,138,76,.6) 24%,rgba(85,199,223,.34) 55%,rgba(168,132,255,.3) 78%,transparent)}
.principles{background:linear-gradient(90deg,rgba(255,138,76,.025),rgba(85,199,223,.025),rgba(168,132,255,.025))}

/* Homepage sections each get a stable visual identity without changing the brand CTA color. */
#products{position:relative}
#products:before,#tools:before,.soundbank-section:before,.tutorials-section:before,.games-section:before{
  content:"";position:absolute;left:50%;top:0;width:min(1320px,100vw);height:100%;transform:translateX(-50%);pointer-events:none;z-index:-1;opacity:.75
}
#products:before{background:radial-gradient(ellipse 46% 38% at 12% 8%,rgba(255,138,76,.06),transparent 72%)}
#tools{position:relative}
#tools:before{background:radial-gradient(ellipse 52% 46% at 88% 12%,rgba(85,199,223,.075),transparent 72%)}
#tools .section-kicker,#tools .heading-dot{color:var(--accent-cyan)}
#tools .collection-count{color:#7eaeb8}
.toolbox-grid .live-tool-card{--card-accent:var(--accent-cyan);--card-rgb:85,199,223;border-color:rgba(var(--card-rgb),.31);background:linear-gradient(145deg,rgba(var(--card-rgb),.08),rgba(24,27,30,.97) 56%)}
.toolbox-grid .live-tool-card:nth-child(2){--card-accent:#6ca8ff;--card-rgb:108,168,255}
.toolbox-grid .live-tool-card:nth-child(3){--card-accent:var(--accent-violet);--card-rgb:168,132,255}
.toolbox-grid .live-tool-card:nth-child(4){--card-accent:#66d3b0;--card-rgb:102,211,176}
.toolbox-grid .live-tool-card:nth-child(5){--card-accent:#ef8cb2;--card-rgb:239,140,178}
.toolbox-grid .live-tool-card:nth-child(6){--card-accent:#75bfff;--card-rgb:117,191,255}
.toolbox-grid .live-tool-card:nth-child(7){--card-accent:#b692ff;--card-rgb:182,146,255}
.toolbox-grid .live-tool-card:hover{border-color:var(--card-accent);box-shadow:0 16px 44px rgba(var(--card-rgb),.09)}
.toolbox-grid .live-tool-card .live-tool-top>span:first-child,.toolbox-grid .live-tool-card .live-tool-bottom>span{color:var(--card-accent)}
.toolbox-grid .live-tool-card .live-tool-top i{background:var(--card-accent);box-shadow:0 0 0 4px rgba(var(--card-rgb),.1)}
.toolbox-grid .live-tool-card .live-tool-note{border-top-color:rgba(var(--card-rgb),.22)}

.soundbank-section{position:relative}
.soundbank-section:before{background:radial-gradient(ellipse 48% 50% at 15% 28%,rgba(101,214,154,.065),transparent 72%)}
.soundbank-section .section-kicker,.soundbank-section .heading-dot,.soundbank-section h2 span{color:var(--accent-green)}
.soundbank-promo-art{border-color:rgba(101,214,154,.3);background:radial-gradient(ellipse at 50% 50%,rgba(101,214,154,.105),transparent 76%),linear-gradient(140deg,#17231e,#171a1c)}
.soundbank-art-header{color:#8fd8ae}.soundbank-category-strip b{color:var(--accent-green)}

.tutorials-section{position:relative}
.tutorials-section:before{background:radial-gradient(ellipse 52% 52% at 86% 20%,rgba(168,132,255,.065),transparent 72%)}
.tutorials-section .section-kicker,.tutorials-section .heading-dot{color:var(--accent-violet)}
.tutorial-card:hover{border-color:rgba(168,132,255,.72);box-shadow:0 15px 40px rgba(103,75,172,.08)}
.tutorial-copy h3 a:hover,.tutorial-footer a{color:#c1a7ff}

.games-section{position:relative}
.games-section:before{background:radial-gradient(ellipse 52% 52% at 10% 14%,rgba(239,120,150,.05),transparent 74%)}
.games-section .section-kicker,.games-section .heading-dot{color:var(--accent-rose)}
.game-card{border-color:#413840;background:linear-gradient(155deg,rgba(239,120,150,.035),#191c1f 45%)}
.game-card:hover{border-color:rgba(239,120,150,.55);box-shadow:0 15px 40px rgba(165,61,89,.07)}
#news .section-kicker,#news .heading-dot{color:var(--accent-cyan)}
#news:before{background:radial-gradient(ellipse 50% 50% at 88% 14%,rgba(85,199,223,.06),transparent 72%)}
.news-card{border-color:#34434a;background:linear-gradient(155deg,rgba(85,199,223,.035),#191c1f 45%)}
.news-card:hover{border-color:rgba(85,199,223,.5)}
.news-original{color:#85d5e5}

/* Interior pages inherit a color based on their content family. */
.page-tools{--page-accent:var(--accent-cyan);--page-rgb:85,199,223}
.page-tools.tool-texture-lab,.page-tools.tool-ai-3d-lab{--page-accent:var(--accent-violet);--page-rgb:168,132,255}
.page-tools.tool-sound-generator,.page-tools.tool-loop-maker,.page-tools.tool-radio-voice{--page-accent:#72cfff;--page-rgb:114,207,255}
.page-news{--page-accent:var(--accent-cyan);--page-rgb:85,199,223}
.page-AssetLibrary,.page-soundbank{--page-accent:var(--accent-violet);--page-rgb:168,132,255}
.page-projects,.page-devlog{--page-accent:var(--accent-rose);--page-rgb:239,120,150}
.page-tutorials{--page-accent:var(--accent-violet);--page-rgb:168,132,255}
body[class*="page-"]:not(.page-home){background-image:radial-gradient(ellipse 72% 40% at 50% -7%,rgba(var(--page-rgb,255,138,76),.09),transparent 72%),linear-gradient(#0e1114,#101214)}
body[class*="page-"]:not(.page-home) .section-kicker,body[class*="page-"]:not(.page-home) .heading-dot,body[class*="page-"]:not(.page-home) .lab-heading h1 span{color:var(--page-accent,var(--accent))}
.page-tools .lab-heading{position:relative;padding-left:20px}
.page-tools .lab-heading:before{content:"";position:absolute;left:0;top:20px;bottom:20px;width:2px;border-radius:2px;background:linear-gradient(var(--page-accent),transparent);box-shadow:0 0 20px rgba(var(--page-rgb),.25)}
.page-tools .lab-controls,.page-tools .lab-main>section{border-color:rgba(var(--page-rgb),.21)}
.page-tools input[type=range]{accent-color:var(--page-accent)}
.page-tools .button-primary{background:var(--page-accent);border-color:var(--page-accent);color:#0d1316}

@media(max-width:600px){
  body{background-attachment:scroll}
  .page-tools .lab-heading{padding-left:14px}
}
@media(prefers-reduced-motion:reduce){body{background-attachment:scroll}}
