
:root{font-family:Inter,Arial,sans-serif;color:#14233b;background:#f5f8fc}
*{box-sizing:border-box}
body{margin:0}
a{color:inherit;text-decoration:none}
header{background:#0b1f3b;color:white;padding:20px 5%}
.brand{font-weight:800;font-size:23px}
.brand span{color:#47e1b2}
nav{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
nav a{font-size:13px;padding:9px 12px;border-radius:8px;background:#203b5c}
nav a:hover{background:#087f77}
main{max-width:1120px;margin:auto;padding:25px 18px;min-height:70vh}
.hero{padding:55px 35px;background:linear-gradient(125deg,#0b1f3b,#086e76);color:white;border-radius:20px}
.hero h1{font-size:clamp(30px,6vw,54px);max-width:700px;margin:0 0 20px}
.hero p{max-width:650px;line-height:1.7}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin:25px 0}
.card{background:white;padding:25px;border:1px solid #e3eaf3;border-radius:15px;box-shadow:0 6px 24px #10243c09}
.card h3{margin-top:0}
.card p{line-height:1.6;color:#52627a}
.btn,button{display:inline-block;background:#087e70;color:white;border:0;border-radius:9px;padding:12px 17px;cursor:pointer;font-weight:700;margin:5px 5px 5px 0}
.btn:hover,button:hover{filter:brightness(.9)}
.secondary{background:#e6edf5;color:#18314c}
label{display:block;font-weight:600;margin-top:15px}
input,textarea,select{display:block;width:100%;padding:12px;margin-top:6px;border:1px solid #cbd5e1;border-radius:8px;font:inherit;background:white}
textarea{min-height:110px}
h1,h2,h3{color:#112e50}
.hero h1{color:white}
.muted{color:#62758c}
.output{white-space:pre-wrap;line-height:1.75;overflow-wrap:anywhere}
.preview{background:white;padding:30px;border:1px solid #dce5ef;border-radius:12px}
.template-modern{border-top:8px solid #087e70}
.template-classic{font-family:Georgia,serif;border:1px solid #777}
.template-minimal{border:0}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:12px;border-bottom:1px solid #e1e6ee}
.tablewrap{overflow-x:auto}
footer{background:#0b1f3b;color:#d5e4f0;text-align:center;padding:28px;line-height:2}
footer a{margin:0 10px}
.note{background:#eaf5f2;padding:14px;border-radius:9px;line-height:1.6}
@media print{
header,footer,.controls,.no-print{display:none!important}
body,main{background:white;padding:0;margin:0}
.preview{border:0;padding:0}
.card{box-shadow:none;border:0}
}
