/* Layout for new business content; typography, colors and motion reuse styles.css. */
.hero-description{max-width:440px}
.hero-actions{flex-wrap:wrap}
.sample-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 28px}
.sample-card{display:block}
.sample-visual{height:auto;aspect-ratio:10/7;background:var(--panel);border:1px solid var(--line)}
.sample-visual img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .65s}
.sample-card:hover img{transform:scale(1.025)}
.sample-card .project-info p{max-width:440px;font-size:14px}
.sample-link{display:inline-block;font-size:12px;color:var(--lime);margin-top:15px}
.services{padding-top:35px}
.service-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 55px}
.service-row{display:flex;gap:22px;border-top:1px solid var(--line);padding:28px 0}
.service-row>span{font:11px monospace;color:var(--lime);padding-top:6px}
.service-row h3{font-size:23px;font-weight:400;line-height:1.35;letter-spacing:-.6px}
.service-row p{font-size:14px;color:var(--muted);line-height:1.9;margin-top:12px;max-width:440px}
.other-work{padding-top:45px;padding-bottom:65px}
.other-work .project-visual{height:255px}
.other-work .erp-window,.other-work .crypto-window{top:65px}
.other-work .phone{width:90px;height:185px;top:40px}
.other-work .visual-word{font-size:28px}
.other-work .project-info h3{font-size:20px}
.other-work .tags{margin-top:13px}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:9%;padding-top:45px}
.contact h2{font-size:clamp(35px,3.8vw,56px);font-weight:400;letter-spacing:-2px;line-height:1.15;margin:23px 0}
.contact-copy>p:not(.eyebrow){font-size:14px;color:var(--muted);line-height:1.9;max-width:430px}
.contact-email{display:inline-block;color:var(--lime);font-size:20px;letter-spacing:-.6px;margin:27px 0 18px;overflow-wrap:anywhere}
.contact-location{margin-bottom:18px}
.contact-phone small{display:block;font-size:12px;margin-top:5px}
.contact-form{padding:28px;background:var(--panel);border:1px solid var(--line);border-radius:6px;min-width:0}
.contact-note{font-size:12px;line-height:1.8;color:var(--muted);margin-bottom:23px}
.contact-form label{display:block;font-size:13px;margin-bottom:19px;line-height:1.7}
.contact-form input,.contact-form textarea{display:block;width:100%;min-width:0;font:16px/1.6 var(--font);color:var(--text);border:1px solid #535a45;background:var(--bg);border-radius:4px;padding:11px 12px;margin-top:6px}
.contact-form textarea{resize:vertical}
.contact-form textarea:focus-visible{outline:2px solid var(--lime);outline-offset:6px}
.contact-form .button{border:0}
#contact-status{font-size:13px;line-height:1.8;margin-top:18px;color:var(--muted);overflow-wrap:anywhere}
#contact-status:empty{margin-top:0}
#contact-status a{text-decoration:underline;color:var(--lime)}
@media(max-width:1100px){.other-work .project-visual{height:230px}.other-work .phone-back{left:16%}.other-work .phone-front{left:48%}}
@media(max-width:760px){
 nav{gap:15px;font-size:11px}
 nav a:first-child{display:inline}
 .site-header{height:80px}
 .hero h1{font-size:clamp(43px,11.5vw,68px);letter-spacing:-2.7px}
 .hero h1 em{letter-spacing:-2.7px}
 .hero-actions{gap:22px}
 .hero-description{max-width:335px}
 .sample-grid,.service-list{grid-template-columns:1fr;gap:35px}
 .service-list{gap:0}
 .services,.other-work{padding-top:15px}
 .service-row{padding:25px 0;gap:18px}
 .service-row h3{font-size:22px}
 .sample-card .project-info h3{font-size:22px}
 .other-work .project-visual{height:245px}
 .other-work .phone{width:100px;height:205px;top:30px}
 .other-work .phone-back{left:25%}.other-work .phone-front{left:51%}
 .contact{grid-template-columns:1fr;gap:32px;padding-top:15px}
 .contact h2{font-size:36px}
 .contact-form{padding:23px}
 footer>span{font-size:11px;line-height:1.8}
}
@media(max-width:380px){.brand{font-size:18px;letter-spacing:-.7px}nav{gap:10px;font-size:10px}.hero h1{font-size:43px}.hero-actions{gap:18px}.contact-email{font-size:19px}}

.footer-contact{display:flex;flex-direction:column;gap:7px;font-size:11px;line-height:1.7}.footer-contact a{color:var(--text)}

/* Preserve the complete supplied logo, including its integrated wordmark. */
.brand-logo{display:block;width:52px;height:52px;padding:0;object-fit:contain;background:#000;border-radius:10px;flex-shrink:0}
.footer-brand{display:inline-flex;align-items:center;gap:8px}
.footer-brand .brand-logo{width:42px;height:42px;padding:0}
.side-wordmark{position:fixed;left:17px;top:50%;writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg);font-size:11px;font-weight:bold;letter-spacing:4px;color:var(--muted);z-index:9;padding:12px 5px}
.side-wordmark:hover{color:var(--lime)}
@media(max-width:1100px){.side-wordmark{display:none}}
@media(max-width:760px){.brand{font-size:18px;letter-spacing:-.8px;gap:7px}.brand .brand-logo{width:35px;height:35px;padding:0}}
@media(max-width:380px){.brand{font-size:16px;gap:5px}.brand .brand-logo{width:30px;height:30px;padding:0}}

.logo-trigger{display:block;border:0;padding:0;background:transparent;border-radius:10px;cursor:zoom-in;color:inherit;flex-shrink:0}
.logo-preview{display:block;position:fixed;z-index:100;width:min(330px,calc(100vw - 32px),calc(100svh - 32px));height:auto;aspect-ratio:1;max-height:calc(100svh - 32px);object-fit:contain;padding:0;border:0;background:transparent;border-radius:0;box-shadow:none}
.logo-preview[hidden]{display:none}

.wordmark-text{white-space:nowrap}.wordmark-art,.wordmark-gine{font-weight:600}.wordmark-int{font-weight:400;color:var(--lime)}
