*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100%}body{min-height:100vh;font-family:Roboto,sans-serif;font-size:16px;line-height:1.65}img,video{display:block;max-width:100%;height:auto}video{max-height:250px}.content{display:flex;flex-direction:column;min-height:100vh}app-header,app-footer{flex:0 0 auto}main{flex:1 1 auto;width:100%}.container{display:flex;flex-direction:column;align-items:stretch;width:100%;max-width:1600px;margin:0 auto;padding:2.5rem 1.5rem}h1,h2,h3{margin-top:0;font-family:Roboto Slab,serif;line-height:1}h1{text-align:center}p{margin-top:0}.container>h2{margin:1rem 0 1.25rem;font-size:1.7rem;text-align:center}a{color:#fff}button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;margin:.25rem;padding:.65rem 1rem;border:none;border-radius:6px;background-color:#0d2b72;color:#fff;font:inherit;font-weight:600;cursor:pointer;transition:filter .15s ease,transform .15s ease}button:hover{filter:brightness(1.1)}button:active{transform:scale(.98)}form{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;width:100%;padding:.5rem}input,select{min-height:42px;padding:.55rem .75rem;border:none;border-radius:6px;font:inherit}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #1359a3;outline-offset:2px}#intro{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);align-items:center;gap:2.75rem;width:100%;padding:2.75rem;background-color:#4f92da;color:#fff;border-radius:12px}#intro>img{width:100%;max-width:300px;aspect-ratio:1 / 1;object-fit:cover;border-radius:20px;justify-self:center}#intro>div{min-width:0}#intro>div>h1{margin-bottom:1.25rem;color:#90ee90;font-size:2rem;text-align:left}#intro p{margin-bottom:1rem;font-size:1rem;line-height:1.7}#quote{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;width:100%;padding:.5rem 2rem;text-align:center}#quote h2{max-width:850px;margin:0;font-size:1.35rem}#quote span{display:block}#quote span:last-child{margin-top:.35rem}hr{width:100%;margin:1.5rem 0;border:0;border-top:2px solid #1359a3}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:1.25rem;width:100%}.card{display:flex;flex-direction:column;min-width:0;padding:1.5rem;background-color:#4f92da;color:#fff;border-radius:12px;transition:transform .15s ease,filter .15s ease}.card:hover{transform:translateY(-2px);filter:brightness(1.03)}.card-header{margin-bottom:1.25rem;padding-bottom:.75rem;border-bottom:1px solid black}.card-header h1,.card-header h2,.card-header h3{margin:0}.card-header h2{font-size:1.45rem}.card-body{display:flex;flex-direction:column;flex-grow:1;gap:.8rem;font-size:1rem;line-height:1.7}.card-body>span{display:block}.card-body ul{margin:0;padding-left:1.4rem}.card-body li{margin-bottom:.45rem}.card-body li:last-child{margin-bottom:0}.card-body ul ul{margin-top:.4rem}.card a{padding:0;color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:2px}.card a:hover{text-decoration-thickness:2px}.buttons{display:flex;gap:.25rem}.buttons-horizontal{flex-direction:row;align-items:center;flex-wrap:wrap}.buttons-vertical{flex-direction:column;justify-content:center}.dot{display:inline-block;width:10px;height:10px;flex-shrink:0;border-radius:50%}.dot-red{background-color:red}.dot-green{background-color:green}.dot-yellow{background-color:#ff0}.scrollable{max-height:75vh;overflow-x:hidden;overflow-y:auto}@media(max-width:800px){.container{padding:1.75rem 1rem}#intro{grid-template-columns:minmax(180px,220px) minmax(0,1fr);gap:1.75rem;padding:1.75rem}#intro>img{max-width:220px}#intro>div>h1{font-size:1.75rem}}@media(max-width:600px){.container{padding:1rem .75rem}.container>h2{margin-bottom:1.25rem;font-size:1.5rem}#intro{grid-template-columns:1fr;gap:1.5rem;padding:1.5rem 1rem;text-align:center}#intro>img{width:min(70%,250px);max-width:none}#intro>div>h1{font-size:1.7rem;text-align:center}#intro p{font-size:1rem}#quote{padding:.5rem .75rem}#quote h2{font-size:1.2rem}hr{margin:1.75rem 0}.grid{grid-template-columns:1fr;gap:1rem}.card{padding:1.25rem}.card-header{margin-bottom:1rem}.card-header h2{font-size:1.35rem}main form{flex-direction:column;align-items:stretch}main form input,main form select,main form button{width:100%;margin:0}.buttons-horizontal{flex-direction:column;align-items:stretch}.buttons-horizontal button{width:100%;margin:0}}@media(max-width:380px){#intro{padding:1.25rem .75rem}#intro>img{width:80%}.card{padding:1rem}}
