/* Consistent legibility across light and dark themes. */
html{color-scheme:dark}html[data-theme=light]{color-scheme:light;--paper:#faf8fd;--ink:#24182f;--muted:#584b66;--accent:#69359a;--line:#cfc4dc;--color-destructive:#a2203c}
html[data-theme=light] .header{background:#fffdfbf5;border-color:#d6ccdf}
html[data-theme=light] .navlinks a:hover,html[data-theme=light] .text-link:hover{color:#60278f}
html[data-theme=light] .hero{background:#f3edf9;color:var(--ink)}
html[data-theme=light] .hero:before{background:linear-gradient(90deg,#faf7fcef 10%,#f3edf9d9 55%,#efe6f5ad);opacity:1}
html[data-theme=light] .hero-skyline{opacity:.28!important}
html[data-theme=light] .hero h1,html[data-theme=light] .process,html[data-theme=light] .process h2,html[data-theme=light] .process h3{color:var(--ink)}
html[data-theme=light] .hero h1 em,html[data-theme=light] .eyebrow,html[data-theme=light] .hero .eyebrow{color:#69359a}
html[data-theme=light] .step p,html[data-theme=light] .service-detail p,html[data-theme=light] .project-meta .project-type,html[data-theme=light] .hero-foot strong,html[data-theme=light] .process .eyebrow{color:var(--muted)}
html[data-theme=light] .project:hover .project-meta,html[data-theme=light] .faq summary:after,html[data-theme=light] .faq details[open] summary:after{color:#69359a}
html[data-theme=light] .brand-art{background:#eee4f6;color:var(--ink);border-color:#c8b3df}
html[data-theme=light] .brand-art .small,html[data-theme=light] .brand-art .bottom{color:#584266}
html[data-theme=light] .growth-lab{background:#f1e9f8;border-color:#c8b3df;color:var(--ink)}
html[data-theme=light] .growth-detail p,html[data-theme=light] .growth-lab .lab-hint{color:var(--muted)}
html[data-theme=light] .growth-detail a,html[data-theme=light] .lab-kicker,html[data-theme=light] .system-node span{color:#69359a}
html[data-theme=light] .orbit-core,html[data-theme=light] .city-band{color:#fff}
html[data-theme=light] .orbit-node{background:#fff;color:#45265f;border-color:#a78bbf}
html[data-theme=light] .orbit-node[aria-pressed=true]{background:#67388f;color:#fff}
html[data-theme=light] .step,html[data-theme=light] .checklist li{border-color:#cfc4dc}
html[data-theme=light] .success{color:#365e39}
html[data-theme=light] input::placeholder,html[data-theme=light] textarea::placeholder{color:#6a6074;opacity:1}
html[data-theme=light] input:focus,html[data-theme=light] textarea:focus,html[data-theme=light] select:focus{border-color:#69359a;box-shadow:0 0 0 3px #69359a28}
html[data-theme=light] :is(a,button,summary):focus-visible{outline:3px solid #69359a;outline-offset:4px}
html[data-theme=light] .button{background:linear-gradient(115deg,#c4a1ef,#ddc5f8,#be95e9);color:#24122f!important;border-color:#a77ace}
html[data-theme=light] .formbox label,html[data-theme=light] .privacy-note{color:#473451}
/* A straight-on laptop: the screen and metal base share one plane. */
.compact-home .hero .client-showcase{padding:0 12px;min-width:0}
.compact-home .hero .hero-art{position:relative;transform:none;width:100%;max-width:580px;min-height:0;margin:0 auto;padding:0 12px 22px}
.compact-home .hero .hero-art .live-browser{transform:none;border:7px solid #29242f;border-bottom-width:14px;border-radius:13px 13px 7px 7px;box-shadow:0 1px 0 #aaa1b5,0 18px 45px #0004;overflow:hidden}
.compact-home .hero .live-browser .chrome{height:25px;background:#ebe8ef;border-color:#d5d0dd}
.compact-home .hero .live-browser .chrome span{font-size:9px;color:#51485f}
.compact-home .hero .live-browser img{aspect-ratio:16/9;object-fit:cover;object-position:top}
.compact-home .hero .laptop-base{left:0;right:0;bottom:8px;height:15px;transform:none;clip-path:none;border-radius:2px 2px 45% 45% / 2px 2px 80% 80%;background:linear-gradient(#e6e1eb 0%,#a69dad 45%,#776e81 100%);box-shadow:0 10px 18px #0003;z-index:3}
.compact-home .hero .laptop-base:before{left:41%;right:41%;top:0;height:4px;border-radius:0 0 8px 8px;background:#706779}
.compact-home .hero .laptop-base:after{display:none}
.compact-home .hero .client-badge{position:static;transform:none;display:none}
.compact-home .hero .showcase-controls{margin-top:14px;gap:8px}
.compact-home .hero .showcase-controls button{min-height:38px;padding:8px 13px}
.compact-home .hero .showcase-caption{display:block;font-size:11px;line-height:1.4;margin:10px 0 0;color:var(--muted)}
/* Fine dot texture and an orbital glow, animated once without continuous distraction. */
.ambient-art{position:absolute;inset:0;overflow:hidden;z-index:-1;pointer-events:none;opacity:.75;background-image:radial-gradient(#c6a5ff44 .65px,transparent .9px);background-size:24px 24px;mask-image:linear-gradient(90deg,transparent,black 65%,transparent)}
.ambient-art:before,.ambient-art:after{content:'';position:absolute;width:680px;height:680px;right:-140px;top:-180px;border:1px solid #b891f438;border-radius:50%;box-shadow:0 0 0 60px #b891f408,0 0 0 120px #b891f408,0 0 85px #a967ed20;animation:ambient-arrive 5s ease-out both}
.ambient-art:after{width:460px;height:460px;right:100px;top:210px;box-shadow:0 0 90px #a967ed26;animation-direction:reverse}
html[data-theme=light] .ambient-art{opacity:.42;background-image:radial-gradient(#75469b66 .65px,transparent .9px)}
html[data-theme=light] .ambient-art:before,html[data-theme=light] .ambient-art:after{border-color:#75469b40}
@keyframes ambient-arrive{from{transform:translate3d(35px,25px,0) scale(.92);opacity:.25}to{transform:translate3d(0,0,0) scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){.ambient-art:before,.ambient-art:after{animation:none}}
/* One short footer shared by every main website page. */
.site-footer{border-top:1px solid var(--line);padding:24px 0 14px;background:var(--paper);color:var(--ink)}
.footer-row{display:flex;justify-content:space-between;align-items:center;gap:24px}
.footer-business strong{display:block;font-size:14px}.footer-business address{font-style:normal;font-size:12px;color:var(--muted);margin-top:4px}
.footer-contact{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.site-footer nav{display:flex;gap:22px;font-size:13px}.site-footer nav a{padding:9px 0}
.footer-meta{display:flex;justify-content:space-between;gap:20px;font-size:10px;line-height:1.6;color:var(--muted);margin-top:16px}.footer-meta a{text-decoration:underline;text-underline-offset:2px}
@media(max-width:760px){.compact-home .hero .hero-art{max-width:480px;padding:0 7px 20px}.compact-home .hero .hero-art .live-browser{border-width:5px;border-bottom-width:10px;border-radius:10px 10px 5px 5px}.compact-home .hero .live-browser .chrome{height:20px}.compact-home .hero .live-browser .chrome span{font-size:7px}.compact-home .hero .laptop-base{height:12px;bottom:8px}.compact-home .hero .showcase-controls{gap:5px}.compact-home .hero .showcase-controls button{font-size:10px;padding:7px 10px}.footer-row{flex-wrap:wrap;gap:15px 22px}.site-footer nav{width:100%;gap:25px}.footer-meta{flex-direction:column;gap:4px;margin-top:8px}.footer-contact{margin-left:auto}html[data-theme=light] .navlinks{background:#fff;border-color:#cfc4dc}}

/* Keep complete website captures inside consistent screen-shaped frames. */
.compact-project-image,.project-image-wrap{aspect-ratio:16/9;overflow:hidden;background:#eeeaf2}.compact-project-image img,.project-image-wrap img,.compact-home .hero .live-browser img,.slide-project img,.image-collage img,.proof-image img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;object-position:center;transform:none!important}.project-image-wrap img{height:100%}.compact-project:hover img,.real-project:hover img,.real-project:focus-visible img{transform:none}.portfolio-project-note{font-size:12px;line-height:1.65;color:var(--muted);margin:14px 0 0}.project-evidence{font-size:14px;line-height:1.8;color:var(--muted);margin:28px 0 0}.project-evidence a{text-decoration:underline;text-underline-offset:3px;color:var(--accent)}
