:root { color-scheme:only light; --black:#101010; --gray:#666; --line:#dedede; --soft:#f5f5f3; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:#fff; color:#101010; }
body { margin:0; color:var(--black); background:#fff; font-family:Arial, Helvetica, sans-serif; line-height:1.5; }
main, .hero, .section, .advantages, .faq, .contact, footer { background:#fff; color:var(--black); }
a { color:inherit; }
.scroll-progress { position:fixed; top:0; left:0; width:0; height:3px; background:#000; z-index:100; pointer-events:none; }
.site-header { height:76px; padding:0 max(24px, calc((100vw - 1200px)/2)); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:rgba(255,255,255,.92); position:sticky; top:0; z-index:10; backdrop-filter:blur(14px); transition:height .25s, box-shadow .25s, background .25s; }
.site-header.is-scrolled { height:66px; background:rgba(255,255,255,.97); box-shadow:0 10px 35px rgba(0,0,0,.07); }
.brand { display:inline-flex; align-items:center; gap:10px; font-size:17px; font-weight:800; text-decoration:none; }
.brand img { width:42px; height:42px; object-fit:cover; border-radius:6px; }
nav { display:flex; align-items:center; gap:28px; }
nav > a { font-size:14px; font-weight:700; text-decoration:none; }
.button { min-height:50px; padding:0 24px; border:1px solid #000; border-radius:5px; display:inline-flex; align-items:center; justify-content:center; background:#000; color:#fff; font:700 14px Arial, sans-serif; text-decoration:none; cursor:pointer; box-shadow:0 0 0 #000; transition:background .2s, color .2s, transform .2s, box-shadow .2s; }
.button:hover { background:#fff; color:#000; transform:translateY(-2px); box-shadow:5px 5px 0 #000; }
.button:active { transform:translateY(0); box-shadow:2px 2px 0 #000; }
.button-small { min-height:40px; padding:0 18px; }
.hero { min-height:calc(100vh - 76px); max-height:860px; display:grid; grid-template-columns:minmax(0, 1.05fr) minmax(380px, .95fr); border-bottom:1px solid var(--line); }
.hero-copy { padding:clamp(70px, 9vw, 140px) max(36px, calc((100vw - 1200px)/2)); padding-right:clamp(40px, 7vw, 100px); display:flex; flex-direction:column; justify-content:center; }
.eyebrow { margin:0 0 22px; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:1.8px; }
h1 { margin:0; font-size:clamp(62px, 6.2vw, 94px); line-height:.9; letter-spacing:0; }
.hero-text { max-width:650px; margin:32px 0; font-size:clamp(24px, 3vw, 42px); line-height:1.12; }
.hero-support { max-width:570px; margin:-14px 0 32px; color:var(--gray); font-size:17px; }
.hero-actions { display:flex; align-items:center; gap:28px; margin-bottom:60px; }
.text-link { font-size:14px; font-weight:700; text-underline-offset:5px; }
.highlights { margin:0; padding-top:24px; border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr; gap:30px; }
.highlights div { display:flex; flex-direction:column; gap:5px; }
.highlights dt { font-weight:800; }
.highlights dd { margin:0; color:var(--gray); font-size:14px; }
.hero-visual { min-height:620px; background:var(--soft); display:flex; align-items:center; justify-content:center; overflow:hidden; position:relative; isolation:isolate; }
.hero-visual::before, .hero-visual::after { content:''; position:absolute; width:90px; height:90px; border-color:#bbb; opacity:.8; }
.hero-visual::before { top:32px; left:32px; border-top:1px solid; border-left:1px solid; }
.hero-visual::after { right:32px; bottom:32px; border-right:1px solid; border-bottom:1px solid; }
.hero-visual img { width:min(82%, 640px); height:auto; border:1px solid var(--line); border-radius:28px; background:#fff; box-shadow:0 18px 50px rgba(0,0,0,.08); position:relative; z-index:2; transition:transform .5s, box-shadow .5s; }
.hero-visual:hover img { transform:translateY(-6px); box-shadow:0 28px 70px rgba(0,0,0,.13); }
.route-tech { position:absolute; inset:0; z-index:1; pointer-events:none; }
.route-line { position:absolute; display:block; height:1px; background:#999; transform-origin:left center; }
.route-line-a { width:36%; left:7%; top:27%; transform:rotate(18deg); }
.route-line-b { width:30%; right:5%; top:25%; transform:rotate(132deg); }
.route-line-c { width:28%; left:8%; bottom:22%; transform:rotate(-18deg); }
.route-node { position:absolute; width:11px; height:11px; border:2px solid #111; border-radius:50%; background:var(--soft); box-shadow:0 0 0 6px rgba(0,0,0,.05); }
.route-node-a { left:7%; top:26%; }
.route-node-b { right:8%; top:38%; }
.route-node-c { left:30%; bottom:29%; }
.route-pulse { position:absolute; left:7%; top:calc(27% - 3px); width:7px; height:7px; border-radius:50%; background:#000; animation:routeMove 4.5s ease-in-out infinite; }
@keyframes routeMove { 0% { transform:translate(0,0); opacity:0; } 15% { opacity:1; } 75% { opacity:1; } 100% { transform:translate(220px,70px); opacity:0; } }
.section { padding:110px max(24px, calc((100vw - 1200px)/2)); }
.section-heading { max-width:850px; margin-bottom:64px; }
h2 { margin:0; font-size:clamp(38px, 5vw, 68px); line-height:1.05; letter-spacing:0; }
.services { display:grid; grid-template-columns:repeat(4, 1fr); border-top:1px solid #000; }
.services article { min-height:260px; padding:26px 24px 20px 0; border-right:1px solid var(--line); position:relative; transition:transform .25s, background .25s, box-shadow .25s; }
.services article:not(:first-child) { padding-left:24px; }
.services article:last-child { border-right:0; }
.services span { font:700 12px Arial; color:var(--gray); }
.services h3 { margin:68px 0 14px; font-size:22px; }
.services p { margin:0; color:var(--gray); font-size:15px; }
.services article:hover { background:#fafafa; transform:translateY(-5px); box-shadow:inset 0 3px 0 #000; }
.delivery-types { padding:110px max(24px, calc((100vw - 1200px)/2)); background:var(--soft); }
.type-grid { display:grid; grid-template-columns:repeat(3, 1fr); border-top:1px solid #000; border-left:1px solid var(--line); }
.type-grid article { min-height:190px; padding:28px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:#fff; position:relative; overflow:hidden; transition:transform .25s, box-shadow .25s; }
.type-grid article::after { content:''; position:absolute; width:22px; height:22px; right:14px; top:14px; border-top:1px solid #aaa; border-right:1px solid #aaa; transition:width .25s, height .25s, border-color .25s; }
.type-grid article:hover { z-index:2; transform:translateY(-5px); box-shadow:0 16px 36px rgba(0,0,0,.1); }
.type-grid article:hover::after { width:32px; height:32px; border-color:#000; }
.type-grid h3 { margin:0 0 18px; font-size:20px; }
.type-grid p { margin:0; color:var(--gray); }
.section-note { margin:22px 0 0; color:var(--gray); font-size:13px; }
.advantages { padding:110px max(24px, calc((100vw - 1200px)/2)); display:grid; grid-template-columns:1fr 1fr; gap:10vw; }
.advantages ul { margin:0; padding:0; list-style:none; border-top:1px solid #000; }
.advantages li { padding:24px 0 24px 22px; display:grid; gap:6px; border-bottom:1px solid var(--line); position:relative; transition:padding-left .2s; }
.advantages li::before { content:''; position:absolute; left:0; top:31px; width:7px; height:7px; border:1px solid #000; transform:rotate(45deg); }
.advantages li:hover { padding-left:30px; }
.advantages li strong { font-size:19px; }
.advantages li span { color:var(--gray); }
.coverage { padding:90px max(24px, calc((100vw - 1200px)/2)); display:grid; grid-template-columns:1fr 1fr; gap:10vw; background:var(--soft); }
.coverage-copy { align-self:end; }
.coverage-copy p { max-width:560px; margin:0 0 28px; color:var(--gray); font-size:18px; }
.process { padding:100px max(24px, calc((100vw - 1200px)/2)); display:grid; grid-template-columns:1fr 1fr; gap:10vw; background:#101010; color:#fff; }
.process ol { margin:0; padding:0; list-style:none; border-top:1px solid #555; }
.process li { padding:28px 0; border-bottom:1px solid #555; display:grid; gap:7px; position:relative; transition:padding-left .25s, border-color .25s; }
.process li:hover { padding-left:18px; border-color:#fff; }
.process li strong { font-size:20px; }
.process li span { color:#bbb; }
.process li .step { color:#fff; font-size:12px; font-weight:800; }
.faq { padding:110px max(24px, calc((100vw - 1200px)/2)); }
.faq-list { border-top:1px solid #000; }
.faq details { border-bottom:1px solid var(--line); transition:background .2s, padding .2s; }
.faq details[open] { padding-left:18px; background:#fafafa; }
.faq summary { padding:25px 46px 25px 0; position:relative; font-size:18px; font-weight:800; cursor:pointer; list-style:none; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:'+'; position:absolute; right:8px; top:18px; font-size:28px; font-weight:400; }
.faq details[open] summary::after { content:'−'; }
.faq details p { max-width:760px; margin:-6px 0 25px; color:var(--gray); }
.contact { padding:110px max(24px, calc((100vw - 1200px)/2)); display:grid; grid-template-columns:.9fr 1.1fr; gap:10vw; }
.contact-copy > p:not(.eyebrow) { max-width:500px; margin-top:28px; color:var(--gray); font-size:18px; }
.contact-note { max-width:500px; margin-top:38px; padding-top:22px; display:grid; gap:6px; border-top:1px solid var(--line); }
.contact-note span { color:var(--gray); }
form { display:grid; grid-template-columns:1fr 1fr; gap:24px 18px; align-content:start; }
.field { display:grid; gap:8px; }
.field-full, .submit, .form-status { grid-column:1/-1; }
label { font-size:13px; font-weight:800; }
input, select, textarea { width:100%; padding:0 14px; border:1px solid #999; border-radius:4px; background:#fff; color:#000; -webkit-text-fill-color:#000; font:16px Arial, sans-serif; transition:border-color .2s, box-shadow .2s, transform .2s; }
input, select { height:52px; }
textarea { padding-top:14px; resize:vertical; }
input:focus, select:focus, textarea:focus { outline:0; border-color:#000; box-shadow:0 0 0 3px rgba(0,0,0,.12); transform:translateY(-1px); }
.consent { display:flex; align-items:flex-start; gap:10px; font-weight:400; cursor:pointer; }
.consent input { width:18px; height:18px; margin:2px 0 0; flex:0 0 auto; }
.submit { width:100%; margin-top:6px; }
.submit:disabled { opacity:.55; cursor:wait; }
.form-status { min-height:24px; margin:0; font-size:14px; font-weight:700; }
.form-status.success { color:#12652d; }
.form-status.error { color:#a31313; }
.honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.privacy-note { margin:-10px 0 0; color:var(--gray); font-size:12px; }
.mobile-cta { display:none; }
.reveal { opacity:0; transform:translateY(28px); transition:opacity .65s ease var(--reveal-delay, 0ms), transform .65s ease var(--reveal-delay, 0ms); }
.reveal.is-visible { opacity:1; transform:translateY(0); }
.section, .delivery-types, .advantages, .coverage, .process, .faq, .contact { position:relative; overflow:hidden; }
.section::after, .faq::after, .contact::after { content:''; position:absolute; right:max(24px, calc((100vw - 1200px)/2)); top:38px; width:54px; height:12px; border-top:1px solid #aaa; border-bottom:1px solid #aaa; opacity:.6; }
footer { padding:34px max(24px, calc((100vw - 1200px)/2)); display:flex; align-items:center; gap:30px; border-top:1px solid var(--line); }
footer p { margin:0; color:var(--gray); }
footer > span { margin-left:auto; font-weight:700; }
@media (max-width:900px) { nav > a:not(.button) { display:none; } .hero { min-height:auto; max-height:none; grid-template-columns:1fr; } .hero-copy { padding:72px 24px 58px; } .hero-visual { min-height:420px; } .services { grid-template-columns:1fr 1fr; } .services article:nth-child(2) { border-right:0; } .services article:nth-child(n+3) { border-top:1px solid var(--line); } .type-grid { grid-template-columns:1fr 1fr; } .advantages, .coverage, .process, .contact { grid-template-columns:1fr; gap:58px; } }
@media (max-width:560px) { body { padding-bottom:66px; } .site-header { height:68px; padding:0 16px; } .brand span { font-size:15px; } .brand img { width:36px; height:36px; } .button-small { padding:0 13px; } h1 { font-size:52px; } h2 { font-size:38px; } .hero-text { font-size:27px; } .hero-actions { align-items:stretch; flex-direction:column; gap:18px; } .highlights { grid-template-columns:1fr; gap:18px; } .hero-visual { min-height:330px; } .hero-visual img { border-radius:20px; } .section, .delivery-types, .advantages, .coverage, .process, .faq, .contact { padding:76px 20px; } .services, .type-grid { grid-template-columns:1fr; } .services article, .services article:not(:first-child) { min-height:210px; padding:24px 0; border-right:0; border-top:1px solid var(--line); } .services article:first-child { border-top:0; } .services h3 { margin-top:42px; } .type-grid article { min-height:160px; } form { grid-template-columns:1fr; } .field { grid-column:1/-1; } .mobile-cta { display:flex; position:fixed; left:12px; right:12px; bottom:10px; min-height:48px; align-items:center; justify-content:center; border-radius:5px; background:#000; color:#fff; font-size:14px; font-weight:800; text-decoration:none; z-index:20; box-shadow:0 6px 24px rgba(0,0,0,.24); } footer { align-items:flex-start; flex-direction:column; gap:12px; } footer > span { margin-left:0; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } .reveal { opacity:1; transform:none; } }
@media (prefers-color-scheme:dark) { :root, html, body { color-scheme:only light; background:#fff; color:#101010; } }