@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');
@import url('https://jevelin.shufflehound.com/corporate-accounting/wp-content/cache/autoptimize/32/css/autoptimize_0c3706836102546eb4f7ff9cde1ae1e7.css');
:root { --pont-blue:#436dfe; --pont-ink:#30314f; --pont-muted:#838383; }
* { box-sizing:border-box; }
body { background:#fff; color:var(--pont-ink); font-family:'Raleway','Helvetica',Arial,sans-serif; font-size:14px; font-weight:400; line-height:1.7; margin:0; }
.integration-header { background:#fff; box-shadow:0 1px 0 rgba(35,47,86,.06); padding:20px 0; }
.integration-header .container, .integration-main .container { margin:0 auto; max-width:1170px; padding:0 20px; }
.integration-header .container { align-items:center; display:flex; justify-content:space-between; }
.integration-logo { background:url('../wp-content/uploads/sites/32/2019/10/logo-pont.svg') center left/contain no-repeat; color:transparent; display:block; font-size:0; height:60px; text-decoration:none; width:180px; }
.integration-logo span { display:none; }
.integration-nav { font-family:'Raleway',serif; }
.integration-nav a { color:#30314f; font-size:13px; font-weight:600; margin-left:25px; text-decoration:none; }
.integration-nav a:hover { color:var(--pont-blue); }
.integration-main { padding:82px 0 0; }
.integration-back { color:var(--pont-blue); display:inline-block; font-size:14px; font-weight:700; margin-bottom:38px; text-decoration:none; }
.integration-back:hover { color:#204ce4; }
.integration-grid { align-items:center; display:grid; gap:66px; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.integration-label { color:var(--pont-blue); font-family:'Raleway','Helvetica',Arial,sans-serif; font-size:13px; font-weight:700; letter-spacing:1.3px; text-transform:uppercase; }
h1, h2, h3 { font-family:'Raleway',serif; font-weight:700; }
h1 { color:var(--pont-ink); font-size:43px; line-height:1.18; margin:13px 0 19px; }
.integration-summary { color:var(--pont-muted); font-size:18px; line-height:1.7; margin:0 0 28px; }
.integration-actions { display:flex; flex-wrap:wrap; gap:12px; }
.button { background:var(--pont-blue); border-radius:5px; color:#fff; display:inline-block; font-family:'Raleway','Helvetica',Arial,sans-serif; font-size:14px; font-weight:600; line-height:60px; padding:0 40px; text-decoration:none; }
.button:hover { background:#204ce4; color:#fff; }
.button-secondary { background:#fff; box-shadow:0 8px 22px rgba(38,64,143,.1); color:var(--pont-ink); }
.button-secondary:hover { color:var(--pont-blue); }
.shot { background:#e9eef8; border-radius:8px; box-shadow:0 22px 50px rgba(38,64,143,.16); height:330px; overflow:hidden; position:relative; }
.shot img { height:100%; object-fit:cover; object-position:center 56%; transform:scale(1.17); width:100%; }
.shot:after { border:9px solid #fff; border-radius:8px; content:''; inset:0; pointer-events:none; position:absolute; }
.shot-event { background:#e6edff url('https://www.lyyti.com/hubfs/Website%20update%202024-2025/Mockups%202026/EN%20-%20In-person%20events%20main%20-%202026.svg') center/cover no-repeat; }
.shot-event:before { display:none; }
.shot-event:after { background:transparent; border:8px solid #fff; border-radius:8px; content:''; inset:0; position:absolute; }
.integration-benefits { background:#f7f9ff; margin-top:100px; padding:82px 0; }
.integration-benefits:before { background-color:#e9eef8; background-position:center; background-repeat:no-repeat; background-size:cover; border:8px solid #fff; border-radius:8px; box-shadow:0 18px 42px rgba(38,64,143,.14); content:''; display:block; height:300px; margin:0 auto 58px; max-width:960px; }
body:has(.shot img[src*="applicationId=411"]) .integration-benefits:before { background-image:url('https://appstore.superoffice.com/Image?imageId=46234&applicationId=411'); }
body:has(.shot img[src*="applicationId=60"]) .integration-benefits:before { background-image:url('https://appstore.superoffice.com/Image?imageId=56288&applicationId=60'),url('https://appstore.superoffice.com/Image?imageId=56289&applicationId=60'); background-position:left center,right center; background-size:50% 100%,50% 100%; }
body:has(.shot img[src*="applicationId=1081"]) .integration-benefits:before { background-image:url('https://appstore.superoffice.com/Image?imageId=55611&applicationId=1081'),url('https://appstore.superoffice.com/Image?imageId=55612&applicationId=1081'); background-position:left center,right center; background-size:50% 100%,50% 100%; }
body:has(.shot img[src*="applicationId=331"]) .integration-benefits:before { background-image:url('https://appstore.superoffice.com/Image?imageId=46225&applicationId=331'),url('https://appstore.superoffice.com/Image?imageId=46230&applicationId=331'); background-position:left center,right center; background-size:50% 100%,50% 100%; }
body:has(.shot img[src*="applicationId=487"]) .integration-benefits:before { background-image:url('https://appstore.superoffice.com/Image?imageId=46312&applicationId=487'),url('https://appstore.superoffice.com/Image?imageId=46313&applicationId=487'); background-position:left center,right center; background-size:50% 100%,50% 100%; }
body:has(.shot-event) .integration-benefits:before { background-image:url('https://www.lyyti.com/hubfs/Website%20update%202024-2025/Global/(EN)%20In-person%20reg+event%20website%20.svg'); }
.section-head { margin:0 auto 39px; max-width:680px; text-align:center; }
.section-head h2 { font-size:34px; margin:12px 0; }
.section-head p { color:var(--pont-muted); font-size:16px; line-height:1.7; margin:0; }
.benefit-grid { display:grid; gap:22px; grid-template-columns:repeat(3,1fr); }
.benefit { background:#fff; min-height:225px; padding:35px 25px; text-align:center; transition:box-shadow .35s ease; }
.benefit:hover { box-shadow:0 25px 45px rgba(0,0,0,.04); }
.benefit i { background:#e6ecff; border-radius:8px; color:var(--pont-blue); display:inline-block; font-size:28px; line-height:1; padding:18px 19px 14px; transition:all .4s ease-in-out; }
.benefit:hover i { background:var(--pont-blue); color:#fff; }
.benefit h3 { font-size:18px; margin:22px 0 9px; }
.benefit p { color:var(--pont-muted); font-size:15px; line-height:1.6; margin:0; }
.integration-footer { background:#292b33; color:rgba(255,255,255,.7); font-size:14px; padding:29px 20px; text-align:center; }
@media (max-width:767px) { .integration-header .container { display:block; text-align:center; } .integration-logo { background-position:center; margin:0 auto; } .integration-nav { margin-top:12px; } .integration-nav a { margin:0 9px; } .integration-main { padding:55px 0 0; } .integration-grid { gap:35px; grid-template-columns:1fr; } h1 { font-size:32px; } .shot { height:255px; } .integration-benefits { margin-top:60px; padding:60px 0; } .integration-benefits:before { height:175px; margin-bottom:40px; } .benefit-grid { grid-template-columns:1fr; } }
