:root{
--color-bg:#ffffff;
--color-surface:#f7fbfa;
--color-muted:#eef6f5;
--color-primary:#19b5a5;
--color-primary-soft:#6fe0d2;
--color-accent:#2dd4bf;
--color-text:#0f172a;
--color-text-light:#475569;
--color-border:#e2e8f0;
--color-radius:14px;
--color-radius-sm:10px;
--shadow-sm:0 2px 8px rgba(0,0,0,0.04);
--shadow-md:0 8px 24px rgba(0,0,0,0.06);
--shadow-lg:0 20px 40px rgba(0,0,0,0.08);
--font-sans:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;
--max-width:1200px;
--spacing-xs:0.25rem;
--spacing-sm:0.5rem;
--spacing-md:1rem;
--spacing-lg:1.5rem;
--spacing-xl:2rem;
--spacing-2xl:3rem;
}

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

html{
font-size:16px;
-webkit-text-size-adjust:100%;
}

body{
font-family:var(--font-sans);
color:var(--color-text);
background:var(--color-bg);
line-height:1.6;
min-height:100vh;
text-rendering:optimizeLegibility;
}

img,
picture,
video,
canvas,
svg,
iframe{
max-width:100%;
height:auto;
display:block;
}

input,
button,
textarea,
select{
font:inherit;
max-width:100%;
}

button{
border:none;
background:none;
cursor:pointer;
}

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

p{
margin-bottom:var(--spacing-md);
color:var(--color-text-light);
}

h1,h2,h3,h4,h5,h6{
line-height:1.2;
font-weight:600;
margin-bottom:var(--spacing-md);
color:var(--color-text);
}

h1{font-size:2.25rem;}
h2{font-size:1.875rem;}
h3{font-size:1.5rem;}
h4{font-size:1.25rem;}
h5{font-size:1.125rem;}
h6{font-size:1rem;}

ul,ol{
padding-left:1.25rem;
margin-bottom:var(--spacing-md);
}

li{
margin-bottom:0.25rem;
word-break:break-word;
}

.container{
width:100%;
max-width:var(--max-width);
margin-inline:auto;
padding-inline:var(--spacing-md);
}

.section{
padding-block:var(--spacing-2xl);
}

.grid{
display:grid;
gap:var(--spacing-lg);
}

.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(--spacing-md);
}

.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;
}

.flex > *{
min-width:0;
}

.button{
display:inline-flex;
align-items:center;
justify-content:center;
gap:0.5rem;
padding:0.65rem 1.25rem;
border-radius:999px;
background:linear-gradient(135deg,var(--color-primary),var(--color-accent));
color:#fff;
font-weight:500;
box-shadow:var(--shadow-sm);
transition:all 0.2s ease;
max-width:100%;
flex-wrap:wrap;
text-align:center;
}

.button:hover{
transform:translateY(-1px);
box-shadow:var(--shadow-md);
}

.button-outline{
background:transparent;
border:1px solid var(--color-border);
color:var(--color-text);
}

.card{
background:var(--color-surface);
border-radius:var(--color-radius);
padding:var(--spacing-lg);
box-shadow:var(--shadow-sm);
max-width:100%;
}

.card:hover{
box-shadow:var(--shadow-md);
}

.form-group{
display:flex;
flex-direction:column;
gap:0.25rem;
margin-bottom:var(--spacing-md);
max-width:100%;
}

input,
textarea,
select{
padding:0.6rem 0.75rem;
border-radius:var(--color-radius-sm);
border:1px solid var(--color-border);
background:#fff;
color:var(--color-text);
}

textarea{
resize:vertical;
min-height:120px;
}

input:focus,
textarea:focus,
select:focus{
outline:none;
border-color:var(--color-primary);
box-shadow:0 0 0 2px rgba(25,181,165,0.15);
}

table{
width:100%;
border-collapse:collapse;
max-width:100%;
}

th,td{
text-align:left;
padding:0.75rem;
border-bottom:1px solid var(--color-border);
word-break:break-word;
}

.header{
position:sticky;
top:0;
z-index:1000;
background:rgba(255,255,255,0.9);
backdrop-filter:blur(10px);
border-bottom:1px solid var(--color-border);
}

.nav{
display:flex;
align-items:center;
justify-content:space-between;
gap:var(--spacing-md);
flex-wrap:wrap;
}

.nav-links{
display:flex;
gap:var(--spacing-md);
flex-wrap:wrap;
}

.nav-center{
text-align:center;
font-weight:600;
}

.burger{
display:none;
flex-direction:column;
gap:4px;
}

.burger span{
width:22px;
height:2px;
background:var(--color-text);
}

.footer{
background:var(--color-muted);
padding-block:var(--spacing-2xl);
}

.footer-grid{
display:grid;
gap:var(--spacing-lg);
grid-template-columns:repeat(5,minmax(0,1fr));
}

.footer small{
display:block;
margin-top:var(--spacing-lg);
color:var(--color-text-light);
}

.hero{
padding-block:var(--spacing-2xl);
background:linear-gradient(135deg,#ffffff,#e6fffb);
border-radius:var(--color-radius);
}

.text-center{
text-align:center;
}

.max-w-text{
max-width:65ch;
}

.mx-auto{
margin-inline:auto;
}

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

@media (max-width:768px){
.grid-3,
.grid-2{
grid-template-columns:1fr;
}
.nav-links{
display:none;
flex-direction:column;
width:100%;
}
.burger{
display:flex;
}
.footer-grid{
grid-template-columns:1fr;
}
.section{
padding-block:var(--spacing-xl);
}
h1{font-size:1.875rem;}
h2{font-size:1.5rem;}
}