/* Fonts are loaded via in for faster first paint. */ :root{color-scheme:dark;--bg:#000000;--text:#f5f5f3;--muted:#a3a5ad;--gold:#f6ca72;--line:#26272d}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:40px}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible{outline:2px solid var(--gold);outline-offset:6px}.wrap{width:min(1280px,88%);margin:auto}.header{height:104px;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:40px}.wordmark{font-family:'Barlow Condensed',Impact,sans-serif;font-size:30px;font-style:italic;font-weight:800;letter-spacing:-1px;line-height:1}.wordmark span{color:var(--gold);margin-left:4px}.wordmark i{font:10px 'DM Sans',sans-serif;vertical-align:top;margin-left:5px}nav{display:flex;gap:34px;margin-left:auto;font-size:14px;color:#c4c4ca}nav a:hover{color:var(--gold)}.nav-quote{font-size:14px;border:1px solid #4c4536;padding:10px 18px;border-radius:6px}.nav-quote span{margin-left:24px;color:var(--gold)}.hero{min-height:740px;display:grid;grid-template-columns:1.05fr 1fr;align-items:center;position:relative;padding-top:68px}.eyebrow{display:flex;align-items:center;gap:12px;font-size:12px;font-weight:600;letter-spacing:2.1px;color:var(--gold)}.line{height:1px;width:28px;background:var(--gold)}h1,h2,h3,p{margin:0}h1{font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(80px,8.8vw,132px);line-height:.96;font-weight:700;letter-spacing:-2.5px;margin:25px 0 28px}em{font-style:normal;color:var(--gold)}h1 em{background:linear-gradient(110deg,#fff0c4,#f9ce77 60%,#bd8131);background-clip:text;color:transparent}.intro{color:#afb0b8;line-height:1.85;font-size:17px}.button{display:inline-flex;align-items:center;justify-content:center;gap:38px;background:linear-gradient(110deg,#ffdfa1,#eabc66);color:#17130c;padding:17px 23px;border-radius:5px;font-size:15px;font-weight:700;margin-top:31px;box-shadow:0 3px 0 #956a29;transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-3px);box-shadow:0 6px 26px #eabc6625}.button span{font-size:22px;line-height:1}.small-note{font-size:12px;letter-spacing:.3px;color:#747780;margin-top:17px}.hero-art{position:relative;align-self:stretch;display:flex;align-items:center;justify-content:center;isolation:isolate;min-width:0;background:radial-gradient(ellipse at 60% 52%,#14385b24,transparent 66%)}.logo-frame{position:relative;width:110%;aspect-ratio:1.7;overflow:hidden;flex-shrink:0;mix-blend-mode:screen;z-index:2;transform:rotate(-3deg)}.logo-frame img{position:absolute;width:125%;max-width:none;left:-12%;top:-155%;height:auto}.orbit{position:absolute;border:1px solid #29446040;border-radius:50%;height:80%;width:80%;transform:rotate(29deg);z-index:-1}.orbit-two{width:105%;height:60%;transform:rotate(-29deg);border-color:#b68a3920}.hero-art:after{content:'';position:absolute;width:5px;height:5px;border-radius:50%;background:#89cfff;box-shadow:0 0 22px 5px #367fde;top:28%;right:15%}.art-caption{position:absolute;bottom:8%;left:10%;right:4%;display:flex;justify-content:space-between;gap:12px;font-size:10px;letter-spacing:1.5px;color:#686e7c}.hero-bottom{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;padding:55px 0 27px;color:#787b84;font-size:11px;letter-spacing:1.2px}.hero-bottom a{font-size:12px;letter-spacing:0}.hero-bottom a span{margin-left:20px;color:var(--gold)}.platforms{border-block:1px solid var(--line);background:#0d0e11}.platforms .wrap{display:flex;align-items:center;justify-content:space-between;gap:25px;min-height:100px}.platforms span{font-size:10px;letter-spacing:1.7px;color:#787b84}.platforms strong{font-size:17px;font-weight:500;color:#c6c7cc}.platforms i{font-style:normal;color:#735d36;font-size:12px}.services{padding-block:105px}.section-top{display:flex;align-items:end;justify-content:space-between;gap:60px;margin-bottom:46px}h2{font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(42px,4.5vw,62px);font-weight:600;letter-spacing:-.7px;line-height:1.06;margin-top:20px}h2 span{color:#858791}.section-top>p{max-width:350px;color:var(--muted);font-size:15px;line-height:1.85}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.service{background:linear-gradient(130deg,#15161b,#0c0d10);border:1px solid var(--line);border-radius:8px;padding:29px;transition:border-color .25s,transform .25s}.service:hover{border-color:#8c713f;transform:translateY(-5px)}.card-top{display:flex;align-items:center;justify-content:space-between;color:#666b76;font-size:12px;margin-bottom:47px}.icon{color:var(--gold);font-size:32px;line-height:1;font-weight:400}.service:nth-child(2) .icon{color:#83baf1}.service:nth-child(3) .icon{color:#ef6c70}h3{font-size:21px;font-weight:500;letter-spacing:-.5px}.service p{font-size:14px;line-height:1.85;color:var(--muted);margin:15px 0 26px}.tags{display:flex;flex-wrap:wrap;gap:7px}.tags span{font-size:11px;color:#a0a2ab;border:1px solid #2b2c34;border-radius:4px;padding:4px 8px}.approach{border-top:1px solid var(--line);padding-block:85px 110px;display:grid;grid-template-columns:1fr 1fr;gap:80px}.approach>div>p{color:var(--muted);margin-top:25px}.steps article{display:flex;gap:25px;padding:25px 0;border-bottom:1px solid var(--line)}.steps article:first-child{padding-top:0}.steps article>span{color:var(--gold);font-size:12px;padding-top:4px}.steps h3{font-size:18px}.steps p{font-size:14px;line-height:1.85;color:var(--muted);margin-top:8px}.contact{position:relative;overflow:hidden;border:1px solid #524328;border-radius:9px;padding:65px;background:radial-gradient(ellipse at 90% 100%,#8c5f2022,transparent 60%),#111114}.contact h2{font-size:clamp(52px,6vw,82px);position:relative;z-index:1}.contact>p{margin-top:22px;color:var(--muted);font-size:15px}.contact .button{position:relative;z-index:1}.contact-stamp{position:absolute;right:3%;bottom:-90px;color:#efbd6010;font-family:'Barlow Condensed',Impact,sans-serif;font-size:350px;font-weight:800;font-style:italic;letter-spacing:-45px;transform:rotate(-9deg);pointer-events:none}.contact-stamp span{color:#edc47f0a}.contact-status{position:relative;z-index:1}footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:39px}footer .wordmark{font-size:24px}footer p,footer>span{font-size:11px;color:#747680}@media(min-width:1500px){.hero{min-height:790px}}@media(max-width:900px){.hero{min-height:660px}.hero h1{font-size:94px}.hero-art{min-height:330px}.platforms .wrap{gap:15px}.platforms span{display:none}.service{padding:22px}.service-grid{gap:12px}.approach{gap:40px}.art-caption{display:none}}@media(max-width:650px){.wrap{width:88%}.header{height:82px;gap:20px}.wordmark{font-size:27px}nav{display:none}.nav-quote{margin-left:auto;padding:8px 13px}.hero{padding-top:42px;grid-template-columns:1fr}.hero h1{font-size:clamp(80px,16vw,108px);letter-spacing:-1.5px}.eyebrow{font-size:10px;letter-spacing:1.6px}.intro{font-size:15px}.hero-art{min-height:290px;margin-top:14px}.logo-frame{width:95%}.orbit-one{height:85%;width:70%}.orbit-two{height:66%;width:95%}.hero-bottom{padding:12px 0 23px}.hero-bottom>span{max-width:150px;font-size:9px}.hero-bottom a{font-size:11px}.platforms .wrap{flex-wrap:wrap;justify-content:center;gap:13px 18px;padding-block:20px;min-height:90px}.platforms strong{font-size:14px}.platforms i{font-size:9px}.services{padding-block:62px}.section-top{display:block;margin-bottom:28px}.section-top>p{margin-top:22px;font-size:14px;max-width:none}.service-grid{grid-template-columns:1fr}.card-top{margin-bottom:22px}.service{padding:25px}.service p{font-size:15px}.tags span{font-size:12px}.approach{grid-template-columns:1fr;padding-block:55px 65px;gap:35px}.contact{padding:34px 25px}.contact h2{font-size:52px}.contact-stamp{font-size:260px;right:-45px;bottom:-70px}.contact .button{gap:25px}footer{flex-wrap:wrap;padding-block:28px;gap:18px}footer p{order:3;width:100%;font-size:12px}footer>span{margin-left:auto}.hero-art:after{top:23%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}} .quote-form{position:relative;z-index:2;max-width:740px;margin-top:35px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.quote-form label{display:block;font-size:14px;color:#d5d5d9;margin-top:17px}.quote-form input,.quote-form textarea,.quote-form select{display:block;width:100%;margin-top:8px;padding:14px 15px;border-radius:5px;border:1px solid #3b3a3d;background:#0b0c10;color:var(--text);font:16px 'DM Sans',sans-serif}.quote-form textarea{resize:vertical;min-height:130px}.quote-form input:focus,.quote-form textarea:focus,.quote-form select:focus{outline:2px solid var(--gold);outline-offset:2px}.quote-form .button{border:0;cursor:pointer;font-family:inherit;margin-top:23px}.form-note{font-size:12px;color:#96969f;margin-top:17px}.honey{display:none!important}@media(max-width:650px){.form-row{grid-template-columns:1fr;gap:0}} .service{display:flex;flex-direction:column}.service .tags{margin-top:auto}.platforms .wrap{gap:15px}.platforms strong{white-space:nowrap}.platforms span{max-width:100px}.service:nth-child(4) .icon{color:#dc9bea}.service:nth-child(5) .icon{color:#99bddd}.service:nth-child(6) .icon{color:#b2d4ad}@media(min-width:651px) and (max-width:900px){.service-grid{grid-template-columns:repeat(2,1fr)}.platforms .wrap{flex-wrap:wrap;justify-content:center;padding-block:20px}} .wordmark{display:block}.brand-logo{display:block;width:104px;height:70px;object-fit:contain}.logo-frame{width:105%;aspect-ratio:1.5;overflow:visible;mix-blend-mode:normal;transform:rotate(-3deg)}.logo-frame img{position:static;width:100%;height:auto;max-width:100%;filter:drop-shadow(0 20px 35px #0009)}.contact-stamp{width:360px;height:auto;right:30px;top:52px;bottom:auto;opacity:.16;letter-spacing:normal;transform:rotate(-9deg)}footer .brand-logo{width:88px;height:60px}@media(max-width:650px){.brand-logo{width:82px;height:56px}.logo-frame{width:96%}.contact-stamp{width:200px;right:-25px;top:110px;opacity:.1}} /* Polished red and gold carry the metallic App Man identity across the page. */ :root{--gold:#ffce68;--red:#ef1828;--metal-gold:linear-gradient(174deg,#fff6cc 0%,#ffdf7d 19%,#bd771e 42%,#ffeaa0 49%,#fff3c2 54%,#e5a637 67%,#915019 100%);--metal-red:linear-gradient(172deg,#ffb9b9 0%,#ff3a45 20%,#eb0717 42%,#ff6570 49%,#f52633 55%,#a5000c 78%,#60010a 100%)} h1 em,.contact h2 em{background:var(--metal-gold);background-clip:text;-webkit-background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 #6e4515)}h2 span{background:var(--metal-gold);background-clip:text;-webkit-background-clip:text;color:transparent}.button{background:linear-gradient(176deg,#fff0b9 0%,#ffdb78 23%,#c99134 46%,#ffe6a0 50%,#f5c25b 61%,#dda33d 100%);border:1px solid #ffe8a9!important;box-shadow:inset 0 1px 0 #fff8d9,0 3px 0 #754713,0 8px 28px #e7aa3615;text-shadow:0 1px 0 #fff3bd80}.button:hover{box-shadow:inset 0 1px 0 #fff8d9,0 5px 0 #754713,0 10px 34px #e7aa3630}.nav-quote{background:linear-gradient(175deg,#fa4250,#cb0917 46%,#ec2634 51%,#780510);border-color:#ff7d7f;box-shadow:inset 0 1px 0 #ffafb280,0 2px 0 #4f0008}.nav-quote span{color:#ffe598}.service{position:relative;overflow:hidden;border-color:#5a442a;background:linear-gradient(135deg,#251a0e 0%,#101012 30%,#070708 100%);box-shadow:inset 0 1px 0 #ffdc8620}.service:before{content:'';position:absolute;left:24px;right:24px;top:0;height:3px;background:var(--metal-gold);box-shadow:0 0 15px #f2b74130}.service:nth-child(even){border-color:#562329;background:linear-gradient(135deg,#290c10 0%,#111013 30%,#070708 100%)}.service:nth-child(even):before{background:var(--metal-red);box-shadow:0 0 15px #f0193330}.service .icon{color:#ffcf70!important;text-shadow:0 1px 0 #805015,0 0 18px #eab94a33}.service:nth-child(even) .icon{color:#ff4d58!important;text-shadow:0 1px 0 #78040b,0 0 18px #ee143233}.service h3{color:#ffdb87}.service:nth-child(even) h3{color:#ff858b}.service:hover{border-color:#ffcf70}.service:nth-child(even):hover{border-color:#fb5360}.platforms{background:#080506;border-top-color:#742129;border-bottom-color:#59401f}.platforms strong{background:var(--metal-gold);background-clip:text;-webkit-background-clip:text;color:transparent}.platforms i{color:#ec3340}.contact{border-color:#a47935;box-shadow:inset 0 1px 0 #ffe49b38;background:radial-gradient(ellipse at 100% 0%,#9d0b202a,transparent 55%),radial-gradient(ellipse at 0% 100%,#a56a2022,transparent 60%),#080808}.quote-form input,.quote-form textarea,.quote-form select{border-color:#58442b;background:#080808}.steps article>span{color:#ffcf70}.steps article:nth-child(2)>span{color:#ff5c67}.header{border-bottom-color:#5f3626}.line{background:var(--metal-red);height:3px}footer{border-top:1px solid #5b341f;margin-top:35px} .marketing-guidance{display:flex;align-items:center;gap:24px;margin-top:24px;padding:26px 29px;border:1px solid #755028;border-radius:8px;background:linear-gradient(105deg,#241707,#080808 75%)}.guidance-symbol{font-size:30px;color:#ffd779}.marketing-guidance h3{color:#ffe09b;font-size:21px}.marketing-guidance p{font-size:14px;color:#b8b4ac;margin-top:7px;max-width:700px}.guidance-label{margin-left:auto;font-size:11px;letter-spacing:1.5px;white-space:nowrap;color:#ffd779}.contact .included-guidance{font-size:14px;color:#ffda86;margin-top:14px}@media(max-width:650px){.marketing-guidance{flex-wrap:wrap;padding:24px;gap:14px}.marketing-guidance>div{flex:1;min-width:200px}.guidance-label{margin-left:0}.marketing-guidance p{font-size:15px}} /* White and polished gold interface; the supplied brand mark retains its colors. */ .nav-quote{color:#17130c;background:linear-gradient(176deg,#fff0b9 0%,#ffdb78 23%,#c99134 46%,#ffe6a0 50%,#f5c25b 61%,#dda33d 100%);border-color:#ffe8a9;box-shadow:inset 0 1px 0 #fff8d9,0 2px 0 #754713}.nav-quote span{color:#32210b}.service,.service:nth-child(even){border-color:#5a442a;background:linear-gradient(135deg,#20190d 0%,#101012 30%,#070708 100%)}.service:before,.service:nth-child(even):before{background:var(--metal-gold);box-shadow:0 0 15px #f2b74130}.service .icon,.service:nth-child(even) .icon{color:#ffcf70!important;text-shadow:0 1px 0 #805015,0 0 18px #eab94a33}.service h3,.service:nth-child(even) h3{color:#f8f7f2}.service:hover,.service:nth-child(even):hover{border-color:#ffcf70}.platforms{background:#070707;border-top-color:#59401f;border-bottom-color:#59401f}.platforms i{color:#d9b66b}.contact{background:radial-gradient(ellipse at 100% 0%,#a56a201a,transparent 55%),radial-gradient(ellipse at 0% 100%,#a56a2022,transparent 60%),#080808}.steps article:nth-child(2)>span{color:#ffcf70}.header{border-bottom-color:#59462c}.line{background:var(--metal-gold)}footer{border-top-color:#59462c} /* Near-black service tiles, subtly lifted from the pure black page. */ .service,.service:nth-child(even){background:#0a0a0a;border-color:#322b1e;box-shadow:inset 0 1px 0 #ffdc860d}.service:hover,.service:nth-child(even):hover{border-color:#927341} /* Final surface palette: black page, barely lifted black panels. */ html,body{background:#000000} .service,.service:nth-child(even),.service:hover,.service:nth-child(even):hover,.marketing-guidance,.contact{background:#050505;background-image:none;box-shadow:none} .platforms{background:#030303;background-image:none} .quote-form input,.quote-form textarea,.quote-form select{background:#000000;background-image:none} .hero-art{background:none} .service,.service:nth-child(even),.marketing-guidance,.contact{border-color:#292317} .hero-art:after{background:#ffe3a1;box-shadow:0 0 20px 3px #dcae5040} .orbit{border-color:#c79b3930} /* Clear white copy and a full-strength contact brand mark. */ :root{--text:#ffffff;--muted:#ffffff} body,nav,.intro,.small-note,.art-caption,.hero-bottom,.platforms span,.section-top>p,.card-top,.service p,.tags span,.approach>div>p,.steps p,.contact>p,.quote-form label,.form-note,.marketing-guidance p,footer p,footer>span{color:#ffffff} .service h3,.service:nth-child(even) h3{color:#ffffff} .quote-form input::placeholder,.quote-form textarea::placeholder{color:#ffffff;opacity:1} .quote-form option{color:#ffffff;background:#000000} .contact{padding-right:65px} .contact-stamp{opacity:1;width:230px;right:40px;top:48px;transform:none;filter:none} .contact>.eyebrow,.contact>h2,.contact>p{max-width:calc(100% - 225px)} @media(max-width:1100px){.contact-stamp{position:static;display:block;width:175px;height:auto;margin-top:32px}.contact>.eyebrow,.contact>h2,.contact>p{max-width:100%}} @media(max-width:650px){.contact{padding-right:25px}.contact-stamp{width:150px;opacity:1;margin-top:28px}} /* Slightly lifted tile surfaces against the black page. */ .service,.service:nth-child(even),.service:hover,.service:nth-child(even):hover,.marketing-guidance,.contact{background:#0c0c0c;background-image:none} /* Match form fields to the lifted tile surfaces. */ .quote-form input,.quote-form textarea,.quote-form select,.quote-form option{background:#0c0c0c;background-image:none;color:#ffffff} /* Restore the original individual service icon colours. */ .service .icon{color:#f6ca72!important;text-shadow:none} .service:nth-child(2) .icon{color:#83baf1!important;text-shadow:none} .service:nth-child(3) .icon{color:#ef6c70!important;text-shadow:none} .service:nth-child(4) .icon{color:#dc9bea!important;text-shadow:none} .service:nth-child(5) .icon{color:#99bddd!important;text-shadow:none} .service:nth-child(6) .icon{color:#b2d4ad!important;text-shadow:none} /* Alternate metallic gold and red tile accent lines. */ .service:nth-child(odd)::before{background:var(--metal-gold);box-shadow:0 0 15px #f2b74130} .service:nth-child(even)::before{background:var(--metal-red);box-shadow:0 0 15px #f0193330} /* Flat red and gold accents: no interface gradients, glows or shading. */ :root{--gold:#f6ca72;--red:#ef2637;--metal-gold:#f6ca72;--metal-red:#ef2637} *,*::before,*::after{box-shadow:none!important;text-shadow:none!important;filter:none!important} h1 em,.contact h2 em,h2 span,.platforms strong{background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--gold)} .button,.button:hover{background:var(--gold);background-image:none;border-color:var(--gold)!important;color:#000000} .nav-quote,.nav-quote:hover{background:var(--red);background-image:none;border-color:var(--red);color:#ffffff} .nav-quote span{color:#ffffff} .service,.service:nth-child(even),.marketing-guidance,.contact{background:#0c0c0c;background-image:none} .service:nth-child(odd){border-color:#59472a} .service:nth-child(even){border-color:#57242b} .service:nth-child(odd)::before{background:var(--gold)} .service:nth-child(even)::before{background:var(--red)} .eyebrow,.steps article:nth-child(odd)>span,.guidance-symbol,.guidance-label{color:var(--gold)} .approach .eyebrow,.contact>.eyebrow,.steps article:nth-child(even)>span{color:var(--red)} .line{background:var(--red)} .platforms strong:nth-of-type(even){color:var(--red)} .platforms i{color:var(--gold)} .header{border-bottom-color:var(--red)} .platforms{border-top-color:var(--gold);border-bottom-color:var(--red)} .marketing-guidance{border-color:var(--gold)} .contact{border-color:var(--red)} footer{border-top-color:var(--gold)} .hero-art{background:none} .hero-art:after{background:var(--gold)} .orbit-one{border-color:#59472a}.orbit-two{border-color:#57242b} .quote-form input:focus,.quote-form textarea:focus,.quote-form select:focus{outline-color:var(--red)} /* Metallic accents on flat black surfaces; no ambient shading or glow. */ :root{--metal-gold:linear-gradient(174deg,#fff6cc 0%,#ffdf7d 19%,#bd771e 42%,#ffeaa0 49%,#fff3c2 54%,#e5a637 67%,#915019 100%);--metal-red:linear-gradient(172deg,#ffb9b9 0%,#ff3a45 20%,#eb0717 42%,#ff6570 49%,#f52633 55%,#a5000c 78%,#60010a 100%)} h1 em,.contact h2 em,h2 span,.platforms strong{background:var(--metal-gold);background-clip:text;-webkit-background-clip:text;color:transparent} .platforms strong:nth-of-type(even){background:var(--metal-red);background-clip:text;-webkit-background-clip:text;color:transparent} .button,.button:hover{background:var(--metal-gold);color:#000000} .nav-quote,.nav-quote:hover{background:var(--metal-red);color:#ffffff} .service:nth-child(odd)::before{background:var(--metal-gold)} .service:nth-child(even)::before,.line{background:var(--metal-red)} /* Gold header divider. */ .header{border-bottom-color:var(--gold)} /* App Man — final art direction */ :root{--bg:#000;--text:#fff;--muted:#fff;--gold:#f4ca78;--red:#ef3443;--line:#29251d;--metal-gold:linear-gradient(165deg,#fff4cb 0%,#f7d589 28%,#bf893a 47%,#ffe6a6 51%,#f2c56c 72%,#c7913e 100%);--metal-red:linear-gradient(165deg,#ffb3b7 0%,#f74a58 28%,#b90a1c 47%,#ff5c66 51%,#df1b2d 75%,#8e0717 100%)} html{scroll-padding-top:28px}html,body{background:#000}body{font-family:'DM Sans',sans-serif;color:#fff;line-height:1.7}.wrap{width:min(1240px,88%)} .header{height:112px;gap:40px;border-bottom:1px solid #b294534d}.brand-logo{width:108px;height:78px}.wordmark{flex-shrink:0}nav{gap:36px;font-size:14px;color:#fff}.nav-quote{padding:11px 20px;border:1px solid #f5cf81;border-radius:5px;font-size:14px;font-weight:600;background:transparent;color:var(--gold)}.nav-quote:hover{background:var(--gold);color:#000}.nav-quote span{color:inherit;margin-left:24px} .hero{grid-template-columns:1.03fr 1fr;min-height:735px;padding-top:64px;column-gap:34px}.hero-copy{position:relative;z-index:3}.eyebrow{font-size:12px;line-height:1.7;letter-spacing:2px;font-weight:600;color:var(--gold)}.line{width:25px;height:2px;background:var(--metal-gold)}h1{font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(88px,8.4vw,124px);font-weight:700;line-height:.98;letter-spacing:-1.5px;margin:28px 0 30px}h1 em,h2 span,.contact h2 em{background:var(--metal-gold);background-clip:text;-webkit-background-clip:text;color:transparent}.intro{font-size:17px;line-height:1.9;color:#fff}.button,.button:hover{font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:36px;min-height:58px;padding:15px 25px;background:var(--metal-gold);border:1px solid #ffe1a0!important;border-radius:5px;color:#100c06;font-size:15px;font-weight:700;transition:transform .2s}.button:hover{transform:translateY(-2px)}.small-note{margin-top:19px;font-size:12px;letter-spacing:.4px;color:#fff}.hero-art{background:none;min-height:440px}.logo-frame{width:106%;aspect-ratio:1.5;transform:rotate(-3deg);overflow:visible}.logo-frame img{width:100%;height:auto;position:static}.orbit{display:none}.hero-art:after{display:none}.art-caption{left:4%;right:0;bottom:10%;font-size:10px;letter-spacing:1.8px;color:#fff}.hero-bottom{padding:52px 0 25px;font-size:11px;letter-spacing:1.5px;color:#fff}.hero-bottom a{font-size:12px;color:#fff;letter-spacing:0} .platforms{background:#050505;border-top:1px solid #7e673d;border-bottom:1px solid #29251d}.platforms .wrap{min-height:94px;gap:22px}.platforms span{max-width:110px;font-size:10px;line-height:1.8;letter-spacing:1.8px;color:#fff}.platforms strong,.platforms strong:nth-of-type(even){font-size:16px;font-weight:500;background:none;color:#fff}.platforms i{font-size:11px;color:var(--gold)} .services{padding-block:96px}.section-top{align-items:end;margin-bottom:40px;gap:60px}h2{font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(44px,4.5vw,64px);font-weight:600;line-height:1.08;letter-spacing:-.5px;margin-top:19px}.section-top>p{max-width:360px;font-size:16px;line-height:1.85;color:#fff}.service-grid{gap:20px}.service,.service:nth-child(even),.service:hover,.service:nth-child(even):hover{position:relative;display:flex;flex-direction:column;padding:29px;background:#0c0c0c;border:1px solid #29251f;border-radius:7px;transition:transform .2s,border-color .2s}.service:hover,.service:nth-child(even):hover{transform:translateY(-4px);border-color:#8e7445}.service:before,.service:nth-child(odd):before{left:27px;right:27px;top:0;height:2px;background:var(--metal-gold)}.service:nth-child(even):before{background:var(--metal-red)}.card-top{margin-bottom:31px;color:#fff;font-size:12px;letter-spacing:1px}.icon{font-size:32px}.service h3,.service:nth-child(even) h3{font-size:23px;line-height:1.3;font-weight:500;letter-spacing:-.6px;color:#fff}.service p{font-size:15px;line-height:1.8;margin:17px 0 27px;color:#fff}.tags{gap:7px;margin-top:auto}.tags span{font-size:12px;line-height:1.5;padding:5px 9px;border-color:#343027;border-radius:4px;color:#fff}.marketing-guidance{background:#0c0c0c;border:1px solid #51432a;border-radius:7px;margin-top:22px;padding:27px 29px;gap:24px}.marketing-guidance h3{font-size:22px;color:var(--gold)}.marketing-guidance p{font-size:15px;line-height:1.8;color:#fff}.guidance-label{font-size:11px;color:var(--gold)}.guidance-symbol{font-size:27px;color:var(--gold)} .approach{grid-template-columns:1fr 1fr;gap:90px;padding-block:82px 98px;border-top:1px solid #29251d}.approach .eyebrow{color:var(--gold)}.approach>div>p{font-size:16px;color:#fff}.steps article{gap:23px;padding-block:25px;border-color:#29251d}.steps article:first-child{padding-top:0}.steps article>span{font-size:12px;color:var(--gold)}.steps article:nth-child(2)>span{color:var(--red)}.steps h3{font-size:19px;font-weight:500;color:#fff}.steps p{font-size:15px;line-height:1.85;color:#fff} .contact{background:#0c0c0c;border:1px solid #9b7b43;border-radius:8px;padding:56px;display:grid;grid-template-columns:.9fr 1.1fr;column-gap:58px;align-items:start}.contact>.eyebrow{grid-column:1;max-width:none;color:var(--gold);font-size:11px;letter-spacing:1.5px}.contact>h2{grid-column:1;max-width:none;font-size:64px;margin-top:22px;line-height:1.04}.contact>p{grid-column:1;max-width:none;color:#fff;font-size:15px;margin-top:24px;line-height:1.85}.contact .included-guidance{color:var(--gold);font-size:14px;margin-top:20px}.quote-form{grid-column:2;grid-row:1/7;max-width:none;margin:0;width:100%}.quote-form label{font-size:14px;color:#fff;margin-top:19px}.quote-form .form-row label{margin-top:0}.form-row{grid-template-columns:1fr 1fr;gap:16px}.quote-form input,.quote-form textarea,.quote-form select,.quote-form option{background:#111;color:#fff;border:1px solid #494033;border-radius:5px;padding:13px 14px;font-family:inherit;font-size:16px;line-height:1.5}.quote-form textarea{min-height:150px}.quote-form input::placeholder,.quote-form textarea::placeholder{color:#fff;opacity:1}.quote-form input:focus,.quote-form textarea:focus,.quote-form select:focus{outline:2px solid var(--gold);outline-offset:3px}.quote-form .button{width:100%;margin-top:23px}.form-note{font-size:12px;line-height:1.8;color:#fff;margin-top:16px}.contact-stamp{grid-column:1;position:static;display:block;width:158px;height:auto;opacity:1;transform:none;margin-top:31px;align-self:start}.contact-stamp{max-width:100%}footer{margin-top:36px;padding-block:27px 38px;border-top:1px solid #5a4829;gap:24px}footer .brand-logo{width:86px;height:62px}footer p,footer>span{font-size:12px;color:#fff}a:focus-visible{outline:2px solid var(--gold);outline-offset:5px} @media(min-width:1500px){.hero{min-height:760px}} @media(max-width:1000px){.hero{column-gap:15px;min-height:660px}.hero h1{font-size:96px}.intro{font-size:16px}.hero-art{min-height:350px}.platforms .wrap{gap:17px}.platforms span{display:none}.service-grid{grid-template-columns:repeat(2,1fr)}.section-top{gap:30px}.section-top>p{max-width:310px}.approach{gap:45px}.contact{padding:38px;column-gap:35px}.contact>h2{font-size:52px}.contact>.eyebrow{font-size:10px}.contact-stamp{width:145px}.form-row{grid-template-columns:1fr;gap:0}.quote-form .form-row label+label{margin-top:19px}.art-caption{display:none}} @media(max-width:650px){.wrap{width:88%}.header{height:88px;gap:20px}.brand-logo{width:85px;height:62px}nav{display:none}.nav-quote{margin-left:auto;padding:9px 15px;font-size:13px}.nav-quote span{margin-left:20px}.hero{grid-template-columns:1fr;padding-top:43px;min-height:0;column-gap:0}.eyebrow{font-size:10px;letter-spacing:1.5px}.hero h1{font-size:clamp(78px,17vw,108px);letter-spacing:-1px;margin-block:23px 25px}.intro{font-size:16px;line-height:1.85}.hero .button{margin-top:28px}.small-note{font-size:12px}.hero-art{min-height:265px;margin-top:22px}.logo-frame{width:96%;max-width:400px}.hero-bottom{padding:12px 0 24px;gap:20px}.hero-bottom>span{font-size:10px;line-height:1.7;max-width:150px}.hero-bottom a{font-size:11px}.hero-bottom a span{margin-left:10px}.platforms .wrap{flex-wrap:wrap;justify-content:center;min-height:0;gap:12px 17px;padding-block:21px}.platforms strong,.platforms strong:nth-of-type(even){font-size:14px}.platforms i{font-size:9px}.services{padding-block:62px}.section-top{display:block;margin-bottom:29px}h2{font-size:45px}.section-top>p{max-width:none;margin-top:24px;font-size:16px}.service-grid{grid-template-columns:1fr;gap:16px}.service,.service:nth-child(even),.service:hover,.service:nth-child(even):hover{padding:26px}.card-top{margin-bottom:25px}.service h3{font-size:23px}.service p{font-size:16px}.tags span{font-size:12px}.marketing-guidance{padding:25px;gap:15px;align-items:start}.marketing-guidance>div{min-width:0;flex-basis:calc(100% - 42px)}.marketing-guidance h3{font-size:21px}.marketing-guidance p{font-size:15px}.guidance-label{margin-left:42px}.approach{grid-template-columns:1fr;gap:37px;padding-block:54px 64px}.steps p{font-size:16px}.contact{display:flex;flex-direction:column;padding:29px 24px;gap:0}.contact>.eyebrow{font-size:10px;max-width:none}.contact>h2{font-size:52px;max-width:none;margin-top:20px}.contact>p{max-width:none;font-size:16px}.contact .included-guidance{font-size:14px}.quote-form{margin-top:30px}.quote-form label{font-size:14px}.quote-form input,.quote-form textarea,.quote-form select{font-size:16px}.contact-stamp{width:130px;margin-top:28px}.quote-form .button{gap:25px}.form-note{font-size:12px}footer{margin-top:27px;flex-wrap:wrap;gap:15px;padding-block:25px}footer p{width:100%;order:3;font-size:12px}footer>span{margin-left:auto}.hero-art:after{display:none}} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}} /* A persistent, accessible light / dark preference. */ .theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:82px;min-height:44px;padding:8px 12px;border:1px solid #5b4a2b;border-radius:5px;background:#0c0c0c;color:#fff;font:500 14px 'DM Sans',sans-serif;cursor:pointer;flex-shrink:0}.theme-toggle:hover{border-color:var(--gold)}.theme-toggle:focus-visible{outline:2px solid var(--gold);outline-offset:4px}.theme-icon{font-size:19px;line-height:1}.header{gap:25px} html[data-theme=light]{color-scheme:light;--bg:#fff;--text:#171717;--muted:#171717;--line:#ded8cc;--gold:#805813} html[data-theme=light],html[data-theme=light] body{background:#fff;color:#171717} html[data-theme=light] :is(nav,.intro,.small-note,.art-caption,.hero-bottom,.hero-bottom a,.platforms span,.platforms strong,.platforms strong:nth-of-type(even),.section-top>p,.card-top,.service h3,.service:nth-child(even) h3,.service p,.tags span,.approach>div>p,.steps h3,.steps p,.contact>p,.quote-form label,.form-note,.marketing-guidance p,footer p,footer>span){color:#171717} html[data-theme=light] :is(.service,.service:nth-child(even),.service:hover,.service:nth-child(even):hover,.marketing-guidance,.contact){background:#f7f7f5;border-color:#cfc4b1} html[data-theme=light] .platforms{background:#f7f7f5;border-color:#cfc4b1} html[data-theme=light] :is(.header,.approach,.steps article,footer){border-color:#cfc4b1} html[data-theme=light] :is(.quote-form input,.quote-form textarea,.quote-form select,.quote-form option){background:#fff;color:#171717;border-color:#aaa08f} html[data-theme=light] :is(.quote-form input,.quote-form textarea)::placeholder{color:#555;opacity:1} html[data-theme=light] .tags span{border-color:#cfc4b1} html[data-theme=light] :is(.eyebrow,.approach .eyebrow,.contact>.eyebrow,.marketing-guidance h3,.guidance-label,.guidance-symbol,.contact .included-guidance){color:#805813} html[data-theme=light] :is(h1 em,h2 span,.contact h2 em){background:linear-gradient(165deg,#754806,#a77418 35%,#714407 49%,#b78020 54%,#79500d 100%);background-clip:text;-webkit-background-clip:text;color:transparent} html[data-theme=light] .theme-toggle{background:#f7f7f5;color:#171717;border-color:#cfc4b1} html[data-theme=light] .nav-quote{color:#704b0e;border-color:#a17b36} html[data-theme=light] .nav-quote:hover{background:#f4ca78;color:#171717} html[data-theme=light] .service:nth-child(1) .icon{color:#916315!important} @media(max-width:650px){.header{gap:10px}.theme-toggle{min-width:44px;width:44px;padding:8px;margin-left:auto}.theme-label{display:none}.nav-quote{margin-left:0;padding:9px 12px}.nav-quote span{margin-left:9px}.header .brand-logo{width:78px}} /* Purposeful motion, with a full reduced-motion alternative. */ @keyframes enter-copy{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}} @keyframes enter-mark{from{opacity:0;transform:translateY(24px) rotate(-6deg) scale(.95)}to{opacity:1;transform:translateY(0) rotate(-3deg) scale(1)}} @keyframes accent-travel{from{background-position:100% 50%}to{background-position:0% 50%}} @media(prefers-reduced-motion:no-preference){ .hero-copy>.eyebrow{animation:enter-copy .6s both} .hero h1{animation:enter-copy .75s .08s both} .hero .intro{animation:enter-copy .75s .16s both} .hero .button,.hero .small-note{animation:enter-copy .75s .24s both} .logo-frame{animation:enter-mark 1s .12s both} body,.platforms,.service,.contact,.marketing-guidance,.quote-form input,.quote-form textarea,.quote-form select,.theme-toggle{transition:background-color .25s,color .25s,border-color .25s} .section-top,.service,.marketing-guidance,.approach>div,.contact{transition:opacity .65s,translate .65s,transform .25s,border-color .25s;transition-delay:var(--reveal-delay,0ms)} .reveal-pending{opacity:0;translate:0 25px} .revealed{opacity:1;translate:0 0} .service:hover,.service:nth-child(even):hover{transform:perspective(1000px) translateY(-5px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition-delay:0ms} .service .icon{display:inline-block;transition:transform .3s} .service:hover .icon{transform:translateY(-3px) scale(1.08)} .service:hover::before{background-size:200% 100%;animation:accent-travel 1s ease both} .button{background-size:140% 100%;background-position:100% 50%;transition:background-position .4s,transform .2s} .button:hover{background-position:0% 50%} .button>span,.nav-quote>span{display:inline-block;transition:transform .2s} .button:hover>span,.nav-quote:hover>span{transform:translate(3px,-3px)} .button:active{transform:translateY(1px) scale(.985)} .theme-icon{transition:transform .35s} .theme-toggle:hover .theme-icon{transform:rotate(25deg)} nav a::after{transition:transform .25s} } nav a{position:relative;padding-block:8px}nav a::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left}nav a:hover::after,nav a[aria-current=location]::after{transform:scaleX(1)} .reading-progress{position:fixed;top:0;left:0;width:100%;height:2px;background:var(--metal-gold);transform:scaleX(0);transform-origin:left;z-index:50;pointer-events:none} .quote-form label:focus-within{color:var(--gold)} @media(hover:none){.service:hover,.service:nth-child(even):hover{transform:none}} /* ---------- Mobile / WebView (iOS + Android) ---------- */ html{-webkit-text-size-adjust:100%;text-size-adjust:100%} html,body{max-width:100%;overflow-x:hidden} body{-webkit-font-smoothing:antialiased} /* Respect the notch / Dynamic Island / home indicator in a WebView shell */ body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)} footer{padding-bottom:calc(38px + env(safe-area-inset-bottom))} .header{padding-top:env(safe-area-inset-top)} @media(max-width:650px){ /* The one deliberate difference from desktop: logo sits above the copy. */ .hero-art{order:-1;min-height:0;margin:0 0 26px} .hero-copy{order:0} .hero-bottom{order:1} .logo-frame{width:100%;max-width:340px;margin-inline:auto} /* Both header buttons keep their exact desktop appearance on mobile */ .header{gap:10px} .header .brand-logo{width:76px;height:auto} .theme-toggle{ width:auto;min-width:82px;height:auto;min-height:44px; gap:8px;padding:8px 12px;border-radius:5px;margin-left:auto;flex:none; font:500 14px 'DM Sans',sans-serif; } .theme-label{display:inline} .theme-icon{font-size:19px} .nav-quote{ display:inline-flex;align-items:center;justify-content:center; width:auto;height:auto;min-height:44px; padding:11px 20px;border-radius:5px; font-size:14px;font-weight:600; margin-left:0;flex:none;white-space:nowrap; } .nav-quote span{margin-left:24px} /* Comfortable tap targets elsewhere */ .button,.quote-form .button{min-height:48px} .quote-form input,.quote-form select,.quote-form textarea{min-height:48px;font-size:16px} .steps article,.service{-webkit-tap-highlight-color:transparent} } @media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.reveal-pending{opacity:1;translate:none}.service:hover,.service:nth-child(even):hover{transform:none}} /* Symbols must render as plain glyphs, not colour emoji, on iOS/Android. */ .theme-icon,.nav-quote span,.button span,.hero-bottom a span, .platforms i,.guidance-symbol,.service .icon{ font-family:'DM Sans',system-ui,'Segoe UI Symbol','Apple Symbols',sans-serif; font-variant-emoji:text; }