:root{ --brand:#0a5a8a; --brand-dark:#083d5b; --ink:#0b1320; --bg:#ffffff; --muted:#6b7a8c; }
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; color:var(--ink); background:var(--bg); line-height:1.6}
.container{width:min(1120px, 92%); margin-inline:auto}
.site-header{position:sticky; top:0; z-index:100; background:#fff; border-bottom:1px solid #e8edf3}
.header-inner{display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:0.75rem 0}
.brand{display:flex; align-items:center; gap:.6rem; color:var(--ink); text-decoration:none}
.brand-text{font-weight:700; letter-spacing:.2px}
.main-nav{display:flex; align-items:center; gap:1rem}
.main-nav .nav-toggle{display:none; background:none; border:1px solid #d2d9e3; padding:.4rem .6rem; border-radius:.5rem}
.menu{display:flex; gap:1rem; list-style:none; margin:0; padding:0}
.menu a{color:var(--ink); text-decoration:none; padding:.5rem .75rem; border-radius:.4rem}
.menu a:hover{background:#f1f6fb}
.lang-switch{position:relative}
.btn.outline.lang{display:inline-flex; align-items:center; gap:.4rem; background:#fff; color:var(--ink); border:1.5px solid #9cc7e5}
.lang-menu{display:none; position:absolute; right:0; top:115%; background:#fff; border:1px solid #e8edf3; border-radius:.6rem; padding:.25rem; min-width:180px; box-shadow:0 8px 20px rgba(0,0,0,.08); z-index:200}
.lang-menu.open{display:block}
.lang-option{display:block; width:100%; text-align:left; padding:.5rem .6rem; border:none; background:transparent; cursor:pointer}
.lang-option:hover{background:#f1f6fb}
.hero{background: linear-gradient(135deg, #061a27 0%, #0b2f48 45%, #0a5a8a 100%); color:#f7fbff}
.hero-inner{display:grid; grid-template-columns: 1.1fr .9fr; gap:2rem; align-items:center; min-height:64svh; padding:6rem 0}
.hero-copy h1{font-size:clamp(1.8rem, 2.2vw + 1rem, 3rem); line-height:1.15; margin:0 0 .5rem 0}
.hero-copy p{color:#cfe6f6; margin:0 0 1.25rem 0}
.hero-logo{max-width:340px; width:100%; filter: drop-shadow(0 12px 24px rgba(0,0,0,.35));}
.cta-group{display:flex; gap:.75rem; flex-wrap:wrap}
.btn{display:inline-block; padding:.8rem 1rem; border-radius:.6rem; text-decoration:none; font-weight:600}
.btn.primary{background:var(--brand); color:#fff}
.btn.primary:hover{background:var(--brand-dark)}
.btn.ghost{border:1.5px solid #9cc7e5; color:#0a5a8a}
.btn.ghost:hover{background:#eaf3f9}
.features{padding:3.5rem 0}
.features-grid{display:grid; grid-template-columns: repeat(3, 1fr); gap:1.25rem}
.card{border:1px solid #e8edf3; border-radius:.9rem; padding:1.25rem; background:#fff}
.card h3{margin:.25rem 0 .25rem 0}
.card p{color:var(--muted)}
.card-icon{width:40px; height:40px; filter: drop-shadow(0 6px 12px rgba(10,90,138,.15));}
.about{padding:2rem 0 1rem}
.contact{padding:1.5rem 0 3.5rem}
.contact .form{border:1px solid #e8edf3; border-radius:.9rem; padding:1rem; background:#fff}
.form label{display:block; font-weight:600; margin:.5rem 0}
.form input, .form textarea{width:100%; margin-top:.25rem; padding:.7rem .8rem; border:1px solid #d8e2ec; border-radius:.6rem; font:inherit}
.form input:focus, .form textarea:focus{outline:2px solid #b7dbf5; border-color:#97c9eb}
.form .grid-2{display:grid; grid-template-columns:1fr 1fr; gap:.75rem}
.form .checkbox{display:flex; align-items:center; gap:.5rem; font-weight:400}
.form-status{margin-top:.6rem; color:var(--brand)}
.site-footer{border-top:1px solid #e8edf3; background:#fafcff; padding:1rem 0}
.footer-inner{display:flex; align-items:center; justify-content:space-between; gap:1rem}
.socials{display:flex; gap:.6rem}
.social{color:var(--brand); display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:.6rem; background:#eaf3f9}
.social:hover{background:#d8ebf8}
.cookie-banner{position:fixed; left:0; right:0; bottom:0; z-index:300; background:#061a27; color:#eaf3f9; border-top:2px solid #0a5a8a; padding:.85rem 0}
.cookie-inner{display:flex; align-items:center; justify-content:space-between; gap:1rem}
.cookie-text{font-size:.95rem}
.cookie-text code{background:#0b2f48; color:#d7ecfa; padding:0 .25rem; border-radius:.25rem}
.cookie-link{color:#9cc7e5}
.cookie-actions{display:flex; gap:.5rem}
.cookie-actions .btn{white-space:nowrap}
@media (max-width: 980px){ .hero-inner{grid-template-columns:1fr; text-align:center} .hero-art{order:-1} }
@media (max-width: 900px){ .features-grid{grid-template-columns:1fr} .cookie-inner{flex-direction:column; align-items:flex-start} }
@media (max-width: 720px){ .main-nav .nav-toggle{display:inline-block} .menu{display:none; position:absolute; right:4%; top:64px; flex-direction:column; background:#fff; border:1px solid #e8edf3; padding:.5rem; border-radius:.6rem; width: min(240px, 92%)} .menu.open{display:flex} .form .grid-2{grid-template-columns:1fr} }