:root { --black:#0a0a0a; --white:#f2f0eb; --off:#e7e5df; --text:#151515; --muted:#5f5f5b; --line:#c9c7c1; --pad:clamp(1.25rem,4vw,4.5rem); --font:"Manrope",sans-serif; }
*,*::before,*::after{box-sizing:border-box} html{scroll-behavior:smooth;scroll-padding-top:5rem;background:var(--black);overscroll-behavior-y:none} body{min-height:100%;max-width:100%;margin:0;background-color:#c9c7c1;background-image:url("assets/blackveil-background.png");background-position:center;background-size:cover;background-attachment:fixed;background-repeat:no-repeat;background-blend-mode:multiply;color:var(--text);font-family:var(--font);font-size:16px;-webkit-font-smoothing:antialiased;overflow-x:hidden;overscroll-behavior-y:none} a{color:inherit;text-decoration:none} button,input,select,textarea{font:inherit} img{display:block;width:100%} :focus-visible{outline:2px solid currentColor;outline-offset:4px}.container{width:min(100%,1440px);margin:auto;padding-inline:var(--pad)}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:2.9rem;padding:.75rem 1.15rem;border:1px solid var(--text);background:var(--text);color:#fff;font-size:.84rem;font-weight:500;transition:background .2s,color .2s}.button:hover{background:#333}.button--light{background:#fff;color:var(--text)}.button--light:hover{background:var(--off)}.button--outline{background:transparent;color:var(--text)}.button--outline:hover{background:var(--text);color:#fff}
.site-header{position:fixed;z-index:20;inset:0 0 auto;background:var(--black);color:#fff}.header-inner{height:5rem;display:flex;align-items:center;justify-content:space-between}.logo{display:block;width:max-content}.logo img{width:9.25rem;height:auto}.nav-wrap{display:flex;align-items:center;gap:2rem}.site-nav{display:flex;gap:1.8rem}.site-nav a{font-size:.82rem;color:#c6c6c6;transition:color .2s}.site-nav a:hover{color:#fff}.header-button{border-color:#fff}.menu-button{display:none;width:2rem;border:0;background:transparent;color:#fff;padding:.4rem 0}.menu-button span{display:block;height:1px;background:currentColor;margin:.4rem 0;transition:transform .2s}
main{padding-top:5rem}.hero{padding-block:clamp(4rem,7vw,6.5rem);border-bottom:1px solid var(--line);background:rgba(242,240,235,.78)}.eyebrow{margin:0 0 1.25rem;font-size:.72rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.hero h1{max-width:980px;margin:0;font-size:clamp(2.7rem,5vw,4rem);font-weight:500;line-height:1.05;letter-spacing:-.05em}.hero-copy{display:grid;grid-template-columns:repeat(12,1fr);gap:1.25rem;margin-top:1.75rem}.hero-copy p{grid-column:1/7;max-width:690px;margin:0;color:var(--muted);font-size:1.08rem;line-height:1.6}.hero-actions{grid-column:9/13;display:flex;justify-content:flex-end;align-items:start;gap:.6rem}
section{padding-block:clamp(4rem,7vw,6.5rem)}.section-head{display:grid;grid-template-columns:repeat(12,1fr);gap:1.25rem;margin-bottom:2.5rem}.section-head .eyebrow{grid-column:1/4}.section-head h2{grid-column:4/10;margin:0;font-size:clamp(2rem,3.5vw,3.25rem);font-weight:500;line-height:1.12;letter-spacing:-.04em}.section-head>p{grid-column:10/13;margin:0;color:var(--muted);font-size:.92rem;line-height:1.55}
.services{background:rgba(239,237,231,.9)}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.service{padding:1.75rem 2rem 2rem;border-right:1px solid var(--line)}.service:last-child{border:0}.service-number{display:block;margin-bottom:3rem;font-size:.72rem;color:var(--muted)}.service h3{margin:0 0 .8rem;font-size:1.6rem;font-weight:500;letter-spacing:-.035em}.service>p{min-height:4rem;margin:0 0 1.5rem;color:var(--muted);font-size:.92rem;line-height:1.55}.service ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}.service li{padding:.65rem 0;border-bottom:1px solid var(--line);font-size:.84rem}
.work{background:rgba(245,245,243,.93);border-block:1px solid var(--line)}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem 1.25rem}.project-image{aspect-ratio:16/10;overflow:hidden;background:#ddd}.project-image img{height:100%;object-fit:cover;filter:grayscale(1);transition:transform .25s,filter .25s}.project:hover .project-image img{transform:scale(1.015);filter:none}.project-meta{display:grid;grid-template-columns:1fr auto;gap:1rem;padding-top:1rem}.project h3{margin:0 0 .3rem;font-size:1.15rem;font-weight:500;letter-spacing:-.02em}.project p,.project time{margin:0;color:var(--muted);font-size:.78rem}.project time{padding-top:.15rem}
.gaming{background:#fff url("assets/fivem-redm-background.png") center/cover no-repeat}.gaming-layout{display:grid;grid-template-columns:repeat(12,1fr);gap:1.25rem}.gaming-intro{grid-column:1/8}.gaming-intro h2{max-width:46rem;margin:0;font-size:clamp(2.2rem,4.2vw,3.75rem);font-weight:500;line-height:1.05;letter-spacing:-.05em}.gaming-intro>p:not(.eyebrow){max-width:38rem;margin:1.5rem 0 0;color:var(--muted);font-size:1rem;line-height:1.6}.gaming-intro .button{margin-top:2rem}.gaming-list{grid-column:9/13;padding:1.35rem 1.5rem .25rem;border-radius:1rem;background:rgba(10,10,10,.9);color:#fff}.gaming-platforms{display:flex;justify-content:space-between;padding:0 0 1.2rem;border-bottom:1px solid #555;font-size:1.25rem;font-weight:500;letter-spacing:-.035em}.gaming-item{display:grid;grid-template-columns:2.25rem 1fr;gap:1rem;padding:1.25rem 0;border-bottom:1px solid #555}.gaming-item:last-child{border-bottom:0}.gaming-item span{padding-top:.15rem;color:#999;font-size:.72rem}.gaming-item h3{margin:0 0 .4rem;font-size:1.05rem;font-weight:500}.gaming-item p{margin:0;color:#bbb;font-size:.84rem;line-height:1.5}
.process{padding-bottom:0;background:rgba(239,237,231,.88)}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.step{min-height:13rem;padding:1.5rem;border-right:1px solid var(--line);display:flex;flex-direction:column}.step:last-child{border:0}.step span{font-size:.75rem;color:var(--muted)}.step h3{margin:auto 0 .7rem;font-size:1.35rem;font-weight:500;letter-spacing:-.025em}.step p{margin:0;color:var(--muted);font-size:.86rem;line-height:1.5}
.reasons{margin-top:clamp(5rem,9vw,8.5rem);background:var(--black);color:#fff}.reasons .section-head .eyebrow,.reasons .section-head>p{color:#999}.reason-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #333}.reason{min-height:13rem;padding:1.5rem 2rem;border-right:1px solid #333}.reason:last-child{border:0}.reason span{font-size:.72rem;color:#888}.reason h3{margin:3.5rem 0 .7rem;font-size:1.25rem;font-weight:500}.reason p{max-width:22rem;margin:0;color:#aaa;font-size:.86rem;line-height:1.55}
.contact{background:rgba(255,255,255,.88)}.contact-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1.25rem}.contact-info{grid-column:1/5}.contact-info h2{margin:0 0 1.3rem;font-size:clamp(2.2rem,3.5vw,3.4rem);font-weight:500;line-height:1.1;letter-spacing:-.045em}.contact-info>p{max-width:28rem;margin:0 0 3rem;color:var(--muted);line-height:1.55}.contact-details{padding-top:1.5rem;border-top:1px solid var(--line)}.contact-details span{display:block;margin-bottom:.5rem;font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.contact-details a{display:block;width:max-content;margin-bottom:1.5rem;font-size:1.05rem;border-bottom:1px solid}.contact-form{grid-column:7/13;display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.field{display:flex;flex-direction:column;gap:.6rem}.field--wide{grid-column:1/-1}.field label{font-size:.78rem;font-weight:500}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:0;background:rgba(255,255,255,.92);padding:.8rem;color:var(--text);outline:0}.field textarea{min-height:9rem;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--text)}.contact-form .button{grid-column:1/-1;justify-self:start;border:0;cursor:pointer}.contact-form .button:disabled{cursor:wait;opacity:.65}.form-status{grid-column:1/-1;min-height:1.4em;margin:0;font-size:.85rem;line-height:1.4}.form-status[data-state="success"]{color:#217a3c}.form-status[data-state="error"]{color:#a12626}
.site-footer{background:var(--black);color:#fff;padding:3rem 0}.footer-main{display:grid;grid-template-columns:1fr 1.4fr .6fr;align-items:start;gap:3rem;padding-bottom:4.5rem}.footer-brand p{max-width:17rem;margin:1rem 0 0;color:#aaa;font-size:.82rem;line-height:1.5}.footer-email{width:max-content;font-size:clamp(1.25rem,1.9vw,1.8rem);letter-spacing:-.035em;border-bottom:1px solid #777;padding-bottom:.35rem}.footer-social{justify-self:end;display:flex;align-items:center;gap:.65rem;padding-right:.75rem}.footer-social a{width:2.5rem;height:2.5rem;display:grid;place-items:center;border:1px solid #444;border-radius:50%;color:#bbb;transition:color .2s,border-color .2s,background .2s}.footer-social a:hover{color:#111;border-color:#fff;background:#fff}.footer-social svg{width:1.05rem;height:1.05rem;fill:currentColor}.footer-bottom{display:grid;grid-template-columns:1fr 1fr auto;gap:2rem;padding-top:1.5rem;border-top:1px solid #3d3d3d;color:#999;font-size:.75rem}.footer-bottom span:nth-child(2){text-align:center}
.fade{opacity:1;transform:none;transition:opacity .3s,transform .3s}.fade.visible{opacity:1;transform:none}
/* Softer spatial system: every section rests above the fixed veil. */
.site-header{inset:50% auto auto 1rem;width:3.75rem;height:3.75rem;transform:translateY(-50%);border:1px solid rgba(255,255,255,.1);border-radius:50%;box-shadow:0 12px 40px rgba(10,10,10,.12);overflow:hidden;transition:width .35s cubic-bezier(.22,.61,.36,1),height .35s cubic-bezier(.22,.61,.36,1),border-radius .3s ease}
.site-header::after{content:"";position:absolute;left:50%;top:50%;width:1.35rem;height:1px;background:#f2f0eb;box-shadow:0 -6px 0 #f2f0eb,0 6px 0 #f2f0eb;transform:translate(-50%,-50%);transition:opacity .18s .18s,visibility 0s .18s}
.site-header:hover,.site-header:focus-within,.site-header.open{width:16rem;height:29rem;border-radius:1.25rem}
.site-header:hover::after,.site-header:focus-within::after,.site-header.open::after{opacity:0;visibility:hidden;transition:opacity 0s,visibility 0s}
.header-inner{height:100%;min-width:16rem;padding:1.4rem;display:flex;flex-direction:column;align-items:stretch}
.site-header .logo{align-self:center;opacity:0;transform:translateX(-.5rem);transition:opacity .22s .08s,transform .22s .08s}
.site-header:hover .logo,.site-header:focus-within .logo,.site-header.open .logo{opacity:1;transform:none}
.nav-wrap{width:100%;flex:1;flex-direction:column;align-items:stretch;justify-content:center;gap:1.25rem;opacity:0;transform:translateX(-.5rem);transition:opacity .22s .08s,transform .22s .08s}
.site-header:hover .nav-wrap,.site-header:focus-within .nav-wrap,.site-header.open .nav-wrap{opacity:1;transform:none}
.site-nav{width:100%;flex-direction:column;gap:0;border-top:1px solid #333}.site-nav a{display:block;width:100%;padding:.9rem 0;border-bottom:1px solid #333;font-size:1rem;color:#ddd}.header-button{width:100%;margin-top:1rem}
main{padding-top:0}
.hero,.services,.work,.gaming,.process,.reasons,.contact{border-radius:1.25rem;box-shadow:0 16px 56px rgba(10,10,10,.07);overflow:hidden}
.hero,.services,.work,.gaming,.process,.reasons,.contact{width:min(calc(100% - 4rem),1280px);margin:1.5rem auto}
.services,.work,.gaming,.process,.reasons,.contact{padding-block:clamp(4.5rem,7vw,6.5rem)}
.hero{position:relative;margin-top:0;border-radius:0 0 1.25rem 1.25rem;background:#fff url("assets/blackveil-hero-background2.png") center/cover no-repeat;border:1px solid rgba(255,255,255,.9)}.hero::after{content:"";position:absolute;z-index:0;top:2rem;right:2rem;width:clamp(10rem,18vw,14rem);aspect-ratio:461/134;background:url("assets/check.png") center/contain no-repeat}.hero>*{position:relative;z-index:1}.hero h1{max-width:53rem}
.services{background:#fff}
.work{background:#fff}
.process{background:#fff}
.reasons{background:#111;color:#f5f5f3}
.contact{background:#fff}
.button{border-radius:999px;padding-inline:1.35rem;transition:background .3s ease,color .3s ease,transform .3s ease}.button:hover{transform:translateY(-1px)}
.service-grid,.process-grid,.reason-grid{border-radius:1rem;overflow:hidden}
.service,.step,.reason{transition:background .3s ease}.service:hover,.step:hover{background:rgba(245,245,243,.7)}.reason:hover{background:#171717}
.project-image{border-radius:1.25rem}.project-image img{transition:transform .4s ease,filter .4s ease}.project:hover .project-image img{transform:scale(1.01)}
.field input,.field select,.field textarea{border-radius:.75rem;padding:.95rem 1rem;transition:border-color .25s ease,background .25s ease}
.site-footer{margin-top:1rem;border-radius:1.75rem 1.75rem 0 0;padding-top:4rem;background:#111}
@media(max-width:900px){.site-header{inset:.65rem .65rem auto;width:auto;height:auto;border-radius:1rem;transform:none;overflow:hidden}.site-header::after{display:none}.site-header:hover,.site-header:focus-within,.site-header.open{width:auto;height:auto;border-radius:1rem}.header-inner{height:4rem;min-width:0;padding:0 1rem;flex-direction:row;align-items:center}.site-header .logo,.site-header:hover .logo,.site-header:focus-within .logo,.site-header.open .logo{opacity:1;transform:none}.nav-wrap,.site-header:hover .nav-wrap,.site-header:focus-within .nav-wrap,.site-header.open .nav-wrap{width:auto;flex:none;flex-direction:row;align-items:center;opacity:1;transform:none}.site-nav,.header-button{display:none}.menu-button{display:block}.nav-wrap{gap:0}.site-header.open{height:calc(100svh - 1.3rem)}.site-header.open .header-inner{align-items:flex-start;padding-top:1rem}.site-header.open .site-nav{display:flex;position:absolute;left:var(--pad);top:25vh;flex-direction:column;gap:1rem}.site-header.open .site-nav a{font-size:2rem;color:#fff}.site-header.open .header-button{display:inline-flex;position:absolute;left:var(--pad);right:var(--pad);bottom:2rem;width:auto;margin:0}.site-header.open .menu-button span:first-child{transform:translateY(3.5px) rotate(45deg)}.site-header.open .menu-button span:last-child{transform:translateY(-3.5px) rotate(-45deg)}.hero-copy{grid-template-columns:1fr}.hero-copy p,.hero-actions{grid-column:1}.hero-actions{justify-content:flex-start}.section-head{grid-template-columns:1fr 2fr}.section-head .eyebrow{grid-column:1}.section-head h2{grid-column:2}.section-head>p{grid-column:2}.service-number{margin-bottom:2.5rem}.gaming-intro{grid-column:1/8}.gaming-list{grid-column:8/13}.process-grid{grid-template-columns:1fr 1fr}.step:nth-child(2){border-right:0}.step{border-bottom:1px solid var(--line)}.reason-grid{grid-template-columns:1fr}.reason{min-height:0;padding:2rem 1rem;border-right:0;border-bottom:1px solid #333}.reason h3{margin:2rem 0 .7rem}.contact-info{grid-column:1/6}.contact-form{grid-column:6/13}.footer-main{grid-template-columns:1fr 1fr}.footer-social{grid-column:2;grid-row:1;align-items:flex-end}.footer-email{grid-column:1/-1}.footer-bottom{grid-template-columns:1fr auto}.footer-bottom span:nth-child(2){display:none}}
@media(max-width:600px){body{background-size:auto 100%;background-position:65% center}.site-header{inset:.65rem .65rem auto;width:auto;transform:none}.header-inner{height:4rem}.logo img{width:8.25rem}main{padding-top:0}html{scroll-padding-top:5.3rem}.hero,.services,.work,.gaming,.process,.reasons,.contact{width:calc(100% - 1rem);margin:.5rem;border-radius:1.25rem}.hero{margin-top:0;padding:9.8rem var(--pad) 4.5rem;border-radius:0 0 1.25rem 1.25rem;background:#fff url("assets/blackveil-hero-background.jpg") 58% center/auto 100% no-repeat}.hero::after{display:none}.hero h1{font-size:2.5rem}.hero-actions{flex-direction:column}.hero-actions .button{width:100%}.section-head{grid-template-columns:1fr;gap:1rem}.section-head .eyebrow,.section-head h2,.section-head>p{grid-column:1}.section-head>p{margin-top:.5rem}.service-grid{grid-template-columns:1fr}.service,.service:first-child{padding:2rem 1rem;border-right:0;border-bottom:1px solid var(--line)}.service:last-child{border-bottom:0}.service>p{min-height:0}.project-grid{grid-template-columns:1fr;gap:2.5rem}.project-image{border-radius:1rem}.gaming{background-position:62% center}.gaming-layout{grid-template-columns:1fr;gap:3rem}.gaming-intro,.gaming-list{grid-column:1}.gaming-intro{padding:1rem;border-radius:1rem;background:#fff}.gaming-intro h2{font-size:2.35rem}.gaming-intro .button{width:100%}.process-grid{grid-template-columns:1fr}.step,.step:first-child{min-height:0;padding:1.5rem 1rem;border-right:0}.step h3{margin:3rem 0 .7rem}.contact-grid{grid-template-columns:1fr;gap:4rem}.contact-info,.contact-form{grid-column:1}.contact-form{grid-template-columns:1fr}.field--wide,.contact-form .button{grid-column:1}.footer-main{grid-template-columns:1fr;gap:2.5rem}.footer-social{grid-column:1;grid-row:auto;justify-self:start;align-items:flex-start}.footer-email{grid-column:1;font-size:1.15rem}.footer-bottom{align-items:flex-start;gap:2rem}.footer-bottom span:last-child{text-align:right}.site-footer{margin-top:.5rem;border-radius:1.25rem 1.25rem 0 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.fade{opacity:1;transform:none;transition:none}.project-image img{transition:none}}
.captcha-field{min-height:78px;overflow:hidden}.form-privacy{grid-column:1/-1;margin:-.75rem 0 0;color:var(--muted);font-size:.75rem;line-height:1.5}.form-privacy a,.footer-policy{text-decoration:underline;text-underline-offset:.2em}
.legal-body{background:#e7e5df;background-image:none}.legal-header{padding:1.25rem var(--pad);background:#111;color:#fff}.legal-header .container{display:flex;align-items:center;justify-content:space-between;padding:0}.legal-header .logo img{width:9.25rem}.legal-back{font-size:.82rem;border-bottom:1px solid #777;padding-bottom:.2rem}.legal-page{width:min(calc(100% - 2rem),900px);min-width:0;margin:1rem auto;padding:clamp(2rem,6vw,5rem);border-radius:1.25rem;background:#fff;overflow-wrap:anywhere}.legal-page h1{margin:0 0 1rem;font-size:clamp(2.5rem,6vw,4.75rem);font-weight:500;line-height:1;letter-spacing:-.05em}.legal-updated{margin:0 0 4rem;color:var(--muted);font-size:.8rem}.legal-page section{min-width:0;padding:2rem 0;border-top:1px solid var(--line)}.legal-page h2{margin:0 0 1rem;font-size:1.3rem;font-weight:500}.legal-page p,.legal-page li{color:#444;line-height:1.7}.legal-page ul{padding-left:1.2rem}.legal-page a{text-decoration:underline;text-underline-offset:.2em}.legal-footer{padding:2rem var(--pad);background:#111;color:#aaa;text-align:center;font-size:.75rem}
@media(max-width:600px){.legal-header .logo img{width:8rem}.legal-page{padding:2rem 1.25rem}.legal-page h1{font-size:2.6rem}.legal-updated{margin-bottom:3rem}}
@media(max-width:360px){.captcha-field{min-height:69px}.g-recaptcha{transform:scale(.88);transform-origin:left top}}
