/* css/main.css - loaded on EVERY page: theme variables, header, footer, buttons and the shared components */
/* ---- 1. Reset (small replacement for the Tailwind base styles) ---- */
*,::before,::after{box-sizing:border-box;border:0 solid #e5e7eb}
html{line-height:1.5;-webkit-text-size-adjust:100%;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
body{margin:0;line-height:inherit}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}
a{color:inherit;text-decoration:inherit}
b,strong{font-weight:bolder}
code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:1em}
small{font-size:80%}
table{text-indent:0;border-color:inherit;border-collapse:collapse}
button,input,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}
button,select{text-transform:none}
button,[type="button"],[type="submit"]{-webkit-appearance:button;background-color:transparent;background-image:none}
blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}
ol,ul{list-style:none;margin:0;padding:0}
textarea{resize:vertical}
input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}
[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}
::-webkit-search-decoration{-webkit-appearance:none}
button,[role="button"]{cursor:pointer}
:disabled{cursor:default}
img,svg,video{display:block;vertical-align:middle}
img,video{max-width:100%;height:auto}
summary{display:list-item}

/* ---- 2. Layout helpers used by the header, footer and page wrapper ---- */
.flex{display:flex}
.hidden{display:none}
.items-center{align-items:center}
.justify-between{justify-content:space-between}
.mx-auto{margin-left:auto;margin-right:auto}
.max-w-6xl{max-width:72rem}
.px-4{padding-left:1rem;padding-right:1rem}
.py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.py-10{padding-top:2.5rem;padding-bottom:2.5rem}
.p-2{padding:.5rem}
.mt-12{margin-top:3rem}
.gap-1{gap:.25rem}
.gap-2{gap:.5rem}
.gap-3{gap:.75rem}
.space-y-1>*+*{margin-top:.25rem}
.h-8{height:2rem}
.w-8{width:2rem}
.h-10{height:2.5rem}
.w-10{width:2.5rem}
.h-16{height:4rem}
.rounded{border-radius:.25rem}
.rounded-lg{border-radius:.5rem}
.font-semibold{font-weight:600}
.text-sm{font-size:.875rem;line-height:1.25rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.border-t{border-top-width:1px}
.border-b{border-bottom-width:1px}
.border-slate-200{border-color:#e2e8f0}
.bg-white{background-color:#fff}
.text-slate-800{color:#1e293b}
.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
@media (min-width:640px){.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}}
@media (min-width:768px){.md\:flex{display:flex}.md\:hidden{display:none}}

/* ---- 3. Site styles ---- */
:root{--accent:#2563eb;--accent-hover:#1d4ed8;--bg-light:#ffffff;--bg-light-secondary:#f8fafc;--text-light:#1e293b;--text-light-secondary:#64748b;--border-light:#e2e8f0;--bg-dark:#0B0F19;--bg-dark-secondary:#11162A;--text-dark:#FFFFFF;--text-dark-secondary:#9AA4BF;--border-dark:#1E2A4A;}
html{scroll-behavior:smooth;}
body{background-color:var(--bg-light) !important;color:var(--text-light) !important;transition:background-color 0.3s ease,color 0.3s ease;}
html.dark body{background-color:var(--bg-dark) !important;color:var(--text-dark) !important;}
header{background-color:var(--bg-light) !important;border-color:var(--border-light) !important;position:sticky;top:0;z-index:1000;transition:transform 0.3s ease,box-shadow 0.3s ease;}
html.dark header{background-color:var(--bg-dark) !important;border-color:var(--border-dark) !important;}
header.header-scrolled{box-shadow:0 2px 10px rgba(0,0,0,0.1);}
html.dark header.header-scrolled{box-shadow:0 2px 10px rgba(0,0,0,0.5);}
header.header-hidden{transform:translateY(-100%);}
.nav-link{color:var(--text-light) !important;font-weight:500;padding:0.5rem 1rem;border-radius:0.5rem;transition:all 0.2s ease;display:inline-flex;align-items:center;gap:0.25rem;}
html.dark .nav-link{color:var(--text-dark) !important;}
.nav-link:hover,.nav-link.active{background-color:var(--bg-light-secondary) !important;text-decoration:none;}
html.dark .nav-link:hover,html.dark .nav-link.active{background-color:var(--bg-dark-secondary) !important;}
.mobile-link{padding:0.75rem 1rem;font-weight:500;border-radius:0.5rem;transition:all 0.2s ease;display:flex;align-items:center;}
.mobile-link:hover,.mobile-link.active{background-color:var(--bg-light-secondary);}
html.dark .mobile-link:hover,html.dark .mobile-link.active{background-color:var(--bg-dark-secondary);}
#mobile-menu{background-color:var(--bg-light) !important;border-color:var(--border-light) !important;}
html.dark #mobile-menu{background-color:var(--bg-dark) !important;border-color:var(--border-dark) !important;}
#mobile-menu-button{color:var(--text-light) !important;background:transparent !important;border:none !important;transition:all 0.2s ease;}
html.dark #mobile-menu-button{color:var(--text-dark) !important;}
#mobile-menu-button:hover{background-color:#f1f5f9 !important;color:#1e293b !important;}
html.dark #mobile-menu-button:hover{background-color:#2a2a2a !important;color:#f9fafb !important;}
#mobile-menu-button .material-symbols-rounded{color:inherit !important;}
footer{background-color:var(--bg-light) !important;border-color:var(--border-light) !important;}
html.dark footer{background-color:var(--bg-dark) !important;border-color:var(--border-dark) !important;}
.hero-title{font-size:2.5rem;font-weight:700;color:var(--text-light);margin-bottom:1rem;line-height:1.2;}
html.dark .hero-title{color:var(--text-dark);}
.hero-description{font-size:1.125rem;color:var(--text-light-secondary);max-width:600px;margin:0 auto;line-height:1.6;}
html.dark .hero-description{color:var(--text-dark-secondary);}
{background-color:var(--bg-light);border:1px solid var(--border-light);border-radius:1rem;padding:2rem;box-shadow:0 1px 3px rgba(0,0,0,0.1);margin-bottom:2rem;}
{background-color:var(--bg-dark-secondary);border-color:var(--border-dark);box-shadow:0 1px 3px rgba(0,0,0,0.3);}
.btn{background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:white;padding:0.75rem 1.5rem;border-radius:0.75rem;font-weight:600;display:inline-flex;align-items:center;gap:0.5rem;text-decoration:none;border:none;cursor:pointer;transition:all 0.2s ease;box-shadow:0 2px 4px rgba(37,99,235,0.2);}
.btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(37,99,235,0.3);}
.more-menu.hidden{display:none !important;}
.nav-link:focus-visible,.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.more-wrap{position:relative;}
.more-btn .material-symbols-rounded{font-size:1.25rem;transition:transform .2s;}
.more-btn[aria-expanded="true"] .material-symbols-rounded{transform:rotate(180deg);}
.more-menu{position:absolute;right:0;top:calc(100% + .5rem);min-width:11rem;padding:.375rem;background:var(--bg-light);border:1px solid var(--border-light);border-radius:.75rem;box-shadow:0 10px 25px rgba(0,0,0,.12);z-index:60;}
html.dark .more-menu{background:var(--bg-dark-secondary);border-color:var(--border-dark);box-shadow:0 10px 25px rgba(0,0,0,.5);}
.more-menu a{display:block;padding:.55rem .75rem;border-radius:.5rem;font-weight:500;}
.more-menu a:hover{background:var(--bg-light-secondary);}
html.dark .more-menu a:hover{background:var(--bg-dark);}
.mobile-more-label{padding:.5rem 1rem 0;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-light-secondary);}
button.nav-link{background:transparent;}
.btn-ghost{display:inline-flex;align-items:center;padding:.9rem 1.5rem;font-weight:600;border:1px solid var(--border-light);border-radius:.75rem;transition:border-color .2s,background-color .2s;}
html.dark .btn-ghost{border-color:var(--border-dark);}
.btn-ghost:hover{border-color:var(--accent);background:var(--bg-light-secondary);}
html.dark .btn-ghost:hover{background:var(--bg-dark-secondary);}
.v-section{margin-top:3.5rem;}
.v-title{font-size:1.5rem;font-weight:700;text-align:center;margin-bottom:1.5rem;}
@media (prefers-reduced-motion: reduce){*{animation:none !important;transition:none !important;scroll-behavior:auto !important;}}
:root{--surface:var(--bg-light);--surface-2:var(--bg-light-secondary);--line:var(--border-light);--muted:var(--text-light-secondary);--fg:var(--text-light);--accent-soft:#e8f0ff;--ok:#16a34a;--warn:#b45309;--bad:#c2410c;}
html.dark{--surface:var(--bg-dark-secondary);--surface-2:var(--bg-dark);--line:var(--border-dark);--muted:var(--text-dark-secondary);--fg:var(--text-dark);--accent-soft:#14275a;--ok:#4ade80;--warn:#fbbf24;--bad:#fb923c;}
.mi{line-height:1;display:inline-block;vertical-align:middle;}
[hidden]{display:none!important;}
.muted{color:var(--muted);}
.center{text-align:center;}
.section-sub{text-align:center;color:var(--muted);max-width:42rem;margin:-.75rem auto 1.75rem;line-height:1.6;}
.eyebrow{display:block;text-align:center;font-size:.78rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--accent);margin-bottom:.5rem;}
.page-hero{text-align:center;padding:2.25rem 0 1rem;}
.page-hero .hero-title{font-size:clamp(1.9rem,5vw,2.75rem);}
.page-hero .hero-icon{font-size:3rem;color:var(--accent);}
.wrap-narrow{max-width:46rem;margin:0 auto;}
.grid-auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;}
.card{border:1px solid var(--line);background:var(--surface);border-radius:1rem;padding:1.4rem;}
.card.hov{transition:border-color .2s,transform .2s;}
.card.hov:hover{border-color:var(--accent);transform:translateY(-2px);}
.card h3{font-weight:700;margin-bottom:.3rem;font-size:1.05rem;}
.card p,.card li{color:var(--muted);font-size:.95rem;line-height:1.6;}
.card .mi.big{font-size:2rem;color:var(--accent);margin-bottom:.5rem;display:block;}
a.card{text-decoration:none;color:inherit;display:block;}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1rem;counter-reset:s;}
.step{border:1px solid var(--line);background:var(--surface);border-radius:1rem;padding:1.25rem;}
.step::before{counter-increment:s;content:counter(s);display:grid;place-items:center;width:2rem;height:2rem;border-radius:999px;background:var(--accent);color:#fff;font-weight:700;margin-bottom:.75rem;}
.step h3{font-weight:700;margin-bottom:.25rem;}
.step p{color:var(--muted);font-size:.93rem;line-height:1.55;}
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:1rem;background:var(--surface);}
.tbl{width:100%;border-collapse:collapse;font-size:.95rem;}
.tbl th,.tbl td{text-align:left;padding:.85rem 1.1rem;border-bottom:1px solid var(--line);vertical-align:top;}
.tbl tr:last-child td{border-bottom:0;}
.tbl thead th{font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);background:var(--surface-2);}
.tbl td{color:var(--muted);}
.tbl td:first-child{color:var(--fg);font-weight:600;}
.notice{display:flex;gap:.75rem;padding:1rem 1.1rem;border-radius:.9rem;border:1px solid rgba(37,99,235,.3);background:var(--accent-soft);color:var(--fg);font-size:.95rem;line-height:1.55;text-align:left;}
.notice .mi{color:var(--accent);font-size:1.3rem;margin-top:.05rem;}
.notice p{margin:0;}
.notice.warn{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.4);}
.notice.warn .mi{color:var(--warn);}
.notice+.notice{margin-top:.75rem;}
.notice a{color:var(--accent);font-weight:600;}
.ticks{list-style:none;padding:0;margin:0;}
.ticks li{display:flex;gap:.6rem;align-items:flex-start;padding:.3rem 0;color:var(--muted);line-height:1.55;}
.ticks .mi{color:var(--ok);font-size:1.2rem;margin-top:.1rem;}
button.btn-ghost{background:transparent;cursor:pointer;color:inherit;font-family:inherit;}
.btn-block{width:100%;justify-content:center;}
.faq details{border:1px solid var(--line);background:var(--surface);border-radius:.9rem;margin-bottom:.6rem;}
.faq details[open]{border-color:rgba(37,99,235,.5);}
.faq summary{cursor:pointer;list-style:none;padding:1rem 1.2rem;font-weight:600;display:flex;align-items:center;gap:.75rem;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary .mi{margin-left:auto;color:var(--muted);transition:transform .2s;}
.faq details[open] summary .mi{transform:rotate(180deg);}
.faq .ans{padding:0 1.2rem 1.1rem;color:var(--muted);line-height:1.65;font-size:.96rem;}
.faq .ans ol{list-style:decimal;padding-left:1.2rem;margin:.5rem 0;}
.faq .ans a,.prose a{color:var(--accent);font-weight:500;}
.faq .ans b{color:var(--fg);}
.toast{position:fixed;left:50%;bottom:1.5rem;transform:translate(-50%,1rem);background:var(--fg);color:var(--surface);padding:.6rem 1.1rem;border-radius:.8rem;font-weight:600;font-size:.9rem;opacity:0;pointer-events:none;transition:.25s;z-index:3000;}
.toast.show{opacity:1;transform:translate(-50%,0);}
.actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.5rem;}
.actions.center{justify-content:center;}
.cta-box{margin-top:3.5rem;padding:2.5rem 1.25rem;text-align:center;border-radius:1.25rem;color:#fff;background:linear-gradient(135deg,#0b2a6b,#1d4ed8);}
.cta-box h2{font-size:1.6rem;font-weight:700;margin-bottom:.5rem;}
.cta-box p{color:#cfdcff;max-width:30rem;margin:0 auto 1.25rem;}
.cta-box .btn{background:#fff;color:#0b2a6b;box-shadow:none;}
.cta-box .btn-ghost{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35);color:#fff;}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2rem;}
@media(max-width:820px){
  .foot-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:520px){
  .foot-grid{grid-template-columns:1fr;}
}
.foot-grid h4{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:.75rem;font-weight:700;}
.foot-grid a{display:block;padding:.2rem 0;font-size:.94rem;}
.foot-grid a:hover{color:var(--accent);}
.foot-grid p{color:var(--muted);font-size:.92rem;max-width:30ch;}
.socials{display:flex;gap:.5rem;margin-top:.9rem;}
.foot-grid .socials a{display:grid;place-items:center;width:2.4rem;height:2.4rem;border:1px solid var(--line);border-radius:.7rem;padding:0;}
.foot-grid .socials a:hover{background:var(--accent-soft);}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem;border-top:1px solid var(--line);margin-top:2rem;padding-top:1.1rem;color:var(--muted);font-size:.85rem;}
.more-menu a[aria-current="page"],.mobile-link[aria-current="page"]{color:var(--accent);}
