/* DD Experience — Didonna Design Studio */
:root{--ddx-accent:#ff5033;--ddx-paper:#f2efe7;--ddx-ink:#09090a}

/* 3D particle stage: fixed behind every transparent section */
#ddx-stage{position:fixed;inset:0;width:100vw;height:100vh;height:100lvh;z-index:0;pointer-events:none;opacity:0;transition:opacity 1.6s ease}
#ddx-stage.is-on{opacity:1}
.ddx-stage-on body{background:#09090a}
.ddx-stage-on #ddx-stage{background:linear-gradient(130deg,#09090a 0%,#111114 58%,#25100d 100%)}
.ddx-stage-on .dd-page-hero{background:radial-gradient(circle at 80% 20%,rgba(255,80,51,.22),rgba(0,0,0,0) 32%)!important}
.ddx-stage-on .dd-hero{background:radial-gradient(circle at 78% 28%,rgba(255,80,51,.3),rgba(0,0,0,0) 30%)!important}
#ddx-stage canvas{display:block;width:100%!important;height:100%!important}
.ddx .site-footer{position:relative;z-index:1}
.ddx main{position:relative;z-index:1}

/* Scroll progress */
#ddx-progress{position:fixed;top:0;left:0;right:0;height:2px;background:var(--ddx-accent);transform-origin:0 50%;transform:scaleX(0);z-index:2147483001;pointer-events:none}
.admin-bar #ddx-progress{top:32px}
@media (max-width:782px){.admin-bar #ddx-progress{top:46px}}

/* Film grain */
#ddx-grain{position:fixed;inset:-50%;width:200%;height:200%;z-index:2147482990;pointer-events:none;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:ddx-grain 1.2s steps(6) infinite}
@keyframes ddx-grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}

/* Cursor ring (native cursor stays visible) */
#ddx-ring,#ddx-dot{position:fixed;top:0;left:0;pointer-events:none;z-index:2147483002;border-radius:50%;will-change:transform}
#ddx-ring{width:38px;height:38px;margin:-19px 0 0 -19px;border:1px solid rgba(242,239,231,.45);transition:width .3s,height .3s,margin .3s,border-color .3s,background .3s,opacity .3s;opacity:0}
#ddx-dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:var(--ddx-accent);opacity:0;transition:opacity .3s}
.ddx-cursor-on #ddx-ring,.ddx-cursor-on #ddx-dot{opacity:1}
#ddx-ring.is-link{width:74px;height:74px;margin:-37px 0 0 -37px;border-color:var(--ddx-accent);background:rgba(255,80,51,.08)}
#ddx-ring.is-down{width:28px;height:28px;margin:-14px 0 0 -14px}

/* Split headings */
.ddx-split .ddx-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.ddx-split .ddx-w>span{display:inline-block;transform:translate3d(0,105%,0) rotate(4deg);transform-origin:0 100%;transition:transform 1.1s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--i,0) * 55ms)}
.ddx-split.ddx-in .ddx-w>span{transform:none}

/* 3D tilt cards with glare */
.ddx-tilt{transform-style:preserve-3d;transition:transform .6s cubic-bezier(.16,1,.3,1);will-change:transform}
.ddx-tilt.is-hover{transition:transform .12s linear}
.ddx-glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(255,80,51,.18),rgba(242,239,231,.05) 40%,transparent 65%);mix-blend-mode:screen;z-index:2}
.ddx-tilt.is-hover .ddx-glare{opacity:1}

/* Magnetic buttons */
.ddx-mag{transition:transform .5s cubic-bezier(.16,1,.3,1)}
.ddx-mag.is-hover{transition:transform .15s linear}

/* Scroll hint on the home hero */
#ddx-hint{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:10px;font:500 10px/1 "Plus Jakarta Sans",sans-serif;letter-spacing:.24em;text-transform:uppercase;color:rgba(242,239,231,.7);pointer-events:none;transition:opacity .4s}
#ddx-hint i{display:block;width:1px;height:44px;background:linear-gradient(var(--ddx-accent),transparent);animation:ddx-hint 1.8s ease-in-out infinite;transform-origin:top}
@keyframes ddx-hint{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

/* Shape label that follows the morph on the home */
#ddx-label{position:fixed;right:clamp(16px,4vw,64px);bottom:clamp(16px,4vh,40px);z-index:5;font:500 10px/1.4 "Plus Jakarta Sans",sans-serif;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,239,231,.55);pointer-events:none;text-align:right;transition:opacity .5s}
#ddx-label b{display:block;color:var(--ddx-accent);font-weight:600}
@media (max-width:767px){#ddx-label{display:none}}

@media (prefers-reduced-motion:reduce){
  #ddx-grain{animation:none}
  .ddx-split .ddx-w>span{transform:none!important;transition:none}
}
@media (hover:none){#ddx-ring,#ddx-dot{display:none}}
@media (max-width:767px){#ddx-hint{display:none}}