.attendance-container{
    width:min(100%, 1280px);
    margin:0 auto;
    padding:0 64px;
}

.attendance-hero{
    display:flex;
    align-items:center;
    min-height:720px;
    padding:124px 0 76px;
    background:linear-gradient(61.07deg, #000000 -27.06%, #05041A 31.73%, #120C3C 91.84%);
}

.attendance-hero-grid{
    display:grid;
    grid-template-columns:552px minmax(460px, 550px);
    align-items:center;
    justify-content:space-between;
    gap:48px;
}

.attendance-hero-copy{
    display:flex;
    flex-direction:column;
    width:552px;
    min-height:460.3949890136719px;
}

.attendance-hero-copy h1{
    margin:0;
    color:#fff;
    font-family:Montserrat, Arial, sans-serif;
    font-size:48px;
    font-weight:700;
    letter-spacing:0;
    line-height:60px;
}

.attendance-hero-copy h1 span,
.attendance-heading h2 span,
.attendance-final-cta h2 span{
    color:#f47a00;
}

.attendance-hero-copy p{
    max-width:560px;
    margin:30.8px 0 0;
    color:#a4aec4;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:18px;
    font-weight:400;
    letter-spacing:0;
    line-height:28.8px;
}

.attendance-tags{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    max-width:500px;
    margin-top:30.8px;
}

.attendance-tags span{
    display:inline-flex;
    align-items:center;
    min-height:24px;
    padding:0 12px;
    border-radius:4px;
    background:#2d3448;
    color:#e1e6f0;
    font-size:11px;
    font-weight:700;
}

.attendance-hero-actions,
.attendance-final-actions{
    display:flex;
    gap:16px;
    margin-top:30.8px;
}

.attendance-hero-actions .btn-primary-lignum,
.attendance-hero-actions .btn-secondary-lignum{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:217px;
    height:56px;
    min-width:217px;
    min-height:56px;
    padding:16px 32px;
    border-radius:8px;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:16px;
    font-weight:700;
    letter-spacing:0;
    line-height:24px;
    white-space:nowrap;
}

.attendance-hero-media{
    position:relative;
    justify-self:end;
    overflow:hidden;
    width:min(100%, 550px);
    height:333.5648193359375px;
    border:1px solid #FFFFFF0D;
    border-radius:16px;
    background:#101827;
    box-shadow:0 24px 70px rgba(0,0,0,.32), 0 0 74px rgba(244,122,0,.12);
}

.attendance-hero-media img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.attendance-heading{
    max-width:760px;
    margin:0 auto 64px;
    text-align:center;
}

.attendance-heading h2{
    margin:0;
    color:#f7f7fb;
    font-family:Montserrat, Arial, sans-serif;
    font-size:32px;
    font-weight:600;
    letter-spacing:0;
    line-height:41.6px;
}

.attendance-heading p{
    margin:16px auto 0;
    color:#8791a8;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:18px;
    font-weight:400;
    letter-spacing:0;
    line-height:28.8px;
    text-align:center;
}

.attendance-problems,
.attendance-exceptions{
    padding:96px 0 104px;
    background:#121039;
}

.attendance-card-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:20px;
}

.attendance-card,
.attendance-method-card,
.attendance-status-grid article,
.attendance-info-grid article{
    border:1px solid rgba(255,255,255,.06);
    border-radius:8px;
    background:#151a2d;
}

.attendance-card{
    min-height:214px;
    padding:28px 24px;
}

.attendance-card-wide{
    grid-column:span 2;
}

.attendance-card img{
    display:block;
    width:32px;
    height:32px;
    object-fit:contain;
}

.attendance-card i,
.attendance-method-card h3 i,
.attendance-info-grid i{
    color:#f47a00;
    font-size:22px;
}

.attendance-method-card h3 img{
    display:block;
    width:24px;
    height:24px;
    object-fit:contain;
}

.attendance-card h3,
.attendance-method-card h3,
.attendance-status-grid h3,
.attendance-info-grid h2{
    margin:28px 0 12px;
    color:#fff;
    font-size:18px;
    font-weight:800;
    line-height:1.24;
}

.attendance-card h3{
    font-family:Montserrat, Arial, sans-serif;
    font-size:20px;
    font-weight:400;
    letter-spacing:0;
    line-height:30px;
}

.attendance-card p,
.attendance-method-card span,
.attendance-status-grid p,
.attendance-info-grid p{
    margin:0;
    color:#8f99ae;
    font-size:12px;
    font-weight:600;
    line-height:1.5;
}

.attendance-card p{
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:16px;
    font-weight:400;
    letter-spacing:0;
    line-height:25.6px;
}

.attendance-methods,
.attendance-flow,
.attendance-security{
    padding:102px 0 112px;
    background:#060516;
}

.attendance-method-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:44px;
    margin-bottom:58px;
}

.attendance-method-card{
    position:relative;
    overflow:hidden;
    min-height:280px;
    padding:36px;
    background:#151a2d;
}

.attendance-method-card::after{
    content:"";
    position:absolute;
    top:-80px;
    right:-50px;
    width:180px;
    height:180px;
    border-radius:50%;
    background:rgba(244,122,0,.08);
}

.attendance-method-card.teal::after{
    background:rgba(44,170,161,.1);
}

.attendance-method-card.teal h3 i{
    color:#2CAAA1;
}

.attendance-method-card h3{
    display:flex;
    align-items:center;
    gap:12px;
    margin:0 0 28px;
    font-family:Montserrat, Arial, sans-serif;
    font-size:24px;
    font-weight:400;
    letter-spacing:0;
    line-height:36px;
}

.attendance-method-card ol{
    display:grid;
    gap:22px;
    margin:0;
    padding:0;
    list-style:none;
    counter-reset:attendance-method;
}

.attendance-method-card li{
    position:relative;
    min-height:38px;
    padding-left:48px;
    counter-increment:attendance-method;
}

.attendance-method-card li:not(:last-child)::after{
    content:"";
    position:absolute;
    top:28px;
    bottom:-22px;
    left:14px;
    width:1px;
    background:rgba(244,122,0,.42);
}

.attendance-method-card.teal li:not(:last-child)::after{
    background:rgba(44,170,161,.42);
}

.attendance-method-card li::before{
    content:counter(attendance-method);
    position:absolute;
    top:0;
    left:0;
    display:flex;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    border:1px solid rgba(244,122,0,.42);
    border-radius:50%;
    color:#f47a00;
    font-size:12px;
    font-weight:800;
    z-index:1;
}

