﻿@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Playfair+Display:wght@700;800&display=swap");
:root{--primary:hsl(210,92%,26%);--primary-fg:hsl(0,0%,100%);--accent:hsl(43,92%,58%);--accent-fg:hsl(213,58%,14%);--secondary:hsl(205,74%,91%);--secondary-fg:hsl(210,92%,20%);--bg:hsl(210,33%,98%);--fg:hsl(213,58%,14%);--card:hsl(0,0%,100%);--muted:hsl(210,30%,94%);--muted-fg:hsl(213,18%,39%);--border:hsl(212,28%,87%);--radius:0.5rem;--shadow-soft:0 18px 45px -24px hsl(210 92% 18%/0.38);--shadow-card:0 8px 28px -18px hsl(210 80% 18%/0.24);--shadow-glow:0 12px 30px -18px hsl(43 92% 58%/0.7);--grad-hero:linear-gradient(90deg,hsl(210 92% 20%/0.94),hsl(210 92% 26%/0.72),hsl(204 84% 43%/0.58));--grad-gold:linear-gradient(135deg,hsl(43,92%,62%),hsl(37,88%,52%));--grad-soft:linear-gradient(180deg,hsl(210,33%,98%),hsl(205,74%,94%));--grad-sky:linear-gradient(180deg,hsl(205,74%,92%),hsl(210,33%,98%))}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Inter",sans-serif;background:var(--bg);color:var(--fg);-webkit-font-smoothing:antialiased;line-height:1.6}
h1,h2,h3,h4{font-family:"Playfair Display",serif;letter-spacing:-0.02em}
img{max-width:100%;display:block}a{color:inherit;text-decoration:none}ul{list-style:none}
.container-page{width:100%;max-width:1280px;margin-inline:auto;padding-inline:1rem}
@media(min-width:640px){.container-page{padding-inline:1.5rem}}
@media(min-width:1024px){.container-page{padding-inline:2rem}}
.section{padding:4rem 0}@media(min-width:768px){.section{padding:6rem 0}}
.badge-soft{display:inline-flex;align-items:center;gap:.5rem;background:var(--secondary);color:var(--secondary-fg);padding:.375rem .75rem;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:2px}
.card-soft{border-radius:.5rem;background:var(--card);padding:1.5rem;box-shadow:var(--shadow-card);border:1px solid var(--border);transition:box-shadow .3s,transform .3s}
.card-soft:hover{box-shadow:var(--shadow-soft);transform:translateY(-4px)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.625rem 1.25rem;border-radius:.375rem;font-weight:600;font-size:.875rem;cursor:pointer;border:none;transition:opacity .2s,background .2s;text-decoration:none;font-family:inherit;white-space:nowrap}
.btn-primary{background:var(--primary);color:var(--primary-fg)}.btn-primary:hover{opacity:.9}
.btn-gold{background:var(--grad-gold);color:var(--accent-fg);box-shadow:var(--shadow-glow)}.btn-gold:hover{opacity:.9}
.btn-outline{background:transparent;color:var(--primary);border:2px solid var(--primary)}.btn-outline:hover{background:var(--primary);color:var(--primary-fg)}
.btn-outline-white{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.4)}.btn-outline-white:hover{background:#fff;color:var(--primary)}
.btn-ghost{background:transparent;color:var(--primary)}.btn-ghost:hover{background:var(--secondary)}
.btn-lg{padding:.875rem 1.75rem;font-size:1rem}.btn-sm{padding:.375rem .875rem;font-size:.8rem}
.btn-full{width:100%}.btn-rounded{border-radius:9999px}
.prose p{margin-bottom:1rem;color:var(--muted-fg);line-height:1.8}
.prose h2{font-size:1.5rem;color:var(--primary);margin-top:2rem;margin-bottom:.75rem}
.prose ul{list-style:disc;padding-left:1.5rem;margin-bottom:1rem;color:var(--muted-fg)}
.prose li{margin-bottom:.5rem;line-height:1.7}
.prose blockquote{border-left:4px solid var(--accent);padding-left:1rem;font-style:italic;color:var(--muted-fg);margin:1.5rem 0}
.prose table{width:100%;border-collapse:collapse;margin:1.5rem 0}
.prose table th,.prose table td{padding:.625rem 1rem;border:1px solid var(--border);text-align:left}
.prose table thead{background:var(--secondary);color:var(--secondary-fg);font-weight:700}
.prose table tbody tr:nth-child(even){background:var(--muted)}
.prose a{color:var(--primary);text-decoration:underline}
.grid-2{display:grid;grid-template-columns:1fr;gap:1.5rem}@media(min-width:640px){.grid-2{grid-template-columns:repeat(2,1fr)}}
.grid-3{display:grid;grid-template-columns:1fr;gap:1.5rem}@media(min-width:768px){.grid-3{grid-template-columns:repeat(3,1fr)}}
.grid-4{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}@media(min-width:768px){.grid-4{grid-template-columns:repeat(4,1fr)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.animate-fade-up{animation:fadeUp .4s ease both}
.form-group{margin-bottom:1rem}.form-label{display:block;font-size:.875rem;font-weight:600;margin-bottom:.375rem;color:var(--fg)}
.form-control{width:100%;padding:.625rem .875rem;border:1px solid var(--border);border-radius:var(--radius);font-size:.875rem;background:var(--card);color:var(--fg);outline:none;transition:border .2s,box-shadow .2s;font-family:inherit}
.form-control:focus{border-color:var(--primary);box-shadow:0 0 0 3px hsl(210 92% 26%/0.12)}
textarea.form-control{resize:vertical;min-height:120px}
.toast{position:fixed;bottom:1.5rem;right:1.5rem;z-index:9999;background:var(--primary);color:#fff;padding:1rem 1.5rem;border-radius:.5rem;box-shadow:var(--shadow-soft);font-weight:600;animation:fadeUp .3s ease;max-width:340px;display:none}
.toast.show{display:block}.toast.success{background:hsl(145,55%,42%)}.toast.error{background:hsl(0,70%,55%)}
