/* =============================================================================
   theme.css — Design tokens + base + component helpers (ported to WordPress)
   -----------------------------------------------------------------------------
   Holds design tokens (CSS custom properties), self-hosted Inter @font-face
   declarations, and a few small component helpers Tailwind utilities cannot
   express cleanly. Tokens map to the Customizer (accent + colour mode); the
   compiled Tailwind stylesheet is enqueued alonFgside this file.
   ========================================================================== */

/* ==================== INTER ==================== */
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/inter-400.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("../fonts/inter-500.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/inter-600.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("../fonts/inter-700.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 800; font-display: swap;
  src: url("../fonts/inter-800.woff2") format("woff2");
}
/* ==================== MERRIWEATHER ==================== */
/*@font-face {
	font-family: "Merriweather"; font-style: normal; font-weight: 100; font-display: swap;
	src: url("../fonts/Merriweather96pt-Thin.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: normal; font-weight: 200; font-display: swap;
	src: url("../fonts/Merriweather96pt-ExtraLight.woff2") format("woff2");
}*/
@font-face {
	font-family: "Merriweather"; font-style: normal; font-weight: 300; font-display: swap;
	src: url("../fonts/Merriweather96pt-Light.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: normal; font-weight: 400; font-display: swap;
	src: url("../fonts/Merriweather96pt-Regular.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: normal; font-weight: 500; font-display: swap;
	src: url("../fonts/Merriweather96pt-Medium.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: normal; font-weight: 600; font-display: swap;
	src: url("../fonts/Merriweather96pt-SemiBold.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: normal; font-weight:700; font-display: swap;
	src: url("../fonts/Merriweather96pt-Bold.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: normal; font-weight:800; font-display: swap;
	src: url("../fonts/Merriweather96pt-ExtraBold.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: normal; font-weight:900; font-display: swap;
	src: url("../fonts/Merriweather96pt-Black.woff2") format("woff2");
}

/*@font-face {
	font-family: "Merriweather"; font-style: italic; font-weight: 100; font-display: swap;
	src: url("../fonts/Merriweather96pt-ThinItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: italic; font-weight: 200; font-display: swap;
	src: url("../fonts/Merriweather96pt-ExtraLightItalic.woff2") format("woff2");
}*/
@font-face {
	font-family: "Merriweather"; font-style: italic; font-weight: 300; font-display: swap;
	src: url("../fonts/Merriweather96pt-LightItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: italic; font-weight: 400; font-display: swap;
	src: url("../fonts/Merriweather96pt-Italic.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: italic; font-weight: 500; font-display: swap;
	src: url("../fonts/Merriweather96pt-MediumItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: italic; font-weight: 600; font-display: swap;
	src: url("../fonts/Merriweather96pt-SemiBoldItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: italic; font-weight:700; font-display: swap;
	src: url("../fonts/Merriweather96pt-BoldItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: italic; font-weight:800; font-display: swap;
	src: url("../fonts/Merriweather96pt-ExtraBoldItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Merriweather"; font-style: italic; font-weight:900; font-display: swap;
	src: url("../fonts/Merriweather96pt-BlackItalic.woff2") format("woff2");
}

/* ==================== IBM PLEX MONO ==================== */
@font-face {
	font-family: "IBM Plex Mono"; font-style: normal; font-weight: 100; font-display: swap;
	src: url("../fonts/IBMPlexMono-Thin.woff2") format("woff2");
}
@font-face {
	font-family: "IBM Plex Mono"; font-style: normal; font-weight: 200; font-display: swap;
	src: url("../fonts/IBMPlexMono-ExtraLight.woff2") format("woff2");
}
@font-face {
	font-family: "IBM Plex Mono"; font-style: normal; font-weight: 300; font-display: swap;
	src: url("../fonts/IBMPlexMono-Light.woff2") format("woff2");
}
@font-face {
	font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap;
	src: url("../fonts/IBMPlexMono-Regular.woff2") format("woff2");
}
@font-face {
	font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap;
	src: url("../fonts/IBMPlexMono-Medium.woff2") format("woff2");
}
@font-face {
	font-family: "IBM Plex Mono"; font-style: normal; font-weight: 600; font-display: swap;
	src: url("../fonts/IBMPlexMono-SemiBold.woff2") format("woff2");
}
@font-face {
	font-family: "IBM Plex Mono"; font-style: normal; font-weight:700; font-display: swap;
	src: url("../fonts/IBMPlexMono-Bold.woff2") format("woff2");
}
/*@font-face {
	font-family: "IBM Plex Mono"; font-style: normal; font-weight:800; font-display: swap;
	src: url("../fonts/IBMPlexMono-ExtraBold.woff2") format("woff2");
}*/
/*@font-face {
	font-family: "IBM Plex Mono"; font-style: normal; font-weight:900; font-display: swap;
	src: url("../fonts/IBMPlexMono-Black.woff2") format("woff2");
}*/

@font-face {
	font-family: "IBM Plex Mono"; font-style: italic; font-weight: 100; font-display: swap;
	src: url("../fonts/IBMPlexMono-ThinItalic.woff2") format("woff2");
}
@font-face {
	font-family: "IBM Plex Mono"; font-style: italic; font-weight: 200; font-display: swap;
	src: url("../fonts/IBMPlexMono-ExtraLightItalic.woff2") format("woff2");
}
@font-face {
	font-family: "IBM Plex Mono"; font-style: italic; font-weight: 300; font-display: swap;
	src: url("../fonts/IBMPlexMono-LightItalic.woff2") format("woff2");
}
@font-face {
	font-family: "IBM Plex Mono"; font-style: italic; font-weight: 400; font-display: swap;
	src: url("../fonts/IBMPlexMono-Italic.woff2") format("woff2");
}
@font-face {
	font-family: "IBM Plex Mono"; font-style: italic; font-weight: 500; font-display: swap;
	src: url("../fonts/IBMPlexMono-MediumItalic.woff2") format("woff2");
}
@font-face {
	font-family: "IBM Plex Mono"; font-style: italic; font-weight: 600; font-display: swap;
	src: url("../fonts/IBMPlexMono-SemiBoldItalic.woff2") format("woff2");
}
@font-face {
	font-family: "IBM Plex Mono"; font-style: italic; font-weight:700; font-display: swap;
	src: url("../fonts/IBMPlexMono-BoldItalic.woff2") format("woff2");
}
/*@font-face {
	font-family: "IBM Plex Mono"; font-style: italic; font-weight:800; font-display: swap;
	src: url("../fonts/IBMPlexMono-ExtraBoldItalic.woff2") format("woff2");
}*/
/*@font-face {
	font-family: "IBM Plex Mono"; font-style: italic; font-weight:900; font-display: swap;
	src: url("../fonts/IBMPlexMono-BlackItalic.woff2") format("woff2");
}*/
/* ==================== FRAUNCES ==================== */
@font-face {
	font-family: "Fraunces"; font-style: normal; font-weight: 100; font-display: swap;
	src: url("../fonts/Fraunces72pt-Thin.woff2") format("woff2");
}
/*@font-face {
	font-family: "Fraunces"; font-style: normal; font-weight: 200; font-display: swap;
	src: url("../fonts/Fraunces72pt-ExtraLight.woff2") format("woff2");
}*/
@font-face {
	font-family: "Fraunces"; font-style: normal; font-weight: 300; font-display: swap;
	src: url("../fonts/Fraunces72pt-Light.woff2") format("woff2");
}
@font-face {
	font-family: "Fraunces"; font-style: normal; font-weight: 400; font-display: swap;
	src: url("../fonts/Fraunces72pt-Regular.woff2") format("woff2");
}
/*@font-face {
	font-family: "Fraunces"; font-style: normal; font-weight: 500; font-display: swap;
	src: url("../fonts/Fraunces72pt-Medium.woff2") format("woff2");
}*/
@font-face {
	font-family: "Fraunces"; font-style: normal; font-weight: 600; font-display: swap;
	src: url("../fonts/Fraunces72pt-SemiBold.woff2") format("woff2");
}
@font-face {
	font-family: "Fraunces"; font-style: normal; font-weight:700; font-display: swap;
	src: url("../fonts/Fraunces72pt-Bold.woff2") format("woff2");
}
/*@font-face {
	font-family: "Fraunces"; font-style: normal; font-weight:800; font-display: swap;
	src: url("../fonts/Fraunces72pt-ExtraBold.woff2") format("woff2");
}*/
@font-face {
	font-family: "Fraunces"; font-style: normal; font-weight:900; font-display: swap;
	src: url("../fonts/Fraunces72pt-Black.woff2") format("woff2");
}

@font-face {
	font-family: "Fraunces"; font-style: italic; font-weight: 100; font-display: swap;
	src: url("../fonts/Fraunces72pt-ThinItalic.woff2") format("woff2");
}
/*@font-face {
	font-family: "Fraunces"; font-style: italic; font-weight: 200; font-display: swap;
	src: url("../fonts/Fraunces72pt-ExtraLightItalic.woff2") format("woff2");
}*/
@font-face {
	font-family: "Fraunces"; font-style: italic; font-weight: 300; font-display: swap;
	src: url("../fonts/Fraunces72pt-LightItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Fraunces"; font-style: italic; font-weight: 400; font-display: swap;
	src: url("../fonts/Fraunces72pt-Italic.woff2") format("woff2");
}
/*@font-face {
	font-family: "Fraunces"; font-style: italic; font-weight: 500; font-display: swap;
	src: url("../fonts/Fraunces72pt-MediumItalic.woff2") format("woff2");
}*/
@font-face {
	font-family: "Fraunces"; font-style: italic; font-weight: 600; font-display: swap;
	src: url("../fonts/Fraunces72pt-SemiBoldItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Fraunces"; font-style: italic; font-weight:700; font-display: swap;
	src: url("../fonts/Fraunces72pt-BoldItalic.woff2") format("woff2");
}
/*@font-face {
	font-family: "Fraunces"; font-style: italic; font-weight:800; font-display: swap;
	src: url("../fonts/Fraunces72pt-ExtraBoldItalic.woff2") format("woff2");
}*/
@font-face {
	font-family: "Fraunces"; font-style: italic; font-weight:900; font-display: swap;
	src: url("../fonts/Fraunces72pt-BlackItalic.woff2") format("woff2");
}

/* ==================== GEIST MONO ==================== */
@font-face {
	font-family: "Geist Mono"; font-style: normal; font-weight: 100; font-display: swap;
	src: url("../fonts/GeistMono-Thin.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: normal; font-weight: 200; font-display: swap;
	src: url("../fonts/GeistMono-ExtraLight.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: normal; font-weight: 300; font-display: swap;
	src: url("../fonts/GeistMono-Light.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: normal; font-weight: 400; font-display: swap;
	src: url("../fonts/GeistMono-Regular.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: normal; font-weight: 500; font-display: swap;
	src: url("../fonts/GeistMono-Medium.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: normal; font-weight: 600; font-display: swap;
	src: url("../fonts/GeistMono-SemiBold.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: normal; font-weight:700; font-display: swap;
	src: url("../fonts/GeistMono-Bold.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: normal; font-weight:800; font-display: swap;
	src: url("../fonts/GeistMono-ExtraBold.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: normal; font-weight:900; font-display: swap;
	src: url("../fonts/GeistMono-Black.woff2") format("woff2");
}

@font-face {
	font-family: "Geist Mono"; font-style: italic; font-weight: 100; font-display: swap;
	src: url("../fonts/GeistMono-ThinItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: italic; font-weight: 200; font-display: swap;
	src: url("../fonts/GeistMono-ExtraLightItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: italic; font-weight: 300; font-display: swap;
	src: url("../fonts/GeistMono-LightItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: italic; font-weight: 400; font-display: swap;
	src: url("../fonts/GeistMono-Italic.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: italic; font-weight: 500; font-display: swap;
	src: url("../fonts/GeistMono-MediumItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: italic; font-weight: 600; font-display: swap;
	src: url("../fonts/GeistMono-SemiBoldItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: italic; font-weight:700; font-display: swap;
	src: url("../fonts/GeistMono-BoldItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: italic; font-weight:800; font-display: swap;
	src: url("../fonts/GeistMono-ExtraBoldItalic.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono"; font-style: italic; font-weight:900; font-display: swap;
	src: url("../fonts/GeistMono-BlackItalic.woff2") format("woff2");
}


/* ---------- DESIGN TOKENS: light theme (default) -------------------------- */

:root {
  /* ===== COLOR ======= */  
  --c-accent-teal: 82 153 160;
  --c-accent-teal-strong: 82 153 160; /* 13 148 136 hover/active accent -- 117 196 198 / 75c4c6*/
  --c-accent-yellow: 193 223 71; 
  --c-accent-tangerine: 230 138 121;
  --c-accent-beige: 111 103 93; /*--- update ----*/
  --c-primary-offwhite: 248 246 244;
  --c-primary-offblack: 43 43 43;
  --c-primary-grey: 187 189 188;

	
  /* ===== TYPOGRAPHY ======= */  
  --font-sans-orig: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI",
    Roboto, Helvetica, Arial, sans-serif;
  --font-sans: "IBM Plex Mono", monospace;/*Geist Mono */
  --font-display: var(--font-sans);
	
	/* CLAUDE --- update ----*/
  --f-headlines: 'Fraunces',serif;
  --f-body: 'Inter',sans-serif;
  --f-mono: 'IBM Plex Mono',monospace;

  /* ===== SHAPE ======= */  
  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1.5rem;
  --radius-pill: 9999px;

  /* ===== LAYOUT ======= */  
  --container-max: 80rem; /* 1280px, mirrors max-w-7xl */
  --content-max: 42rem;   /* the readable inner rail */
}

 /* ===== COLOR REF ===== */
.bg-accent-teal { background: rgb(var(--c-accent-teal))}
.bg-accent-yellow { background: rgb(var(--c-accent-yellow))}
.bg-accent-tangerine { background: rgb(var(--c-accent-tangerine))}
.bg-accent-beige { background: rgb(var(--c-accent-beige))}
.bg-offblack { background: rgb(var(--c-primary-offblack))}
.bg-offwhite { background: rgb(var(--c-primary-offwhite)); }
.br-12 {border-radius: var(--radius-sm)}


/* ---------- Base ---------------------------------------------------------- */
html {
  font-family: var(--font-display);/*--font-sans*/
  height: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Smooth, accessible focus rings driven by the accent token. */
/* Focus ring follows each element's own border-radius (so grouped inputs with
   a square right edge stay square on focus — the outline isn't forced round). */
:where(a, button, input, textarea, [tabindex]):focus-visible {
  outline: 2px solid rgb(var(--c-accent-teal));
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
}

/* ---------- Primary navigation -------------------------------------------
   wp_nav_menu() renders every depth assigned to the "primary" location.
   Top-level items are laid out by the Tailwind classes coming from the
   chosen header style; submenus are positioned and themed here. */
.oz-menu,
.oz-menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.oz-menu li {
  position: relative;
}
.oz-menu li a { 
    font-family:var(--f-mono);
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:0.1em;
    text-decoration:none;
	color:rgb(var(--c-primary-offwhite) / 0.7);
    padding-bottom:6px;
	border-bottom:1px solid transparent;
    transition:color .2s ease, border-color .2s ease;
}

.oz-menu li a:hover, 
.oz-menu li a:active,
.oz-menu--underline > li > a[aria-current="page"]::after {
	border-bottom: 1px solid;
	border-bottom-color: rgb(var(--c-accent-yellow));
	color:rgb(var(--c-accent-teal));
}

/* Gradient underline under the current item (styles that opt into it). */
.oz-menu--underline > li > a[aria-current="page"]::after {
  content: "";
  position: absolute;
  left: 0.25rem;
  right: 0.25rem;
  bottom: -1px;
  height: 1px;
  /*background-image: linear-gradient(
    to right,
    rgb(var(--c-accent-yellow) / 0),
    rgb(var(--c-accent-yellow) / 0.6),
    rgb(var(--c-accent-yellow) / 0)
  );*/
} 

/* Dropdown panels. :where() keeps specificity at zero for the dark variants so
   the flat "stacked"/"inline" overrides further down can still reset them. */
.oz-menu .oz-submenu,
.oz-menu .children {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 60;
  min-width: 13rem;
  margin-top: 0.5rem;
  padding: 0.375rem;
  border-radius: var(--radius-md);
  background-color: rgb(var(--c-primary-offwhite));
  color: rgb(var(--c-primary-offblack));
  box-shadow: 0 10px 30px rgb(24 24 27 / 0.12);
  outline: 1px solid rgb(24 24 27 / 0.05);
  outline-offset: -1px;
  display: none;
  text-align: left;
}
:where(.dark) .oz-menu .oz-submenu,
:where(.dark) .oz-menu .children {
  background-color: rgb(39 39 42);
  outline-color: rgb(255 255 255 / 0.1);
}
/* Second level and deeper open to the side. */
.oz-menu .oz-submenu .oz-submenu,
.oz-menu .children .children {
  top: -0.375rem;
  left: 100%;
  margin-top: 0;
  margin-left: 0.25rem;
}
.oz-menu li:hover > .oz-submenu,
.oz-menu li:hover > .children,
.oz-menu li:focus-within > .oz-submenu,
.oz-menu li:focus-within > .children,
.oz-menu li.oz-submenu-open > .oz-submenu,
.oz-menu li.oz-submenu-open > .children {
  display: block;
}

.oz-submenu-link,
.oz-menu .children a {
  display: block;
  padding: 0.5rem 0.75rem;
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  font-weight: 500;
  color: rgb(63 63 70);
  transition: background-color 0.15s ease, color 0.15s ease;
}
:where(.dark) .oz-submenu-link,
:where(.dark) .oz-menu .children a {
  color: rgb(212 212 216);
}
.oz-submenu-link:hover,
.oz-menu .children a:hover,
.oz-submenu-link[aria-current="page"],
.oz-menu .children a[aria-current="page"] {
  background-color: rgb(244 244 245);
  color: rgb(var(--c-accent-yellow));
}
:where(.dark) .oz-submenu-link:hover,
:where(.dark) .oz-menu .children a:hover,
:where(.dark) .oz-submenu-link[aria-current="page"],
:where(.dark) .oz-menu .children a[aria-current="page"] {
  background-color: rgb(63 63 70);
  color: rgb(var(--c-accent-yellow));
}

/* Toggle button that opens a submenu for pointer and keyboard users. */
.oz-submenu-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  margin-left: -0.25rem;
  border: 0;
  border-radius: var(--radius-pill);
  background: transparent;
  color: inherit;
  cursor: pointer;
}
.oz-submenu-toggle svg {
  width: 0.875rem;
  height: 0.875rem;
  transition: transform 0.2s ease;
}
.oz-submenu-open > .oz-submenu-toggle svg {
  transform: rotate(180deg);
}
.oz-menu > li {
  display: flex;
  align-items: center;
}

/* Stacked variant (mobile menu): every depth is rendered in flow. */
.oz-menu--stacked > li,
.oz-menu--stacked li {
  display: block;
}
.oz-menu--stacked .oz-submenu,
.oz-menu--stacked .children {
  position: static;
  display: block;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: none;
  box-shadow: none;
  outline: none;
  text-align: inherit;
}
.oz-menu--stacked .oz-submenu-link,
.oz-menu--stacked .children a {
  background: none;
}

/* Inline variant (footer): children follow their parent on the same row. */
.oz-menu--inline li {
  display: inline-flex;
  align-items: center;
  gap: 1.5rem;
}
.oz-menu--inline .oz-submenu,
.oz-menu--inline .children {
  position: static;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  min-width: 0;
  margin: 0 0 0 1.5rem;
  padding: 0;
  background: none;
  box-shadow: none;
  outline: none;
}
.oz-menu--inline .oz-submenu-link,
.oz-menu--inline .children a {
  display: inline;
  padding: 0;
  background: none;
  font-size: inherit;
}

/* ---------- Footer widgets ------------------------------------------------ */
.oz-footer-widgets {
  display: grid;
  gap: 2rem;
  padding-bottom: 2.5rem;
}
@media (min-width: 640px) {
  .oz-footer-widgets {
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  }
}
.oz-widget-title {
  margin-bottom: 0.75rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: rgb(39 39 42);
}
.dark .oz-widget-title {
  color: rgb(244 244 245);
}
.oz-widget {
  font-size: 0.875rem;
  color: rgb(82 82 91);
}
.dark .oz-widget {
  color: rgb(161 161 170);
}
.oz-widget ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.oz-widget li {
  margin: 0.35rem 0;
}
.oz-widget a:hover {
  color: rgb(var(--c-accent-teal-strong));
}

/* ---------- Decorative background rail ------------------------------------
   Recreates the "white content column floating on a tinted page" look using
   our own markup and tokens. */
.bg-rail {
  position: fixed;
  inset: 0;
  display: flex;
  justify-content: center;
  pointer-events: none;
  z-index: 0;
}
.bg-rail > div {
  width: 100%;
  max-width: var(--container-max);
  background-color: rgb(var(--c-primary-offwhite));
}
.dark .bg-rail > div {
  background-color: rgb(var(--c-primary-offblack));
}

/* ---------- Avatar / photo placeholders ----------------------------------
   Gradient placeholders so the template looks complete with zero image
   assets. Replaced by real featured images where available. */
.ph {
  background-image: linear-gradient(
    135deg,
	rgb(var(--c-accent-yellow) / 0.95),
    rgb(var(--c-accent-teal) / 0.95)
  );
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* Tilted photo strip on the home page. */
.photo-strip { gap: 1.25rem; }
.photo-strip > * { rotate: 2deg; }
.photo-strip > *:nth-child(even) { rotate: -2deg; }
.photo-strip > *:nth-child(3n) { rotate: 3deg; }

/* ---------- Long-form prose tweaks --------------------------------------- */
.prose-body {
	font-family: var(--f-body);
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
	line-height: inherit;
}
.prose-body :where(p, ul, ol):not(:last-child) { margin-bottom: 1.25rem; }
.prose-body a {
  color: rgb(var(--c-accent-teal-strong));
  text-decoration: underline;
  text-underline-offset: 3px;
}
/* scroll-margin keeps anchor jumps (TOC) clear of the sticky header. */
/*.prose-body h2 { font-weight: 700; font-size: 1.5rem; margin: 2rem 0 0.75rem; scroll-margin-top: 6rem; text-transform: uppercase;}*/
/*.prose-body h3 { font-weight: 300; font-size: 1.125rem; margin: 1.5rem 0 0.5rem; scroll-margin-top: 6rem; text-transform: uppercase;}*/
.prose-body h2 {
	color: rgb(var(--c-primary-offblack));
	font-family: var(--f-mono);
	text-transform: uppercase;
	font-weight: 500;
	font-size: 13px;
	letter-spacing: .16em;
	margin: 46px 0;
	scroll-margin-top: 6rem;
}
.dark .prose-body h2 {color: rgb(var(--c-primary-offwhite))}
.prose-body h2::before {
  content: "// ";
}
.prose-body h3 {
	font-family: var(--f-headlines);
	color: rgb(var(--c-primary-offblack));
	/*color: rgb(var(--c-accent-teal-strong));*/
	font-weight: 500;
	font-size: 1.3rem;
	margin: 1.5rem 0;
	scroll-margin-top: 6rem;
}
.dark .prose-body h3 {color: rgb(var(--c-primary-offwhite))}

/* Tailwind preflight strips list styling — restore it inside prose. */
.prose-body ul { list-style: disc; padding-left: 1.5rem; }
.prose-body ol { list-style: decimal; padding-left: 1.5rem; }
.prose-body li { margin: 0.35rem 0; }
.prose-body li::marker { 
	color: rgb(var(--c-accent-teal)); 
	font-family: var(--f-mono); 
	font-size:13px;
	letter-spacing:.05em;
}
.prose-body figure:not(:last-child),
.prose-body pre:not(:last-child),
.prose-body .table-wrap:not(:last-child) { margin-bottom: 1.5rem; }
/* Inline code (not inside a <pre> block). */
.prose-body :not(pre) > code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.875em;
  background: rgb(244 244 245);
  padding: 0.1em 0.35em;
  border-radius: 0.3rem;
}
.dark .prose-body :not(pre) > code { background: rgb(39 39 42); }

/* Fenced code blocks (editor "Code" block / <pre><code>). Mirrors the
   prototype's dark, rounded code panel — applied via CSS so authored content
   doesn't need utility-class wrappers. */
.prose-body pre {
  position: relative;
  margin: 1.5rem 0;
  padding: 1rem 1.25rem;
  overflow-x: auto;
  border-radius: 0.75rem;
  background: rgb(24 24 27);
  color: rgb(244 244 245);
  font-size: 0.875rem;
  line-height: 1.65;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.08);
}
.prose-body pre code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  background: transparent;
  color: inherit;
  padding: 0;
  border-radius: 0;
  font-size: inherit;
}
/* ARTICLE - CUSTOM */
.prose-body hr { margin: 65px 0; border-top: thin dashed; height: 0; border-top-color: rgb(var(--c-primary-grey) / 0.75)}
.dark .prose-body hr { border-top-color: rgb(var(--c-primary-grey) / 0.25)}
.prose-body strong, b { font-weight: 700 }
.dark .prose-body strong, b { color: rgb(var(--c-primary-offwhite) / 0.6) }
.prose-body sup {padding: 0 5px;}

/* Hide the native disclosure triangle on FAQ <summary> (Safari/Chrome). */
summary::-webkit-details-marker { display: none; }
summary { list-style: none; }

/* Utility: clamp a paragraph to N lines (used by article/portfolio cards). */
.clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ---------- WordPress core classes ---------------------------------------- */
/* Accessible hidden text that becomes visible on keyboard focus. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  width: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  word-wrap: normal !important;
}
.screen-reader-text:focus {
  background-color: #fff;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  clip-path: none;
  color: rgb(var(--c-accent-teal-strong));
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

/* ---------- Skip link -----------------------------------------------------
   Built on .screen-reader-text (see below) so it is hidden until focused.
   The admin bar is fixed at the top of the viewport, so the focused link is
   pushed below it — otherwise the two overlap for logged-in users. */
.oz-skip-link:focus {
  top: 5px;
  left: 5px;
}
body.admin-bar .oz-skip-link:focus {
  top: calc(32px + 5px);
}
@media screen and (max-width: 782px) {
  body.admin-bar .oz-skip-link:focus {
    top: calc(46px + 5px);
  }
}

/* Content alignment (images, blocks, etc.). */
.alignleft { float: left; margin: 0.5rem 1.5rem 1rem 0; }
.alignright { float: right; margin: 0.5rem 0 1rem 1.5rem; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignwide { max-width: 1100px; }
.alignfull { max-width: 100%; }
.prose-body img,
.wp-caption { max-width: 100%; height: auto; }

/* Captions. */
.wp-caption { margin-bottom: 1.5rem; }
.wp-caption img { display: block; }
.wp-caption-text,
.gallery-caption {
  font-size: 0.85rem;
  color: rgb(113 113 122);
  text-align: center;
  margin-top: 0.5rem;
}
.dark .wp-caption-text,
.dark .gallery-caption { color: rgb(161 161 170); }

/* Sticky + by-post-author markers (required hooks for core/comments). */
.bypostauthor > article { box-shadow: inset 3px 0 0 rgb(var(--c-accent-teal)); }
.sticky { /* sticky posts are surfaced in the loop */ }

/* Long titles / unbroken strings shouldn't overflow the content area. */
h1, h2, h3, h4, h5, h6 { /*overflow-wrap: break-word;*/ }

/* Nested comment replies. */
.oz-comment-list .children {
  margin-top: 1rem;
  padding-left: 1.25rem;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (min-width: 640px) { .oz-comment-list .children { padding-left: 2.5rem; } }
.oz-comment-list .comment-reply-link { font-weight: 500; color: rgb(var(--c-accent-teal-strong)); }
.oz-comment-list .comment-reply-link:hover { color: rgb(var(--c-accent-teal)); }




/* REFERENCES */
/* Hide footnote arrows/backlinks */
.footnotes {
	font-size: .75rem;
}
.footnotes .footnote-backref,
.footnotes a[rel="footnote"]::after {
    display: none;
}
.footnotes-sep {display: none;}


/* MARKDOWN TABLES */

.table-wrap {
    margin: 32px 0;
	overflow-y: hidden;
	overflow-x: visible;
	/*overflow: visible;*/
    -webkit-overflow-scrolling: touch;
	width: 100%;
}

@media(min-width: 1024px) {
    .table-wrap {
       /* width:min(1080px,calc(100vw - 80px));
       margin-left: 50%;
        transform: translate(-50%);*/
        position: relative;
        z-index: 45;
    }

    .table-wrap::before,
	.table-wrap::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        height: 20px;
        pointer-events: none;
        z-index: 2;
        -webkit-mask-image: linear-gradient(to right,transparent 0%,#000 6%,#000 94%,transparent 100%);
        mask-image: linear-gradient(to right,transparent 0%,#000 6%,#000 94%,transparent 100%);
    }

    .table-wrap::before {
        top: 0;
        transform: translateY(-100%);
        background: linear-gradient(to top,#f1f5f9 0% 20%,#f1f5f900);
    }

    .table-wrap::after {
        bottom: 0;
        transform: translateY(100%);
        background: linear-gradient(to bottom,#f1f5f9 0% 20%,#f1f5f900);
		overflow:visible;
    }
}

@media(min-width: 1280px) {
    .table-wrap {
		width:54rem;
	    /*width:min(1080px,calc(100vw - 24px));*/
    }
}

.table-wrap caption {
    caption-side: top;
    text-align: left;
    font-family: Barlow Condensed,sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 1.3;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #0f172a;
    padding: 0 0 12px 23px
}

.table-wrap table {
	width:min(768px);
	width:max(1080px);
	font-size: .75rem;
	background-color: rgb(var(--c-primary-offwhite));
	color: rgb(var(--c-primary-offblack));
	
	border-collapse: separate;
    border-spacing: 0;
	border: 3px solid rgb(var(--c-accent-beige)/.5);
    border-radius: 12px;
	overflow: hidden;
}
@media(max-width: 500px) {
	.table-wrap table {width:min(550px)}
}
.table-wrap table th,
.table-wrap table td {
	padding: 10px;
}
/* Table borders */
/* Add vertical borders between columns */
.table-wrap td,
.table-wrap th:not(:last-child) {
  border-bottom: 1px dashed;
  border-bottom-color: rgb(var(--c-primary-grey) / 0.75);
}
.table-wrap table tr:last-child td {
  border-bottom: none !important;
}
.table-wrap table tr:hover {
  background: rgb(var(--c-accent-teal)/.1);
}


/* Header styling */
.table-wrap table th {
    font-weight: 600;
    text-align: left;
	background: rgb(var(--c-accent-beige)/.5);
	color: rgb(var(--c-primary-offblack)/1);
	padding: 10px;
	text-transform: uppercase;
}

/* Row striping
.table-wrap table tr:nth-child(even) {
    background: rgb(var(--c-accent-teal)/.1);
} */

/* TOC -- doesn't work */

.dark #toc a:hover {
  color: rgb(var(--c-accent-teal));
  border-color: rgb(var(--c-accent-teal));
}

.article-toc-rail {
    display: none
}

@media(min-width: 1280px) {
    .article-toc-rail {
        display:block;
        position: absolute;
        top: 0;
        bottom: 0;
        right: calc(50% + 400px);
        width: 220px
    }

    .article-toc {
        position: sticky;
        top: 172px;
        max-height: calc(100vh - 232px);
        overflow-y: auto;
        padding-right: 8px
    }
}

/* BLOCK QUOTE */
blockquote {
    display: flex;
    gap: 20px;
    margin: 48px 0; /* set in tailwind.css */
    padding: 8px 0;
    border: none;
    background: none;
    border-radius: 0;
	font-family: var(--f-headlines);
	font-style: italic;
	font-weight: 450;
	line-height: 1.22;
	font-size: clamp(1.35rem, 2.7vw, 1.8rem);/*1.9rem,3.4vw,2.7rem*/
}
blockquote a {font-size:12px}
.dark blockquote {color: rgb(var(--c-primary-offwhite) / 0.85)}
blockquote::before {
    content: "";
    width: 4px;
    background: rgb(var(--c-accent-tangerine));
    flex-shrink: 0;
    border-radius: 0;
}

/* PROGRESS BAR */
.reading-progress-bar {
    top: auto;
    bottom: 0; /* anchor to bottom of header */
}

/* SITE HEADER */
#main { /* offset for fixed header */
		padding-top: 4rem;
	}
@media(min-width: 450px) {
	#main { /* offset for fixed header */
		padding-top: 2rem;
	}
}

@media(min-width: 1024px) {
	.breadcrumb {
		margin-bottom: 1rem;
	}
}

.site-header {
    z-index: 50;
    background-color: rgb(var(--c-primary-offblack));
    border-bottom: 1px solid #f1f5f933;
    position: fixed;
    top: 0;
    left: 0;
    right: 0
}

.site-header:has(.reading-progress) {
    padding-bottom: 6px
}
.reading-progress {
    pointer-events: none;
    height: 6px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0
}

.site-header:has(.reading-progress)+.site-header__spacer {
    margin-bottom: 6px
}

.site-header:has(.site-header__mobile-menu:not(.hidden)) .reading-progress {
    display: none
}

.reading-progress__fill {
    background: var(--c-accent-yellow);
    border-radius: 0 3px 3px 0;
    width: 0;
    height: 100%;
    transition: width .1s linear
}

.site-header__logo {
    flex-shrink: 0;
    align-items: center;
    gap: 0;
    width: 190px;
    height: 73px;
    text-decoration: none;
    display: flex
}

.site-header__logo-icon {
    width: 71px;
    height: 73px
}

.site-header__logo-text {
    width: 105px;
    height: 56px;
    margin-top: 8px;
    margin-left: 6px
}

@media(min-width: 1728px) {
    .site-header__logo {
        width:253px;
        height: 97px
    }

    .site-header__logo-icon {
        width: 94px;
        height: 97px
    }

    .site-header__logo-text {
        width: 139px;
        height: 75px;
        margin-top: 11px;
        margin-left: 8px
    }
}

.site-header__desktop-nav {
    align-items: center;
    gap: 48px;
    display: none
}

@media(min-width: 1024px) {
    .site-header__desktop-nav {
        display:flex
    }
}

@media(min-width: 1728px) {
    .site-header__desktop-nav {
        gap:120px
    }
}

.site-header__links {
    align-items: center;
    gap: 32px;
    display: flex
}

@media(min-width: 1728px) {
    .site-header__links {
        gap:64px
    }
}

@media(max-width: 1279px)and (min-width:1024px) {
    .site-header__nav {
        padding:8px 24px
    }

    .site-header__desktop-nav {
        gap: 24px
    }

    .site-header__links {
        gap: 16px
    }

    .nav-link {
        font-size: .9375rem
    }
}

.site-header__mobile-btn {
    /*color: #fff;*/
    cursor: pointer;
    background: 0 0;
    border: none;
    border-radius: 6px;
    justify-content: center;
    align-items: center;
    padding: 8px;
    display: inline-flex
}

@media(min-width: 1024px) {
    .site-header__mobile-btn {
        display:none
    }
}

.site-header__spacer {
    height: 97px
}

@media(min-width: 1728px) {
    .site-header__spacer {
        height:121px
    }
}

.btn-primary {
    background-color: var(--color-highlight);
    min-width: 170px;
    height: 44px;
    font-family: var(--font-heading);
    text-transform: uppercase;
    letter-spacing: .09em;
    color: #0f172a;
    border-radius: 30px;
    justify-content: center;
    align-items: center;
    padding: 0 24px;
    font-size: 1.25rem;
    font-weight: 700;
    text-decoration: none;
    transition: all .2s;
    display: inline-flex;
    box-shadow: 0 4px 4px #00000040
}

.author-bio {
	background: rgb(var(--c-accent-beige))
}
.author-title {
	color: rgb(var(--c-primary-offblack))
}
.author-bio-image {
	border-radius: 12px;
}
.author-icon-image{
	border-radius: 50px;
}

/* ================= CLAUSE CLASSES ==================== */

  /* ===== GENERAL ===== */
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:rgb(var(--c-primary-offwhite));
    color:rgb(var(--c-primary-offblack));
    font-family:var(--f-body);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  a{color:inherit;} 
  .mono{font-family:var(--f-mono);}
  .wrap{max-width:1180px;margin:0 auto;padding:0 32px;}

  /* PLUS PATTERN TEXTURE */
  .plus-field{
    position:absolute;inset:0;pointer-events:none;
    background-image:radial-gradient(rgb(var(--c-accent-teal) / 0.35) 1px, transparent 1px),
                      linear-gradient(rgb(var(--c-accent-teal) / 0.35) 1px, transparent 1px);
    background-size:26px 26px, 26px 26px;
    background-position:0 0, 13px 13px;
    -webkit-mask-image: radial-gradient(ellipse at center, black 0%, transparent 72%);
            mask-image: radial-gradient(ellipse at center, black 0%, transparent 72%);
  }
  .plus-grid{ 
    position:absolute;pointer-events:none;
    font-family:var(--f-mono);font-size:14px;line-height:26px;
    color:rgb(var(--c-accent-teal) / 0.4);
    letter-spacing:12px;white-space:pre;
  }

  /* ===== NAV (over hero) ===== */
  nav.top{
    position:relative;z-index:5;
    display:flex;align-items:center;justify-content:space-between;
    padding:26px 48px 26px 88px;
  }
  .logo{font-family:var(--f-headlines);font-weight:600;font-size:19px;letter-spacing:0.02em;color:rgb(var(--c-primary-offwhite));}


  /* ===== HERO ===== */
  .hero{
    position:relative;
    display:grid;grid-template-columns:44% 56%;
    min-height:640px;
  }
  .hero-panel-dark{background:rgb(var(--c-primary-offblack));position:relative;overflow:hidden;}
  .hero-panel-teal{background:rgb(var(--c-accent-teal));position:relative;overflow:hidden;}

  .hero-index{
    position:absolute;left:34px;top:110px;bottom:34px;z-index:4;
    display:flex;flex-direction:column;align-items:center;gap:22px;
    color:rgb(var(--c-primary-offwhite) / 0.85);
  }
  .hero-index .count{font-family:var(--f-mono);font-size:12px;letter-spacing:.05em;}
  .hero-index .rule{width:1px;flex:1;background:rgb(var(--c-primary-offwhite) / 0.3);}
  .hero-index .vert{
    writing-mode:vertical-rl;transform:rotate(180deg);
    font-family:var(--f-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;
  }

  .hero-photo{
    position:absolute;left:0;right:0;bottom:0;top:7%;/*14%*/
    background-image:url('https://i0.wp.com/fidamo.com/wp-content/uploads/2026/08/KatieMoon-PublicSpeaking-2_CENTER.webp?w=900&ssl=1');
    background-size:cover;background-position:center 20%;
    filter:grayscale(1) contrast(1.05);
	z-index: 3; /*added - photo oover FIDAMO*/
  }
  .hero-photo::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(0deg, rgb(var(--c-primary-offblack)) 0%, transparent 42%);/*42%*/  
  }

  .hero-ghost{
    position:absolute;
	  top:15%;left:-4%;/*8% -4%*/
	  z-index:2;
    font-family:var(--f-headlines);
	  font-weight:780;
	  font-size:min(27vw,190px);/*15vw,190px*/
    line-height:0.85;letter-spacing:-0.02em;
    color:rgb(var(--c-primary-offwhite) / 0.14);
    white-space:nowrap;pointer-events:none;
  }

  .hero-copy{
    position:relative;z-index:4;
    height:100%;display:flex;flex-direction:column;justify-content:center;
    padding:40px 60px 40px 56px;
  }
  .hero-eyebrow{
    font-family:var(--f-mono);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;
    color:rgb(var(--c-primary-offblack) / 0.7);margin-bottom:20px;
  }
  h1.hero-quote{
    font-family:var(--f-headlines);font-style:italic;font-weight:450;
    font-size:clamp(1.9rem,3.4vw,2.7rem);line-height:1.22;
    color:rgb(var(--c-primary-offblack));margin:0 0 26px;max-width:15ch;
  }
  .hero-copy p{font-size:15.5px;max-width:44ch;color:rgb(var(--c-primary-offblack) / 0.82);margin:0 0 26px;}
  .hero-copy .learn{
    font-family:var(--f-mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;
    display:inline-flex;align-items:center;gap:14px;color:rgb(var(--c-primary-offblack));text-decoration:none;
    font-weight:500;
  }
  .hero-copy a:hover {color: rgb(var(--c-primary-offwhite))}
  .hero-copy .learn .line{width:34px;height:1px;background:rgb(var(--c-primary-offblack));}

  /* ===== ABOUT SECTION ===== */
  .about-sec{position:relative;padding:110px 0;overflow:hidden;background:rgb(var(--c-primary-offwhite))}
  .about-grid{
    display:grid;grid-template-columns:52px 1fr 1fr;gap:0 56px;
    position:relative;z-index:2;
  }
  .side-label{
    writing-mode:vertical-rl;transform:rotate(180deg);
    font-family:var(--f-mono);font-size:12px;letter-spacing:.28em;text-transform:uppercase;
    color:rgb(var(--c-accent-beige));
    display:flex;align-items:flex-end;justify-content:flex-start;
    border-left:1px solid rgba(43,43,43,0.15);padding-left:16px;
  }
  .about-copy .rule-mark{width:26px;height:2px;background:rgb(var(--c-accent-tangerine));margin-bottom:20px;}
  h2.about-title{
    font-family:var(--f-mono);font-size:13px;letter-spacing:.16em;text-transform:uppercase;
    color:rgb(var(--c-primary-offblack));margin:0 0 30px;font-weight:500;
  }
  .about-copy p{font-size:16px;max-width:46ch;color:rgb(var(--c-primary-offblack) / 0.85);margin:0 0 20px;}

  .about-photo-wrap{position:relative;}
  .about-photo-frame{
    position:relative;background:rgb(var(--c-primary-offwhite));
    padding:34px 34px 0;
  }
  .about-photo-frame img{
    width:100%;display:block;filter:grayscale(1) contrast(1.05);
    aspect-ratio:3/3.7;object-fit:cover;object-position:top center;
  }
  .about-plus-bg{position:absolute;top:-40px;right:-40px;width:260px;height:260px;z-index:0;}
  .founder-tag{
    font-family:var(--f-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;
    color:rgb(var(--c-accent-beige));margin-top:18px;
  }

/* ===== FOCUS AREAS ===== */
.focus-sec{position:relative;padding:0 0 110px;background:rgb(var(--c-primary-offwhite));}
.focus-grid{display:grid;grid-template-columns:52px 1fr;gap:0 56px;position:relative;z-index:2;}
.focus-intro{max-width:52ch;margin-bottom:52px;}
.focus-intro h2.about-title{margin-bottom:18px;}
.focus-intro p{font-size:16px;color:rgb(var(--c-primary-offblack) / 0.85);margin:0;max-width:48ch;}
.focus-list{list-style:none;margin:0;padding:0;}
.focus-item{
  display:grid;grid-template-columns:80px 1fr;gap:28px;
  padding:30px 0;border-top:1px solid rgba(43,43,43,0.15);
}
.focus-item:last-child{border-bottom:1px solid rgba(43,43,43,0.15);}
.focus-item .fnum{
  font-family:var(--f-mono);font-size:13px;letter-spacing:.05em;
  color:rgb(var(--c-accent-tangerine));padding-top:4px;
}
.focus-item h3{font-family:var(--f-headlines);font-weight:500;font-size:1.3rem;margin:0 0 10px;color:rgb(var(--c-primary-offblack));}
.focus-item p{margin:0;font-size:15px;color:rgb(var(--c-primary-offblack) / 0.75);max-width:56ch;}

  /* ===== PULL QUOTE / LEDGER SECTION ===== */
  .statement{position:relative;background:rgb(var(--c-primary-offblack));color:rgb(var(--c-primary-offwhite));padding:110px 0;overflow:hidden;}
  .statement .plus-field{background-image:radial-gradient(rgb(var(--c-primary-offwhite) / 0.18) 1px, transparent 1px),linear-gradient(rgb(var(--c-primary-offwhite) / 0.18) 1px, transparent 1px);}
  .statement-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:70px;position:relative;z-index:2;align-items:end;}
  .quote-mark{
    font-family:var(--f-headlines);font-size:64px;color:rgb(var(--c-accent-tangerine));line-height:0.6;
    margin-bottom:10px;display:block;
  }
  h2.big-quote{
    font-family:var(--f-headlines);font-weight:600;text-transform:uppercase;
    font-size:clamp(2.1rem,4.4vw,3.4rem);line-height:1.05;letter-spacing:-0.01em;
    margin:0;max-width:12ch;
  }
  .ledger{border:1px solid rgb(var(--c-primary-offwhite) / 0.2);border-radius:2px;overflow:hidden;}
  .ledger-row{
    display:grid;grid-template-columns:1fr auto;align-items:baseline;
    padding:17px 20px;font-family:var(--f-mono);font-size:13px;
    border-bottom:1px solid rgb(var(--c-primary-offwhite) / 0.15);
  }
  .ledger-row:last-child{border-bottom:none;}
  .ledger-row .label{color:rgb(var(--c-primary-offwhite) / 0.55);}
  .ledger-row .value{color:rgb(var(--c-primary-offwhite));font-weight:500;}
  .ledger-row .value .accent{color:rgb(var(--c-accent-yellow));}
  .ledger-cap{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:rgb(var(--c-primary-offwhite) / 0.5);margin-bottom:14px;}

  /* ===== RESEARCH / FEATURE STRIP ===== */
  .research{position:relative;display:grid;grid-template-columns:42% 58%;background:rgb(var(--c-accent-tangerine));min-height:420px;}
  .research-copy{padding:70px 56px;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:2;}
  .research-eyebrow{
    font-family:var(--f-mono);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;
    color:rgb(var(--c-primary-offblack) / 0.75);margin-bottom:18px;display:flex;align-items:center;gap:10px;
  }
  .research-eyebrow::before{content:"";width:22px;height:1px;background:rgb(var(--c-primary-offblack));}
  h3.research-title{font-family:var(--f-headlines);font-weight:500;font-size:2rem;margin:0 0 16px;color:rgb(var(--c-primary-offblack));line-height:1.1;}
  .research-copy p{font-size:15px;max-width:40ch;color:rgb(var(--c-primary-offblack) / 0.82);margin:0 0 28px;}
  .research-copy .learn{
    font-family:var(--f-mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;
    display:inline-flex;align-items:center;gap:14px;color:rgb(var(--c-primary-offblack));text-decoration:none;font-weight:500;
    margin-bottom:44px;
  }
  .research-copy .learn .line{width:34px;height:1px;background:rgb(var(--c-primary-offblack));}
  .research-nav{display:flex;align-items:center;gap:24px;font-family:var(--f-mono);font-size:12px;color:rgb(var(--c-primary-offblack) / 0.7);}
  .research-nav .idx{display:flex;align-items:center;gap:10px;}
  .research-nav .idx .line{width:26px;height:1px;background:rgb(var(--c-primary-offblack) / 0.5);}

  .research-img{position:relative;overflow:hidden;}
  .research-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(0.35) contrast(1.05);}
  .research-img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg, rgb(var(--c-accent-tangerine)) 0%, transparent 18%);}
  .research a:hover {color: rgb(var(--c-primary-offwhite))}

  /* ===== FOOTER ===== */
  .site-footer{border-top:thin solid; border-color: rgb(var(--c-primary-grey) / 0.75);}
  .dark .site-footer{border-color: rgb(var(--c-primary-grey) / 0.25);}

  .footer-top{
    display:flex;align-items:center;justify-content:space-between;
    padding:26px 0;border-bottom:thin solid; border-color: rgb(var(--c-primary-grey) / 0.75);
  }
  .dark .footer-top{border-color: rgb(var(--c-primary-grey) / 0.25);}

  .footer-top .q{font-size:14px;}
  .footer-top .q a{color:rgb(var(--c-accent-tangerine));text-decoration:underline;}
  .footer-nav{display:flex;gap:30px;list-style:none;margin:0;padding:0;}
  .footer-nav a{font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;}
  .footer-nav a:hover {color:rgb(var(--c-accent-tangerine))}

  .footer-bottom{display:flex;align-items:center;justify-content:space-between;padding:22px 0 48px;}
  .footer-bottom .legal{font-family:var(--f-mono);font-size:11.5px;color:rgb(var(--c-primary-offblack) / 0.5);}
  .footer-bottom .social a{text-decoration:none;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;border-bottom:1px solid rgb(var(--c-accent-teal));padding-bottom:2px;}
  .footer-bottom .social a:hover {color:rgb(var(--c-accent-tangerine))}

  @media (max-width:900px){
    .hero{grid-template-columns:1fr;}
    .hero-panel-dark{min-height:340px;}
    .hero-index{display:none;}
    .hero-copy{padding:40px 28px;}
    nav.top{padding:20px 24px;}
    .about-grid{grid-template-columns:1fr;gap:32px;}
    .side-label{display:none;}
    .statement-grid{grid-template-columns:1fr;gap:40px;}
    .research{grid-template-columns:1fr;}
    .research-img{min-height:280px;}
    .footer-top, .footer-bottom{flex-direction:column;gap:16px;align-items:flex-start;}
	.focus-grid  {grid-template-columns: 1fr;gap:6px}
  }

  @media (max-width:500px){
	.focus-sec {padding:0 0 50px}
	.focus-grid  {grid-template-columns: 1fr;gap:6px}
}

/* ============ FIDAMO HOME ==================== */

.home-container {
    margin:0;
	background:rgb(var(--c-primary-offwhite));
	color:rgb(var(--c-primary-offblack));
    font-family:'Inter',sans-serif;
	font-size:16px;
	line-height:1.6;
	-webkit-font-smoothing:antialiased;
	/*overflow-x:hidden*/
	position:relative;
}
.home-container *{box-sizing:border-box;}
.home-container .wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
.home-container .plus-field {
    position:absolute;pointer-events:none;
    background-image:radial-gradient(rgb(var(--c-accent-teal) / 0.35) 1px, transparent 1px),
                      linear-gradient(rgb(var(--c-accent-teal) / 0.35) 1px, transparent 1px);
    background-size:26px 26px, 26px 26px;background-position:0 0, 13px 13px;
    -webkit-mask-image: radial-gradient(ellipse at center, black 0%, transparent 72%);
            mask-image: radial-gradient(ellipse at center, black 0%, transparent 72%);
  }
.home-container  .plus-field.on-dark{
    background-image:radial-gradient(rgb(var(--c-primary-offwhite) / 0.2) 1px, transparent 1px),
                      linear-gradient(rgb(var(--c-primary-offwhite) / 0.2) 1px, transparent 1px);
  }

  /* HERO */
  .hero{position:relative;background:rgb(var(--c-primary-offblack));color:rgb(var(--c-primary-offwhite));overflow:hidden;padding-bottom:120px;}
  .hero-ghost{
    position:absolute;top:6%;left:50%;transform:translateX(-50%);z-index:1;
    font-family:var(--f-headlines));font-weight:780;font-size:min(19vw,240px);line-height:0.85;letter-spacing:-0.02em;
    color:rgb(var(--c-primary-offwhite) / 0.08);white-space:nowrap;pointer-events:none;text-align:center;width:100%;
  }
  .hero-inner{position:absolute;top:15%;left:50%;transform:translateX(-50%);z-index:3;padding-top:120px;text-align:center;}
  .hero-eyebrow{font-family:var(--f-mono));font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:rgb(var(--c-accent-yellow));margin-bottom:26px;}
  h1.hero-title{
    font-family:var(--f-headlines));font-weight:500;font-size:clamp(2.4rem,5.5vw,4.2rem);line-height:1.05;
    letter-spacing:-0.01em;margin:0 auto 26px;max-width:14ch;
  }
  .hero-title em{font-style:italic;color:rgb(var(--c-accent-tangerine));font-weight:450;}
  .hero-sub{font-size:17px;max-width:52ch;margin:0 auto 40px;color:rgb(var(--c-primary-offwhite) / 0.75);}
  .hero-cta{
    display:inline-flex;align-items:center;gap:14px;
    font-family:var(--f-mono));font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;
    color:rgb(var(--c-primary-offblack));background:rgb(var(--c-accent-yellow));
    padding:15px 28px;text-decoration:none;font-weight:500;border-radius:2px;
  }

  /* FEATURED ARTICLE */
  .featured{position:relative;padding:90px 0 100px;background:rgb(var(--c-accent-teal));}
  .featured-tag{font-family:var(--f-mono));font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:rgb(var(--c-primary-offwhite));margin-bottom:30px;display:flex;align-items:center;gap:10px;}
  .featured-tag::before{content:"";width:22px;height:1px;background:rgb(var(--c-primary-offwhite));}
  .featured-card{display:grid;grid-template-columns:1.1fr 0.9fr;border:1px solid rgba(43,43,43,0.15);border-radius:2px;overflow:hidden;}
  .featured-img{position:relative;overflow:hidden;min-height:340px;}
  .featured-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(0.3) contrast(1.05);}
  .featured-copy{background:rgb(var(--c-accent-tangerine));padding:48px;display:flex;flex-direction:column;justify-content:center;}
  .featured-meta{font-family:var(--f-mono));font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:rgb(var(--c-accent-tangerine));margin-bottom:16px;}
  h2.featured-title{font-family:var(--f-headlines));font-weight:500;font-size:2rem;line-height:1.15;margin:0 0 18px;}
  .featured-copy p{font-size:15.5px;color:rgb(var(--c-primary-offblack) / 0.8);margin:0 0 26px;}
  .featured-byline{display:flex;align-items:center;gap:12px;margin-bottom:28px;}
  .featured-byline img{width:34px;height:34px;border-radius:50%;object-fit:cover;filter:grayscale(1);}
  .featured-byline .who{font-family:var(--f-mono));font-size:12px;color:rgb(var(--c-primary-offblack) / 0.65);}
  .featured-copy .learn{font-family:var(--f-mono));font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;display:inline-flex;align-items:center;gap:14px;color:rgb(var(--c-primary-offblack));text-decoration:none;font-weight:500;}
  .featured-copy .learn .line{width:34px;height:1px;background:rgb(var(--c-primary-offblack));}
.featured-copy a:hover {color:rgb(var(--c-primary-offwhite));}


  /* MORE FROM FIDAMO GRID */
  .more{position:relative;padding:20px 0 100px;background:rgb(var(--c-accent-teal));}
  .more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
  .more-card{background:rgb(var(--c-primary-offblack));border:1px solid rgba(43,43,43,0.15);border-radius:2px;padding:30px;min-height:220px;display:flex;flex-direction:column;justify-content:space-between;}
  .more-card.soon{border-style:dashed;color:rgb(var(--c-primary-offwhite) / 0.45);}
  .more-card .tag{font-family:var(--f-mono));font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:rgb(var(--c-accent-teal));margin-bottom:14px;}
  .more-card.soon .tag{color:rgb(var(--c-primary-offwhite) / 0.4);}
  .more-card h3{color:rgb(var(--c-primary-offwhite));font-family:var(--f-headlines));font-weight:500;font-size:1.2rem;margin:0 0 10px;}
  .more-card p{font-size:14px;margin:0;color:rgb(var(--c-primary-offwhite) / 0.7);}
  .more-card.soon p{color:rgb(var(--c-primary-offwhite) / 0.4);}
  .more-card .learn{font-family:var(--f-mono));font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;text-decoration:none;color:rgb(var(--c-primary-offwhite));border-bottom:1px solid rgb(var(--c-accent-yellow));padding-bottom:2px;align-self:flex-start;}
  .more-card a:hover{color:rgb(var(--c-accent-teal));}

  /* FOCUS TEASER */
  .focus-teaser{position:relative;background:rgb(var(--c-primary-offblack));color:rgb(var(--c-primary-offwhite));padding:80px 0;overflow:hidden;}
  .focus-teaser-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:48px;position:relative;z-index:2;flex-wrap:wrap;gap:18px;}
  .focus-teaser-head h2{font-family:var(--f-headlines));font-weight:500;font-size:1.9rem;margin:0;max-width:16ch;}
  .focus-teaser-head .see-all{font-family:var(--f-mono));font-size:12px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:rgb(var(--c-primary-offwhite));border-bottom:1px solid rgb(var(--c-accent-yellow));padding-bottom:3px;white-space:nowrap;}
  .focus-teaser-row{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;z-index:2;border-top:1px solid rgb(var(--c-primary-offwhite) / 0.15);}
  .focus-teaser-item{padding:26px 22px 0;border-right:1px solid rgb(var(--c-primary-offwhite) / 0.15);}
  .focus-teaser-item:last-child{border-right:none;}
  .focus-teaser-item .fnum{font-family:var(--f-mono));font-size:12px;color:rgb(var(--c-accent-tangerine));margin-bottom:12px;display:block;}
  .focus-teaser-item h4{font-family:var(--f-body));font-weight:600;font-size:14.5px;margin:0;line-height:1.4;}
  .focus-teaser a:hover{color:rgb(var(--c-accent-teal));}


  /* FOUNDER TEASER */
  .founder-teaser{position:relative;padding:100px 0;background:rgb(var(--c-accent-teal));}
  .ft-grid{display:grid;grid-template-columns:200px 1fr;gap:48px;align-items:center;}
  .ft-photo{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:50%;filter:grayscale(1) contrast(1.05);}
  .ft-eyebrow{font-family:var(--f-mono));font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:rgb(var(--c-primary-offwhite));margin-bottom:14px;}
  blockquote.ft-quote{font-family:var(--f-headlines));font-style:italic;font-weight:450;font-size:1.5rem;line-height:1.4;margin:0 0 18px;max-width:36ch;color:rgb(var(--c-primary-offblack));}
  .ft-name{font-size:14.5px;color:rgb(var(--c-primary-offblack) / 0.7);margin-bottom:20px;}
  .ft-name strong{color:rgb(var(--c-primary-offblack));}
  .ft-link{font-family:var(--f-mono));font-size:12px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:rgb(var(--c-primary-offblack));border-bottom:1px solid rgb(var(--c-accent-yellow));padding-bottom:2px;}
  .founder-teaser a:hover {color: rgb(var(--c-primary-offwhite));}

  @media (max-width:900px){
    .featured-card{grid-template-columns:1fr;}
    .more-grid{grid-template-columns:1fr;}
    .focus-teaser-row{grid-template-columns:1fr 1fr;}
    .focus-teaser-item{border-bottom:1px solid rgb(var(--c-primary-offwhite) / 0.15);padding-bottom:22px;}
    .ft-grid{grid-template-columns:1fr;text-align:left;}
    .ft-photo{width:120px;}
  }