.attendance-method-card.teal li::before{
    border-color:rgba(44,170,161,.42);
    color:#2CAAA1;
}

.attendance-method-card strong{
    display:block;
    margin-bottom:6px;
    color:#dfe5f2;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:14px;
    font-weight:400;
    letter-spacing:0;
    line-height:21px;
}

.attendance-method-card span{
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:14px;
    font-weight:400;
    letter-spacing:0;
    line-height:21px;
}

.attendance-feature-image{
    overflow:hidden;
    border:1px solid rgba(255,255,255,.08);
    border-radius:16px;
    background:#101827;
}

.attendance-feature-image img{
    display:block;
    width:100%;
    aspect-ratio:16 / 9;
    object-fit:cover;
}

.attendance-flow{
    background:#121039;
}

.attendance-flow .attendance-heading h2{
    font-family:Montserrat, Arial, sans-serif;
    font-weight:600;
}

.attendance-flow .attendance-heading p,
.attendance-flow-steps strong,
.attendance-offline strong,
.attendance-offline span,
.attendance-offline small{
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-weight:400;
}

.attendance-flow-steps{
    display:grid;
    grid-template-columns:1fr 52px 1fr 52px 1fr 52px 1fr;
    align-items:center;
    max-width:760px;
    margin:0 auto;
}

.attendance-flow-steps article{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:18px;
    color:#8f99ae;
    text-align:center;
}

.attendance-step-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:70px;
    height:70px;
    border:1px solid rgba(44,170,161,.2);
    border-radius:50%;
    background:#111827;
    box-sizing:border-box;
}

.attendance-step-icon img{
    display:block;
    width:24px;
    height:24px;
    object-fit:contain;
}

.attendance-flow-steps strong{
    color:#8f99ae;
    font-size:14px;
    line-height:21px;
}

.attendance-flow-steps .active strong{
    color:#f47a00;
}

.attendance-flow-steps .active .attendance-step-icon{
    border-color:rgba(244,122,0,.72);
    background:rgba(244,122,0,.12);
    box-shadow:0 0 36px rgba(244,122,0,.22);
}

.attendance-flow-steps > span{
    display:flex;
    align-items:center;
    justify-content:center;
    width:52px;
    height:70px;
}

.attendance-flow-steps > span img{
    display:block;
    width:13px;
    height:20px;
    object-fit:contain;
}

.attendance-offline{
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    gap:8px 24px;
    align-items:center;
    width:min(100%, 520px);
    margin:72px auto 0;
    padding:24px 28px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:10px;
    background:#171c2b;
}

.attendance-offline strong{
    color:#dce4f2;
    font-size:14px;
}

.attendance-offline span{
    color:#8f99ae;
    font-size:12px;
}

.attendance-offline div{
    grid-row:1 / span 2;
    grid-column:2;
    display:flex;
    align-items:center;
    gap:12px;
}

.attendance-offline small{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:6px 10px;
    border-radius:999px;
    background:#111827;
    color:#8f99ae;
    font-size:10px;
    line-height:15px;
}

.attendance-offline small::before{
    content:"";
    width:5px;
    height:5px;
    border-radius:50%;
    background:currentColor;
}

.attendance-offline div img{
    display:block;
    width:27px;
    height:11px;
    object-fit:contain;
}

.attendance-offline .synced{
    background:rgba(44,170,161,.14);
    color:#2CAAA1;
}

.attendance-security{
    background:#191f2d;
}

.attendance-security .attendance-heading h2{
    font-family:Montserrat, Arial, sans-serif;
    font-size:32px;
    font-weight:600;
    line-height:41.6px;
    letter-spacing:0;
}

.attendance-security .attendance-heading{
    max-width:896px;
}

.attendance-security .attendance-heading p{
    width:min(100%, 896px);
    height:29px;
    margin-left:18px;
    margin-right:0;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:18px;
    font-weight:400;
    line-height:28.8px;
    letter-spacing:0;
    text-align:left;
    white-space:nowrap;
}

.attendance-security-panel{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    width:100%;
    max-width:896px;
    height:400px;
    min-height:400px;
    margin:0 auto;
    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;
    background:#151a2d;
    box-shadow:0 34px 70px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.04);
}

.security-core{
    position:relative;
    z-index:3;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:260px;
    height:220px;
    text-align:center;
}

.security-core-mark{
    display:block;
    width:150px;
    height:150px;
    margin-bottom:16px;
    object-fit:contain;
}

.security-core strong{
    color:#2CAAA1;
    font-family:Montserrat, Arial, sans-serif;
    font-size:24px;
    font-weight:400;
    line-height:36px;
    letter-spacing:0;
}

.security-core span{
    margin-top:10px;
    color:#8f99ae;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:16px;
    font-weight:400;
    line-height:24px;
    letter-spacing:0;
    text-align:center;
}

.security-chip{
    position:absolute;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    width:auto;
    height:38px;
    min-height:38px;
    padding:0 16px;
    border:1px solid rgba(44,170,161,.82);
    border-radius:12px;
    background:#151a2d;
    color:#d4daea;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:13px;
    font-weight:400;
    line-height:19.5px;
    letter-spacing:0;
    text-align:center;
    white-space:nowrap;
}

.security-chip.orange{
    border-color:#f47a00;
}

.security-chip img{
    display:block;
    width:18px;
    height:18px;
    object-fit:contain;
}

.top-left{top:49px;left:49px;width:201px;}
.mid-left{top:164.51px;left:49px;width:151px;}
.bottom-left{top:281px;left:120px;width:126px;}
.top-right{top:81px;left:660px;width:159px;}
.mid-right{top:196.51px;left:674px;width:181px;}
.bottom-right{top:297px;left:634px;width:197px;}

.security-lines{
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
}

.security-lines span{
    position:absolute;
    left:50%;
    top:164px;
    width:240px;
    border-top:1px dashed rgba(44,170,161,.26);
    transform-origin:left center;
}

.security-lines .line-gps,
.security-lines .line-life,
.security-lines .line-qr{
    border-top-color:rgba(244,122,0,.26);
}

.line-facial{
    width:220px;
    transform:rotate(206deg);
}

.line-gps{
    width:249px;
    transform:rotate(176deg);
}

.line-geofence{
    width:310px;
    transform:rotate(153deg);
}

.line-life{
    width:286px;
    transform:rotate(-17deg);
}

.line-clock{
    width:232px;
    transform:rotate(13deg);
}

