/* Myroshnychenko — Dark charcoal + safety yellow, industrial repair */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;600;700;800&family=Inter:wght@400;500;600&display=swap');
:root{--bg:#111111;--bg2:#161616;--card:#1c1c1c;--acc:#facc15;--acc2:#fde047;--grad:linear-gradient(135deg,#facc15,#fde047);--text:#f5f5f5;--muted:#666;--sub:#999;--border:rgba(250,204,21,.14);--border2:rgba(250,204,21,.3);--t:.3s ease;}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased;}
a{color:var(--acc2);text-decoration:none;transition:color var(--t);}
.container{max-width:1160px;margin:0 auto;padding:0 28px;}
.top-bar{background:var(--acc);color:#111;text-align:center;padding:9px;font-family:'Barlow Condensed',sans-serif;font-size:.85rem;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;}
.nav{position:sticky;top:0;z-index:99;padding:16px 0;background:var(--bg2);border-bottom:2px solid var(--acc);transition:padding var(--t);}
.nav .container{display:flex;align-items:center;justify-content:space-between;gap:16px;}
.brand{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:1.35rem;letter-spacing:2px;text-transform:uppercase;color:var(--text);}
.brand span{color:var(--acc);}
.nav-phone{display:inline-flex;align-items:center;gap:6px;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:1rem;letter-spacing:.5px;color:var(--acc);padding:7px 16px;border:1.5px solid var(--border2);border-radius:3px;transition:background var(--t),color var(--t);}
.nav-phone:hover{background:var(--acc);color:#111;}
.nav-phone i{font-size:15px;}
/* HERO SPLIT */
.hero{padding:80px 0 100px;background:var(--bg);position:relative;overflow:hidden;min-height:80vh;display:flex;align-items:center;}
.hero-diagonal{position:absolute;right:0;top:0;bottom:0;width:38%;background:rgba(250,204,21,.04);clip-path:polygon(15% 0,100% 0,100% 100%,0% 100%);}
.hero-wrap{display:grid;grid-template-columns:1.3fr 1fr;gap:80px;align-items:center;}
.hero-left{position:relative;z-index:2;}
/* hero right numbers */
.hero-right-nums{display:flex;flex-direction:column;gap:24px;position:relative;z-index:2;}
.hrn{text-align:center;padding:24px;background:var(--card);border:1px solid var(--border);border-radius:3px;}
.hrn .sn{display:block;font-family:'Barlow Condensed',sans-serif;font-size:2.8rem;font-weight:800;color:var(--acc);line-height:1;}
.hrn span:last-child{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-top:4px;display:block;}
/* trust pills */
.trust-pills{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px;}
.tp{display:flex;align-items:center;gap:6px;padding:7px 14px;background:rgba(250,204,21,.08);border:1px solid var(--border);border-radius:3px;font-size:.82rem;font-weight:600;color:var(--acc);font-family:'Barlow Condensed',sans-serif;letter-spacing:.5px;}
.tp i{font-size:14px;}
/* 4-card horizontal row */
.svc-row-4{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--border);margin-top:0;}
.s4{background:var(--card);padding:28px 24px;transition:background var(--t);opacity:0;transform:translateY(24px);}
.s4.visible{opacity:1;transform:translateY(0);transition:opacity .7s ease var(--d,0s),transform .7s ease var(--d,0s);}
.s4:hover{background:#1e1e1e;}
.s4 h3{font-family:'Barlow Condensed',sans-serif;font-size:1.15rem;font-weight:700;text-transform:uppercase;letter-spacing:.3px;margin-bottom:8px;}
.s4 p{font-size:.87rem;color:var(--sub);line-height:1.65;}
/* HORIZONTAL TIMELINE */
.steps-timeline{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:start;gap:0;margin-top:48px;}
.step{padding:28px 20px;background:var(--card);border:1px solid var(--border);transition:border-color var(--t);opacity:0;transform:translateY(20px);}
.step.visible{opacity:1;transform:translateY(0);transition:opacity .7s ease var(--d,0s),transform .7s ease var(--d,0s);}
.step:hover{border-color:var(--border2);}
.step-n{font-family:'Barlow Condensed',sans-serif;font-size:2rem;font-weight:800;color:var(--acc);line-height:1;margin-bottom:10px;}
.step i{font-size:22px;color:var(--acc);margin-bottom:10px;display:block;}
.step h4{font-family:'Barlow Condensed',sans-serif;font-size:.95rem;font-weight:700;text-transform:uppercase;margin-bottom:6px;}
.step p{font-size:.82rem;color:var(--sub);}
.step-line{width:2px;align-self:stretch;background:var(--border);margin:0 -1px;}
.nav-links{list-style:none;display:flex;gap:32px;}
.nav-links a{font-family:'Barlow Condensed',sans-serif;font-size:.9rem;font-weight:700;color:var(--muted);letter-spacing:1.5px;text-transform:uppercase;transition:color var(--t);}
.nav-links a:hover{color:var(--acc);}
.burger{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:4px;}
.burger span{display:block;width:22px;height:2px;background:var(--muted);}
.hero{padding:80px 0 100px;background:var(--bg);position:relative;overflow:hidden;min-height:80vh;display:flex;align-items:center;}
.hero-pattern{position:absolute;inset:0;background-image:repeating-linear-gradient(135deg,rgba(250,204,21,.03) 0,rgba(250,204,21,.03) 1px,transparent 1px,transparent 50px),repeating-linear-gradient(45deg,rgba(250,204,21,.03) 0,rgba(250,204,21,.03) 1px,transparent 1px,transparent 50px);}
.hero-inner{position:relative;z-index:2;max-width:700px;}
.hero-tag{display:inline-flex;align-items:center;gap:10px;padding:8px 18px;background:rgba(250,204,21,.12);border:1px solid var(--border2);border-radius:3px;font-family:'Barlow Condensed',sans-serif;font-size:.85rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--acc);margin-bottom:28px;}
.hero-inner h1{font-family:'Barlow Condensed',sans-serif;font-size:clamp(4rem,9vw,8rem);font-weight:800;line-height:.92;letter-spacing:-2px;text-transform:uppercase;margin-bottom:24px;}
.hero-inner h1 .hl{color:var(--acc);text-shadow:0 0 40px rgba(250,204,21,.35);}
.hero-inner p{font-size:1.05rem;color:var(--sub);max-width:560px;margin-bottom:36px;}
.hero-btns{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:36px;}
.btn-call{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;background:var(--grad);color:#111;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:1rem;letter-spacing:1.5px;text-transform:uppercase;border:none;cursor:pointer;border-radius:3px;box-shadow:0 0 28px rgba(250,204,21,.3);transition:transform var(--t),box-shadow var(--t);}
.btn-call:hover{transform:translateY(-3px);box-shadow:0 0 48px rgba(250,204,21,.45);color:#111;}
.btn-out{display:inline-flex;align-items:center;padding:14px 24px;border:1.5px solid var(--border2);color:var(--sub);font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:.9rem;letter-spacing:1px;text-transform:uppercase;border-radius:3px;transition:border-color var(--t),color var(--t);}
.btn-out:hover{border-color:var(--acc);color:var(--acc);}
.trust-badges{display:flex;gap:12px;flex-wrap:wrap;}
.tb{padding:7px 16px;background:rgba(250,204,21,.08);border:1px solid var(--border);border-radius:3px;font-size:.82rem;font-weight:600;color:var(--acc);font-family:'Barlow Condensed',sans-serif;letter-spacing:.5px;}
.services{padding:90px 0;background:var(--bg2);}
.sh{margin-bottom:52px;}
.sh h2{font-family:'Barlow Condensed',sans-serif;font-size:clamp(2.2rem,5vw,3.5rem);font-weight:800;text-transform:uppercase;letter-spacing:-1px;margin-bottom:10px;}
.sh p{font-size:.97rem;color:var(--sub);}
.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--border);}
.sc{background:var(--card);padding:34px;transition:background var(--t);opacity:0;transform:translateY(24px);}
.sc.visible{opacity:1;transform:translateY(0);transition:opacity .7s ease var(--d,0s),transform .7s ease var(--d,0s),background .35s;}
.sc:hover{background:#222;}
.sc-ic{width:52px;height:52px;border:2px solid var(--border2);display:flex;align-items:center;justify-content:center;background:rgba(250,204,21,.08);margin-bottom:14px;transition:background var(--t);}
.sc-ic i{font-size:24px;color:var(--acc);}
.sc h3{font-family:'Barlow Condensed',sans-serif;font-size:1.3rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;color:var(--text);}
.sc p{font-size:.9rem;color:var(--sub);line-height:1.72;}
.sc-time{display:inline-block;padding:4px 12px;background:rgba(250,204,21,.1);border:1px solid var(--border);border-radius:3px;font-family:'Barlow Condensed',sans-serif;font-size:.78rem;font-weight:700;color:var(--acc);letter-spacing:1px;text-transform:uppercase;margin-top:12px;}
.how{padding:90px 0;background:var(--bg);}
.how h2{font-family:'Barlow Condensed',sans-serif;font-size:clamp(2rem,4.5vw,3rem);font-weight:800;text-transform:uppercase;letter-spacing:-1px;margin-bottom:48px;}
.steps-row{display:flex;align-items:flex-start;gap:0;flex-wrap:wrap;}
.step{flex:1;min-width:170px;padding:28px 24px;background:var(--card);border:1px solid var(--border);border-right:none;transition:border-color var(--t),background var(--t);opacity:0;transform:translateY(20px);}
.step.visible{opacity:1;transform:translateY(0);transition:opacity .7s ease var(--d,0s),transform .7s ease var(--d,0s);}
.step:last-of-type{border-right:1px solid var(--border);}
.step:hover{background:#1e1e1e;border-color:var(--border2);}
.step-n{font-family:'Barlow Condensed',sans-serif;font-size:2.5rem;font-weight:800;color:var(--acc);line-height:1;margin-bottom:10px;}
.step h4{font-family:'Barlow Condensed',sans-serif;font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;}
.step p{font-size:.85rem;color:var(--sub);}
.step-arrow{display:flex;align-items:center;justify-content:center;width:32px;font-size:1.4rem;color:var(--acc);padding-top:36px;flex-shrink:0;}
.contact{padding:90px 0;background:var(--bg2);}
.cw{display:grid;grid-template-columns:1fr 1.2fr;gap:72px;align-items:start;}
.ci h2{font-family:'Barlow Condensed',sans-serif;font-size:clamp(2rem,4vw,2.8rem);font-weight:800;text-transform:uppercase;letter-spacing:-1px;margin-bottom:16px;line-height:1.05;}
.ci p{color:var(--sub);margin-bottom:24px;}
.cd{display:flex;align-items:center;gap:12px;margin-bottom:12px;font-size:.9rem;color:var(--text);}
.cd i{font-size:17px;color:var(--acc);flex-shrink:0;}
.cd a{color:var(--text);}
.cd a:hover{color:var(--acc);}
.hours-box{margin-top:24px;padding:16px 20px;background:rgba(250,204,21,.07);border:1px solid var(--border);border-radius:3px;}
.hours-box strong{display:block;font-family:'Barlow Condensed',sans-serif;font-size:.82rem;letter-spacing:2px;text-transform:uppercase;color:var(--acc);margin-bottom:6px;}
.hours-box span{display:block;font-size:.88rem;color:var(--sub);}
.cf{background:var(--card);padding:36px;border:1px solid var(--border);}
.fg{margin-bottom:16px;}
.fg label{display:block;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:7px;}
.fg input,.fg textarea{width:100%;padding:12px 14px;font-family:'Inter',sans-serif;font-size:.9rem;color:var(--text);background:rgba(250,204,21,.04);border:1px solid var(--border);border-radius:3px;outline:none;transition:border-color var(--t),box-shadow var(--t);}
.fg input::placeholder,.fg textarea::placeholder{color:var(--muted);}
.fg input:focus,.fg textarea:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(250,204,21,.12);}
.fg textarea{resize:vertical;min-height:120px;}
.footer{padding:36px 0;border-top:2px solid var(--acc);background:var(--bg);}
.footer .container{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;}
.footer .brand em{color:var(--acc);font-style:normal;}
.footer p{font-size:.82rem;color:var(--muted);}
.footer .dh strong{color:var(--acc2);}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease;}
.reveal.visible{opacity:1;transform:translateY(0);}
@media(max-width:900px){.cw{grid-template-columns:1fr;}.svc-grid{grid-template-columns:1fr;}
.nav-links{display:none;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:rgba(22,22,22,.98);padding:20px 28px;border-bottom:2px solid var(--acc);}
.nav-links.open{display:flex;}.burger{display:flex;}
.steps-row{flex-direction:column;}.step{border:1px solid var(--border) !important;margin-bottom:2px;}.step-arrow{display:none;}}
@media(max-width:600px){.cf{padding:22px 16px;}.trust-badges{flex-direction:column;}}
