@font-face{font-family:Onest;src:url('assets/Onest.woff2');font-weight:100 900;font-display:swap}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#202224;background:#fff;font:16px/1.55 Onest,Arial,sans-serif}h1,h2,h3,p,figure{margin:0}h1,h2,h3{line-height:1.06;letter-spacing:-.055em;font-weight:550}h2{font-size:clamp(38px,4.5vw,72px)}h3{font-size:25px;letter-spacing:-.035em}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{cursor:pointer;color:inherit;border:0;background:none}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid #917700;outline-offset:5px}header{height:100px;padding:25px 5%;display:flex;align-items:center;gap:45px;position:relative;z-index:2}header:before{content:'';position:absolute;inset:0 auto 0 0;width:28%;background:#f4df38;z-index:-1}.brand{font-size:19px;font-weight:750;letter-spacing:-.05em;line-height:1}.brand span{display:inline-block;margin-left:10px}nav{margin-left:auto;display:flex;gap:32px;font-size:14px}.header-cta{font-size:14px;border-bottom:1px solid;padding:5px 0}.hero{height:calc(100svh - 100px);min-height:620px;position:relative;display:grid;grid-template-columns:48% 52%;padding:0 7% 70px;align-items:center;isolation:isolate}.accent-field{position:absolute;inset:0 auto 0 0;width:28%;background:#f4df38;z-index:-1}.hero-photo{height:min(650px,calc(100svh - 150px));min-height:500px;align-self:end;position:relative;left:5%;mix-blend-mode:multiply}.hero-photo img{display:block;width:100%;height:100%;object-fit:contain}.hero-copy{padding-left:6%;max-width:690px}.tag{background:#202224;color:white;display:inline-block;padding:5px 9px;font-size:11px;letter-spacing:.08em;margin-bottom:23px}h1{font-size:clamp(54px,5.65vw,100px);line-height:.99;letter-spacing:-.065em}.accent-dot{color:#cbb800}.slogan{font-size:clamp(19px,1.6vw,26px);line-height:1.35;letter-spacing:-.035em;margin-top:26px}.intro{color:#6b7074;max-width:37ch;margin:25px 0 30px;font-size:15px}.button{background:#202224;color:white;padding:18px 24px;display:inline-flex;gap:40px;justify-content:space-between;align-items:center;font-size:14px;transition:background .2s}.button:hover{background:#454a4e}.button span{font-size:24px;line-height:1}.side-note{position:absolute;left:3%;top:42%;writing-mode:vertical-rl;transform:rotate(180deg);font-size:10px;letter-spacing:.1em}.scroll{position:absolute;bottom:24px;left:54%;font-size:11px;display:flex;gap:40px}.hero-index{position:absolute;bottom:22px;right:4%;font-size:13px}.hero-index span{color:#919699}.section{padding:100px 8%}.eyebrow{display:block;font-size:12px;letter-spacing:.045em;margin-bottom:50px}.heading-row{display:grid;grid-template-columns:1.2fr 1fr;gap:70px;align-items:end;margin-bottom:60px}.heading-row p{color:#747a7d;max-width:38ch}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #dce0e1}.service-grid article{padding:30px 24px;border-right:1px solid #dce0e1;display:flex;flex-direction:column}.service-grid article:first-child{padding-left:0}.service-grid article:last-child{border:0;padding-right:0}.service-grid article>span{font-size:13px;color:#8a9094;margin-bottom:55px}.service-grid h3{min-height:2.3em;margin-bottom:18px}.service-grid p{font-size:15px;color:#6b7276;margin-bottom:30px}.service-grid button{margin-top:auto;text-align:left;padding:14px 0 0;border-top:1px solid #dce0e1;display:flex;justify-content:space-between;font-size:14px}.service-grid b{font-size:21px;font-weight:400}.panel-story{display:grid;grid-template-columns:1fr 1fr;background:#202427;color:#fff}.panel-story figure{position:relative;min-height:640px}.panel-story img{position:absolute;width:100%;height:100%;object-fit:cover}.panel-story figcaption{position:absolute;bottom:24px;left:24px;background:#f4df38;color:#202224;padding:10px;font-size:11px}.panel-copy{padding:70px 12%}.panel-copy .eyebrow{color:#f4df38;margin-bottom:30px}.panel-copy h2{font-size:clamp(38px,3.5vw,58px);margin-bottom:30px}.panel-copy>p{color:#bdc4c8;max-width:42ch}.principle{display:flex;gap:20px;border-top:1px solid #ffffff26;padding-top:25px;margin-top:25px}.principle>span{color:#f4df38}.principle h3{font-size:20px;margin-bottom:10px}.principle p{font-size:14px;color:#bdc4c8}.tools{display:grid;grid-template-columns:1fr 1.15fr;gap:8%;align-items:center}.tools em{font-style:normal;color:#858b8f}.tools-copy>p{margin:30px 0;max-width:34ch;color:#687176}.tools img{display:block;width:100%;aspect-ratio:1;object-fit:cover}.tools figcaption{font-size:11px;color:#7a8388;margin-top:14px}.text-link{font-size:14px;border-bottom:1px solid;padding-bottom:6px}.process{background:#f4f5f5}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:50px;margin-top:65px}.steps b{font-weight:400;font-size:42px;color:#9a9fa2;letter-spacing:-.05em}.steps h3{margin:25px 0 18px}.steps p{font-size:15px;color:#6a7379;max-width:34ch}.faq{display:grid;grid-template-columns:1fr 1fr;gap:9%}.faq .eyebrow{margin-bottom:30px}details{border-bottom:1px solid #dce0e1}details:first-child{border-top:1px solid #dce0e1}summary{display:flex;justify-content:space-between;gap:20px;list-style:none;cursor:pointer;padding:24px 0;font-size:17px}summary::-webkit-details-marker{display:none}summary span{font-size:23px}details[open] summary span{transform:rotate(45deg)}details p{padding:0 20px 25px 0;color:#717a80;font-size:15px}.contact{background:#f4df38}.contact>div{display:flex;gap:50px;justify-content:space-between;align-items:end}.contact h2{font-size:clamp(42px,5.8vw,95px)}.contact h2 span{color:#fff}footer{padding:35px 5%;display:flex;justify-content:space-between;align-items:center;gap:30px;font-size:12px}footer>a:first-child{font-weight:700;font-size:17px}footer p{color:#7b8185;max-width:45ch}dialog{border:0;padding:40px;max-width:520px;width:calc(100% - 30px);max-height:90svh}dialog::backdrop{background:#10182099;backdrop-filter:blur(4px)}dialog h2{font-size:39px}.close{position:absolute;right:12px;top:10px;font-size:28px}.demo{font-size:13px;color:#69737a;margin:20px 0}form{display:grid;gap:16px}label{display:grid;gap:6px;font-size:14px}input,textarea{width:100%;border:1px solid #cad0d3;padding:12px;background:#f7f8f8;font-size:16px}form [role=status]{font-size:14px}body:has(dialog[open]){overflow:hidden}
@media(max-width:1000px){header{gap:25px}nav{gap:18px}.hero{padding-inline:4%;grid-template-columns:47% 53%}.hero-copy{padding-left:3%}.hero h1{font-size:6.1vw}.hero-photo{left:0}.side-note{left:1%}.service-grid{grid-template-columns:1fr 1fr;gap:25px}.service-grid article{border-bottom:1px solid #dce0e1;padding:25px 0!important;border-right:0}.service-grid article>span{margin-bottom:25px}.panel-copy{padding:50px 8%}.section{padding:75px 6%}.contact>div{display:block}.contact .button{margin-top:35px}.tools{gap:5%}}
@media(max-width:700px){header{height:86px;padding:20px 6%;gap:20px}header:before{width:42%}.brand{font-size:16px}nav{display:none}.header-cta{margin-left:auto;font-size:12px}.hero{min-height:0;height:auto;display:flex;flex-direction:column;padding:40px 6% 75px;align-items:stretch}.accent-field{width:42%;height:430px;top:390px}.hero-copy{order:0;padding:0}.hero h1{font-size:clamp(48px,12vw,80px)}.tag{font-size:10px;margin-bottom:18px}.slogan{font-size:22px;margin-top:22px}.intro{font-size:15px;margin:18px 0 24px}.hero-photo{order:1;height:450px;min-height:0;width:100%;margin-top:25px}.hero-photo img{object-position:center}.side-note{display:none}.scroll{left:6%;bottom:23px;font-size:10px;gap:20px}.hero-index{font-size:11px;right:6%}.section{padding:60px 6%}.eyebrow{margin-bottom:32px;font-size:11px}.heading-row{grid-template-columns:1fr;gap:25px;margin-bottom:35px}.service-grid{gap:24px}.service-grid h3{font-size:23px}.service-grid p{font-size:14px}.service-grid article>span{margin-bottom:25px}.panel-story{grid-template-columns:1fr}.panel-story figure{min-height:0;height:330px}.panel-copy{padding:45px 6%}.panel-copy h2{font-size:42px}.tools{grid-template-columns:1fr;gap:35px}.tools img{aspect-ratio:4/3}.steps{grid-template-columns:1fr;gap:25px;margin-top:35px}.steps article{border-top:1px solid #d6dcdf;padding-top:20px}.steps b{font-size:30px}.steps h3{margin:15px 0}.steps p{max-width:none}.faq{grid-template-columns:1fr;gap:35px}.contact h2{font-size:11vw}.button{width:100%;gap:20px}.contact .eyebrow{margin-bottom:30px}footer{flex-wrap:wrap;padding:30px 6%}footer p{order:3;width:100%}dialog{padding:35px 24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* Desktop: a sequence of horizontal rooms, mobile retains the vertical page. */
@media(min-width:1001px){
 body{height:100dvh;overflow:hidden}header{height:90px;background:#fff}
 main{display:flex;height:calc(100dvh - 90px);overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#a9acac #eff0ed;overscroll-behavior-x:contain}
 main>section{flex:0 0 100%;width:100%;min-width:0;height:100%;min-height:0;overflow-y:auto;overscroll-behavior-y:contain}
 .hero{padding-bottom:60px}.hero-photo{height:calc(100dvh - 160px);min-height:0;max-height:780px}.hero h1{font-size:clamp(54px,5.65vw,100px)}
 .section{padding:clamp(28px,5vh,65px) 7%}.eyebrow{margin-bottom:28px}.heading-row{margin-bottom:30px}
 h2{font-size:clamp(38px,4.1vw,65px)}.service-grid article>span{margin-bottom:28px}.service-grid article{padding-top:24px}.service-grid h3{font-size:23px}
 .panel-story figure{min-height:100%}.panel-copy{padding:32px 9%}.panel-copy h2{margin-bottom:20px}.panel-copy .eyebrow{margin-bottom:22px}.principle{padding-top:16px;margin-top:16px}.principle h3{margin-bottom:7px}
 .tools img{height:min(62vh,640px);aspect-ratio:auto;object-fit:cover}.tools-copy>p{margin:22px 0}.tools h2{font-size:clamp(36px,3.8vw,60px)}
 .steps{margin-top:38px}.steps h3{margin-top:18px}.faq{align-content:center}
 .contact{display:flex;flex-direction:column}.contact>div{margin-block:auto}.contact footer{padding:28px 0 0;margin-top:35px;border-top:1px solid #20222433}.contact footer p{color:#555c46}
}
@media(max-width:1000px){.contact footer{padding:45px 0 0}.scroll span{font-size:0}.scroll span:after{content:'↓';font-size:16px}}

/* Approved yellow palette with dark lettering. */
.brand,.side-note,.contact,.panel-story figcaption{color:#202224}.panel-copy .eyebrow,.principle>span{color:#f4df38}.contact footer p{color:#555c46}.contact footer{border-top-color:#20222433}.contact h2 span{color:#202224}

.services-photo img,.process-photo img{display:block;width:100%;height:100%;object-fit:cover}.services-photo,.process-photo{min-width:0;overflow:hidden}.services-photo{height:260px;margin-bottom:35px}.process-photo{height:300px;margin-bottom:35px}
.cable-art{display:none;pointer-events:none}
@media(min-width:1001px){
 main{position:relative}
 .hero-photo{height:min(873.6px,calc((100dvh - 160px)*1.12));max-height:none;width:112%;left:0;transform:translateX(var(--hero-shift,0px))}
 .services{display:grid;grid-template-columns:31% 1fr;gap:5%;padding:38px 5% 115px;align-items:stretch}
 .services-photo{height:100%;margin:0}.services-content{align-self:center}.services .heading-row{display:block;margin-bottom:28px}.services h2{font-size:clamp(35px,3.5vw,58px)}.services .heading-row p{margin-top:18px;max-width:45ch;font-size:14px}.services .eyebrow{margin-bottom:20px}
 .services .service-grid{grid-template-columns:1fr 1fr;gap:16px 24px;border:0}.services .service-grid article{padding:12px 0 0!important;border:0;border-top:1px solid #dce0e1}.services .service-grid article>span{display:none}.services .service-grid h3{min-height:0;font-size:21px;margin-bottom:10px}.services .service-grid p{font-size:13px;margin-bottom:12px}.services .service-grid button{padding-top:8px}
 .process{display:grid;grid-template-columns:47% 1fr;padding:0;gap:0}.process-photo{height:100%;margin:0}.process-content{padding:38px 10%;align-self:center}.process h2{font-size:clamp(34px,3.1vw,52px)}.process .steps{display:block;margin-top:25px}.process .steps article{display:grid;grid-template-columns:40px 1fr;gap:0 12px;border-top:1px solid #d6dcdf;padding:16px 0}.process .steps b{grid-row:1/3;font-size:24px}.process .steps h3{margin:0 0 8px;font-size:21px}.process .steps p{max-width:none;font-size:14px}.process .eyebrow{margin-bottom:24px}
 .cable-art{display:block;position:absolute;left:0;top:0;z-index:1;overflow:visible}
}

@media(min-width:1001px){.contact{padding-bottom:110px}}


@media(min-width:1001px){.contact footer{border-top-color:transparent}}


/* Fit the horizontal panels to the catalogue preview as well as full windows. */
@media(min-width:1001px){
 .hero-photo{height:100%;max-height:100%;align-self:stretch;min-height:0}
 .hero{padding-top:0}
}
@media(min-width:1001px) and (max-height:850px){
 .services{padding:24px 5% 65px}.services .heading-row{margin-bottom:18px}
 .services .eyebrow{margin-bottom:12px}.services h2{font-size:36px}
 .services .heading-row p{margin-top:12px}.services .service-grid{gap:12px 24px}
 .services .service-grid p{margin-bottom:8px}
}

/* якщо кабелю ніде пройти, не перерізаючи текст — його не малюємо,
   і підвал контактів повертає собі звичайну верхню лінію */
@media(min-width:1001px){main.no-cable .contact footer{border-top-color:#20222433}}
