/* reset padding and margin, box-sizing */
*,
*::after,
*::before{
    padding: 0;
    margin: 0;
    box-sizing:border-box;
}

/* mobile-first html & body */
html{
-webkit-text-size-adjust:100%; /* prevent font scaling in ios */
scroll-behavior:smooth;
}

body{
  background-color: #f8fafc;  
  min-height:100vh;
  min-height:100dvh; /* dynamic height for mobile device */
  font-family:system-ui, -apple-system, 'segoe ui', roboto, sans-serif;  
  line-height:1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #1e293b;

}

/* media defualts (img & video) */
img,
picture,
video,
canvas,
svg{
    display: block;
    max-width: 100%;
    height: auto;

}

/* typography and lists */
input,
button,
select,
textarea{
    font: inherit; /* prevent ios zoom on focus */
}

p,
h1,
h2,
h3,
h4,
h5,
h6{
    overflow-wrap: break-word;
}

ul,
li,
ol{
    list-style:none;
}

a{
    text-decoration:none;
    color:inherit;
}

/* remove  tap highlight in mobile */
a{
-webkit-tab-highlight-color: transparent;
}

@font-face {
    font-family: 'Inter_18pt-Black';
    src: url(../fonts/Inter_18pt-Black.woff2);
    font-weight:800;
    font-style:normal;
    font-display: swap;
}

@font-face{
    font-family: 'Lato-Regular';
    src:url('../fonts/Lato-Regular.woff2');
    font-weight: 400px;
    font-style: normal;
    font-display: swap;

}



/* main */
.ka-main{
    width:100%;
    max-width: 375px;
    min-height:100vh;
    min-height:100dvh;
    display: grid;
    grid-template-columns:1fr 1fr;
    align-content: normal;
    gap:12px;
    padding: 16px;
    border:1px solid #ccc;
    border: radius 10px;

}
h1,h2,h3,.ka-home__footer{ 
    grid-column: 1/-1;
    justify-content:center;
    display:flex;
}
 
h1,h2,h3{
    font-family: Inter_18pt-Black;
    grid-column: 1/-1;
    display: flex;
    align-items:center;
    border-radius:10px;
}
h1{
    align-self: start;
}
h2,h3{
    font-family: Lato-Regular;
    font-size: 0.9rem;
   
}

.ka-home__footer{
align-items: end;
}

.ka-home__footer a{
    padding: 1 rem;

}