.line-qr{
    width:240px;
    transform:rotate(39deg);
}

.attendance-exceptions .attendance-heading h2{
    width:min(100%, 370px);
    min-height:84px;
    margin:0 auto;
    font-family:Montserrat, Arial, sans-serif;
    font-size:32px;
    font-weight:600;
    line-height:41.6px;
    letter-spacing:0;
    text-align:center;
}

.attendance-exceptions .attendance-heading p{
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:18px;
    font-weight:400;
    line-height:28.8px;
    letter-spacing:0;
    text-align:center;
}

.attendance-status-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:23px;
}

.attendance-status-grid article{
    position:relative;
    overflow:hidden;
    min-height:202px;
    padding:26px 24px 24px;
}

.attendance-status-grid article::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:5px;
    background:currentColor;
}

.attendance-status-grid article > div{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:18px;
}

.attendance-status-grid article img{
    display:block;
    width:20px;
    height:20px;
    object-fit:contain;
}

.attendance-status-grid h3{
    margin:0;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:16px;
    font-weight:400;
    line-height:24px;
    letter-spacing:0;
}

.attendance-status-grid p{
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:14px;
    font-weight:400;
    line-height:21px;
    letter-spacing:0;
}

.status-valid{color:#2CAAA1;}
.status-review{color:#f47a00;}
.status-rejected{color:#ff3535;}

.attendance-status-grid article h3,
.attendance-status-grid article p{
    color:#dce4f2;
}

.attendance-status-grid article p{
    color:#9ca6bb;
}

.attendance-status-grid span{
    display:inline-flex;
    margin-top:22px;
    padding:10px 14px;
    border-radius:6px;
    border:1px solid rgba(255,255,255,.08);
    background:#0f1320;
    color:#dce4f2;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:12px;
    font-weight:400;
    line-height:18px;
}

.attendance-dashboard,
.attendance-alerts,
.attendance-info{
    padding:102px 0 112px;
    background:#191f2d;
}

.attendance-dashboard .attendance-heading h2{
    font-family:Montserrat, Arial, sans-serif;
    font-size:32px;
    font-weight:600;
    line-height:41.6px;
    letter-spacing:0;
    text-align:center;
}

.attendance-dashboard .attendance-heading h2 span{
    color:#2CAAA1;
}

.attendance-dashboard .attendance-heading p{
    width:min(100%, 770px);
    height:29px;
    color:#94A3B8;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:18px;
    font-weight:400;
    line-height:28.8px;
    letter-spacing:0;
    text-align:center;
    white-space:nowrap;
}

.attendance-dashboard .attendance-heading{
    margin-bottom:44px;
}

.attendance-dashboard-window{
    overflow:hidden;
    max-width:960px;
    margin:0 auto;
    border-radius:16px;
    background:#070b17;
}

.window-dots{
    display:flex;
    gap:8px;
    height:34px;
    align-items:center;
    padding-left:18px;
    background:#070b17;
}

.window-dots i{
    width:10px;
    height:10px;
    border-radius:50%;
    background:#a35718;
}

.window-dots i:nth-child(2){background:#6a6f7b;}
.window-dots i:nth-child(3){background:#2CAAA1;}

.attendance-dashboard-window img{
    display:block;
    width:100%;
    aspect-ratio:16 / 9;
    object-fit:cover;
    object-position:top left;
    background:#fff;
}

.attendance-dashboard-links{
    display:grid;
    grid-template-columns:repeat(5, 1fr);
    align-items:center;
    gap:0;
    width:100%;
    max-width:896px;
    min-height:80px;
    margin:54px auto 0;
    padding:18px 42px;
    border-radius:0;
    background:#191f2d;
    color:#cbd5e1;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:16px;
    font-weight:400;
    line-height:24px;
    letter-spacing:0;
    text-align:center;
}

.attendance-dashboard-links span{
    display:block;
}

.attendance-dashboard-links > span > span,
.attendance-dashboard-links strong{
    display:block;
    font:inherit;
    font-weight:400;
}

.attendance-dashboard-links > span > span{
    color:#94A3B8;
}

.attendance-dashboard-links strong{
    color:#cbd5e1;
}

.attendance-alerts{
    background:#121039;
}

.attendance-alerts-panel{
    display:grid;
    grid-template-columns:300px minmax(0, 1fr);
    gap:64px;
    align-items:center;
    width:100%;
    max-width:1152px;
    min-height:336.7px;
    padding:64.7px 64px 64px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:32px;
    background:#151a2d;
}

.attendance-alerts h2{
    margin:0;
    color:#fff;
    font-size:25px;
    font-weight:800;
}

.attendance-alerts p{
    margin:22px 0 0;
    color:#8f99ae;
    font-size:13px;
    line-height:1.7;
}

.attendance-alert-list{
    display:grid;
    gap:20px;
}

.attendance-alert-list article{
    display:grid;
    grid-template-columns:40px minmax(0, 1fr) auto;
    justify-content:space-between;
    gap:16px;
    align-items:center;
    width:100%;
    max-width:649.34px;
    height:97px;
    padding:16px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:12px;
    background:#fff9ea;
    color:#343845;
}

.alert-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    align-self:center;
    justify-self:center;
    width:40px;
    height:40px;
    border:1px solid rgba(99,77,255,.1);
    border-radius:8px;
    background:#ded8ff;
}

.attendance-alert-list .alert-icon{
    display:flex;
}

.alert-icon img{
    display:block;
    width:20px;
    height:20px;
    object-fit:contain;
}

.attendance-alert-list strong,
.attendance-alert-list article div span{
    display:block;
}

.attendance-alert-list strong{
    font-size:14px;
    line-height:21px;
    margin-bottom:2px;
}

.attendance-alert-list article div span{
    color:#6f7481;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:14px;
    font-weight:400;
    line-height:20px;
    letter-spacing:0;
}

.attendance-alert-list article div span b{
    color:#343845;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:14px;
    font-weight:600;
    line-height:20px;
    letter-spacing:0;
}

.attendance-alert-list small{
    color:#6f7481;
    font-size:11px;
    font-weight:700;
}

.attendance-alert-list small{
    white-space:nowrap;
}

.attendance-info{
    background:#060516;
}

.attendance-info-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:32px;
}

.attendance-info-grid article{
    min-height:285px;
    padding:42px;
}

.attendance-info-grid article:first-child{
    background:rgba(22,30,49,.7);
}

.attendance-info-grid article:nth-child(2){
    background:rgba(36,42,58,.3);
}

.info-card-icon{
    display:block;
    width:24px;
    height:24px;
    object-fit:contain;
}

.attendance-info-grid h2{
    margin-top:34px;
    font-size:25px;
    font-weight:500;
}

.attendance-info-grid p{
    min-height:96px;
    margin-bottom:28px;
    font-size:13px;
    line-height:1.65;
}

.attendance-info-grid span{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-right:18px;
    color:#DEC0BA;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:13px;
    font-weight:400;
    line-height:19.5px;
    letter-spacing:0;
}

.attendance-info-grid span img{
    display:block;
    width:14px;
    height:14px;
    object-fit:contain;
}

.attendance-final-cta{
    padding:106px 0 112px;
    background:#191f2d;
    text-align:center;
}

.attendance-final-cta h2{
    max-width:820px;
    margin:0 auto;
    color:#fff;
    font-size:44px;
    font-weight:800;
    line-height:1.08;
}

.attendance-final-cta p{
    max-width:690px;
    margin:34px auto 0;
    color:#8f99ae;
    font-size:14px;
    font-weight:600;
    line-height:1.55;
}

.attendance-final-actions{
    justify-content:center;
    margin-top:40px;
}

.attendance-final-actions .btn-primary-lignum,
.attendance-final-actions .btn-secondary-lignum{
    min-width:226px;
    min-height:50px;
    padding:0 26px;
    border-radius:6px;
    font-size:12px;
}

.health-pricing-modal-open{
    overflow:hidden;
}

.health-pricing-modal{
    position:fixed;
    inset:0;
    z-index:1200;
    display:none;
    align-items:center;
    justify-content:center;
    padding:16px;
    background:rgba(1,1,8,.76);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
}

.health-pricing-modal.is-open{
    display:flex;
}

.health-pricing-dialog{
    position:relative;
    overflow:hidden;
    width:min(100%, 896px);
    height:min(793px, calc(100vh - 32px));
    max-height:921.6px;
    border:1px solid rgba(255,255,255,.1);
    border-radius:16px;
    background:linear-gradient(186.74deg, #120C3C 0%, #252278 47.24%, #120C3C 100%);
    box-shadow:0 25px 50px -12px rgba(0,0,0,.25);
    color:#fff;
}

.attendance-pricing-title-mobile,
.attendance-pricing-copy-mobile{
    display:none;
}

@media(min-width:1024px){
    .health-pricing-dialog{
        height:min(849.41px, calc(100vh - 32px));
        transform:scale(.85);
        transform-origin:center;
    }

    .attendance-pricing-dialog .health-pricing-step > h2{
        padding:44px 74px 38px;
        font-size:34px;
        line-height:39.44px;
    }

    .attendance-pricing-dialog .health-pricing-content{
        grid-template-columns:447px 447px;
    }

    .attendance-pricing-dialog .health-pricing-plan{
        width:447px;
        height:544.51px;
        padding:95.8px 32px 95.81px;
        border-right:1px solid rgba(255,255,255,.06);
    }

    .attendance-pricing-dialog .health-pricing-plan h3{
        font-family:Montserrat, Arial, sans-serif;
        font-size:32px;
        font-weight:600;
        line-height:41.6px;
        letter-spacing:0;
    }

    .attendance-pricing-dialog .health-pricing-plan > p{
        max-width:350px;
        margin-top:28px;
        font-family:Inter, "Montserrat", Arial, sans-serif;
        font-size:16px;
        font-weight:400;
        line-height:26px;
        letter-spacing:0;
    }

    .attendance-pricing-dialog .health-pricing-price{
        margin-top:48px;
    }

    .attendance-pricing-dialog .health-pricing-price strong{
        font-size:48px;
        font-weight:700;
        line-height:52.8px;
        letter-spacing:-.96px;
    }

    .attendance-pricing-dialog .health-pricing-price span{
        font-family:Inter, "Montserrat", Arial, sans-serif;
        font-size:16px;
        font-weight:400;
        line-height:24px;
        letter-spacing:0;
    }

    .attendance-pricing-dialog .health-pricing-note{
        max-width:370px;
        margin-top:18px !important;
        font-family:Inter, "Montserrat", Arial, sans-serif;
        font-size:14px !important;
        font-weight:600;
        line-height:14px !important;
        letter-spacing:.7px;
    }

    .attendance-pricing-dialog .health-pricing-contract{
        width:297px;
        min-width:297px;
        max-width:297px;
        flex:none;
        min-height:56px;
        height:56px;
        margin-top:44px;
        gap:12.01px;
        padding:16px 75px;
        box-sizing:border-box;
        border-radius:12px;
        font-family:Inter, "Montserrat", Arial, sans-serif;
        font-size:16px;
        font-weight:600;
        line-height:24px;
        letter-spacing:0;
        text-align:center;
    }

    .attendance-pricing-dialog .health-pricing-includes{
        width:447px;
        height:564px;
        min-height:564px;
        gap:30px;
        padding:32px;
        border-radius:12px 0 0 12px;
    }

    .attendance-pricing-dialog .health-pricing-includes > span{
        font-family:Inter, "Montserrat", Arial, sans-serif;
        font-size:12px;
        font-weight:400;
        line-height:16px;
        letter-spacing:1.2px;
        text-transform:uppercase;
    }

    .attendance-pricing-dialog .health-pricing-feature-list{
        gap:20px;
    }

    .attendance-pricing-dialog .health-pricing-feature-list article{
        grid-template-columns:40px minmax(0, 1fr);
        gap:16px;
    }

    .attendance-pricing-dialog .health-pricing-feature-list i{
        width:40px;
        height:40px;
        border-radius:10px;
        font-size:18px;
    }

    .attendance-pricing-dialog .health-pricing-feature-list h3{
        font-family:Inter, "Montserrat", Arial, sans-serif;
        font-size:16px;
        font-weight:600;
        line-height:24px;
        letter-spacing:0;
    }

    .attendance-pricing-dialog .health-pricing-feature-list p{
        font-family:Inter, "Montserrat", Arial, sans-serif;
        font-size:14px;
        font-weight:400;
        line-height:20px;
        letter-spacing:0;
    }

    .attendance-pricing-dialog .health-pricing-consult{
        min-height:64px;
        font-size:17px;
    }
}

.health-pricing-close{
    position:absolute;
    top:36px;
    right:36px;
    z-index:4;
    display:flex;
    align-items:center;
    justify-content:center;
    width:48px;
    height:48px;
    border:0;
    border-radius:50%;
    background:transparent;
    color:#eef1ff;
    cursor:pointer;
}

.health-pricing-close span{
    display:block;
    font-family:Arial, sans-serif;
    font-size:54px;
    font-weight:300;
    line-height:1;
}

.health-pricing-step{
    display:none;
    height:100%;
}

.health-pricing-step.is-active{
    display:grid;
    grid-template-rows:auto minmax(0, 1fr) auto;
}

.health-pricing-step > h2{
    margin:0;
    padding:70px 90px 56px;
    color:#fff;
    font-family:Montserrat, Arial, sans-serif;
    font-size:48px;
    font-weight:600;
    line-height:62.4px;
    text-align:center;
}

.health-pricing-content{
    display:grid;
    grid-template-columns:447px 447px;
    min-height:0;
}

.health-pricing-plan{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:20px 48px 56px 52px;
}

.health-pricing-plan h3{
    margin:0;
    color:#e8ecff;
    font-family:Montserrat, Arial, sans-serif;
    font-size:48px;
    font-weight:600;
    line-height:62.4px;
}

.health-pricing-plan > p{
    max-width:620px;
    margin:36px 0 0;
    color:#a9b3ca;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:24px;
    font-weight:400;
    line-height:38px;
}

.health-pricing-price{
    display:flex;
    align-items:flex-end;
    gap:18px;
    margin-top:58px;
}

.health-pricing-price strong{
    color:#fff;
    font-family:Montserrat, Arial, sans-serif;
    font-size:64px;
    font-weight:700;
    line-height:70px;
    white-space:nowrap;
}

.health-pricing-price span{
    color:#aeb7cf;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:24px;
    font-weight:400;
    line-height:38px;
}

.health-pricing-note{
    max-width:590px;
    margin:14px 0 0 !important;
    color:#aeb7cf !important;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:20px !important;
    font-weight:700;
    line-height:25px !important;
}

.health-pricing-contract{
    display:flex;
    align-items:center;
    justify-content:center;
    width:464px;
    min-height:88px;
    margin-top:58px;
    border-radius:16px;
    background:#f47a00;
    color:#fff;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:24px;
    font-weight:700;
    line-height:32px;
    text-decoration:none;
}

.health-pricing-includes{
    display:flex;
    flex-direction:column;
    gap:48px;
    width:447px;
    min-height:564px;
    padding:32px;
    border-radius:16px 0 0 16px;
    background:rgba(8,14,29,.5);
}

.health-pricing-includes > span{
    color:#99a3be;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:18px;
    font-weight:400;
    letter-spacing:.18em;
    line-height:27px;
    text-transform:uppercase;
}

.health-pricing-includes-toggle{
    display:none;
}

.health-pricing-feature-list{
    display:grid;
    gap:40px;
}

.health-pricing-feature-list article{
    display:grid;
    grid-template-columns:40px minmax(0, 1fr);
    gap:16px;
    align-items:center;
}

.health-pricing-feature-list i,
.health-pricing-feature-list img{
    display:flex;
    align-items:center;
    justify-content:center;
    width:40px;
    height:40px;
    border:1px solid rgba(44,170,161,.2);
    border-radius:12px;
    background:rgba(44,170,161,.09);
    color:#2CAAA1;
    font-size:18px;
}

.health-pricing-feature-list img{
    padding:11px;
    object-fit:contain;
}

.health-pricing-feature-list h3{
    margin:0;
    color:#e6ebff;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:24px;
    font-weight:700;
    line-height:34px;
}

.health-pricing-feature-list p{
    margin:4px 0 0;
    color:#99a3be;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:21px;
    font-weight:400;
    line-height:31px;
}

.health-pricing-consult{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:80px;
    gap:14px;
    border-top:1px solid rgba(255,255,255,.12);
    background:#151c2b;
    color:#9da8bf;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:24px;
    font-weight:400;
    line-height:32px;
    text-decoration:none;
}

.health-contact-step.is-active{
    grid-template-rows:auto minmax(0, 1fr);
    overflow-y:auto;
    padding:43px 32px 56px;
}

.health-contact-header{
    max-width:690px;
    margin:0 auto;
    text-align:center;
}

.health-contact-header h2,
.health-success-step h2{
    margin:0;
    color:#fff;
    font-family:Montserrat, Arial, sans-serif;
    font-size:34px;
    font-weight:800;
    letter-spacing:0;
    line-height:1.17;
}

.health-contact-header p,
.health-success-step p{
    max-width:670px;
    margin:22px auto 0;
    color:rgba(190,199,220,.78);
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:17px;
    font-weight:400;
    letter-spacing:0;
    line-height:1.45;
}

.health-contact-form{
    display:flex;
    flex-direction:column;
    min-height:0;
    padding-top:64px;
}

.health-selected-plan{
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    align-items:center;
    gap:24px;
    min-height:96px;
    padding:22px 36px;
    border:2px solid #2CAAA1;
    border-radius:12px;
    background:#171e2e;
    box-shadow:0 0 28px rgba(44,170,161,.18);
}

.health-selected-plan strong,
.health-selected-price b{
    display:block;
    color:#fff;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-weight:800;
    letter-spacing:0;
}

.health-selected-plan strong{
    font-size:27px;
    line-height:1.15;
}

.health-selected-price{
    display:flex;
    align-items:flex-end;
    gap:8px;
    color:#fff;
}

.health-selected-price b{
    font-size:38px;
    line-height:1;
}

.health-selected-price span{
    color:#aeb7cf;
    font-size:17px;
    letter-spacing:0;
    line-height:1.1;
    text-transform:none;
}

.health-contact-fields{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px 20px;
    margin-top:40px;
}

.health-contact-field{
    display:grid;
    gap:6px;
    margin:0;
}

.health-contact-field-wide{
    grid-column:1 / -1;
}

.health-contact-field span{
    color:#fff;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:17px;
    font-weight:800;
    letter-spacing:0;
    line-height:1.25;
}

.health-contact-field em{
    color:rgba(190,199,220,.78);
    font-style:normal;
}

.health-contact-field input,
.health-contact-field textarea{
    width:100%;
    border:1px solid rgba(44,170,161,.16);
    border-radius:7px;
    background:#080e1d;
    color:#fff;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:17px;
    font-weight:400;
    letter-spacing:0;
    line-height:1.25;
}

.health-contact-field input{
    height:48px;
    padding:0 13px;
}

.health-contact-field textarea{
    min-height:88px;
    padding:14px 13px;
    resize:vertical;
}

.health-contact-field input::placeholder,
.health-contact-field textarea::placeholder{
    color:rgba(154,163,180,.58);
}

.health-contact-field input:focus,
.health-contact-field textarea:focus{
    outline:2px solid rgba(44,170,161,.72);
    outline-offset:1px;
}

.health-contact-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:34px;
    margin-top:34px;
    padding-top:0;
}

.health-contact-back,
.health-contact-submit,
.health-success-return{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:58px;
    border:0;
    border-radius:8px;
    color:#fff;
    font-family:Inter, "Montserrat", Arial, sans-serif;
    font-size:17px;
    font-weight:800;
    line-height:1;
    text-align:center;
    cursor:pointer;
}

.health-contact-back{
    background:transparent;
}

.health-contact-back:hover,
.health-contact-back:focus{
    background:rgba(255,255,255,.04);
}

.health-contact-submit,
.health-success-return{
    background:#2CAAA1;
    text-decoration:none;
}

.health-contact-submit:hover,
.health-contact-submit:focus{
    background:#35bdb4;
}

.health-contact-submit:disabled{
    opacity:.72;
    cursor:wait;
}

.health-success-step.is-active{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:64px;
    text-align:center;
}

.health-success-icon svg{
    width:96px;
    height:96px;
}

.success-icon-ring,
.success-icon-arc,
.success-icon-check{
    fill:none;
    stroke:#2CAAA1;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.success-icon-ring{
    stroke-width:2;
    opacity:.28;
}

.success-icon-arc{
    stroke-width:5;
}

.success-icon-check{
    stroke-width:8;
}

.health-success-return{
    width:220px;
    margin-top:30px;
}

@media(min-width:1024px){
    .attendance-pricing-modal .health-pricing-dialog{
        height:min(849.41px, calc(100vh - 32px));
        transform:scale(.85);
        transform-origin:center;
    }

    .attendance-pricing-dialog .health-pricing-step > h2{
        padding:44px 74px 38px;
        font-size:34px;
        line-height:39.44px;
    }

    .attendance-pricing-dialog .health-pricing-content{
        grid-template-columns:447px 447px;
    }

    .attendance-pricing-dialog .health-pricing-plan{
        width:447px;
        height:544.51px;
        padding:95.8px 32px 95.81px;
        border-right:1px solid rgba(255,255,255,.06);
    }

    .attendance-pricing-dialog .health-pricing-plan h3{
        font-size:34px;
        line-height:37.4px;
    }

    .attendance-pricing-dialog .health-pricing-plan > p{
        max-width:350px;
        margin-top:28px;
        font-size:17px;
        line-height:26.35px;
    }

    .attendance-pricing-dialog .health-pricing-price{
        margin-top:48px;
    }

    .attendance-pricing-dialog .health-pricing-price strong{
        font-size:48px;
        line-height:45.6px;
    }

    .attendance-pricing-dialog .health-pricing-price span{
        font-size:17px;
        line-height:18.7px;
    }

    .attendance-pricing-dialog .health-pricing-note{
        max-width:370px;
        margin-top:18px !important;
        font-size:15px !important;
        line-height:17.7px !important;
    }

    .attendance-pricing-dialog .health-pricing-contract{
        width:297px;
        min-width:297px;
        max-width:297px;
        flex:none;
        min-height:56px;
        height:56px;
        margin-top:44px;
        gap:12.01px;
        padding:16px 75px;
        box-sizing:border-box;
        border-radius:12px;
        font-size:16px;
    }

    .attendance-pricing-dialog .health-pricing-includes{
        width:447px;
        height:564px;
        min-height:564px;
        gap:32px;
        padding:32px;
        border-radius:12px 0 0 12px;
    }

    .attendance-pricing-dialog .health-pricing-includes > span{
        font-size:14px;
        line-height:21px;
    }

    .attendance-pricing-dialog .health-pricing-feature-list{
        gap:20px;
    }

    .attendance-pricing-dialog .health-pricing-feature-list article{
        grid-template-columns:40px minmax(0, 1fr);
        gap:16px;
    }

    .attendance-pricing-dialog .health-pricing-feature-list i{
        width:40px;
        height:40px;
        border-radius:10px;
        font-size:18px;
    }

    .attendance-pricing-dialog .health-pricing-feature-list h3{
        font-size:17px;
        line-height:23.8px;
    }

    .attendance-pricing-dialog .health-pricing-feature-list p{
        font-size:15px;
        line-height:22.5px;
    }

    .attendance-pricing-dialog .health-pricing-consult{
        min-height:64px;
        font-size:17px;
    }

    .attendance-pricing-dialog .health-pricing-includes{
        justify-content:flex-start;
        width:447px;
        height:564px;
        min-height:564px;
        gap:28px;
        padding:32px;
        border-radius:12px 0 0 12px;
        background:rgba(8,14,29,.5);
    }

    .attendance-pricing-dialog .health-pricing-includes > span{
        margin:0;
        color:#99a3be;
        font-family:Inter, "Montserrat", Arial, sans-serif;
        font-size:12px;
        font-weight:400;
        line-height:16px;
        letter-spacing:1.2px;
        text-transform:uppercase;
    }

    .attendance-pricing-dialog .health-pricing-feature-list{
        display:grid;
        gap:22px;
    }

    .attendance-pricing-dialog .health-pricing-feature-list article{
        display:grid;
        grid-template-columns:40px minmax(0, 1fr);
        gap:16px;
        align-items:center;
    }

    .attendance-pricing-dialog .health-pricing-feature-list i,
    .attendance-pricing-dialog .health-pricing-feature-list img{
        width:40px;
        height:40px;
        border:1px solid rgba(44,170,161,.2);
        border-radius:8px;
        background:rgba(44,170,161,.09);
        color:#2CAAA1;
        font-size:18px;
    }

    .attendance-pricing-dialog .health-pricing-feature-list img{
        padding:11px;
        object-fit:contain;
    }

    .attendance-pricing-dialog .health-pricing-feature-list h3{
        margin:0;
        color:#e6ebff;
        font-family:Inter, "Montserrat", Arial, sans-serif;
        font-size:16px;
        font-weight:600;
        line-height:24px;
        letter-spacing:0;
    }

    .attendance-pricing-dialog .health-pricing-feature-list p{
        margin:0;
        color:#99a3be;
        font-family:Inter, "Montserrat", Arial, sans-serif;
        font-size:14px;
        font-weight:400;
        line-height:20px;
        letter-spacing:0;
    }
}

@media(max-width:1023px){
    .attendance-pricing-title-desktop,
    .attendance-pricing-copy-desktop{
        display:none;
    }

    .attendance-pricing-title-mobile,
    .attendance-pricing-copy-mobile{
        display:inline;
    }

    .attendance-container{
        width:min(100%, 760px);
        padding:0 16px;
    }

    .attendance-hero{
        min-height:auto;
        padding:112px 0 72px;
    }

    .attendance-hero-grid,
    .attendance-card-grid,
    .attendance-method-grid,
    .attendance-alerts-panel,
    .attendance-info-grid{
        grid-template-columns:1fr;
    }

    .attendance-hero-grid{
        gap:44px;
    }

    .attendance-hero-media,
    .attendance-feature-image,
    .attendance-dashboard-window{
        display:none;
    }

    .attendance-hero-copy{
        width:100%;
        min-height:auto;
    }

    .attendance-hero-copy h1{
        font-size:42px;
        line-height:52px;
    }

    .attendance-card-wide{
        grid-column:auto;
    }

    .attendance-flow-steps{
        grid-template-columns:minmax(48px, 1fr) 14px minmax(48px, 1fr) 14px minmax(48px, 1fr) 14px minmax(48px, 1fr);
        gap:4px;
        width:100%;
        max-width:420px;
    }

    .attendance-flow-steps article{
        gap:8px;
        min-width:0;
    }

    .attendance-step-icon{
        width:48px;
        height:48px;
    }

    .attendance-step-icon img{
        width:18px;
        height:18px;
    }

    .attendance-flow-steps strong{
        font-size:11px;
        line-height:14px;
        white-space:normal;
    }

    .attendance-flow-steps > span{
        width:14px;
        height:48px;
        justify-self:center;
    }

    .attendance-flow-steps > span img{
        width:9px;
        height:14px;
    }

    .attendance-flow-steps > span img{
        transform:none;
    }

    .attendance-security-panel{
        display:grid;
        grid-template-columns:minmax(0, 1fr) 108px minmax(0, 1fr);
        grid-template-rows:repeat(3, auto);
        align-items:center;
        gap:10px 8px;
        height:auto;
        min-height:auto;
        padding:24px 14px;
    }

    .attendance-security .attendance-heading p{
        width:100%;
        height:auto;
        margin-left:0;
        text-align:center;
        white-space:normal;
    }

    .attendance-dashboard .attendance-heading p{
        height:auto;
        white-space:normal;
    }

    .security-core,
    .security-chip{
        position:static;
        justify-self:center;
    }

    .security-core{
        order:0;
        grid-column:2;
        grid-row:1 / span 3;
        width:108px;
        height:auto;
        padding:0;
    }

    .security-core-mark{
        width:88px;
        height:88px;
        margin-bottom:8px;
    }

    .security-core strong{
        font-size:14px;
        line-height:18px;
    }

    .security-core span{
        margin-top:4px;
        font-size:10px;
        line-height:14px;
    }

    .security-chip{
        width:100% !important;
        min-width:0;
        height:auto;
        min-height:0;
        padding:4px 0;
        border:0;
        border-radius:0;
        background:transparent;
        gap:6px;
        font-size:10.5px;
        line-height:13.5px;
        white-space:normal;
    }

    .top-left,
    .mid-left,
    .bottom-left{
        grid-column:1;
        justify-self:stretch;
    }

    .top-right,
    .mid-right,
    .bottom-right{
        grid-column:3;
        justify-self:stretch;
    }

    .top-left,
    .top-right{
        grid-row:1;
    }

    .mid-left,
    .mid-right{
        grid-row:2;
    }

    .bottom-left,
    .bottom-right{
        grid-row:3;
    }

    .security-chip img{
        flex:0 0 14px;
        width:14px;
        height:14px;
    }

    .security-lines{
        display:none;
    }

    .attendance-status-grid,
    .attendance-dashboard-links{
        grid-template-columns:1fr;
    }

    .attendance-dashboard-links{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:12px;
        max-width:420px;
        min-height:0;
        margin-top:30px;
        padding:0;
        text-align:left;
    }

    .attendance-dashboard-links > span{
        min-height:58px;
        padding:10px 12px;
        border:1px solid rgba(255,255,255,.06);
        border-radius:10px;
        background:#151a2d;
    }

    .attendance-dashboard-links > span:last-child{
        grid-column:1 / -1;
        justify-self:center;
        width:min(100%, 196px);
    }

    .attendance-dashboard-links > span > span,
    .attendance-dashboard-links strong{
        text-align:center;
    }

    .attendance-alerts-panel{
        gap:24px;
        padding:38px;
    }

    .attendance-alerts h2,
    .attendance-alerts p{
        text-align:center;
    }

    .attendance-alerts p{
        margin-top:12px;
    }

    .attendance-alert-list{
        gap:14px;
    }

    .attendance-alert-list article{
        grid-template-columns:40px minmax(0, 1fr);
        height:auto;
        min-height:0;
        align-items:start;
        gap:12px;
    }

    .attendance-alert-list article div{
        min-width:0;
    }

    .attendance-alert-list article div span{
        overflow-wrap:anywhere;
        word-break:normal;
    }

    .attendance-alert-list small{
        grid-column:2;
        justify-self:start;
        white-space:normal;
    }

    .attendance-final-actions{
        align-items:center;
        justify-content:center;
    }

    .health-pricing-modal{
        align-items:flex-start;
        overflow-y:auto;
        padding:24px 0;
    }

    .health-pricing-dialog{
        width:min(100%, 390px);
        height:auto;
        min-height:735px;
        max-height:none;
        overflow:visible;
        border-radius:16px;
        transform:none;
    }

    .health-pricing-dialog.is-contact-step,
    .health-pricing-dialog.is-success-step{
        min-height:0;
    }

    .health-pricing-close{
        top:22px;
        right:21px;
        width:38px;
        height:38px;
    }

    .health-pricing-close span{
        font-size:38px;
    }

    .health-pricing-step > h2{
        padding:62px 48px 42px;
        font-family:Montserrat, Arial, sans-serif;
        font-size:31px;
        font-weight:600;
        line-height:41.6px;
        letter-spacing:0;
        text-align:center;
    }

    .health-pricing-content{
        display:flex;
        flex-direction:column;
    }

    .health-pricing-plan{
        align-items:flex-start;
        padding:0 25px;
    }

    .health-pricing-plan h3{
        font-size:32px;
        line-height:41.6px;
    }

    .health-pricing-plan > p{
        margin-top:26px;
        font-size:16px;
        line-height:26px;
    }

    .health-pricing-price{
        gap:10px;
        margin-top:58px;
    }

    .health-pricing-price strong{
        font-size:48px;
        line-height:52.8px;
    }

    .health-pricing-price span{
        font-size:17px;
        line-height:26px;
    }

    .health-pricing-note{
        margin-top:24px !important;
        font-size:16px !important;
        line-height:20px !important;
    }

    .health-pricing-contract{
        width:100%;
        min-height:56px;
        margin-top:78px;
        border-radius:12px;
        font-size:17px;
    }

    .health-pricing-includes{
        width:auto;
        min-height:0;
        margin:36px 25px 95px;
        padding:0;
        background:transparent;
        gap:0;
    }

    .health-pricing-includes > span{
        display:none;
    }

    .health-pricing-includes-toggle{
        display:flex;
        align-items:center;
        justify-content:space-between;
        width:100%;
        min-height:48px;
        gap:14px;
        padding:0 24px;
        border:0;
        border-radius:12px;
        background:#101235;
        color:#d8deef;
        font-family:Montserrat, Arial, sans-serif;
        font-size:13px;
        font-weight:600;
        letter-spacing:.14em;
        line-height:1;
        text-align:left;
        cursor:pointer;
    }

    .health-pricing-includes-toggle i{
        color:#fff;
        font-size:18px;
        transition:transform .18s ease;
    }

    .health-pricing-includes.is-open .health-pricing-includes-toggle i{
        transform:rotate(180deg);
    }

    .health-pricing-feature-list{
        display:none;
        gap:22px;
        margin-top:20px;
        padding:24px 20px;
        border-radius:12px;
        background:rgba(8,14,29,.5);
    }

    .health-pricing-includes.is-open .health-pricing-feature-list{
        display:grid;
    }

    .health-pricing-feature-list article{
        grid-template-columns:44px minmax(0, 1fr);
        gap:14px;
    }

    .health-pricing-feature-list i,
    .health-pricing-feature-list img{
        width:44px;
        height:44px;
        font-size:19px;
    }

    .health-pricing-feature-list img{
        padding:12px;
    }

    .health-pricing-feature-list h3{
        font-size:18px;
        line-height:24px;
    }

    .health-pricing-feature-list p{
        font-size:14px;
        line-height:20px;
    }

    .health-pricing-consult{
        min-height:58px;
        padding:12px 18px;
        justify-content:flex-start;
        font-size:16px;
        line-height:20px;
    }

    .health-pricing-consult span{
        flex:1 1 auto;
        min-width:0;
        white-space:normal;
    }

    .health-contact-step.is-active{
        padding:58px 16px 42px;
    }

    .health-contact-header h2{
        font-size:28px;
        line-height:1.16;
    }

    .health-contact-header p{
        margin-top:16px;
        font-size:14px;
        line-height:1.45;
    }

    .health-contact-form{
        padding-top:34px;
    }

    .health-selected-plan{
        min-height:auto;
        padding:24px 22px;
    }

    .health-selected-plan strong{
        font-size:24px;
    }

    .health-selected-price{
        flex-wrap:wrap;
    }

    .health-selected-price b{
        font-size:32px;
    }

    .health-contact-fields,
    .health-contact-actions{
        grid-template-columns:1fr;
    }

    .health-contact-fields{
        gap:18px;
        margin-top:34px;
    }

    .health-contact-field span{
        font-size:15px;
    }

    .health-contact-field input{
        height:48px;
    }

    .health-contact-actions{
        gap:12px;
        margin-top:26px;
        padding-top:0;
    }

    .health-contact-back,
    .health-contact-submit{
        min-height:52px;
        font-size:15px;
    }

    .health-contact-submit{
        order:1;
    }

    .health-contact-back{
        order:2;
    }

    .health-selected-plan{
        display:flex;
        align-items:flex-start;
        flex-direction:column;
    }
}

@media(max-width:575px){
    .attendance-container{
        width:min(100%, 420px);
        padding:0 12px;
    }

    .attendance-hero-copy h1{
        font-size:38px;
        line-height:46px;
    }

    .attendance-hero-copy p{
        margin-top:24px;
        font-size:15px;
    }

    .attendance-hero-actions,
    .attendance-final-actions{
        flex-direction:column;
    }

    .attendance-hero-actions .btn-primary-lignum,
    .attendance-hero-actions .btn-secondary-lignum,
    .attendance-final-actions .btn-primary-lignum,
    .attendance-final-actions .btn-secondary-lignum{
        width:100%;
        min-width:0;
        max-width:320px;
    }

    .attendance-hero-media{
        display:none;
    }

    .attendance-problems,
    .attendance-methods,
    .attendance-flow,
    .attendance-security,
    .attendance-exceptions,
    .attendance-dashboard,
    .attendance-alerts,
    .attendance-info{
        padding:64px 0;
    }

    .attendance-heading{
        margin-bottom:42px;
        text-align:center;
    }

    .attendance-heading h2{
        font-size:24px;
        line-height:31.2px;
    }

    .attendance-heading p{
        margin-left:0;
        font-size:12px;
        text-align:center;
    }

    .attendance-card,
    .attendance-method-card,
    .attendance-status-grid article,
    .attendance-info-grid article{
        min-height:auto;
        padding:24px;
    }

    .attendance-method-card h3{
        font-size:20px;
    }

    .attendance-feature-image,
    .attendance-dashboard-window{
        border-radius:10px;
    }

    .attendance-offline{
        grid-template-columns:1fr;
    }

    .attendance-offline div{
        grid-row:auto;
        grid-column:auto;
    }

    .attendance-alerts-panel{
        padding:28px 20px;
        border-radius:16px;
    }

    .attendance-alert-list article{
        grid-template-columns:36px minmax(0, 1fr);
    }

    .attendance-alert-list small{
        grid-column:2;
    }

    .attendance-info-grid p{
        min-height:0;
    }

    .attendance-final-cta{
        padding:72px 0 82px;
    }

    .attendance-final-cta h2{
        font-size:32px;
    }

    .attendance-final-cta p{
        margin-top:22px;
        font-size:13px;
    }
}