/* ============================================================================
   assets/css/home-desk-pro.css — AU One Home (desktop shell), premium pass
   (2026-09-11). Presentation only, layered over #deskShell's own styles:
   an aurora hero with a shimmering title, stat tiles with a tone edge, module
   tiles whose icon badge and arrow respond, a glowing active nav item, lifted
   side cards, a team band that comes alive on hover. Motion honours
   prefers-reduced-motion. Nothing here changes what anything does.
   ========================================================================== */
#deskShell{ --hd-ease:cubic-bezier(.22,.9,.24,1); --hd-spring:cubic-bezier(.34,1.4,.44,1); }
@keyframes hdAurora{ 0%{ transform:translate(-8%,-10%) rotate(0deg); } 50%{ transform:translate(6%,4%) rotate(18deg); } 100%{ transform:translate(-8%,-10%) rotate(0deg); } }
@keyframes hdShimmer{ 0%{ background-position:0% 50%; } 100%{ background-position:200% 50%; } }
@keyframes hdShine{ from{ transform:translateX(-160%) skewX(-18deg); } to{ transform:translateX(260%) skewX(-18deg); } }
@keyframes hdPulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(163,178,94,.45); } 60%{ box-shadow:0 0 0 8px rgba(163,178,94,0); } }

/* ---- hero: aurora + shimmering headline ------------------------------- */
#deskShell .ds-hero{ isolation:isolate; box-shadow:0 30px 70px -34px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.06); }
#deskShell .ds-hero::before{
  content:""; position:absolute; z-index:-1; width:60%; height:160%; left:-10%; top:-40%; pointer-events:none;
  background:radial-gradient(closest-side, rgba(163,178,94,.28), rgba(163,178,94,.08) 55%, transparent 70%);
  filter:blur(30px);
}
#deskShell .ds-hero .greet{ letter-spacing:.16em; color:rgba(212,220,170,.95); }
#deskShell .ds-heroh1 .g{
  background:linear-gradient(90deg, #f3f5ee 0%, #cfd9a0 35%, #f3f5ee 55%, #a3b25e 80%, #f3f5ee 100%);
  background-size:200% auto; -webkit-background-clip:text; background-clip:text; color:transparent;
}
#deskShell .ds-stat{
  position:relative; overflow:hidden; border-radius:14px;
  transition:transform .22s var(--hd-spring), box-shadow .26s var(--hd-ease), border-color .2s, background-color .2s;
}
#deskShell .ds-stat::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:linear-gradient(180deg, var(--olive,#A3B25E), rgba(163,178,94,.25)); }
#deskShell .ds-stat:hover{ transform:translateY(-3px); border-color:rgba(163,178,94,.45); box-shadow:0 18px 36px -18px rgba(0,0,0,.6); background:rgba(163,178,94,.06); }
#deskShell .ds-stat .v{ font-variant-numeric:tabular-nums; letter-spacing:-.03em; }
#deskShell .ds-slideimg{ transition:transform 1.2s var(--hd-ease); }
#deskShell .ds-slides:hover .ds-slideimg{ transform:scale(1.03); }
#deskShell .ds-slidecap{ backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }

/* ---- section titles ---------------------------------------------------- */
#deskShell .ds-sectitle{ position:relative; padding-left:14px; }
#deskShell .ds-sectitle::before{ content:""; position:absolute; left:0; top:.2em; width:4px; height:1em; border-radius:4px; background:linear-gradient(180deg, var(--olive,#A3B25E), rgba(163,178,94,.35)); }

/* ---- module tiles ------------------------------------------------------ */
#deskShell .ds-mod{ transition:transform .22s var(--hd-spring), box-shadow .26s var(--hd-ease), border-color .2s, background-color .2s; }
#deskShell .ds-mod .mico{ transition:transform .24s var(--hd-spring), box-shadow .24s; box-shadow:inset 0 0 0 1px rgba(255,255,255,.06); }
#deskShell .ds-mod:hover .mico{ transform:scale(1.08) rotate(-4deg); box-shadow:0 10px 22px -10px rgba(163,178,94,.7), inset 0 0 0 1px rgba(163,178,94,.35); }
#deskShell .ds-mod .marrow{ transition:transform .22s var(--hd-spring), opacity .2s, color .2s; }
#deskShell .ds-mod:hover .marrow{ transform:translateX(4px); color:var(--olive,#A3B25E); opacity:1; }
#deskShell .ds-mod:hover{ background:rgba(163,178,94,.05); }
#deskShell .ds-mod:active{ transform:translateY(-1px) scale(.995); }
#deskShell .ds-mod .mtag{ transition:transform .18s var(--hd-spring); }
#deskShell .ds-mod:hover .mtag{ transform:translateY(-1px); }

