/*
Theme Name: Brightest Pixel
Author: Brightest Pixel
Version: 3.1.6
Requires at least: 6.4
Requires PHP: 7.4
Description: Latest Brightest Pixel homepage design with native WordPress contact and account access.
License: GPL-2.0-or-later
Text Domain: brightestpixel
*/

@font-face{font-family:Studio;src:url('assets/studio.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#030409;color:#e6e6ef}body{font-family:Studio,'Helvetica Neue',Arial,sans-serif;font-weight:300;-webkit-font-smoothing:antialiased}body::before{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 43%,#10102355,transparent 58%)}
.page{min-height:100svh;display:flex;align-items:center;justify-content:center;position:relative;padding:80px 24px}.hero{align-self:center;text-align:center;margin:0 auto;width:100%;padding:0}.art{position:relative;width:min(580px,90vw);aspect-ratio:560/380;margin:0 auto -2px}.art video,.art img{width:100%;height:100%;display:block;object-fit:contain;mix-blend-mode:screen;mask-image:radial-gradient(ellipse 48% 47% at 50% 50%,black 55%,transparent 100%)}.art img{display:none}h1{font-weight:250;font-size:clamp(36px,5.2vw,60px);letter-spacing:.17em;line-height:1.3;margin:0 0 29px;padding-left:.17em}.tagline{font-weight:250;font-size:clamp(14px,calc(2.4vw - 3px),21px);letter-spacing:.025em;margin:0 0 12px;color:#d5d5df}.services{font-size:clamp(12px,1.6vw,16px);line-height:1.7;letter-spacing:.025em;font-weight:300;color:#9899ac;margin:0}.footer{position:absolute;left:0;right:0;bottom:26px;display:flex;align-items:center;justify-content:center;min-height:32px}.contact{font:inherit;font-size:12px;letter-spacing:.13em;color:#b4b5c5;background:none;border:0;padding:12px 18px;text-decoration:none;cursor:pointer;transition:color .2s}.contact span{margin-left:9px;display:inline-block;transition:transform .2s}.contact:hover{color:#fff}.contact:hover span{transform:translate(2px,-2px)}:focus-visible{outline:1px solid #b2b9ff;outline-offset:6px;border-radius:2px}.motion{position:absolute;right:25px;bottom:31px;border:0;background:none;color:#626375;padding:8px;font-size:10px;letter-spacing:.07em;cursor:pointer}.motion:hover{color:#ddd}dialog{color:#ddddea;background:#0b0c14;border:1px solid #262739;border-radius:10px;max-width:390px;width:calc(100% - 40px);padding:38px 30px;box-shadow:0 20px 120px #0009;text-align:center}dialog::backdrop{background:#0009;backdrop-filter:blur(8px)}dialog h2{font-size:23px;font-weight:300;letter-spacing:.02em}dialog p{font-size:14px;line-height:1.8;color:#a6a7b8}.close{position:absolute;top:8px;right:10px;padding:7px 10px;color:#aaa;background:none;border:0;font-size:20px;cursor:pointer}.contact-note{font-size:12px!important;color:#75768c!important;margin-top:24px}
@media(min-width:1000px){.hero{padding-bottom:0}.art{width:min(620px,65vh)}}@media(max-width:600px){.page{padding:80px 16px}.hero{padding-bottom:0}.art{width:min(520px,112vw);left:50%;transform:translateX(-50%);margin-left:0;margin-right:0}h1{margin-bottom:24px}.services{max-width:280px;margin:auto}.motion{right:9px;bottom:25px;font-size:9px}.footer{bottom:20px}}@media(max-height:620px) and (min-width:600px){.hero{padding-bottom:0}.art{width:350px}h1{font-size:37px;margin-bottom:12px}.tagline{font-size:15px}.services{font-size:12px}}

dialog{max-width:640px;width:calc(100% - 28px);max-height:92dvh;padding:42px 12px 14px;overflow-y:auto;overscroll-behavior:contain}dialog .close{position:absolute;top:6px;right:12px;z-index:2;min-width:36px;min-height:36px;color:#ddd}.form-frame{display:block;width:100%;height:640px;border:0;border-radius:6px;background:#0b0c14}.form-link{display:inline-block;margin:14px 0 4px;color:#a9aaca;font-size:12px;text-underline-offset:4px}body:has(dialog[open]){overflow:hidden}@media(max-width:600px){dialog{padding-left:4px;padding-right:4px}.form-frame{height:690px}}

/* Smoked glass contact overlay */
dialog{isolation:isolate;background:linear-gradient(135deg,rgba(24,27,46,.60),rgba(5,7,15,.46));border:1px solid rgba(201,207,255,.24);border-radius:16px;box-shadow:0 24px 100px #0007,inset 0 1px 0 #ffffff12;backdrop-filter:blur(18px) saturate(125%);-webkit-backdrop-filter:blur(18px) saturate(125%)}dialog::backdrop{background:rgba(0,1,8,.26);backdrop-filter:none}dialog::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;background:radial-gradient(ellipse at 65% 18%,#8585ff15,transparent 65%),radial-gradient(ellipse at 18% 72%,#438fff10,transparent 60%)}.form-frame{background:transparent}.form-link{font-weight:300;letter-spacing:.06em;color:#b6b8ce}.close{font-weight:200}dialog .close{color:#c9cbdf}
.client-nav{position:absolute;top:26px;right:30px}.client-nav a{color:#b4b5c5;font-size:12px;letter-spacing:.10em;text-decoration:none;padding:12px}.client-nav a:hover{color:#fff}
.footer{gap:12px}.footer .contact{white-space:nowrap}@media(max-width:600px){.footer{gap:4px}.footer .contact{font-size:11px;padding:12px 10px}.motion{bottom:62px}}

h1{font-family:Studio,'Helvetica Neue',Arial,sans-serif;font-weight:150;letter-spacing:.22em;padding-left:.22em}

h1{font-family:"neotype-vf",Studio,sans-serif;font-weight:150;font-style:normal;font-synthesis:none}

h1{letter-spacing:.32em;padding-left:.32em;text-transform:none;font-variant-caps:normal;font-kerning:normal}@media(max-width:600px){h1{font-size:clamp(24px,6.3vw,36px);letter-spacing:.26em;padding-left:.26em}}
h1{display:table;margin-left:auto;margin-right:auto}.tagline{display:table;white-space:nowrap;margin-left:auto;margin-right:auto}
/* Keep the aperture fixed; lift only the rotating cube. */
.art video{position:absolute;inset:0}
.art #cube{transform:translateY(-8%);mask-image:radial-gradient(ellipse 48% 47% at 50% 50%,black 55%,transparent 100%),linear-gradient(to bottom,black 70%,transparent 78%);mask-composite:intersect}
.art #cube-hole{mask-image:radial-gradient(ellipse 48% 47% at 50% 50%,black 55%,transparent 100%),linear-gradient(to bottom,transparent 70%,black 80%);mask-composite:intersect}

dialog{max-width:600px;padding:44px 28px 24px;text-align:left}.bp-contact-inner h2{font-size:27px;font-weight:250;letter-spacing:.035em;margin:0 0 8px}.bp-contact-inner>p{margin:0 0 24px}.bp-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px}.bp-contact-form label{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#b8bfd8;margin-bottom:20px;font-weight:300}.bp-contact-form label span{color:#adb7f4}.bp-contact-form input,.bp-contact-form select,.bp-contact-form textarea{display:block;width:100%;margin-top:9px;padding:11px 12px;background:#04061155;border:1px solid #b9c3ff45;border-radius:5px;color:#e4e8f7;font:300 16px Studio,Arial,sans-serif;letter-spacing:.015em;outline:none}.bp-contact-form select option{background:#0b0c14;color:#e4e8f7}.bp-contact-form input:focus,.bp-contact-form select:focus,.bp-contact-form textarea:focus{border-color:#bec6ffb0;box-shadow:0 0 0 1px #9cafff25}.bp-contact-form textarea{resize:vertical;min-height:110px}.bp-send{display:flex;justify-content:space-between;align-items:center;width:100%;padding:14px 17px;font:300 13px Studio,Arial,sans-serif;letter-spacing:.09em;border:1px solid #cbd1ff60;border-radius:5px;background:linear-gradient(115deg,#a8acff18,#79a8ff0b);color:#e1e6f8;cursor:pointer}.bp-send:hover{background:#a7b3ff20}.bp-privacy{font-size:11px!important;margin:16px 0 0!important;line-height:1.6!important;color:#959db8!important}.bp-honey{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}.bp-notice{border:1px solid #a8b4ff45;padding:12px;font-size:13px!important;color:#d7def7!important;border-radius:5px}@media(max-width:500px){dialog{padding:42px 20px 22px}.bp-fields{grid-template-columns:1fr;gap:0}}

.content-page{max-width:900px;margin:auto;padding:70px 24px}

.hero .footer{position:static;inset:auto;margin:26px auto 0;gap:22px;display:flex;justify-content:center;align-items:center}.hero .footer .contact{font-size:16px;padding:12px 16px;letter-spacing:.09em}@media(max-width:600px){.hero .footer{gap:12px;margin-top:22px}.hero .footer .contact{font-size:14px;padding:12px 10px}}

/* Fit the complete mobile wordmark to 80% of the viewport. */
@media(max-width:600px){.page .hero h1{width:max-content;max-width:none;white-space:nowrap;margin-left:auto;margin-right:auto;}}