/*
  Global site CSS — served verbatim from public/ and linked from Layout.astro.

  WHY THIS LIVES IN public/ INSTEAD OF A <style is:global> BLOCK:
  Astro 6.x's CSS pipeline was non-deterministically dropping the layout's
  inlined <style is:global> from built pages (some builds kept it on one page,
  others dropped it from every page — no _astro/*.css emitted either). Files in
  public/ are copied byte-for-byte and a literal <link> can't be dropped, so the
  fonts and base styles now load reliably on every page. Do not move these rules
  back into a <style> block.

  Self-hosted fonts: woff2 files in public/fonts/. No Google Fonts / network
  dependency, no reliance on the CSS minifier's quote handling.
*/

@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/plus-jakarta-sans-400.woff2") format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/plus-jakarta-sans-500.woff2") format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/plus-jakarta-sans-600.woff2") format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/plus-jakarta-sans-700.woff2") format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 800; font-display: swap; src: url("/fonts/plus-jakarta-sans-800.woff2") format("woff2"); }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/sora-400.woff2") format("woff2"); }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/sora-500.woff2") format("woff2"); }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/sora-600.woff2") format("woff2"); }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/sora-700.woff2") format("woff2"); }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 800; font-display: swap; src: url("/fonts/sora-800.woff2") format("woff2"); }

:root {
  --font-body: "Plus Jakarta Sans", sans-serif;
  --font-head: "Sora", sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: var(--font-body);
  background: #F7F4EF;
  color: #15171C;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
::selection { background: rgba(226,75,48,0.16); }
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }
a { text-decoration: none; }

.content-area h2 { font-family: var(--font-head); font-weight: 800; font-size: 25px; color: #15171C; margin: 40px 0 14px; line-height: 1.25; letter-spacing: -0.015em; }
.content-area h3 { font-family: var(--font-head); font-weight: 700; font-size: 18px; color: #15171C; margin: 28px 0 10px; line-height: 1.3; }
.content-area p { font-size: 16.5px; color: #52596A; line-height: 1.78; margin-bottom: 16px; }
.content-area ul, .content-area ol { margin: 0 0 16px 20px; }
.content-area li { font-size: 16.5px; color: #52596A; line-height: 1.78; margin-bottom: 5px; }
.content-area table { width: 100%; border-collapse: collapse; margin: 18px 0 26px; font-size: 14.5px; }
.content-area th { background: #EFEAE2; padding: 11px 14px; text-align: left; font-weight: 700; color: #15171C; border: 1px solid #E3DDD3; }
.content-area td { padding: 11px 14px; border: 1px solid #E3DDD3; color: #52596A; }
.content-area tr:nth-child(even) td { background: #FBF9F5; }
.content-area strong { color: #15171C; }
.content-area a { color: #E24B30; font-weight: 600; border-bottom: 1px solid rgba(226,75,48,0.25); }
.content-area a:hover { border-bottom-color: #E24B30; }
.content-area em { color: #52596A; }

.faq-item { padding: 18px 0; border-top: 1px solid #E3DDD3; }
.faq-item h3 { font-size: 17px; margin: 0 0 7px; }
.faq-item p { margin: 0; }

.related-tools { display: flex; gap: 9px; flex-wrap: wrap; margin: 24px 0; }
.related-tools a { display: inline-flex; align-items: center; gap: 6px; padding: 10px 16px; border-radius: 10px; background: #fff; color: #E24B30; font-weight: 700; font-size: 13.5px; border: 1px solid #E3DDD3; transition: all 0.15s; }
.related-tools a:hover { border-color: #E24B30; background: #FCEDE9; }

.nav-link { position: relative; transition: color 0.15s; }
.nav-link:hover { color: #15171C !important; }
.nav-more-wrap:hover .nav-more-menu,
.nav-more-wrap.open .nav-more-menu { display: block !important; }
.nav-more-menu a:hover { background: #EFEAE2; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.reveal { animation: fadeUp 0.6s cubic-bezier(0.22,1,0.36,1) both; }