*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{line-height:1.5;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{min-height:100vh;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;background:#ffffff;color:#000000;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
img,video,canvas,svg,iframe{max-width:100%;height:auto;display:block}
input,button,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:none}
a{text-decoration:none;color:inherit}
ul,ol{list-style:none;padding-left:1rem}
p,li{overflow-wrap:anywhere;word-break:break-word}
table{border-collapse:collapse;width:100%;max-width:100%}

:root{
--color-bg:#ffffff;
--color-text:#000000;
--color-accent:#38BDF8;
--color-accent-alt:#4ADE80;
--color-border:#000000;
--font-sans:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
--space-1:0.25rem;
--space-2:0.5rem;
--space-3:0.75rem;
--space-4:1rem;
--space-5:1.5rem;
--space-6:2rem;
--space-7:3rem;
--space-8:4rem;
--radius-sm:4px;
--radius-md:8px;
--radius-lg:16px;
--border-thick:3px;
--max-width:1200px;
--transition:0.2s ease-in-out;
}

h1,h2,h3,h4,h5,h6{font-weight:900;line-height:1.1;letter-spacing:-0.02em}
h1{font-size:clamp(2.5rem,6vw,4.5rem)}
h2{font-size:clamp(2rem,4.5vw,3rem)}
h3{font-size:clamp(1.5rem,3vw,2rem)}
h4{font-size:1.25rem}
h5{font-size:1rem}
h6{font-size:0.875rem}
p{margin-bottom:var(--space-4);font-size:1rem}
strong{font-weight:700}
a:hover{opacity:0.7}

.container{width:100%;max-width:var(--max-width);margin-inline:auto;padding-inline:var(--space-4)}
.section{padding-block:var(--space-7)}
.stack>*+*{margin-top:var(--space-4)}

.grid{display:grid;gap:var(--space-5)}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}

.flex{display:flex;gap:var(--space-4)}
.flex-wrap{flex-wrap:wrap}
.flex-col{flex-direction:column}
.flex-center{align-items:center;justify-content:center}
.flex-between{justify-content:space-between;align-items:center}

.min-w-0>*{min-width:0}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;padding:0.75rem 1.25rem;font-weight:700;text-transform:uppercase;border:var(--border-thick) solid var(--color-border);background:var(--color-bg);transition:var(--transition);flex-wrap:wrap}
.btn-primary{background:var(--color-accent)}
.btn-secondary{background:var(--color-accent-alt)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--color-border)}

.card{border:var(--border-thick) solid var(--color-border);padding:var(--space-5);background:var(--color-bg);display:flex;flex-direction:column;gap:var(--space-3);min-width:0}
.card-accent{background:var(--color-accent)}
.card-accent-alt{background:var(--color-accent-alt)}

.input,.textarea,.select{width:100%;max-width:100%;border:var(--border-thick) solid var(--color-border);padding:0.75rem;background:#fff}
.textarea{min-height:120px;resize:vertical}

.form-group{display:flex;flex-direction:column;gap:0.5rem;margin-bottom:var(--space-4)}

.header{position:sticky;top:0;background:#fff;border-bottom:var(--border-thick) solid var(--color-border);z-index:1000}
.nav{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4)}
.nav-menu{display:flex;gap:var(--space-4);flex-wrap:wrap;align-items: center;}
.nav-toggle{display:none;font-size:1.5rem}

.footer{border-top:var(--border-thick) solid var(--color-border);padding:var(--space-6) var(--space-4)}
.footer-grid{display:grid;gap:var(--space-5)}

.badge{display:inline-block;padding:0.25rem 0.5rem;border:var(--border-thick) solid var(--color-border);font-size:0.75rem;font-weight:700;background:var(--color-accent)}

.hero{padding-block:var(--space-8);border-bottom:var(--border-thick) solid var(--color-border)}
.hero-title{max-width:20ch}

.table{width:100%;overflow-x:auto}
.table table{width:100%;border:var(--border-thick) solid var(--color-border)}
.table th,.table td{padding:0.75rem;border:var(--border-thick) solid var(--color-border);text-align:left}

.media-box{width:100%;aspect-ratio:16/9;overflow:hidden;border:var(--border-thick) solid var(--color-border)}
.media-box img,.media-box video{width:100%;height:100%;object-fit:cover}

@media (max-width:1024px){
.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:768px){
.grid-3,.grid-4,.grid-2{grid-template-columns:1fr}
.nav-menu{display:none;flex-direction:column;border-top:var(--border-thick) solid var(--color-border);padding-top:var(--space-4)}
.nav-menu.active{display:flex}
.nav-toggle{display:block}
.hero{padding-block:var(--space-6)}
}

@media (max-width:480px){
h1{font-size:2.2rem}
h2{font-size:1.8rem}
.container{padding-inline:var(--space-3)}
.btn{width:100%}
}


@media(max-width: 780px){
    .nav{
        display: flex;
        flex-direction: column;
    } 
}
