:root { --bg:#0c0e10; --panel:#15171a; --panel-2:#1b1e21; --ink:#f4f0ea; --muted:#a59e96; --line:rgba(255,255,255,.11); --orange:#ff5a1f; --orange-2:#ff733d; --orange-ink:#220b02; --max:1320px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; color-scheme:dark; }
body { margin:0; min-width:320px; color:var(--ink); background:radial-gradient(circle at 7% 3%,rgba(255,90,31,.13),transparent 32rem),var(--bg); font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; }
.site-header { height:84px; padding:0 max(24px,calc((100vw - var(--max))/2)); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:35px; position:sticky; top:0; z-index:30; background:rgba(12,14,16,.88); border-bottom:1px solid var(--line); backdrop-filter:blur(18px); }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; justify-self:start; }.brand-mark { width:44px; height:44px; display:grid; place-items:center; flex:none; border-radius:12px; background:var(--orange); color:var(--orange-ink); font-weight:950; letter-spacing:-.06em; box-shadow:0 0 28px rgba(255,90,31,.18); }.brand-name { display:grid; gap:2px; }.brand-name strong { font-size:14px; }.brand-name small { color:var(--muted); font-size:8px; letter-spacing:.13em; text-transform:uppercase; }
nav { display:flex; align-items:center; gap:30px; }nav a { color:#b8b1aa; text-decoration:none; font-size:12px; font-weight:750; transition:.18s; }nav a:hover { color:var(--ink); }
.header-cta { justify-self:end; display:inline-flex; align-items:center; gap:10px; min-height:43px; padding:0 17px; border:1px solid rgba(255,90,31,.42); border-radius:10px; color:#ffc0a6; text-decoration:none; font-size:11px; font-weight:850; }.header-cta:hover { background:rgba(255,90,31,.09); }.header-cta span { color:var(--orange); font-size:16px; }
.menu-button { display:none; justify-self:end; width:42px; height:42px; border:1px solid var(--line); border-radius:10px; background:var(--panel); }.menu-button span { display:block; width:18px; height:1px; margin:5px auto; background:var(--ink); }
main { overflow:hidden; }
.hero { max-width:var(--max); min-height:calc(100vh - 84px); margin:0 auto; padding:58px 24px 70px; display:grid; grid-template-columns:minmax(0,1fr) minmax(430px,.82fr); gap:64px; align-items:center; }
.eyebrow { margin:0 0 20px; display:flex; align-items:center; gap:9px; color:var(--orange); font-size:10px; font-weight:900; letter-spacing:.17em; text-transform:uppercase; }.eyebrow span { width:28px; height:2px; background:var(--orange); box-shadow:0 0 10px rgba(255,90,31,.45); }
.hero h1 { max-width:780px; margin:0; font-size:clamp(52px,6.8vw,92px); line-height:.93; letter-spacing:-.065em; }.hero h1 em { color:var(--orange); font-style:normal; }
.lead { max-width:650px; margin:29px 0 0; color:#b8b0a8; font-size:17px; line-height:1.7; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin:34px 0 42px; }.button { min-height:52px; padding:0 20px; display:inline-flex; align-items:center; justify-content:center; gap:15px; border-radius:11px; text-decoration:none; font-size:12px; font-weight:900; transition:.18s; }.button:hover { transform:translateY(-2px); }.button-primary { background:var(--orange); color:var(--orange-ink); box-shadow:0 13px 34px rgba(255,90,31,.2); }.button-primary:hover { background:var(--orange-2); }.button-primary span { font-size:17px; }.button-ghost { border:1px solid var(--line); background:var(--panel); color:#c5beb6; }
.trust-row { display:flex; gap:42px; padding-top:24px; border-top:1px solid var(--line); }.trust-row div { display:grid; gap:4px; }.trust-row strong { font-size:17px; }.trust-row span { color:#77736f; font-size:9px; text-transform:uppercase; letter-spacing:.09em; }
.hero-visual { height:min(680px,72vh); min-height:520px; position:relative; overflow:hidden; border-radius:26px; border:1px solid var(--line); background:#141619; box-shadow:0 35px 90px rgba(0,0,0,.4); }.hero-visual::before { content:""; position:absolute; z-index:3; top:0; right:42px; width:110px; height:4px; background:var(--orange); }.hero-visual img { width:100%; height:100%; object-fit:cover; filter:saturate(.65) contrast(1.08) brightness(.78); }.hero-overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(7,8,9,.82),transparent 60%),linear-gradient(130deg,rgba(255,90,31,.13),transparent 42%); }
.status-card { position:absolute; z-index:4; left:24px; bottom:24px; min-width:220px; padding:15px 17px; display:flex; align-items:center; gap:12px; border:1px solid rgba(255,255,255,.15); border-radius:13px; background:rgba(13,15,17,.78); backdrop-filter:blur(15px); }.pulse { width:9px; height:9px; border-radius:50%; background:var(--orange); box-shadow:0 0 0 6px rgba(255,90,31,.12),0 0 15px rgba(255,90,31,.7); }.status-card div { display:grid; gap:4px; }.status-card small { color:#8e8984; font-size:8px; letter-spacing:.13em; }.status-card strong { font-size:12px; }.visual-code { position:absolute; z-index:4; right:22px; top:22px; padding:7px 9px; border-radius:7px; background:rgba(10,11,13,.72); color:#c7c0b9; font-size:9px; font-weight:800; letter-spacing:.1em; }
.services { padding:105px max(24px,calc((100vw - var(--max))/2)); background:#111315; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.section-intro { display:grid; grid-template-columns:1.1fr .7fr; gap:70px; align-items:end; margin-bottom:42px; }.section-intro h2,.process h2 { max-width:760px; margin:0; font-size:clamp(37px,5vw,62px); line-height:1.03; letter-spacing:-.05em; }.section-intro > p { margin:0; color:var(--muted); font-size:14px; line-height:1.75; }
.services-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }.service-card { min-height:390px; padding:26px; position:relative; border:1px solid var(--line); border-radius:18px; background:linear-gradient(145deg,#191b1e,#141619); overflow:hidden; }.service-card::after { content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:transparent; }.service-card:hover::after,.service-card.featured::after { background:var(--orange); }.service-number { position:absolute; right:20px; top:20px; color:#55545a; font-size:10px; font-weight:900; }.service-icon { width:45px; height:45px; display:grid; place-items:center; border-radius:12px; background:rgba(255,90,31,.1); color:var(--orange); font-size:18px; font-weight:900; }.service-card h3 { margin:58px 0 12px; font-size:19px; }.service-card p { min-height:64px; margin:0; color:var(--muted); font-size:12px; line-height:1.65; }.service-card ul { margin:25px 0 0; padding:19px 0 0; border-top:1px solid var(--line); list-style:none; }.service-card li { padding:5px 0; color:#bbb4ad; font-size:10px; }.service-card li::before { content:"—"; color:var(--orange); margin-right:8px; }
.process { max-width:var(--max); margin:0 auto; padding:110px 24px; display:grid; grid-template-columns:.8fr 1fr; gap:80px; align-items:center; }.process-image { height:690px; position:relative; overflow:hidden; border-radius:22px; border:1px solid var(--line); }.process-image img { width:100%; height:100%; object-fit:cover; filter:saturate(.62) contrast(1.06) brightness(.72); }.process-image::after { content:""; position:absolute; inset:0; background:linear-gradient(to top,rgba(12,14,16,.76),transparent 50%),linear-gradient(145deg,rgba(255,90,31,.11),transparent 45%); }.image-label { position:absolute; z-index:2; left:22px; bottom:22px; color:#d7d0c9; font-size:9px; font-weight:850; letter-spacing:.13em; }
.steps { margin-top:40px; border-top:1px solid var(--line); }.step { padding:23px 0; display:grid; grid-template-columns:44px 1fr; gap:17px; border-bottom:1px solid var(--line); }.step > span { width:34px; height:27px; display:grid; place-items:center; border-radius:7px; background:rgba(255,90,31,.1); color:var(--orange); font-size:9px; font-weight:900; }.step h3 { margin:1px 0 7px; font-size:14px; }.step p { margin:0; color:var(--muted); font-size:11px; line-height:1.6; }
.contact-panel { margin-top:24px; padding:20px; display:flex; justify-content:space-between; align-items:center; gap:18px; border:1px solid rgba(255,90,31,.26); border-radius:15px; background:rgba(255,90,31,.065); }.contact-panel > div { display:grid; gap:4px; }.contact-panel small { color:var(--orange); font-size:8px; font-weight:900; letter-spacing:.14em; }.contact-panel strong { font-size:15px; }.contact-panel a:not(.round-link) { color:#bcb4ad; font-size:10px; text-decoration:none; }.round-link { width:46px; height:46px; display:grid; place-items:center; flex:none; border-radius:50%; background:var(--orange); color:var(--orange-ink); font-size:20px; text-decoration:none; }
footer { min-height:190px; padding:42px max(24px,calc((100vw - var(--max))/2)); display:grid; grid-template-columns:1fr auto 1fr; gap:30px; align-items:center; border-top:1px solid var(--line); background:#090b0c; }.footer-brand { display:flex; align-items:center; gap:12px; }.footer-brand div { display:grid; gap:4px; }.footer-brand strong { font-size:13px; }.footer-brand small { color:var(--muted); font-size:9px; }.footer-links { display:flex; gap:25px; }.footer-links a { color:#9d9690; text-decoration:none; font-size:10px; }.footer-links a:hover { color:var(--orange); }footer > p { justify-self:end; color:#64615e; font-size:9px; }
@media (max-width:1050px) { .site-header { grid-template-columns:1fr auto; }.site-header nav,.header-cta { display:none; }.menu-button { display:block; }.site-header.nav-open nav { display:grid; position:absolute; left:18px; right:18px; top:72px; gap:0; padding:10px; border:1px solid var(--line); border-radius:13px; background:#15171a; }.site-header.nav-open nav a { padding:13px; }.hero { grid-template-columns:1fr; }.hero-copy { padding-top:25px; }.hero-visual { height:590px; }.services-grid { grid-template-columns:1fr 1fr; }.process { gap:45px; }.section-intro { grid-template-columns:1fr; gap:20px; } }
@media (max-width:720px) { .site-header { height:72px; padding-inline:18px; }.brand-name small { display:none; }.hero { min-height:auto; padding:65px 18px 75px; gap:45px; }.hero h1 { font-size:clamp(46px,15vw,65px); }.lead { font-size:15px; }.trust-row { gap:20px; justify-content:space-between; }.hero-visual { min-height:420px; height:520px; }.services { padding:78px 18px; }.services-grid { grid-template-columns:1fr; }.service-card { min-height:auto; }.process { padding:78px 18px; grid-template-columns:1fr; }.process-image { height:520px; order:2; }.process-content { order:1; }footer { grid-template-columns:1fr; text-align:left; }.footer-links { flex-wrap:wrap; }footer > p { justify-self:start; } }

.service-link { display:inline-block; margin-top:18px; color:#ff9a70; font-size:14px; font-weight:850; text-decoration:none; }
.service-link:hover { color:var(--orange); }
.service-page { overflow:hidden; }
.service-hero { max-width:var(--max); min-height:680px; margin:0 auto; padding:100px 24px 90px; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(340px,.75fr); gap:80px; align-items:center; }
.service-hero h1 { max-width:850px; margin:0; font-size:clamp(50px,6.6vw,90px); line-height:.95; letter-spacing:-.065em; }
.service-hero h1 em { color:var(--orange); font-style:normal; }
.service-facts { padding:30px; border:1px solid var(--line); border-radius:22px; background:linear-gradient(145deg,#191b1e,#111315); box-shadow:0 30px 80px rgba(0,0,0,.32); }
.fact-kicker { margin:0 0 10px; color:var(--orange); font-size:14px; font-weight:900; letter-spacing:.16em; }
.service-facts > div { padding:22px 0; display:grid; gap:5px; border-bottom:1px solid var(--line); }
.service-facts > div:last-child { border:0; }
.service-facts strong { font-size:24px; letter-spacing:-.03em; }
.service-facts span { color:var(--muted); font-size:14px; line-height:1.5; }
.seo-section { padding:105px max(24px,calc((100vw - var(--max))/2)); background:#111315; border-block:1px solid var(--line); }
.detail-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.detail-grid article { min-height:230px; padding:25px; border:1px solid var(--line); border-radius:17px; background:linear-gradient(145deg,#191b1e,#141619); }
.detail-grid article > span { color:var(--orange); font-size:10px; font-weight:900; }
.detail-grid h3 { margin:48px 0 12px; font-size:20px; }
.detail-grid p { margin:0; color:var(--muted); font-size:16px; line-height:1.7; }
.solution-band { max-width:var(--max); margin:0 auto; padding:110px 24px; display:grid; grid-template-columns:.8fr 1.2fr; gap:90px; }
.solution-band h2,.seo-cta h2 { margin:0; font-size:clamp(38px,5vw,62px); line-height:1.03; letter-spacing:-.05em; }
.solution-list { border-top:1px solid var(--line); }
.solution-list article { padding:26px 0; border-bottom:1px solid var(--line); }
.solution-list h3 { margin:0 0 9px; font-size:20px; }
.solution-list p { margin:0; color:var(--muted); font-size:16px; line-height:1.7; }
.seo-cta { max-width:var(--max); margin:0 auto 110px; padding:48px; display:flex; align-items:center; justify-content:space-between; gap:50px; border:1px solid rgba(255,90,31,.3); border-radius:22px; background:radial-gradient(circle at 92% 0,rgba(255,90,31,.17),transparent 22rem),#151719; }
.seo-cta > div { max-width:780px; }
.seo-cta p:not(.eyebrow) { margin:18px 0 0; color:var(--muted); font-size:16px; line-height:1.7; }
.seo-cta .button { flex:none; }

@media (max-width:1050px) {
  .service-hero { grid-template-columns:1fr; gap:42px; padding-top:80px; }
  .detail-grid { grid-template-columns:1fr 1fr; }
  .solution-band { grid-template-columns:1fr; gap:45px; }
  .seo-cta { align-items:flex-start; flex-direction:column; }
}
@media (max-width:720px) {
  .service-hero { min-height:auto; padding:70px 18px; }
  .service-hero h1 { font-size:clamp(44px,14vw,64px); }
  .service-facts { padding:22px; }
  .seo-section { padding:78px 18px; }
  .detail-grid { grid-template-columns:1fr; }
  .detail-grid article { min-height:auto; }
  .solution-band { padding:78px 18px; }
  .seo-cta { margin:0 18px 78px; padding:28px; }
  .seo-cta .button { width:100%; }
}
