/*
Theme Name: Studio Pluspunkt
Theme URI: https://studiopluspunkt.de
Author: studio pluspunkt
Description: Custom minimal landing page for studio pluspunkt.
Version: 1.3.0
*/
:root { --bg:#dadada; --ink:#1a1a1a; --red:#e33621; }
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg);color:var(--ink);font-family:"Geist Mono",ui-monospace,monospace;cursor:none}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none;cursor:none}
.grain-overlay{position:fixed;top:-10%;left:-10%;width:120vw;height:120vh;pointer-events:none;z-index:50;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='260' height='260'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  background-size:260px 260px;opacity:.38;mix-blend-mode:multiply}
.hero{height:100vh;position:relative}
.wordmark{position:fixed;left:32px;top:28px;z-index:40}
.wordmark img{width:clamp(180px,32vw,280px);height:auto}
@media(min-width:768px){.wordmark{left:48px;top:36px}}
.center-mark{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:30;display:flex;align-items:center;gap:28px;transition:opacity .12s linear}
.plus{width:72px;height:72px;animation:pp-rotate 6s cubic-bezier(.65,0,.35,1) infinite}
@keyframes pp-rotate{0%{transform:rotate(0)}15%{transform:rotate(360deg)}100%{transform:rotate(360deg)}}
.dot{width:60px;height:60px}
.red-glow{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(72vw,880px);height:min(40vh,360px);background:var(--red);filter:blur(34px);opacity:.95;border-radius:8px;z-index:2;pointer-events:none}
.scramble{position:fixed;bottom:32px;left:32px;z-index:40;font-family:"Geist",ui-sans-serif,system-ui,sans-serif;font-weight:400;font-size:clamp(.85rem,1vw,1rem);letter-spacing:.02em;text-transform:uppercase;font-variant-numeric:tabular-nums;min-width:26ch}
.contact{position:fixed;bottom:32px;right:32px;z-index:40;font-family:"Geist",ui-sans-serif,system-ui,sans-serif;font-weight:300;font-size:clamp(.85rem,1vw,1rem);text-align:right;line-height:1.5}
@media(min-width:768px){.scramble{bottom:40px;left:48px}.contact{bottom:40px;right:48px}}
.pixel-section{height:100vh;width:100%;position:relative;background:var(--bg)}
.pixel-section canvas{display:block;width:100%;height:100%}
.pp-cursor{position:fixed;top:0;left:0;width:110px;height:110px;border-radius:9999px;border:1.5px solid var(--red);pointer-events:none;z-index:9999;transform:translate3d(-9999px,-9999px,0) translate(-50%,-50%);display:flex;align-items:center;justify-content:center}
.pp-cursor span{font-family:"Geist",ui-sans-serif,system-ui,sans-serif;font-weight:300;font-size:10px;line-height:1.2;text-align:center;padding:0 14px}
@media(hover:none){.pp-cursor{display:none}html,body,a{cursor:auto}}