@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,600;0,700;1,600;1,700&display=swap');

:root { --bg:#08050f; --violet:#9b6cff; --lilac:#d7c5ff; --muted:#a79bbd; --line:rgba(190,157,255,.2); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:#f8f5ff; background:var(--bg); font-family:'DM Sans',sans-serif; overflow-x:hidden; }
body::before { content:''; position:fixed; inset:0; z-index:-3; background:radial-gradient(circle at 50% -10%,#241047 0,transparent 38%),linear-gradient(145deg,#0d0717,#08050f 58%,#10091c); }
body::after { content:''; position:fixed; inset:0; z-index:-2; opacity:.07; pointer-events:none; background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size:80px 80px; mask-image:linear-gradient(to bottom,black,transparent 75%); }
::-webkit-scrollbar{width:8px} ::-webkit-scrollbar-track{background:#0d0718} ::-webkit-scrollbar-thumb{background:#5c3b8e;border-radius:8px}
#webgl-background { position:fixed; inset:0; width:100%; height:100%; z-index:-1; pointer-events:none; opacity:.85; }
.page-shell { position:relative; min-height:100vh; isolation:isolate; overflow:clip; }
.page-content { width:min(100% - 32px,760px); margin:auto; padding:42px 0 26px; }
.ambient-glow { position:absolute; width:220px; height:220px; border-radius:50%; filter:blur(90px); opacity:.12; pointer-events:none; z-index:-1; }
.ambient-glow-one{background:#8d43ff;top:15%;left:-180px}.ambient-glow-two{background:#d452c4;top:53%;right:-190px}
.eyebrow { display:flex; align-items:center; gap:9px; color:#bca8e1; font-size:10px; letter-spacing:.2em; text-transform:uppercase; margin-bottom:52px; }
.eyebrow-dot { width:7px;height:7px;border-radius:50%;background:#c294ff;box-shadow:0 0 14px #b875ff; }
.profile-section { display:flex; flex-direction:column; align-items:center; text-align:center; gap:22px; padding-bottom:64px; }
.portrait-wrap { position:relative; width:218px; height:218px; }
.portrait { width:100%;height:100%;overflow:hidden;border-radius:50%;border:1px solid rgba(225,205,255,.55);box-shadow:0 0 0 6px rgba(141,91,255,.07),0 0 35px rgba(141,69,255,.2); }
.portrait img { width:100%;height:100%;display:block;object-fit:cover; }
.portrait-ring { position:absolute; inset:-10px; border:1px solid rgba(187,142,255,.25); border-radius:50%; border-top-color:#d8baff; animation:spin 16s linear infinite; }
.portrait-ring::after { content:''; position:absolute; width:7px;height:7px;border-radius:50%;background:#e2caff;box-shadow:0 0 16px 5px #ad6bff; top:11px;left:50%; }
.profile-kicker { margin:0 0 6px; color:#b986ff; font-size:12px; letter-spacing:.19em; text-transform:uppercase; }
h1 { margin:0; font-size:clamp(40px,8vw,64px); line-height:.98; letter-spacing:-.055em; font-weight:700; } h1 em { font-family:'Playfair Display',serif;font-weight:600;color:#cdb4ff; }
.profile-description { max-width:470px; margin:20px auto 0; color:var(--muted); font-size:15px; line-height:1.7; }
.services-section,.portfolio-section { padding:20px 0 58px; }
.section-heading { display:flex;align-items:center;gap:13px;margin-bottom:21px; }
.section-heading span { display:none; } .section-heading h2 { margin:0;color:#cfc2e5;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase; }
.services-list { display:grid; gap:11px; }
.service-card { position:relative; display:flex;align-items:center;gap:16px;min-height:62px;padding:12px 16px;border:1px solid rgba(190,157,255,.14);border-radius:10px;color:#f7f2ff;text-decoration:none;background:rgba(255,255,255,.045);transition:transform .3s ease,border-color .3s ease,background .3s ease; }
.service-card::before { content:'';position:absolute;inset:0;border-radius:inherit;opacity:0;background:linear-gradient(90deg,rgba(157,93,255,.18),transparent 60%);transition:opacity .35s; }
.service-card:hover,.service-card:focus-visible { transform:translateX(8px);border-color:rgba(200,159,255,.65);background:rgba(137,78,220,.16);box-shadow:0 10px 34px rgba(114,49,205,.2);outline:none; }.service-card:hover::before,.service-card:focus-visible::before{opacity:1}
.service-card > * { position:relative; }.service-icon{width:28px;height:28px;object-fit:contain;flex:none}.service-card span{font-size:14px;font-weight:600;flex:1}.service-card b{font-size:22px;font-weight:400;color:#b78aff;transition:transform .35s}.service-card:hover b{transform:translate(3px,-3px)}
.portfolio-section { padding-top:4px; }.portfolio-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:10px; }.portfolio-item{overflow:hidden;border-radius:8px;border:1px solid rgba(192,153,255,.12);background:#160d26;transition:transform .35s ease,border-color .35s ease;}.portfolio-item:hover{transform:translateY(-3px);border-color:rgba(205,164,255,.5)}.portfolio-img{width:100%;aspect-ratio:218.64/251.88;object-fit:cover;display:block;transition:transform .5s ease,filter .5s}.portfolio-item:hover .portfolio-img{transform:scale(1.04);filter:saturate(1.08)}
.site-footer { padding:47px 0 12px;text-align:center;border-top:1px solid rgba(191,151,255,.13); }.footer-instagram{display:inline-flex;color:#b89be8;transition:color .3s,transform .3s}.footer-instagram:hover{color:#fff;transform:translateY(-3px)}.footer-instagram svg{width:23px;height:23px}.site-footer p{margin:16px 0 0;color:#746783;font-size:11px}
.reveal-section { opacity:0; transform:translateY(24px); transition:opacity .8s ease,transform .8s ease; }.reveal-section.is-visible{opacity:1;transform:none}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width:600px){.page-content{width:min(100% - 28px,760px);padding-top:30px}.eyebrow{margin-bottom:42px}.profile-section{padding-bottom:51px}.services-section,.portfolio-section{padding-bottom:48px}.portfolio-grid{gap:8px}.service-card:hover,.service-card:focus-visible{transform:translateX(3px)}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.portrait-ring{animation:none}.service-card,.portfolio-item,.portfolio-img,.reveal-section{transition:none}.reveal-section{opacity:1;transform:none}}