@layer bricks {} #brx-content {margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0} .content-area {margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0}.hiba-attendance-design{font-family:var(--hiba-font-system)}.hiba-attendance-design .custom-scrollbar::-webkit-scrollbar{width:5px;height:5px}.hiba-attendance-design .custom-scrollbar::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:9999px}.hiba-attendance-design{overflow-x:clip}.hiba-attendance-design .max-w-7xl{width:min(100%,1240px);max-width:1240px}.hiba-attendance-design .hiba-attendance-hero h1{ max-width:720px; font-size:clamp(48px,5vw,68px)!important; line-height:1.06!important; letter-spacing:-.035em!important; text-wrap:balance}.hiba-attendance-design .hiba-attendance-hero p{max-width:680px}.hiba-attendance-design .hiba-attendance-hero a{min-height:48px}.hiba-attendance-design [data-demo-control="true"]{cursor:default;user-select:none;pointer-events:none}.hiba-attendance-design .hiba-attendance-mockup>div:last-child{ border:1px solid #D0D5DD; box-shadow:0 18px 46px rgba(8,20,38,.10)!important}.hiba-attendance-design .hiba-attendance-benefits,.hiba-attendance-design .hiba-attendance-flow{padding-block:72px!important}.hiba-attendance-design .hiba-attendance-benefits h2,.hiba-attendance-design .hiba-attendance-flow h2{max-width:760px}.hiba-attendance-design .hiba-attendance-offline{ background:#081426!important; color:#FFFFFF!important}.hiba-attendance-design .hiba-attendance-offline h2,.hiba-attendance-design .hiba-attendance-offline h3,.hiba-attendance-design .hiba-attendance-offline strong{color:#FFFFFF!important}.hiba-attendance-design .hiba-attendance-offline p{color:rgba(255,255,255,.72)!important}.hiba-attendance-design .hiba-attendance-offline .text-slate-300{color:rgba(255,255,255,.78)!important}.hiba-attendance-design .hiba-attendance-offline .text-slate-400{color:rgba(255,255,255,.58)!important}.hiba-attendance-design .hiba-attendance-offline .bg-slate-900{ background:#111A2D!important; border-color:rgba(255,255,255,.12)!important}.hiba-attendance-design .hiba-attendance-entitlement{ background:#EEF4FF!important; border-color:#C7D7FE!important}.hiba-attendance-design .hiba-attendance-final{ background:#081426!important; color:#FFFFFF!important}.hiba-attendance-design .hiba-attendance-final h2{color:#FFFFFF!important}.hiba-attendance-design .hiba-attendance-final h2 span{color:#5B8CFF!important}.hiba-attendance-design .hiba-attendance-final p,.hiba-attendance-design .hiba-attendance-final .text-slate-400{color:rgba(255,255,255,.72)!important}.hiba-attendance-design .hiba-attendance-final a:first-child{ background:#155EEF!important; color:#FFFFFF!important; border-color:#155EEF!important}.hiba-attendance-design .hiba-attendance-final a:last-child{ background:rgba(255,255,255,.10)!important; color:#FFFFFF!important; border-color:rgba(255,255,255,.16)!important}@media(hover:hover) and (pointer:fine){ .hiba-attendance-design .hiba-attendance-final a:first-child:hover{background:#0F4FD6!important} .hiba-attendance-design .hiba-attendance-final a:last-child:hover{background:rgba(255,255,255,.16)!important}}@media(max-width:1100px){ .hiba-attendance-design .hiba-attendance-hero-grid{grid-template-columns:1fr!important} .hiba-attendance-design .hiba-attendance-hero-grid>*{grid-column:auto!important} .hiba-attendance-design .hiba-attendance-mockup{max-width:760px;margin-inline:auto} .hiba-attendance-design .hiba-attendance-hero h1{max-width:860px;font-size:clamp(46px,6.5vw,60px)!important}}@media(max-width:760px){ .hiba-attendance-design .hiba-attendance-hero{padding-top:32px!important;padding-bottom:52px!important} .hiba-attendance-design .hiba-breadcrumb{gap:6px!important;margin-bottom:18px!important} .hiba-attendance-design .hiba-breadcrumb>span:last-child{flex-basis:100%} .hiba-attendance-design .hiba-attendance-hero h1{font-size:clamp(38px,10.5vw,48px)!important;line-height:1.08!important} .hiba-attendance-design .hiba-attendance-hero .inline-flex.items-center.gap-2.px-3.5{ width:100%;justify-content:flex-start;white-space:normal;text-align:left;line-height:1.35 } .hiba-attendance-design .hiba-attendance-hero .grid.grid-cols-2.sm:grid-cols-4{ grid-template-columns:1fr!important } .hiba-attendance-design .hiba-attendance-mockup .bg-slate-900 .flex.items-center.justify-between{align-items:flex-start!important;flex-wrap:wrap} .hiba-attendance-design .hiba-attendance-mockup .bg-slate-50.border-b{ display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important } .hiba-attendance-design .hiba-attendance-mockup .bg-slate-50.border-b>div{width:100%;text-align:center} .hiba-attendance-design .hiba-attendance-mockup .p-3.bg-slate-50.border-t{ display:grid!important;grid-template-columns:1fr!important } .hiba-attendance-design .hiba-attendance-mockup .p-3.bg-slate-50.border-t>div{display:grid!important;grid-template-columns:1fr!important} .hiba-attendance-design .hiba-attendance-mockup [data-demo-control="true"]{width:100%!important;justify-content:center!important} .hiba-attendance-design .hiba-attendance-offline{padding-block:56px!important} .hiba-attendance-design .hiba-attendance-offline .grid.grid-cols-3{grid-template-columns:1fr!important} .hiba-attendance-design .hiba-attendance-deploy{padding-block:56px!important} .hiba-attendance-design .hiba-attendance-final{padding-block:56px!important} .hiba-attendance-design .hiba-attendance-final h2{font-size:36px!important;line-height:1.1!important} .hiba-attendance-design .hiba-attendance-final .flex.flex-wrap.items-center.justify-center.gap-4{ display:grid!important;grid-template-columns:1fr!important;width:100%!important;max-width:480px } .hiba-attendance-design .hiba-attendance-final .flex.flex-wrap.items-center.justify-center.gap-4>a{width:100%!important}}@media(max-width:430px){ .hiba-attendance-design .max-w-7xl{padding-inline:14px!important} .hiba-attendance-design .hiba-attendance-mockup .grid.grid-cols-2.sm:grid-cols-4{grid-template-columns:1fr 1fr!important}}.hiba-attendance-design .hiba-attendance-benefits,.hiba-attendance-design .hiba-attendance-flow,.hiba-attendance-design .hiba-attendance-offline,.hiba-attendance-design .hiba-attendance-deploy,.hiba-attendance-design .hiba-attendance-final{ padding-block:64px!important;}.hiba-attendance-design .hiba-attendance-benefits>div,.hiba-attendance-design .hiba-attendance-flow>div,.hiba-attendance-design .hiba-attendance-offline>div,.hiba-attendance-design .hiba-attendance-deploy>div{ width:min(100%,1240px);}.hiba-attendance-design .hiba-attendance-benefits .mb-16{margin-bottom:40px!important}.hiba-attendance-design .hiba-attendance-flow .mb-12{margin-bottom:32px!important}.hiba-attendance-design .hiba-attendance-benefits .grid>div,.hiba-attendance-design .hiba-attendance-flow .grid>div{ min-height:100%;}.hiba-attendance-design .hiba-attendance-offline h2{ max-width:680px; font-size:clamp(38px,4vw,54px)!important; line-height:1.08!important;}.hiba-attendance-design .hiba-attendance-offline .lg:col-span-6:last-child{ padding:28px!important;}.hiba-attendance-design .hiba-attendance-deploy h2{ max-width:760px; font-size:clamp(38px,4vw,54px)!important; line-height:1.08!important;}.hiba-attendance-design .hiba-attendance-deploy .lg:col-span-5>div{ padding:28px!important;}.hiba-attendance-design .hiba-attendance-final{ min-height:auto!important;}.hiba-attendance-design .hiba-attendance-final h2{ max-width:760px;}@media(max-width:760px){ .hiba-attendance-design .hiba-attendance-benefits, .hiba-attendance-design .hiba-attendance-flow, .hiba-attendance-design .hiba-attendance-offline, .hiba-attendance-design .hiba-attendance-deploy, .hiba-attendance-design .hiba-attendance-final{ padding-block:48px!important; } .hiba-attendance-design .hiba-attendance-benefits .mb-16, .hiba-attendance-design .hiba-attendance-flow .mb-12{margin-bottom:28px!important} .hiba-attendance-design .hiba-attendance-benefits .grid, .hiba-attendance-design .hiba-attendance-flow .grid{gap:16px!important}}.hiba-attendance-design .hiba-material-icon{ display:inline-block; flex:none; vertical-align:-0.125em; pointer-events:none;}