/* Load the shared stylesheet before the page stylesheet. */

main .icsi-benefit-grid {
display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:10px;
}

main .icsi-benefit-grid article {
border:1px solid var(--line);
    border-radius:var(--radius);
    text-align:center;
    padding:14px 10px;
    box-shadow:var(--shadow-sm);
    transition:var(--transition);
    background:#fff;
}

main .icsi-benefit-grid article:hover {
transform:translateY(-3px);
    box-shadow:var(--shadow);
    border-color:var(--purple-soft);
}

main .icsi-benefit-grid a {
display:block;
    color:inherit;
}

main .icsi-benefit-grid img {
width:50px;
    height:50px;
    margin:0 auto;
}

main .icsi-benefit-grid h3 {
font-size:11.5px;
    line-height:1.3;
    margin:8px 0 4px;
    font-weight:800;
}

main .icsi-benefit-grid p {
font-size:10px;
    line-height:1.45;
    color:var(--text);
    margin:0;
}

main .icsi-why-grid {
display:grid;
    grid-template-columns:1fr;
    gap:10px;
}

main .icsi-why-grid article {
display:grid;
    grid-template-columns:56px 1fr;
    grid-template-areas:
        "icon title"
        "icon desc";
    text-align:left;
    padding:14px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:#fff;
    box-shadow:var(--shadow-sm);
    transition:var(--transition);
    align-items:center;
    column-gap:12px;
}

main .icsi-why-grid article:hover {
transform:translateY(-3px);
    box-shadow:var(--shadow);
    border-color:var(--purple-soft);
}

main .icsi-why-grid article img {
grid-area:icon;
    width:56px;
    height:56px;
    margin:0;
    align-self:center;
}

main .icsi-why-grid article h3 {
grid-area:title;
    font-size:12.5px;
    line-height:1.3;
    margin:0 0 4px;
    font-weight:800;
    color:var(--navy);
}

main .icsi-why-grid article p {
grid-area:desc;
    font-size:12px;
    line-height:1.5;
    color:var(--text);
    margin:0;
}

main .icsi-package-card {
border:1px solid var(--line);
    border-radius:var(--radius);
    padding:18px 16px;
    min-height:auto;
    text-align:left;
    display:grid;
    grid-template-columns:56px 1fr;
    grid-template-areas:
        "icon title"
        "list list"
        "btn btn";
    align-items:center;
    column-gap:12px;
    row-gap:12px;
    position:relative;
    box-shadow:var(--shadow-sm);
    background:#fff;
    transition:var(--transition);
}

main .icsi-package-card:hover {
transform:translateY(-3px);
    box-shadow:var(--shadow);
}

main .icsi-package-card.featured {
border:2px solid var(--purple);
    box-shadow:0 12px 30px var(--purple-glow);
}

main .icsi-package-card>img {
grid-area:icon;
    width:56px;
    height:56px;
    margin:0;
}

main .icsi-package-card h3 {
grid-area:title;
    font-size:14px;
    margin:0;
    font-weight:800;
    line-height:1.3;
    text-align:left;
}

main .icsi-package-card ul {
grid-area:list;
    font-size:12px;
    line-height:1.8;
    text-align:left;
    width:100%;
    padding:0;
    color:var(--text);
    margin:0;
    list-style:none;
}

main .icsi-package-card ul li {
position:relative;
    padding-left:20px;
}

main .icsi-package-card ul li:before {
content:"✓";
    position:absolute;
    left:0;
    top:0;
    color:var(--teal);
    font-weight:800;
    font-size:12px;
}

main .icsi-package-card>a {
grid-area:btn;
    margin-top:0;
    width:100%;
    height:42px;
    border:1.5px solid var(--teal);
    border-radius:var(--radius-sm);
    color:var(--teal);
    display:grid;
    place-items:center;
    font-size:12px;
    font-weight:800;
    transition:var(--transition);
}

main .icsi-package-card>a:hover {
background:var(--teal);
    color:#fff;
}

main .icsi-package-card>a.filled {
background:var(--purple);
    color:#fff;
    border-color:var(--purple);
}

main .icsi-package-card>a.filled:hover {
background:var(--purple-dark);
}

main .icsi-faq-grid {
display:grid;
    gap:8px;
}

@media(min-width:600px) {
main .icsi-why-grid {
grid-template-columns:repeat(2,1fr);
}
}

@media(min-width:900px) {
main .icsi-benefit-grid {
grid-template-columns:repeat(4,1fr);
    gap:14px;
}
}

@media(min-width:900px) {
main .icsi-benefit-grid img {
width:66px;
    height:66px;
}
}

@media(min-width:900px) {
main .icsi-benefit-grid h3 {
font-size:13px;
    margin-top:12px;
}
}

@media(min-width:900px) {
main .icsi-benefit-grid p {
font-size:11px;
}
}

@media(min-width:900px) {
main .icsi-benefit-grid article {
padding:20px 14px;
}
}

@media(min-width:900px) {
main .icsi-why-grid {
grid-template-columns:repeat(4,1fr);
    gap:14px;
}
}

@media(min-width:900px) {
main .icsi-why-grid article {
display:block;
    text-align:center;
    padding:20px 14px;
    column-gap:0;
}
}

@media(min-width:900px) {
main .icsi-why-grid article img {
width:66px;
    height:66px;
    margin:0 auto;
}
}

@media(min-width:900px) {
main .icsi-why-grid article h3 {
font-size:13px;
    text-align:center;
    margin:12px 0 6px;
}
}

@media(min-width:900px) {
main .icsi-why-grid article p {
text-align:center;
}
}

@media(min-width:900px) {
main .icsi-package-card {
display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    padding:22px 16px;
    min-height:340px;
    column-gap:0;
    row-gap:0;
}
}

@media(min-width:900px) {
main .icsi-package-card>img {
width:68px;
    height:68px;
}
}

@media(min-width:900px) {
main .icsi-package-card h3 {
font-size:14px;
    text-align:center;
    margin:8px 0 10px;
}
}

@media(min-width:900px) {
main .icsi-package-card ul {
font-size:14px;
    padding-left:16px;
    line-height:1.7;
}
}

@media(min-width:900px) {
main .icsi-package-card ul li {
padding-left:4px;
}
}

@media(min-width:900px) {
main .icsi-package-card ul li:before {
left:-14px;
}
}

@media(min-width:900px) {
main .icsi-package-card>a {
margin-top:auto;
    height:42px;
    font-size:12px;
}
}

@media(min-width:900px) {
main .icsi-faq-grid {
grid-template-columns:1fr 1fr;
    gap:12px 20px;
}
}
