:root { --ink:#050505; --paper:#f4f2ed; --gold:#d99b20; --gold-light:#ffd76b; --silver:#d8d8d8; --muted:#66635d; --line:#d7d2c7; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--paper); color:var(--ink); font-family:"DM Sans",sans-serif; } h1,h2,h3,p { margin-top:0; } h1,h2 { font-family:Manrope,sans-serif; letter-spacing:-.055em; } .site-header { height:82px; padding:0 21px; display:flex; align-items:center; justify-content:space-between; background:#050505; border-bottom:1px solid #302710; } .logo { display:inline-flex; align-items:center; text-decoration:none; } .logo img { display:block; width:126px; height:58px; object-fit:contain; } .header-call { color:var(--gold-light); font-size:14px; font-weight:700; text-decoration:none; display:flex; gap:7px; align-items:center; }
.hero { overflow:hidden; position:relative; padding:43px 21px 48px; min-height:635px; background:radial-gradient(circle at 85% 48%,#3c2d0c 0,#151007 23%,#050505 55%); color:#fff; border-radius:0 0 34px 34px; } .eyebrow { color:#a06e10; text-transform:uppercase; letter-spacing:.12em; font-size:11px; font-weight:700; margin-bottom:13px; } .hero .eyebrow { color:var(--gold-light); } h1 { position:relative; z-index:1; font-size:45px; line-height:.99; margin-bottom:18px; } h1 em { color:var(--gold-light); font-style:normal; } .hero-copy { position:relative; z-index:1; width:min(300px,85%); line-height:1.55; color:#dbd8d1; font-size:16px; } .hero-actions { position:relative; z-index:2; display:flex; flex-direction:column; gap:10px; width:205px; margin-top:25px; } .button { border:0; border-radius:12px; padding:15px 17px; display:flex; justify-content:space-between; align-items:center; font:700 15px "DM Sans",sans-serif; text-decoration:none; cursor:pointer; } .button-primary { color:#171006; background:linear-gradient(135deg,#fff0a0,#d69616 55%,#fff0a0); } .button-primary span { font-size:21px; line-height:0; } .button-secondary { color:#f4f1ea; border:1px solid #9d7425; background:transparent; justify-content:center; } .trust-row { position:absolute; bottom:24px; left:21px; z-index:1; display:flex; gap:19px; color:#d7d3ca; font-size:12px; } .trust-row b { color:var(--gold-light); } .hero-art { position:absolute; width:260px; height:340px; right:-45px; top:158px; transform:rotate(-5deg); } .orb { position:absolute; border-radius:50%; } .orb-one { width:250px; height:250px; right:5px; bottom:0; background:linear-gradient(135deg,#81550c,#f2bb36); } .orb-two { width:180px; height:180px; right:45px; bottom:35px; background:linear-gradient(135deg,#fafafa,#969696); } .tool-card { position:absolute; display:flex; align-items:center; justify-content:center; box-shadow:0 14px 30px #000a; } .tool-card-main { width:175px; height:130px; right:29px; bottom:56px; border-radius:23px; background:linear-gradient(135deg,#fff,#bdbdbd 50%,#f9f9f9); color:#131313; transform:rotate(7deg); } .house-mark { font-size:47px; margin-right:9px; } .tool-card-main span:last-child { font:700 13px Manrope; letter-spacing:-.04em; } .tool-card-small { width:63px; height:63px; right:0; top:42px; border-radius:17px; background:linear-gradient(135deg,#2c2c2c,#050505); font-size:28px; transform:rotate(14deg); } .spark { position:absolute; color:#fff; font-size:28px; } .spark-one { right:203px; top:40px; } .spark-two { bottom:0; right:230px; color:var(--gold-light); }
.services,.how-it-works,.request { padding:70px 21px; } .section-heading h2,.how-it-works h2,.request h2 { font-size:30px; line-height:1.1; margin-bottom:27px; }.service-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.service-card { min-height:170px; padding:17px; border:1px solid var(--line); border-radius:17px; background:#fff; }.service-icon { display:grid; place-items:center; height:38px; width:38px; border-radius:11px; background:#fff0c5; font-size:19px; }.service-card h3 { font:700 16px Manrope; margin:18px 0 8px; letter-spacing:-.04em; }.service-card p,.request>p { color:var(--muted); font-size:13px; line-height:1.45; margin-bottom:0; }
.how-it-works { background:linear-gradient(130deg,#151515,#050505); color:#fff; }.how-it-works ol { list-style:none; padding:0; margin:31px 0 0; }.how-it-works li { padding:17px 0; border-top:1px solid #56441d; display:flex; gap:18px; }.how-it-works li:last-child { border-bottom:1px solid #56441d; }.how-it-works li>span { color:var(--gold-light); font:700 13px Manrope; }.how-it-works h3 { font:700 16px Manrope; margin:0 0 5px; letter-spacing:-.04em; }.how-it-works p { color:#cbc6bc; font-size:13px; margin:0; }
.request { background:var(--paper); }.request form { display:flex; flex-direction:column; gap:15px; margin-top:26px; }.request label { display:flex; flex-direction:column; gap:7px; color:var(--ink); font-size:13px; font-weight:700; }.request input,.request textarea { border:1px solid #c8c2b4; background:#fff; border-radius:10px; padding:13px; font:15px "DM Sans"; color:var(--ink); resize:vertical; }.request input:focus,.request textarea:focus { outline:2px solid var(--gold-light); border-color:var(--gold); }.form-note { color:var(--muted); font-size:11px; line-height:1.4; margin:0; }.form-success { color:#916211; font-weight:700; margin:0; } footer { padding:24px 21px 30px; color:#ddd8cf; background:#050505; display:flex; flex-direction:column; gap:12px; border-top:1px solid #302710; } footer .logo img { width:108px; height:50px; } footer p,footer a:not(.logo) { margin:0; color:#cfc7b8; font-size:13px; text-decoration:none; }
@media (min-width:720px) { .site-header { max-width:1100px; margin:auto; padding:0 40px; } .hero { border-radius:0; min-height:600px; padding:95px max(40px,calc((100vw - 1020px)/2)); } h1 { font-size:68px; } .hero-copy { font-size:18px; }.hero-art { right:calc((100vw - 1050px)/2); top:130px; transform:scale(1.25) rotate(-5deg); }.trust-row { left:max(40px,calc((100vw - 1020px)/2)); bottom:42px; }.services,.how-it-works,.request { padding-left:max(40px,calc((100vw - 1020px)/2)); padding-right:max(40px,calc((100vw - 1020px)/2)); }.section-heading { display:flex; align-items:baseline; justify-content:space-between; gap:40px; }.section-heading h2 { max-width:480px; }.service-grid { grid-template-columns:repeat(4,1fr); }.how-it-works ol { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }.how-it-works li:last-child { border-bottom:0; }.request form { max-width:580px; } footer { padding-left:max(40px,calc((100vw - 1020px)/2)); padding-right:max(40px,calc((100vw - 1020px)/2)); flex-direction:row; justify-content:space-between; align-items:center; } }