@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:200 800;font-display:swap;src:url('/fonts/bricolage-grotesque-latin-wght-normal.woff2') format('woff2-variations');}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/ibm-plex-sans-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/ibm-plex-sans-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/ibm-plex-sans-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/jetbrains-mono-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/jetbrains-mono-latin-500-normal.woff2') format('woff2');}
/* Frempong Labs / Jason Frempong — base + interaction states. */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#f7f2e9;color:#161311;font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3{margin:0}
p{margin:0}
a{color:#AC522D;text-decoration:none}
a:hover{color:#87401F}
::selection{background:#e9dfc9}

a:focus-visible,button:focus-visible{outline:2px solid #AC522D;outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-9999px;top:0;background:#161311;color:#f7f2e9;padding:12px 18px;z-index:100;border-radius:0 0 10px 0}
.skip:focus{left:0}

/* pills (was style-hover) */
.pill-outline{font-family:'JetBrains Mono',monospace;font-size:13px;color:#161311;border:1px solid #161311;padding:9px 16px;border-radius:999px;transition:background .15s ease,color .15s ease;display:inline-block}
.pill-outline:hover{background:#161311;color:#f7f2e9}
.pill-clay{display:inline-block;background:#AC522D;color:#f7f2e9;font-weight:600;font-size:16px;padding:15px 30px;border-radius:999px;transition:background .15s ease}
.pill-clay:hover{background:#161311;color:#f7f2e9}
.pill-ghost{display:inline-block;border:1px solid #161311;color:#161311;font-weight:600;font-size:16px;padding:14px 26px;border-radius:999px;transition:background .15s ease,color .15s ease}
.pill-ghost:hover{background:#161311;color:#f7f2e9}

/* cards / rows */
.card-hover{transition:background .15s ease}
.card-hover:hover{background:#fbf6ec}
.row-link{display:block;text-decoration:none;color:inherit;transition:background .15s ease}
.row-link:hover{color:inherit;background:#fbf6ec}
.row-link:hover h3{color:#AC522D}
.link-dark{color:#161311}
.link-dark:hover{color:#AC522D}

/* form (contact) */
.field{background:#fffdf8;border:1px solid #e3d9c4;border-radius:10px;padding:13px 14px;font-size:16px;color:#161311;width:100%;font-family:inherit}
.field:focus{border-color:#AC522D;outline:none;box-shadow:0 0 0 3px rgba(172,82,45,.18)}
.btn-clay{background:#AC522D;border:none;color:#f7f2e9;border-radius:12px;font-weight:600;font-size:16px;transition:background .15s ease;text-decoration:none;display:inline-block;cursor:pointer;font-family:inherit}
.btn-clay:hover{background:#87401F;color:#f7f2e9}
.hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}

@media print{
  *{background:#FFF !important;color:#000 !important}
  a{color:#000 !important;text-decoration:underline}
}
