/* APPRO / 2026 chrome hero — home page only. Designed as CSS + SVG for sharp, lightweight rendering. */
body.goji-home .gj-hero.apc-hero {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:135px 28px 72px;
  background:
    radial-gradient(ellipse 63% 46% at 91% 4%,rgba(173,124,243,.28),transparent 70%),
    radial-gradient(ellipse 44% 40% at 4% 9%,rgba(214,188,253,.25),transparent 74%),
    linear-gradient(180deg,#f7f1ff 0%,#faf8ff 38%,#fff 71%,#fff 100%);
}
.apc-hero .apc-atmosphere{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.apc-hero .apc-atmosphere::before{
  content:"";position:absolute;inset:0 0 auto;height:810px;
  background-image:linear-gradient(90deg,rgba(134,93,183,.09) 1px,transparent 1px),linear-gradient(0deg,rgba(134,93,183,.065) 1px,transparent 1px);
  background-size:116px 116px;
  mask-image:linear-gradient(#0009 1%,#0005 52%,transparent 99%);
}
.apc-hero .apc-atmosphere::after{
  content:"";position:absolute;left:-20%;right:-20%;top:680px;height:270px;
  background:radial-gradient(ellipse at center,#f4e8ff 0%,rgba(250,246,255,.14) 70%,transparent 83%);
  filter:blur(25px);opacity:.7;
}
.apc-atmosphere span{position:absolute;display:block;border-radius:100%;pointer-events:none;filter:blur(4px)}
.apc-atmosphere .apc-ambient-one{width:660px;height:500px;top:-200px;right:-100px;background:radial-gradient(ellipse,rgba(159,112,224,.24),transparent 69%)}
.apc-atmosphere .apc-ambient-two{width:520px;height:420px;top:250px;right:16%;background:radial-gradient(ellipse,rgba(214,173,255,.25),transparent 70%)}
.apc-atmosphere .apc-ambient-three{width:560px;height:420px;top:15px;left:-310px;background:radial-gradient(ellipse,rgba(246,219,255,.5),transparent 67%)}
.apc-hero-grid{position:relative;max-width:1240px;width:100%;min-height:580px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:10px;align-items:center}
body.goji-home .gj-hero.apc-hero .gj-hero-copy.apc-hero-copy{position:relative;z-index:3;max-width:650px;width:100%;margin:0;padding:30px 0 25px;text-align:left}
.apc-hero .apc-eyebrow{
  display:inline-flex;align-items:center;gap:10px;margin:0 0 29px;padding:9px 14px;
  border:1px solid rgba(143,94,196,.18);border-radius:99px;background:rgba(255,255,255,.7);
  box-shadow:inset 0 1px 0 #fff,0 11px 30px -24px rgba(70,27,123,.45);
  font:600 10px/1.4 'Inter',sans-serif;letter-spacing:1.35px;color:#654b81;
}
.apc-eyebrow-spark{font-size:16px;line-height:1;color:#8c56d1;text-shadow:0 0 12px rgba(171,113,226,.35)}
body.ap-monthly.goji-home .gj-hero.apc-hero h1{
  max-width:710px;margin:0;color:#21122f;
  font-family:'Fustat','Inter',sans-serif;font-size:clamp(49px,5.1vw,79px);font-weight:450;
  letter-spacing:-.074em;line-height:1.04;text-wrap:balance;
}
.apc-hero h1 span{
  display:inline-block;color:#6c3b9f;
  background:linear-gradient(109deg,#6f36a2 0%,#a67ac6 23%,#4a226c 37%,#9b64d1 58%,#62348e 78%,#9d73cd 94%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.apc-hero .apc-lede{
  max-width:530px;margin:25px 0 0;
  color:#685d73;font:400 16px/1.78 'Inter',sans-serif;letter-spacing:-.02em;
}
.apc-hero .apc-lede strong{color:#43304f;font-weight:600}
.apc-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:32px 0 0}
.apc-hero .apc-button{
  min-height:53px;padding:13px 19px;display:inline-flex;align-items:center;justify-content:center;gap:18px;
  text-decoration:none;border-radius:14px;border:1px solid transparent;
  font:600 13px/1.3 'Inter',sans-serif;letter-spacing:-.005em;white-space:nowrap;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.apc-hero .apc-button-primary{
  color:#fff;border-color:#75449f;
  background:linear-gradient(124deg,#2a153c 0%,#52236f 48%,#7138a6 77%,#45205f 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.37),inset 0 -1px 0 rgba(34,8,50,.27),0 13px 30px -15px rgba(56,12,99,.55);
}
.apc-hero .apc-button-primary:hover{color:#fff;background:linear-gradient(125deg,#38174f,#67308d 65%,#9251cc);transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 17px 31px -14px rgba(51,8,104,.6)}
.apc-button-arrow{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:9px;background:linear-gradient(140deg,#aa6ff0,#7545cc);font-size:17px;box-shadow:inset 0 1px 0 #ffffff75;color:#fff}
.apc-hero .apc-button-secondary{color:#513565;border-color:rgba(123,75,168,.23);background:rgba(255,255,255,.67);box-shadow:inset 0 1px 0 #fff}
.apc-hero .apc-button-secondary:hover{background:#fff;transform:translateY(-2px);border-color:#b48cda}
.apc-button-secondary span{color:#985acb}
.apc-pills{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:19px}
.apc-pills span{display:inline-flex;align-items:center;gap:7px;color:#7c7187;font:500 11px/1.3 'Inter',sans-serif;letter-spacing:-.02em}
.apc-pills span:not(:last-child)::after{content:'·';margin:0 4px 0 6px;font-size:14px;color:#b29ac9}
.apc-pills i{display:inline-block;width:5px;height:5px;flex:none;border-radius:50%;background:linear-gradient(140deg,#a974e3,#7238b0);box-shadow:0 0 0 3px #e9def8}
.apc-hero .apc-review{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:#493657;margin-top:35px;padding:13px 16px;border-radius:14px;
  border:1px solid #ded1e7;background:rgba(255,255,255,.83);box-shadow:0 12px 34px -28px #4a236f9e;transition:border-color .2s,transform .2s}
.apc-hero .apc-review:hover{border-color:#a77aca;transform:translateY(-2px)}
.apc-review .apc-review-stars{color:#9355dc;font-size:16px;letter-spacing:1.5px;white-space:nowrap}
.apc-review b{font:650 11px/1.4 'Inter',sans-serif;white-space:nowrap}
.apc-review .apc-review-muted{color:#8a7a95;font:450 10px/1.4 'Inter',sans-serif;white-space:nowrap}
.apc-review .apc-review-link{margin-left:2px;color:#a16acb;font-size:15px}
/* The metal sculpture is a scalable vector; no large raster download or layout shift. */
.apc-hero .apc-scene{position:relative;width:100%;min-height:585px;max-width:610px;margin:0 auto;z-index:1;isolation:isolate}
.apc-scene-glow{position:absolute;width:104%;height:91%;left:-2%;top:5%;border-radius:50%;background:
  radial-gradient(ellipse at 52% 48%,rgba(229,207,255,.96),rgba(217,185,255,.33) 37%,rgba(225,204,255,.19) 57%,transparent 76%);
  filter:blur(11px)}
.apc-scene-orbit{position:absolute;z-index:0;left:10%;right:8%;top:17%;height:66%;border:1px solid rgba(167,113,221,.22);border-radius:50%;transform:rotate(-23deg);box-shadow:0 0 25px rgba(255,255,255,.75),inset 0 0 20px rgba(255,255,255,.45)}
.apc-scene-orbit-b{left:17%;right:15%;top:12%;height:72%;transform:rotate(45deg);border-color:rgba(183,145,220,.18)}
.apc-chrome-sculpture{display:block;position:absolute;width:114%;max-width:none;height:auto;left:-7%;top:50%;z-index:1;transform:translateY(-51%) rotate(-1deg);filter:drop-shadow(0 31px 30px rgba(60,27,103,.18));animation:apc-float 9s ease-in-out infinite alternate;overflow:visible}
.apc-scene-streak{position:absolute;width:5px;height:5px;background:#fff;box-shadow:0 0 17px 3px #fff,0 0 32px 8px #c6a2ef;border-radius:50%;z-index:2}
.apc-scene-streak-one{top:21%;right:18%}.apc-scene-streak-two{bottom:27%;left:17%;width:3px;height:3px;opacity:.9}
.apc-scene-label{position:absolute;z-index:3;display:flex;align-items:center;gap:12px;border:1px solid rgba(255,255,255,.94);background:rgba(255,255,255,.62);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 21px 50px -31px #5330755c,inset 0 1px 0 rgba(255,255,255,.87);color:#59416e}
.apc-scene-label-top{top:17%;right:-1%;flex-direction:column;align-items:flex-start;gap:6px;border-radius:14px;padding:13px 16px;transform:rotate(5deg)}
.apc-scene-label-top>span{font:700 8px/1.3 'Inter',sans-serif;letter-spacing:1.6px;color:#a17cae}
.apc-scene-label-top>b{font:600 10px/1.35 'Inter',sans-serif;letter-spacing:.25px}
.apc-scene-label-bottom{left:-4%;bottom:16%;padding:13px 16px 13px 13px;border-radius:17px;transform:rotate(-3deg)}
.apc-check{font-size:20px;color:#a15adc;background:linear-gradient(140deg,#fff,#e9dcff);border-radius:10px;display:grid;place-items:center;width:37px;height:37px;flex:none}
.apc-scene-label-bottom b{display:block;color:#432456;font:600 11px/1.5 'Inter',sans-serif}
.apc-scene-label-bottom small{display:block;color:#8a7599;font:400 9px/1.5 'Inter',sans-serif}
.apc-hero-divider{display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1240px;margin:18px auto 0;padding:17px 2px;border-top:1px solid rgba(157,108,201,.19);color:#9b89a5;font:600 9px/1.4 'Inter',sans-serif;letter-spacing:1.3px}
.apc-hero-divider>span:first-child{display:inline-flex;align-items:center;gap:9px}.apc-hero-divider i{display:inline-block;width:8px;height:8px;background:#a576d7;border-radius:50%;box-shadow:0 0 0 4px #e9dcf7}
.apc-hero-divider b{font-size:15px;font-weight:450;color:#985dd0;padding-left:7px}
/* Keep APPRO's original interactive app showcase, framed as supporting work after the new hero. */
body.goji-home .gj-hero.apc-hero .gj-demo{position:relative;z-index:1;margin:31px auto 0;border:1px solid rgba(149,112,190,.25);box-shadow:0 28px 65px -48px rgba(87,47,126,.39)}
body.ap-soft.goji-home .nav-cta.glass-cta{background:linear-gradient(110deg,#261433,#422157 55%,#622c86 100%);border-color:#6a4483;box-shadow:inset 0 1px 0 #ffffff3b,0 8px 18px -13px #33104688}
body.ap-soft.goji-home .nav-cta.glass-cta:hover{background:linear-gradient(110deg,#361848,#5c287a 70%,#8143ab)}
body.ap-soft.goji-home .nav-cta .gc-icon{background:linear-gradient(130deg,#a868ec,#9056e6)}
@keyframes apc-float{from{transform:translateY(-51%) rotate(-1deg)}to{transform:translateY(-49%) rotate(1deg)}}
@media(min-width:1450px){body.goji-home .gj-hero.apc-hero{padding-top:154px}.apc-hero-grid{min-height:590px}.apc-scene{min-height:600px}}
@media(max-width:1100px){
  .apc-hero-grid{gap:1px;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr)}
  body.ap-monthly.goji-home .gj-hero.apc-hero h1{font-size:clamp(45px,5vw,66px)}
  .apc-hero .apc-scene{min-height:515px}
  .apc-scene-label-top{right:-4%}.apc-scene-label-bottom{left:-2%}
  .apc-hero .apc-lede{font-size:15px}
}
@media(max-width:900px){
  body.goji-home .gj-hero.apc-hero{padding:128px 26px 56px}
  .apc-hero-grid{display:flex;flex-direction:column;align-items:center;gap:0;min-height:0;max-width:700px}
  body.goji-home .gj-hero.apc-hero .gj-hero-copy.apc-hero-copy{text-align:center;max-width:650px;padding:8px 0 0}
  body.ap-monthly.goji-home .gj-hero.apc-hero h1{max-width:680px;font-size:clamp(48px,7.2vw,72px);margin-inline:auto}
  .apc-hero .apc-lede{font-size:16px;max-width:540px;margin:21px auto 0}
  .apc-actions,.apc-pills{justify-content:center}
  .apc-hero .apc-review{margin-top:27px}
  .apc-hero .apc-scene{max-width:630px;min-height:460px;margin-top:-12px}
  .apc-scene-label-bottom{left:4%;bottom:11%}
  .apc-scene-label-top{right:4%;top:15%}
  .apc-hero-divider{max-width:680px;margin-top:10px}
  body.goji-home .gj-hero.apc-hero .gj-demo{margin-top:18px}
}
@media(max-width:650px){
  body.goji-home .gj-hero.apc-hero{padding:116px 16px 44px}
  .apc-hero .apc-eyebrow{font-size:8px;letter-spacing:.85px;margin-bottom:22px;padding:9px 11px}
  body.ap-monthly.goji-home .gj-hero.apc-hero h1{font-size:clamp(41px,8.5vw,57px);line-height:1.065;letter-spacing:-.064em}
  .apc-hero .apc-lede{font-size:14px;line-height:1.75;max-width:470px;margin-top:19px}
  .apc-actions{margin-top:27px;gap:9px}
  .apc-hero .apc-button{min-height:49px;font-size:12px;padding:11px 15px}
  .apc-pills{margin-top:19px;gap:6px}
  .apc-pills span{font-size:10px}
  .apc-hero .apc-review{margin-top:26px}
  .apc-hero .apc-scene{min-height:370px;max-width:500px;margin-top:-12px}
  .apc-scene-label-top{right:4%;top:13%;padding:9px 10px}.apc-scene-label-top>b{font-size:8px}.apc-scene-label-top>span{font-size:7px}
  .apc-scene-label-bottom{left:3%;bottom:12%;padding:8px 10px 8px 8px}.apc-scene-label-bottom b{font-size:9px}.apc-scene-label-bottom small{font-size:8px}.apc-check{height:30px;width:30px;font-size:15px}
  .apc-hero-divider{margin-top:0;font-size:8px;letter-spacing:.45px}
  .apc-hero-divider>span:nth-child(2){display:none}
}
@media(max-width:430px){
  body.goji-home .gj-hero.apc-hero{padding:113px 16px 40px}
  .apc-hero .apc-eyebrow{font-size:7.35px;letter-spacing:.55px}
  body.ap-monthly.goji-home .gj-hero.apc-hero h1{font-size:clamp(38px,9.2vw,44px);line-height:1.09}
  .apc-hero .apc-lede{font-size:13px}
  .apc-actions{flex-direction:column;align-items:stretch;max-width:340px;margin-inline:auto}
  .apc-hero .apc-button{width:100%;min-height:49px;justify-content:center}
  .apc-button-arrow{margin-left:auto}
  .apc-hero .apc-button-primary{padding-left:25px}
  .apc-hero .apc-button-secondary{min-height:43px}
  .apc-pills{gap:8px 6px;max-width:310px;margin-inline:auto}
  .apc-pills span{font-size:9px}.apc-pills span:not(:last-child)::after{margin-left:1px;margin-right:1px}
  .apc-hero .apc-review{padding:10px 12px;gap:7px;margin-top:22px}
  .apc-review .apc-review-stars{font-size:12px;letter-spacing:0}.apc-review b{font-size:10px}.apc-review .apc-review-muted{font-size:9px}
  .apc-hero .apc-scene{min-height:295px;margin-top:-1px}
  .apc-scene-label-bottom{left:0;bottom:6%}
  .apc-scene-label-top{right:-1%;top:8%}
}
@media(prefers-reduced-motion:reduce){.apc-chrome-sculpture{animation:none!important}.apc-hero .apc-button,.apc-hero .apc-review{transition:none}}