/* Shared atmosphere; presentation rules scoped to the landing page. */
body[data-studio] { isolation:isolate; }
.studio-atmosphere { position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; }
.studio-atmosphere::before,.studio-atmosphere::after { content:""; position:absolute; width:65vmax; height:65vmax; border-radius:50%; opacity:.4; animation:studio-cloud 24s ease-in-out infinite alternate; }
.studio-atmosphere::before { background:radial-gradient(circle,#e8c4a6,transparent 66%); top:-35%; right:-25%; }
.studio-atmosphere::after { background:radial-gradient(circle,#bed3cd,transparent 65%); bottom:-45%; left:-28%; animation-delay:-12s; }
.studio-doodle { position:absolute; left:var(--left); top:var(--top); color:var(--tone); opacity:.25; font-size:var(--size); line-height:1; animation:studio-drift var(--duration) ease-in-out infinite alternate; animation-delay:var(--delay); }
[data-studio] .scroll-progress { display:block; position:fixed; inset:0 auto auto 0; height:3px; width:100%; background:linear-gradient(90deg,#ad3624,#d2a659,#527f79); transform:scaleX(var(--studio-progress,0)); transform-origin:left; z-index:100; pointer-events:none; }
.studio-tilt { rotate:var(--studio-tilt,0deg); transition:rotate .3s ease,transform .3s ease,box-shadow .3s ease; }
.studio-spark { position:fixed; top:0; left:0; width:8px; height:8px; background:var(--spark-color); border-radius:1px; pointer-events:none; z-index:101; }
[data-studio="main"] .hero { position:relative; }
[data-studio="main"] .hero::after { content:""; position:absolute; right:0; top:22px; width:38px; height:38px; opacity:.6; background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 2v36M2 20h36M7 7l26 26M7 33L33 7' fill='none' stroke='%23ad3624' stroke-width='1.3'/%3E%3C/svg%3E"); animation:studio-turn 28s linear infinite; pointer-events:none; }
[data-studio="main"] .hero-copy .eyebrow::before { content:""; display:inline-block; width:7px; height:7px; margin-right:10px; background:var(--red); border-radius:50%; box-shadow:0 0 0 5px #ad362411; animation:studio-pulse 3s ease-in-out infinite; }
[data-studio="main"] .artwork::before { content:""; position:absolute; inset:8% 5% 4%; border:1px dashed #ad36242c; border-radius:50%; rotate:-18deg; pointer-events:none; animation:studio-orbit 32s linear infinite; }
[data-studio="main"] .artwork::after { content:""; position:absolute; width:10px; height:10px; right:8%; top:18%; border:1px solid #527f7960; border-radius:50%; box-shadow:12px 10px 0 -3px #ad362450; pointer-events:none; animation:studio-drift 7s ease-in-out infinite alternate; }
[data-studio="main"] .card { position:relative; padding:24px 18px 20px; border-radius:2px 2px 14px 2px; background:linear-gradient(130deg,#fffdf760,transparent); }
[data-studio="main"] .card::after { content:""; position:absolute; right:0; bottom:0; width:22px; height:22px; background:linear-gradient(135deg,transparent 50%,#ded5c355 51%); pointer-events:none; }
[data-studio="main"] .card-top svg { transition:rotate .55s cubic-bezier(.2,.8,.2,1),scale .55s; }
[data-studio="main"] .card:hover .card-top svg { rotate:-12deg; scale:1.18; }
[data-studio="main"] .ribbon { position:relative; overflow:hidden; }
[data-studio="main"] .ribbon::after { content:""; position:absolute; inset:-100% auto -100% -30%; width:20%; background:linear-gradient(90deg,transparent,#fff8,transparent); rotate:22deg; animation:studio-sweep 9s ease-in-out infinite; pointer-events:none; }
[data-studio="main"] .closing { position:relative; }
[data-studio="main"] .closing::before { content:""; position:absolute; left:0; top:0; width:90px; height:3px; background:var(--red); transform-origin:left; animation:studio-underline 5s ease-in-out infinite; }
@keyframes studio-cloud { to { transform:translate(8%,12%) scale(1.12); } }
@keyframes studio-drift { to { transform:translate(12px,-28px) rotate(35deg); } }
@keyframes studio-turn { to { transform:rotate(360deg); } }
@keyframes studio-orbit { to { rotate:342deg; } }
@keyframes studio-pulse { 50% { box-shadow:0 0 0 9px #ad362400; } }
@keyframes studio-sweep { 0%,65% { left:-30%; } 100% { left:140%; } }
@keyframes studio-underline { 50% { transform:scaleX(1.6); } }
.studio-paused .studio-atmosphere::before,.studio-paused .studio-atmosphere::after,.studio-paused .studio-doodle { animation-play-state:paused; }
@media(max-width:600px) { .studio-doodle:nth-child(n+7) { display:none; } [data-studio="main"] .hero::after { width:26px; height:26px; top:12px; } [data-studio="main"] .card { padding-inline:12px; } }
@media print { .studio-atmosphere,.studio-spark,[data-studio] .scroll-progress,[data-studio="main"] .hero::after,[data-studio="main"] .artwork::before,[data-studio="main"] .artwork::after { display:none!important; } .studio-tilt { rotate:none!important; } }

/* V3: a brighter moving workshop, with bounded decorative layers. */
.studio-atmosphere::before { opacity:.65; background:radial-gradient(ellipse,#e9b9a5 0%,#eed7aa70 36%,transparent 68%); }
.studio-atmosphere::after { opacity:.6; background:radial-gradient(ellipse,#a8d0c4 0%,#bfd4df60 38%,transparent 68%); }
.studio-doodle { opacity:.4; text-shadow:0 2px 10px #fff8; }
.studio-spark { width:11px; height:11px; clip-path:polygon(50% 0,61% 37%,100% 50%,61% 63%,50% 100%,39% 63%,0 50%,39% 37%); }
.studio-trail { width:14px; height:14px; }
[data-studio="main"] .artwork { isolation:isolate; }
[data-studio="main"] .visual { z-index:2; }
[data-studio="main"] .artwork::before { inset:4%; border:0; background:radial-gradient(ellipse,#edc36e42,transparent 70%); animation:studio-glow 8s ease-in-out infinite alternate; }
.studio-orbits { position:absolute; inset:0; pointer-events:none; z-index:3; }
.studio-ring { position:absolute; inset:6%; border:1px solid #ad362448; border-radius:50%; animation:studio-turn 24s linear infinite; }
.studio-ring::after { content:""; position:absolute; width:10px; height:10px; left:15%; top:12%; background:#ad3624; border:3px solid var(--paper); border-radius:50%; box-shadow:0 0 0 4px #ad362418; }
.ring-one { border-style:dashed; rotate:-15deg; z-index:-1; }
.ring-two { inset:0 14%; border-color:#367f7755; rotate:32deg; animation-duration:32s; animation-direction:reverse; }
.ring-two::after { background:#367f77; box-shadow:0 0 0 5px #367f7718; }
.ring-three { inset:14% 0; border-color:#bf8b2d55; rotate:-22deg; animation-duration:40s; }
.ring-three::after { background:#bf8b2d; box-shadow:0 0 0 5px #bf8b2d18; }
.studio-sticker { position:absolute; display:grid; place-items:center; width:52px; height:52px; font-size:35px; line-height:1; border:1px solid #fff8; box-shadow:3px 5px 0 #64543c16,0 8px 20px #64543c12; animation:studio-sticker-float 5s ease-in-out infinite; }
.sticker-star { left:6%; top:8%; background:#efcc77; color:#79511c; rotate:-12deg; border-radius:8px 8px 8px 2px; }
.sticker-pencil { right:0; top:38%; background:#c0d9cd; color:#346c61; rotate:12deg; border-radius:50%; animation-delay:-1.8s; }
.sticker-arrow { left:10%; bottom:5%; background:#e7bdad; color:#9e452f; rotate:-8deg; border-radius:4px 14px 4px 4px; animation-delay:-3s; }
[data-studio="main"] .button { position:relative; overflow:hidden; box-shadow:4px 5px 0 #ad362420; }
[data-studio="main"] .button::before { content:""; position:absolute; inset:-100% auto -100% -40%; width:30%; background:linear-gradient(90deg,transparent,#fff5,transparent); rotate:20deg; animation:studio-sweep 5s ease-in-out infinite; pointer-events:none; }
[data-studio="main"] .card { box-shadow:0 10px 35px -25px #80664b60; }
@media(hover:hover) and (pointer:fine) {
  [data-studio="main"] .card:hover { transform:perspective(850px) rotateX(var(--studio-rx,0deg)) rotateY(var(--studio-ry,0deg)) translateY(-7px); box-shadow:0 18px 35px -20px #80664b60; }
}
@keyframes studio-sticker-float { 0%,100% { translate:0 0; } 50% { translate:0 -12px; } }
@keyframes studio-glow { to { scale:1.12; opacity:.6; } }
.studio-paused .studio-ring,.studio-paused .studio-sticker { animation-play-state:paused; }
@media(max-width:600px) { .studio-sticker { width:35px; height:35px; font-size:24px; } .studio-ring::after { width:7px; height:7px; border-width:2px; }  }
@media print { .studio-orbits { display:none!important; } [data-studio="main"] .button::before { display:none; } }
.studio-orbits { inset:-12px; overflow:clip; }
.studio-particles { position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:101; }
.studio-particles .studio-spark { position:absolute; }
@media print { .studio-particles { display:none; } }
[data-studio="main"] .artwork::before { rotate:0deg; }

/* V4: tactile hover reactions and lively ornaments, without a mouse light. */
.studio-doodle { animation-name:studio-doodle-roam; }
.studio-doodle-reaction { display:block; transition:translate .55s cubic-bezier(.2,.8,.2,1),rotate .55s,scale .55s; }
@keyframes studio-doodle-roam {
  0% { transform:translate(0,0) rotate(-12deg); }
  50% { transform:translate(calc(var(--drift-x,40px) * .55),var(--drift-y,-48px)) rotate(18deg); }
  100% { transform:translate(var(--drift-x,40px),-10px) rotate(55deg); }
}
[data-studio="main"] :is(.eyebrow,.intro,.ribbon-items span,.tag,.visual-note,.footer-inner strong) { transition:translate .35s,rotate .35s,scale .35s,color .35s; }
[data-studio="main"] .ribbon-items span { display:inline-block; }
[data-studio="main"] header nav a,[data-studio="main"] .text-link { position:relative; }
[data-studio="main"] header nav a::after { content:""; position:absolute; left:0; right:0; bottom:-5px; height:2px; background:var(--red); border-radius:50%; transform:scaleX(0); transform-origin:left; transition:transform .3s; pointer-events:none; }
[data-studio="main"] :is(#about-title,#explore-title,#closing-title) { position:relative; }
[data-studio="main"] :is(#about-title,#explore-title,#closing-title)::after { content:""; position:absolute; left:0; bottom:-8px; width:110px; max-width:75%; height:3px; border-radius:50%; background:var(--red); transform:scaleX(0) rotate(-2deg); transform-origin:left; transition:transform .45s; pointer-events:none; }
[data-studio="main"] .ai-note::before { content:""; position:absolute; top:-9px; left:35%; width:72px; height:18px; background:#c7b28155; border-inline:1px dashed #a38b5b66; rotate:-4deg; transition:rotate .4s,scale .4s; pointer-events:none; }
.studio-sticker { transition:scale .4s,rotate .4s; }
.studio-ring { transition:opacity .4s,border-color .4s; }
@media(hover:hover) and (pointer:fine) {
  [data-studio="main"] header nav a:hover::after { transform:scaleX(1); }
  [data-studio="main"] .hero-copy>.eyebrow:hover { translate:5px 0; rotate:-1deg; }
  [data-studio="main"] .intro:hover { translate:4px 0; color:var(--ink); }
  [data-studio="main"] .ribbon:hover .ribbon-items span { translate:0 -5px; rotate:-6deg; }
  [data-studio="main"] .ribbon:hover .ribbon-items span:nth-child(2) { rotate:5deg; translate:0 3px; }
  [data-studio="main"] .ribbon:hover strong { color:var(--red); }
  [data-studio="main"] .artwork:hover .studio-sticker { scale:1.18; rotate:8deg; }
  [data-studio="main"] .artwork:hover .sticker-pencil { rotate:-15deg; }
  [data-studio="main"] .artwork:hover .studio-ring { border-color:#ad362480; opacity:.8; }
  [data-studio="main"] .artwork:hover .visual-note { translate:0 -4px; rotate:-3deg; }
  [data-studio="main"] :is(#about-title,#explore-title,#closing-title):hover::after { transform:scaleX(1) rotate(-2deg); }
  [data-studio="main"] .ai-note:hover::before { rotate:5deg; scale:1.08; }
  [data-studio="main"] .card:hover .tag { color:var(--red); translate:4px 0; }
  [data-studio="main"] .card:hover .card-top svg { animation:studio-icon-salute .7s ease both; }
  [data-studio="main"] .footer-inner strong:hover { display:inline-block; rotate:-8deg; scale:1.12; }
  [data-studio] :is(.brand,.editorial-wordmark):hover img { transform:translateY(-4px) rotate(12deg) scale(1.12); }
}
[data-studio="main"] header nav a:focus-visible::after { transform:scaleX(1); }
@keyframes studio-icon-salute { 0%,100% { translate:0 0; } 35% { translate:0 -6px; rotate:-12deg; } 70% { rotate:8deg; } }
@media print { [data-studio="main"] .ai-note::before { display:none; } .studio-doodle-reaction { transform:none; translate:none; scale:none; rotate:none; } }