:root{--bg:#030405;--white:#f7f7f7;--muted:#aaa;--line:#2a2a2a;--c:#00a9d6;--m:#dc0871;--y:#f2e600}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--white);font-family:Avenir,'Avenir Next',Montserrat,Arial,sans-serif;font-weight:300}a{color:inherit;text-decoration:none}header{height:92px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 5%;position:sticky;top:0;background:rgba(3,4,5,.95);z-index:5}.mark img{width:210px;max-height:58px;object-fit:contain;object-position:left center}nav{display:flex;gap:44px;font-weight:800;font-size:14px}nav a:hover{color:var(--c)}.hero{min-height:570px;display:grid;grid-template-columns:1fr 1fr;align-items:center;border-bottom:1px solid var(--line);padding:40px 6%}.main-logo{width:min(430px,90%)}.tag{font-weight:800;letter-spacing:.5px;font-size:22px;margin:18px 0 32px}.tag b{color:var(--m)}.hero-image img{width:100%;max-width:590px;display:block;margin:auto}.button{display:inline-block;border:1px solid #eee;padding:16px 36px;font-weight:800;position:relative;background:linear-gradient(90deg,var(--c),var(--m),var(--y)) bottom/100% 3px no-repeat;cursor:pointer;color:white}.button:hover{background-color:#111}.intro{text-align:center;padding:55px 20px 30px}.intro h1,.project-intro h1{font-size:38px;line-height:1.05;margin:0 0 22px;font-weight:800}.intro p{max-width:650px;margin:auto;color:#ddd;font-size:18px;line-height:1.6}.services{display:grid;grid-template-columns:1fr 1fr;max-width:980px;margin:auto;padding:25px 20px 65px}.services article{display:flex;gap:28px;padding:20px 45px}.services article+article{border-left:1px solid var(--line)}h2{font-weight:800}.services p{color:#ccc;line-height:1.5}.icon{width:94px;height:94px;min-width:94px;border:2px solid;border-radius:50%;display:grid;place-items:center;font-size:38px}.cyan{border-color:var(--c)}.magenta{border-color:var(--m)}.work{padding:40px 5% 55px;border-top:1px solid var(--line)}.section-head{display:flex;justify-content:space-between;align-items:end}.section-head h2{font-size:34px;margin:6px 0}.small{padding:12px 26px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:20px}.tile{height:220px;display:flex;align-items:end;justify-content:center;padding:16px;background:#101113 center/cover;border:1px solid #171717;font-weight:800}.branding{background-image:linear-gradient(135deg,#171717,#050505)}.print{background-image:radial-gradient(circle at 70% 30%,#333,#090909 55%)}.web{background-image:linear-gradient(145deg,#07131b,#090909)}.social{background-image:linear-gradient(160deg,#1d1d1d,#070707)}.contact{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:1.2fr 1fr 1.2fr auto;gap:35px;align-items:center;padding:38px 5%}.contact h2{font-size:34px;margin:0}.contact p{line-height:1.6}.details{display:grid;gap:9px}.details a:hover{color:var(--c)}footer{padding:25px 5%;display:flex;justify-content:space-between;align-items:center;color:#bbb;font-size:13px}footer img{width:180px}.project-page{max-width:1050px;margin:auto;padding:75px 30px}.project-intro{max-width:680px;margin-bottom:50px}.project-intro h1{font-size:62px}.project-intro p{font-size:18px;color:#ccc;line-height:1.6}.eyebrow{font-weight:800!important;color:var(--c)!important;letter-spacing:2px}form{display:grid;grid-template-columns:1fr 1fr;gap:28px 32px}label{font-weight:800;font-size:13px;letter-spacing:.7px}label em{font-weight:300;color:#777;font-style:normal}input,select,textarea{width:100%;margin-top:9px;background:#08090a;border:1px solid #3a3a3a;color:white;padding:15px;font:inherit;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--c)}.wide{grid-column:1/-1}.submit{grid-column:1/-1;width:max-content;font:inherit}.form-note{color:#888;font-size:13px;margin-top:22px}@media(max-width:800px){header{height:auto;padding:18px 5%;align-items:flex-start}.mark img{width:150px}nav{gap:14px;font-size:11px;flex-wrap:wrap;justify-content:flex-end}.hero{grid-template-columns:1fr;padding-top:55px}.hero-image{margin-top:45px}.services,.grid{grid-template-columns:1fr}.services article+article{border-left:0;border-top:1px solid var(--line)}.contact{grid-template-columns:1fr}.project-intro h1{font-size:44px}form{grid-template-columns:1fr}.wide,.submit{grid-column:1}.grid .tile{height:180px}}

.header-tagline{color:#fff;text-decoration:none;font-weight:800;letter-spacing:.12em;font-size:clamp(.72rem,1.1vw,.95rem);white-space:nowrap;}
/* Keep the header phrase on one horizontal line */
.header-tagline{display:inline-block;width:auto;writing-mode:horizontal-tb;text-orientation:mixed;white-space:nowrap;transform:none;line-height:1;}
@media(max-width:800px){.header-tagline{font-size:11px;letter-spacing:.08em;white-space:nowrap;}}
/* Reference-mockup layout lock */
header{height:92px;padding:0 3.2%}.mark img{width:64px;height:64px;object-fit:contain}.hero{min-height:468px;grid-template-columns:46% 54%;padding:28px 5% 18px}.hero-copy{padding-left:2.5%}.main-logo{width:min(390px,92%)}.tag{font-size:20px;margin:12px 0 24px}.hero-image img{width:100%;max-width:540px}.intro{padding:30px 20px 18px}.intro h1{font-size:32px}.intro p{font-size:16px;max-width:600px}.services{padding:10px 20px 30px}.work{padding-top:28px;padding-bottom:28px}.grid{gap:8px}.tile{height:190px}.contact{padding-top:28px;padding-bottom:28px}footer{padding-top:20px;padding-bottom:20px}
@media(max-width:800px){.mark img{width:48px;height:48px}.hero{grid-template-columns:1fr;padding-top:40px}.hero-copy{padding-left:0}.main-logo{width:min(390px,95%)}}
/* Top-left brand statement supplied by Artistico Haus */
.top-value{display:flex;align-items:center;flex:0 0 auto}
.top-value img{display:block;width:clamp(230px,24vw,360px);height:auto}
@media(max-width:800px){.top-value img{width:180px}}

/* Option 1 approved master layout */
.top-value{font-weight:800;font-size:clamp(24px,3.1vw,44px);letter-spacing:-1.5px;white-space:nowrap;line-height:1;color:#fff}
.hero{grid-template-columns:44% 56%;padding:24px 4.5% 24px;min-height:500px}
.hero-copy{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0}
.main-logo{display:block;width:min(405px,94%);height:auto;mix-blend-mode:normal}
.hero-copy .button{margin-top:18px}
@media(max-width:800px){.top-value{font-size:20px;letter-spacing:-.5px}.hero{grid-template-columns:1fr}.main-logo{width:min(430px,96%)}}
/* Branding portfolio image supplied by Artistico Haus */
.tile.branding{background-image:url('assets/logo-samples.png');background-size:cover;background-position:center;background-repeat:no-repeat;color:#fff;text-shadow:0 1px 4px #000}

.portfolio-page{max-width:1200px;margin:auto;padding:70px 5%}.portfolio-intro{text-align:center;margin-bottom:36px}.portfolio-intro small{font-weight:800;letter-spacing:2px}.portfolio-intro h1{font-size:48px;margin:8px 0}.portfolio-intro p{color:#bbb}.branding-sheet{background:#fff}.branding-sheet img{display:block;width:100%;height:auto} .top-value{font-size:22px;font-weight:800;white-space:nowrap}@media(max-width:800px){.top-value{font-size:14px}.portfolio-page{padding:40px 4%}.portfolio-intro h1{font-size:36px}}

/* Web design portfolio image supplied by Artistico Haus */
.portfolio-subhead{margin-top:70px}.webdesign-sheet{background:#fff}.webdesign-sheet img{display:block;width:100%;height:auto}

/* Portfolio sheets supplied by Artistico Haus */
.portfolio-page{max-width:1400px;margin:auto}.portfolio-intro{padding:58px 5% 22px}.portfolio-intro h1{font-size:42px;margin:6px 0 12px}.portfolio-intro p{max-width:900px;color:#ccc;line-height:1.65;font-size:17px}.portfolio-subhead{border-top:1px solid var(--line);margin-top:42px}.branding-sheet,.webdesign-sheet,.printdesign-sheet,.pattern-sheet{padding:0 5% 55px}.branding-sheet img,.webdesign-sheet img,.printdesign-sheet img,.pattern-sheet img{display:block;width:100%;height:auto;background:white}.printdesign-sheet{display:grid;gap:28px}.pattern-sheet img{max-width:1200px;margin:auto}.tile.social{background-image:linear-gradient(145deg,#151515,#050505)}

/* Locked portfolio structure: each category is a separate page. */
.tile.print{background-image:linear-gradient(rgba(0,0,0,.12),rgba(0,0,0,.28)),url('assets/print-samples.jpg');background-size:cover;background-position:center}
.tile.web{background-image:linear-gradient(rgba(0,0,0,.12),rgba(0,0,0,.28)),url('assets/website.jpg');background-size:cover;background-position:center}
.tile.social{background-image:linear-gradient(rgba(0,0,0,.12),rgba(0,0,0,.28)),url('assets/digital-apparel-patterns.jpg');background-size:cover;background-position:center}
.tile span{background:rgba(0,0,0,.72);padding:7px 11px;text-shadow:none}
.single-art-sheet{padding:0 5% 55px;text-align:center}.single-art-sheet img{display:block;width:auto;max-width:100%;height:auto;margin:0 auto;background:#fff;image-rendering:auto}
/* Never upscale portfolio art past its original pixel width on large screens. */
.webdesign-sheet img,.single-art-sheet img[src$="website.jpg"]{max-width:1126px}
.pattern-original img{max-width:2048px}
.printdesign-sheet img:first-child{max-width:1987px;margin-left:auto;margin-right:auto}.printdesign-sheet img:nth-child(2){max-width:1362px;margin-left:auto;margin-right:auto}
.work-category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:0 5% 70px}.work-category{min-height:330px;display:flex;align-items:end;justify-content:center;padding:22px;background-position:center;background-size:cover;border:1px solid #222;font-weight:800;font-size:22px}.work-category span{background:rgba(0,0,0,.75);padding:10px 16px}.work-category.branding{background-image:url('assets/logos-page.jpg')}.work-category.print{background-image:url('assets/print-samples.jpg')}.work-category.web{background-image:url('assets/website.jpg')}.work-category.pattern{background-image:url('assets/digital-apparel-patterns.jpg')}@media(max-width:800px){.work-category-grid{grid-template-columns:1fr}.work-category{min-height:220px}}