/* ---- sidebar navigation ------------------------------------------------ */
#deskShell .ds-nava{ transition:background-color .18s, color .18s, transform .18s var(--hd-spring), box-shadow .2s; }
#deskShell .ds-nava:hover{ transform:translateX(2px); }
#deskShell .ds-nava.on{ box-shadow:0 10px 24px -14px rgba(163,178,94,.9), inset 0 0 0 1px rgba(163,178,94,.28); }
#deskShell .ds-nava .ds-navasvg, #deskShell .ds-nava svg{ transition:transform .2s var(--hd-spring); }
#deskShell .ds-nava:hover svg{ transform:scale(1.1); }
#deskShell .ds-brand.lg{ position:relative; }
#deskShell .ds-brand.lg img, #deskShell .ds-brand.lg .ds-brandb{ transition:transform .3s var(--hd-spring); }
#deskShell .ds-brand.lg:hover img{ transform:rotate(-6deg) scale(1.05); }

/* ---- head bar ---------------------------------------------------------- */
#deskShell .ds-searchslot.gsearch-box{ transition:box-shadow .2s, border-color .2s, transform .2s var(--hd-spring); }
#deskShell .ds-searchslot.gsearch-box:focus-within{ box-shadow:0 0 0 3px rgba(163,178,94,.25), 0 14px 30px -18px rgba(0,0,0,.6); transform:translateY(-1px); }
#deskShell .ds-ibtn{ transition:transform .18s var(--hd-spring), background-color .18s, box-shadow .2s; }
#deskShell .ds-ibtn:hover{ transform:translateY(-1px); box-shadow:0 10px 20px -14px rgba(0,0,0,.6); }
#deskShell .ds-ibtn:active{ transform:scale(.94); }
#deskShell .ds-prof{ transition:background-color .18s, transform .18s var(--hd-spring); }
#deskShell .ds-prof:hover{ transform:translateY(-1px); }

/* ---- aside cards ------------------------------------------------------- */
#deskShell .ds-card{ transition:box-shadow .26s var(--hd-ease), border-color .2s, transform .22s var(--hd-spring); }
#deskShell .ds-card:hover{ border-color:rgba(163,178,94,.3); box-shadow:0 20px 44px -26px rgba(0,0,0,.7); }
#deskShell .ds-profav{ position:relative; transition:transform .3s var(--hd-spring); }
#deskShell .ds-profcard:hover .ds-profav{ transform:scale(1.04); }
#deskShell .ds-profchip{ letter-spacing:.08em; }
#deskShell .ds-profopen{ transition:background-color .18s, transform .18s var(--hd-spring), box-shadow .2s; }
#deskShell .ds-profopen:hover{ transform:translateY(-1px); box-shadow:0 12px 26px -14px rgba(163,178,94,.8); }
#deskShell .ds-note:first-child .ds-notever{ animation:hdPulse 2.6s ease-out 1; }
#deskShell .ds-notever{ letter-spacing:.06em; }
#deskShell .ds-online .ds-ondot{ box-shadow:0 0 0 3px rgba(63,125,78,.18); }

/* ---- team band --------------------------------------------------------- */
#deskShell #dsTeamHost .aut-mate{ transition:transform .28s var(--hd-spring), filter .3s var(--hd-ease); }
#deskShell #dsTeamHost .aut-mate img{ transition:transform .35s var(--hd-spring), filter .35s var(--hd-ease); }
#deskShell #dsTeamHost .aut-mate:hover{ transform:translateY(-6px); }
#deskShell #dsTeamHost .aut-mate:hover img{ transform:scale(1.04); filter:saturate(1.15) contrast(1.04); }
#deskShell #dsTeamHost .aut-stage{ transition:box-shadow .3s var(--hd-ease); }
#deskShell #dsTeamHost .aut-mate:hover .aut-stage{ box-shadow:0 26px 44px -26px rgba(163,178,94,.7); }
#deskShell #dsTeamHost .aut-name{ transition:color .2s; }
#deskShell #dsTeamHost .aut-mate:hover .aut-name{ color:var(--olive,#A3B25E); }

/* ---- footer ------------------------------------------------------------ */
#deskShell .ds-footlink{ transition:color .18s, transform .18s var(--hd-spring); }
#deskShell .ds-footlink:hover{ transform:translateY(-1px); }

/* ---- motion ------------------------------------------------------------ */
@media (prefers-reduced-motion:no-preference){
  #deskShell .ds-hero::before{ animation:hdAurora 18s ease-in-out infinite; }
  #deskShell .ds-heroh1 .g{ animation:hdShimmer 7s linear infinite; }
}
@media (prefers-reduced-motion:reduce){
  #deskShell *, #deskShell *::before, #deskShell *::after{ animation:none !important; transition:none !important; }
  #deskShell .ds-heroh1 .g{ color:var(--ink,#fff); background:none; -webkit-text-fill-color:initial; }
}
/* light theme keeps the same rules — the olive rgba accents read on paper too */
html[data-theme="light"] #deskShell .ds-heroh1 .g{ background-image:linear-gradient(90deg, #1c1e16 0%, #5b6733 35%, #1c1e16 55%, #748040 80%, #1c1e16 100%); }
html[data-theme="light"] #deskShell .ds-stat:hover, html[data-theme="light"] #deskShell .ds-mod:hover{ box-shadow:0 18px 36px -18px rgba(20,24,16,.3); }
