/*
Theme Name: Two-iT Onepage
Author: Two-iT
Description: Zakelijk onepage thema met originele huisstijl en driedimensionale iconen.
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: two-it
*/
:root{--gold:#f8c631;--ink:#17191c;--muted:#aeb0b5;--line:#ffffff1a;--bg:#131517}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:120px}body{margin:0;background:var(--bg);color:#fff;font:16px/1.7 Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}a,button,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #daab21;outline-offset:6px}svg{width:24px;height:24px;flex-shrink:0}.wrap{width:min(1280px,88%);margin:auto}.skip{position:absolute;left:-9999px}.skip:focus{left:20px;top:20px;z-index:100;background:#fff;color:#111;padding:12px}header{position:sticky;top:16px;z-index:20;width:min(1320px,94%);margin:16px auto 0;border:1px solid #ffffff1c;border-radius:19px;background:linear-gradient(125deg,#292b2df2,#1a1c1ff5);box-shadow:0 12px 45px #0005,inset 0 1px #ffffff0e;backdrop-filter:blur(18px)}nav{height:88px;display:flex;align-items:center;justify-content:space-between;gap:30px}header .wrap{width:94%}.logo img{width:176px;height:60px;object-fit:contain}.links{display:flex;gap:30px;align-items:center;font-size:14px}.links a:hover{color:var(--gold)}.nav-contact{border:1px solid #685b35;background:linear-gradient(135deg,#4b4126,#302c23);border-radius:9px;padding:11px 20px;box-shadow:inset 0 1px #ffffff15}.menu{display:none;color:#fff;border:1px solid #666;background:transparent;border-radius:8px;padding:7px 13px}main>.wrap{position:relative}.hero{display:grid;grid-template-columns:1fr 1.13fr;gap:10px;align-items:center;padding:60px 0 90px;min-height:660px}.eyebrow{font-size:12px;letter-spacing:2px;text-transform:uppercase;font-weight:700;color:var(--gold);display:flex;gap:10px;align-items:center}.eyebrow:before{content:'';width:18px;height:2px;background:currentColor}h1{font-size:clamp(49px,5.6vw,80px);font-weight:700;letter-spacing:-3.7px;line-height:1.05;margin:23px 0 25px}h1 span{background:linear-gradient(100deg,#fff0a4,#ffc02a);background-clip:text;color:transparent}p{margin:0 0 23px}.hero p{font-size:17px;color:#b6b9bd;max-width:450px}.actions{display:flex;align-items:center;gap:25px;margin-top:31px;flex-wrap:wrap}.button{font-weight:700;font-size:14px;color:#211c0b;display:inline-flex;gap:30px;align-items:center;justify-content:space-between;padding:16px 23px;border:1px solid #ffe698;border-radius:10px;background:linear-gradient(135deg,#ffe58c,#f4b719);box-shadow:0 7px 0 #91680c,0 15px 28px #e6ad1323,inset 0 1px #fff8;transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-3px);box-shadow:0 10px 0 #91680c,0 19px 34px #e6ad1330}.textlink{font-size:14px;border-bottom:1px solid #6c7075;padding:8px 0}.visual{position:relative;width:100%;aspect-ratio:1.15;isolation:isolate}.visual img{width:116%;height:116%;object-fit:contain;position:absolute;left:-8%;top:-8%;mask-image:radial-gradient(ellipse at center,#000 46%,transparent 72%)}.float-label{position:absolute;display:flex;align-items:center;gap:13px;padding:15px 20px;background:linear-gradient(135deg,#34373bf2,#1d2024f0);border:1px solid #ffffff26;border-radius:14px;box-shadow:0 18px 40px #0006,inset 0 1px #ffffff19;backdrop-filter:blur(12px);font-size:14px;font-weight:700;animation:float 6s ease-in-out infinite}.float-label svg{color:var(--gold);width:31px;height:31px}.float-label small{display:block;font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#aeb3b9;font-weight:400;margin-bottom:2px}.label-cloud{top:10%;right:-2%}.label-support{bottom:7%;left:0;animation-delay:-3s}@keyframes float{50%{transform:translateY(-9px)}}.proof{display:grid;grid-template-columns:repeat(4,1fr);position:relative;z-index:2;margin:0 0 -52px;background:linear-gradient(110deg,#35373b,#222529);border:1px solid #ffffff21;border-radius:20px;box-shadow:0 24px 50px #0003,inset 0 1px #ffffff1c}.proof>a{display:flex;align-items:center;gap:15px;padding:27px 20px;position:relative}.proof>a+a:before{content:'';position:absolute;height:42%;top:29%;left:0;width:1px;background:#ffffff1f}.proof strong{font-size:14px;display:block}.proof small{display:block;color:#afb3b9;font-size:12px}.proof b{color:#c2a751;font-weight:400;margin-left:auto}.proof-icon{color:var(--gold);background:linear-gradient(145deg,#4b4637,#272720);box-shadow:3px 5px 9px #0004,inset 0 1px #bdb49433;border:1px solid #6a5f3c;border-radius:12px;padding:10px;display:flex}.proof-icon svg{width:28px;height:28px}.light{background:#f0f2f5;color:var(--ink)}.section{padding:100px 0}#diensten{padding-top:130px;background:radial-gradient(ellipse at 20% 35%,#fff,#eef0f4 75%)}.section-head{display:grid;grid-template-columns:1.2fr 1fr;gap:90px;align-items:end;margin-bottom:54px}h2{font-size:clamp(33px,3.5vw,49px);font-weight:700;letter-spacing:-1.9px;line-height:1.15;margin:17px 0 0}.light .eyebrow{color:#95710b}.section-head p{font-size:16px;color:#656b75;max-width:415px;margin:0}.services{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;align-items:start}.service{padding:30px;position:relative;border:1px solid #fff;border-radius:20px;background:linear-gradient(145deg,#fff,#f7f8fb);box-shadow:9px 13px 25px #1d2a4410,-5px -5px 20px #fff9;transition:transform .25s,box-shadow .25s}.service:hover,.service[open]{transform:translateY(-6px);box-shadow:9px 20px 30px #1d2a4420;border-color:#e1be51}.service-icon{display:flex;width:75px;height:75px;justify-content:center;align-items:center;border:1px solid #50545a;border-radius:20px;background:linear-gradient(135deg,#42464c,#1a1d21);color:var(--gold);box-shadow:5px 7px 0 #dadee4,8px 12px 20px #1c27332b,inset 0 2px #ffffff22;transform:rotate(-6deg);margin-bottom:32px;transition:transform .25s}.service-icon svg{width:37px;height:37px;filter:drop-shadow(0 2px 4px #0004)}.service:hover .service-icon{transform:rotate(0deg) translateY(-2px)}.service:nth-child(2) .service-icon,.service:nth-child(6) .service-icon{background:linear-gradient(135deg,#ffe995,#efb120);color:#322706;border-color:#e8c35a;box-shadow:5px 7px 0 #e9e0c4,8px 12px 20px #b895332b,inset 0 2px #ffffff66}.num{position:absolute;right:30px;top:28px;font-size:12px;color:#9298a1;letter-spacing:2px}.service h3{font-size:23px;line-height:1.25;letter-spacing:-.5px;margin:0 0 13px}.service p{font-size:15px;color:#6a707a;line-height:1.7;margin:0;max-width:265px}.service summary{list-style:none;cursor:pointer;padding-bottom:32px}.service summary::-webkit-details-marker{display:none}.service summary:after{content:'+';position:absolute;right:26px;bottom:21px;border:1px solid #dde1e7;border-radius:50%;width:31px;height:31px;text-align:center;line-height:28px;font-size:23px;color:#636a73;background:#fff}.service[open] summary:after{content:'−'}.extra{border-top:1px solid #dce0e6;padding:20px 0 25px}.extra a{display:block;font-size:14px;font-weight:bold;margin-top:15px}.cloud{display:grid;grid-template-columns:.95fr 1fr;gap:110px;align-items:center}#cloud{background:radial-gradient(ellipse at 5% 50%,#3e352124,transparent 60%)}.cloud-card{position:relative;border:1px solid #ffffff23;border-radius:28px;padding:44px;background:linear-gradient(135deg,#35373b,#202226 75%);box-shadow:18px 18px 0 -2px #131517,18px 18px 0 -1px #ffffff13,30px 34px 50px #0004,inset 0 1px #ffffff17;transform:rotate(-3deg)}.cloud-emblem{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#ffe48d,#e4a81a);color:#443209;box-shadow:0 6px 0 #866214,0 15px 25px #0004,inset 0 1px #fff9;border-radius:18px;width:80px;height:80px;margin-bottom:28px}.cloud-emblem svg{width:43px;height:43px}.cloud-number{font-size:clamp(100px,10vw,145px);line-height:1;font-weight:700;letter-spacing:-8px}.cloud-number span{color:var(--gold);font-size:.55em;letter-spacing:-3px}.cloud-statement{font-size:20px;margin-top:20px;line-height:1.4;max-width:300px}.cloud-facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}.cloud-facts span{font-size:12px;color:#d2c8ac;border:1px solid #695d40;border-radius:6px;padding:5px 10px;background:#3e362844}.cloud p{color:#aeb4bd;margin:25px 0}.about{display:grid;grid-template-columns:1fr 1.1fr;gap:110px;align-items:center}.about-icon{width:90px;height:90px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#fff,#e5e8ee);border:1px solid #fff;border-radius:25px;box-shadow:8px 8px 0 #d7dbe2,12px 14px 28px #313c4922,inset 0 2px #fff;color:#626971;margin-bottom:35px;transform:rotate(-8deg)}.about-icon svg{width:45px;height:45px}.about p{font-size:18px;color:#727884;line-height:1.85}.about strong{font-weight:500;color:#252b35}.about-note{display:flex;align-items:center;gap:17px;border-top:1px solid #d4d9e0;padding-top:25px;font-size:14px;color:#4c5360}.monogram{display:flex;background:#e3e6ed;padding:12px;border-radius:12px;color:#586170}.contact{background:var(--bg);padding:68px 0}.contact>.wrap{display:grid;grid-template-columns:1.2fr 1fr;gap:80px;align-items:center;border-radius:28px;padding:57px 60px;background:radial-gradient(ellipse at 85% 0%,#fff0a3,transparent 60%),linear-gradient(130deg,#fbd869,#edb21f);color:#28210f;border:1px solid #ffe8a0;box-shadow:0 9px 0 #886716,0 24px 60px #0004,inset 0 2px #fff7;position:relative}.contact h2{font-size:clamp(37px,4vw,55px);margin-top:0}.contact p{margin:20px 0 0;max-width:410px;font-size:16px;color:#594a23}.contact-icon{display:flex;align-items:center;justify-content:center;width:58px;height:58px;background:linear-gradient(135deg,#443c25,#292719);color:#ffdb66;border-radius:16px;box-shadow:5px 6px 0 #c79c37,inset 0 1px #fff3;transform:rotate(7deg);margin:0 0 20px auto}.contact-icon svg{width:30px;height:30px}.contact-links a{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid #92702055;font-size:23px;letter-spacing:-.6px}.contact-links small{font-size:13px;margin-top:17px;display:block}footer{padding:30px 0}.footer-top{display:flex;gap:25px;justify-content:space-between;align-items:center;padding:20px 0 35px}.footer-top p{margin:0;color:#a7adb6;font-size:14px}.footer-bottom{border-top:1px solid #ffffff18;padding-top:24px;display:flex;gap:20px;justify-content:space-between;font-size:12px;color:#949ca7}.footer-bottom div{display:flex;gap:22px}.admin-bar header{top:48px}@media(max-width:1050px){.links{gap:18px}.hero{min-height:590px}.proof>a{gap:10px;padding:22px 13px}.proof b{display:none}.proof-icon{padding:8px}.proof strong{font-size:13px}.proof small{font-size:11px}.section-head,.cloud,.about{gap:50px}.label-cloud{right:-3%;top:5%}.float-label{padding:11px 13px}.services{gap:18px}.service{padding:25px}.contact>.wrap{padding:45px;gap:45px}}@media(max-width:760px){.wrap{width:88%}header{top:10px;border-radius:14px}nav{height:74px}.logo img{width:150px;height:52px}.menu{display:block}.links{display:none;position:absolute;top:80px;left:0;right:0;background:#24272c;padding:25px;flex-direction:column;align-items:stretch;border:1px solid #ffffff25;border-radius:14px;box-shadow:0 20px 30px #0006}.links.open{display:flex}.hero{grid-template-columns:1fr;gap:15px;padding:45px 0 38px;min-height:0}h1{font-size:clamp(44px,9vw,66px);letter-spacing:-2.6px}.hero p{font-size:16px}.visual{width:100%;aspect-ratio:1.25;margin-top:16px}.visual img{width:112%;height:112%;left:-6%;top:-6%}.label-cloud{right:0;top:0}.label-support{left:0;bottom:0}.float-label{font-size:12px}.float-label small{font-size:10px}.float-label svg{width:24px;height:24px}.proof{grid-template-columns:1fr 1fr;margin-bottom:-65px;border-radius:16px}.proof>a{padding:18px 14px}.proof>a:nth-child(3),.proof>a:nth-child(4){border-top:1px solid #ffffff18}.proof>a:nth-child(3):before{display:none}.proof small{font-size:11px}.proof-icon svg{width:23px;height:23px}.proof strong{font-size:12px}.section{padding:70px 0}#diensten{padding-top:115px}.section-head,.cloud,.about{grid-template-columns:1fr;gap:27px}.section-head{margin-bottom:35px}.services{grid-template-columns:1fr 1fr;gap:15px}.service{padding:23px}.service h3{font-size:20px}.service p{font-size:14px}.service-icon{width:61px;height:61px;border-radius:17px}.service-icon svg{width:30px;height:30px}.service summary{padding-bottom:28px}.num{right:18px;top:20px}.cloud-card{padding:35px;width:90%;margin:0 auto 30px;transform:rotate(-2deg)}.cloud-number{font-size:120px}.about-icon{width:65px;height:65px;border-radius:18px;margin-bottom:26px}.about-icon svg{width:35px;height:35px}.about p{font-size:16px}.contact{padding:30px 0 50px}.contact>.wrap{grid-template-columns:1fr;padding:32px 28px;gap:28px;border-radius:21px}.contact-icon{display:none}.contact-links a{font-size:21px}.footer-top,.footer-bottom{flex-direction:column;align-items:flex-start}.footer-bottom div{flex-wrap:wrap;gap:16px}.admin-bar header{top:56px}}@media(max-width:480px){.services{grid-template-columns:1fr}.service-icon{width:69px;height:69px}.service h3{font-size:23px}.service p{font-size:15px;max-width:none}.proof>a{gap:8px;padding:16px 10px}.proof-icon{padding:6px;border-radius:9px}.proof-icon svg{width:20px;height:20px}.proof small{font-size:10px}.proof strong{font-size:11px}.actions{gap:18px}.button{padding:14px 19px}.eyebrow{font-size:11px;letter-spacing:1.6px}.label-cloud{top:0}.label-support{bottom:-3%}.float-label{padding:9px 11px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
